Web Design Tips: Mobilizing Your Site Using CSS

With a second style sheet and minor changes to a page's HTML, many online stores can offer an excellent mobile shopping experience without creating a second web page or registering a mobile specific domain.

Mobile Internet use is on the rise. And online merchants presumably want to provide customers with the best possible shopping experience. It is for these reasons that many leading ecommerce sites have begun to offer either mobile specific pages (typically a subdomain) or mobile specific styles.

In this "Web Design Tips," I am going to make some suggestions about whether you should build a separate, mobile specific website, and provide a quick example of how you might transform your CSS to create a more mobile-friendly version of your current page.
Should You Build a Separate Mobile Site?

The answer can be either yes or no. Personally, I believe that mobile Internet devices and mobile handsets will soon be as capable of rendering web pages as well as laptops and desktops do now, so that registering a .mobi domain or even building a separate site could be a waste of time.

A better solution might be to redesign your current site so that it is easy to render on multiple platforms. In fact, developing websites that easily migrate among platforms (mobile, desktop, RSS, or more) was the one of the main reasons that CSS was created. Good website design will largely separate content from layout and appearance.

If you do decide that the best way to serve mobile customers is with a mobile-specific site, I will encourage you to use a subdomain rather than a .mobi domain. For example the URL might be http://m.yoursite.com rather than http://yoursite.mobi.

Read More Article...

Web Design Tips: Cufón is a Fast Font Replacement Solution

An easy-to-implement JavaScript called Cufón allows web designers to quickly embed visually interesting fonts on their web pages, opening up new opportunities for typographical design elements.

Every medium has constraints. For print, there are things like size, ink density, and paper quality. For video, even the best available HDTV only musters up about 2.1 megapixel resolution (HD 1080p is 1920 pixels by 1080 pixels). On the Internet, those constraints can be things like bandwidth, screen size, or—today's topic—fonts.

Every computer has some number of fonts installed. The most common of these are generally referred to as "web safe," meaning you can be pretty sure that if you specify one of these common fonts in your CSS or HTML, the person who visits your page will see the font face you defined. But this can be limiting. What if you want a custom font that almost no one will have installed?

In this "Web Design Tips," I am going to describe one possible way to do font replacement, and show you how to implement it with Cufón.

Read More Article...