Staying on top of the ever changing technology can be a monumental task these days. For business owners and authors alike this means the Internet landscape itself is constantly evolving. From new book marketing channels to your home on the web itself, there is always a new ap or technology to be considered. How best to evolve your website is the question at hand, or even should you.
It seems like just a little while ago a business owner needed only have a web presence. Fixed width was the norm, centered pretty much a given. Then, up popped the flexible width websites which allowed all different sizes of desktops to view the content based on their screen width. This however, was merely the birthing pains of a new era in web design. Laptops, iPads, and iPhones are now in the hands of an ever growing population. According to Jeff Bullas,
- "Use of desktop computers is down for 35% iPad owners since they bought the device
- Use of laptops is also down since they bought an iPad at 39%
- 87% of owners are using it every day of the week
- 26% for half an hour to an hour per day
- 32% for 1-2 hours per day
- 24% for more than 2 hours a day."[1]
Just as we are scrambling to learn Adaptive Web Design to cope with the ever growing digital devices available the WC3[2] has decided to begin the implementation of new standards in design which they have dubbed Responsive Web Design.
No longer can the business owner keep up with this ever changing environment. It is time to let go and let the webmasters tackle this complex landscape. However, for those of you die hard do-it-yourselfers here's the tip of the iceberg of Responsive Web Design. Keep in mind though, that as long as your website if 'flexible' your website should be able to be viewed on most devices.
With Adaptive design code is written for each device, but with Responsive design one size truly fits all. To begin with we no longer express size in specific increments, such as pixels per inch, inches, or the like. Everything is sized as compared to a fixed standard. What are those standards? The most often used is the 'em' - the height of an 'm'. Each device from the iPhone's 320 pixel screen all the way up to your desktop's 1480, and growing pixel display need to show all of your website's content without the user noticing any adjustments or side-scrolling.
While you may have a multiple column website on your desktop, those columns, if left to only re-size on your iPhone will become so tiny that they can't be easily read. So, what responsive design enables is 'content reflow'. This merely means that your columns that are side-by-side on your desktop will slide under each other on your smaller devices, as in your iPhone or iPad. And since your font too is specified in percentages rather than pixels it fits better in the host device too.
As for font sizes you may not be aware, but the standard font size for all browsers is 16 pixels (px). Therefore if you want your font size to be smaller than that, which most of us do, for example you will need to express your body font size as 62.5% to achieve a 10 px font and then when you want a larger 12 px font you would tell your font to increase to 1.2 em and for 16 px 1.6 em. Now that makes the math much simpler wouldn't you say? But, the caveat here is in deep parent/child relationship. However, I won't get into this discussion here.
Now, let's touch on the image resizing issues. The good news is that we have now clearer, crisper, high resolution displays, which allow us to bump up our dpi (dot per inch) from the web standard of 72 to a whopping 96! Even still, this won't help us in responsive image resizing and rendering across devices. Sure you can simply specify your image display as percentages, but that can leave you with muddy images on larger screens and anomalies on smaller ones.
The world of web design is fully aware of the impending image problem. There is actually a whole group dedicated to solving these challenges. In time they may come up with a solution that will be viable on all platforms. But for now your web designer can recommend the best work-around for your website's images.
As you can see, things are changing fast, but don't fret. When you can afford to invest in a make-over of your Internet presence that is soon enough to invest in the new Responsive Web Design.
[1] http://www.jeffbullas.com/2011/04/04/29-statistics-reveal-how-the-apples-ipad-is-changing-our-lives/
[2] http://www.w3.org/standards/webdesign/
