Technology and Internet speed play a major role in distinguishing mobile platforms from full computers, but in the end it all comes down to size. Even the largest smart phone screens that measure more than four inches (10.2 centimeters) diagonally are tiny compared to computer monitors. While the image resolutions of these displays continue to grow, they're physically too small to legibly display whole Web sites. Reading on them requires zooming in, and often the multi-column layouts of modern sites make navigation and content consumption difficult. Optimal Web site usability comes from an understanding of a platform's defining characteristics. For mobile, that begins with screen size.

Mobile Web design must focus on single-column layouts that condense all of the content into one compact arrangement. This may entail re-arranging navigation links, removing less important page elements, and making the primary column narrower to account for a phone's dimensions. While monitors are wider than they are tall, most phone screens are designed for a portrait orientation -- you can always turn the phone on its side to browse a site, but mobile layouts need to account for the narrowness of that default orientation. Layout isn't the only concern -- since mobile devices don't use a mouse like a PC, "mouseover states" like drop-down menus have to be redesigned to work with touch inputs or phone buttons [source: Smashing Magazine].

That last point leads into another challenge of mobile Web site design: browser and hardware variety. It's hard enough to build full Web sites that take into account the idiosyncrasies of browsers like Internet Explorer, Mozilla Firefox and Google Chrome. In the mobile world, some people browse the Web on "dumb" phones with tiny low-resolution screens; others use smart phones with far higher-res displays and touch screens! Sometimes one mobile site isn't enough -- it makes sense to design separate mobile interfaces for various devices. Facebook, for example, serves up a tailored site to smart phone visitors by detecting the capabilities of the device they're using [source: PC World]. We'll cover the technology behind that in the next section.

Though mobile Web design requires a simplified interface, it doesn't necessarily result in a down Web site. On the contrary, smart phones offer advanced features unavailable on computers. QR Codes scanned by phone cameras can instantly launch Web sites or download applications. Maps can tie into GPS data to give you directions or recommendations for nearby restaurants. It takes a smart use of technology behind the scenes to create an efficient mobile site. Let's look at how tech and design are two sides of the same coin.

A mobile Web site is easy to identify thanks to its design, but someone, somewhere put a lot of clever engineering into that product. Modern Web design is typically built using cascading style sheets (CSS). As the name implies, style sheets control the style elements of a page -- fonts, text colors, page width, margins and so on. While the content of your Web site may be stored in a database or in HTML files, CSS determines how that content is presented. All of the design changes mentioned in the previous section are accomplished through CSS, and other tweaks can be made to optimize the browsing experience for mobile devices. Replacing a large image background with a simple solid color, for example, will make a mobile site load faster and use less bandwidth.

Building a mobile Web site is the first step. Once the site exists, visitors have to use it. There's no clear-cut right way to deliver a mobile site, but there are several viable options. The simplest is to have a link on the full site somewhere that says "View mobile site." Often developers use a subdomain -- usually m.website.com -- to direct users to the mobile Web site. That's easy to understand. Website.com goes to the full site, m.website.com goes to the mobile site. Some sites use i.website.com instead due to the popularity of the iPhone, but the implementation is the same. While many sites use a system to automatically shepherd mobile browsers to the mobile site (described below) sometimes the only way to get to that mobile site is to manually type in the m.website.com address.