Writing a good jQuery plugin

You spend weeks developing a complex plugin, which does everything and you publish it on GitHub, create an awesome website and wait for users to roll in creation, you wait…and wait… but very few customers, Okay…so what gives? and download your latest Actually, you can write code but you missed of some good practices, so here is some practices i want to share it with you before publish you code: 1. Documentation….

Read More

Advanced topics in HTML5 & CSS3

Lately, I have finished from present a training in advanced topics in HTML5 and CSS3 in collaborate with Prince Sumaya University, here is the main topics covered:  HTML4 Review. HTML5 Elements and Attributes. Advanced Topics in HTML5(Canvas, LocalStorage, AppCache, Drag&Drop, Web Worker, History Api, Geolocation, Web Sockets and FileSystem). Web Performance. Web Accessibility & Microdata. Web Design Approches(Resposnive, Adaptive, Fluid). Mobile touch events. The most important resources in front end…

Read More

Request Desktop Site

What does “Request Desktop Site” feature do? First of all, where can I find it? This feature available in chrome browser mobile version, When viewing the mobile version of a site, open the menu and check the box located next to Request Desktop site. The Web page will automatically begin to reload in the background. Actually I tried opening our responsive websites from mobile and enable this feature but without…

Read More

Email Template For All Devices

Why Mobile First? Mobile is exploding, today’s smart phones are driving huge use of networked applications and Web content. Mobile forces you to focus, you have to prioritize because there simply isn’t room in a 320 by 480 pixel screen for extraneous, unnecessary elements. Mobile extends your capabilities. Building mobile first allows teams to utilize this full palette of capabilities to create rich context-aware applications instead of limiting themselves to…

Read More

CSS Like a Lego

With all my work at bayt.com, I’d been think more about CSS architecture, how to write the qualified, meaningful, reusable classes. So I want to share with you my secret of how to think and write the CSS, actually for me I found the fantastic way is the Lego way. Why Lego? Because it’s like a bricks can be assembled and connected in many ways, to construct such objects/classes as…

Read More

Bootstrap Framework

It’s a CSS framework and it’s developed by Twitter guys (@mdo & @fat), Check out Bootstrap on Github. Although i have a simple CSS framework using it with any new project as freelance or in Bayt.com projects, but after i found twitter bootstrap i am impressed for how can it help me, and its a weapon of choice for me for this reasons: Easy to work with. Streamline workflow and…

Read More

Responsive Web Design (RWD) Approach

Definition: is an approach to web design to provide an optimal viewing experience with a minimum of resizing, panning, and scrolling—across a wide range of devices ( desktop => mobile ). Almost every new client these days wants a mobile version of their website, so it’s time to support the mobile and tablet version, and here is some statistics how the mobile increased from 2010 until and what is the…

Read More

TeamToolTip – Jquey Plugin

This is my first time to write a Jquery plugin, actually i expected this more difficult but its appear easy, and i am start learning from Jquery Documentation, and I recommend anyone need to learn basic, best practice and writing your plugin, to start by Jquery Documentation. Now I want to talk about my plugin, lately increased requests from our clients to add page with their team member and add…

Read More

Best Practice For Using Images On Web Pages

Optimizing images for faster performance: Don’t scale images in HTML. Images should be saved to the exact size you want them to be viewed on the web. Do not resize images using size attributes in your HTML code. Taking a large image and having it display at a smaller size not only slows down loading times but also distorts your image.Don’t use a bigger image than you need just because…

Read More

Fonts on the Web – @font-face

@font-face: define a new font and use it on your site even its not implemented as default in web browsers and operating systems. Actually at first glance i guessed this feature is CSS3 but its Not exactly a feature which is new to CSS3, @font-face was first proposed for CSS2 and you can implement it with cross-browser compatibility. This guide will teach you how to implement @font-face with cross-browser compatibility: 1. Select the font you want to use, you can use…

Read More