Is Your Site Mobile Responsive

Mobile Responsive vs. Mobile DesignedThe following is a guest post from my good friend Howard Jacobson.  Howard is a pioneer in intellectual property and has extensive programming talents.  This is from a thread we exchanged over Google +;

“Mobile responsive design” really is two different things. “Mobile” design means to design a web site for a mobile device (e.g., a smart phone or tablet). “Responsive design” means to design a web site for a browser window of varying size no matter the device on which the browser is running.

Until the advent of mobile browsers, web sites were designed only for PC / Mac screens of a certain size. In the earlier days of the web, that size was perhaps 500 pixels wide (because computer screens were limited to a width of 600 pixels. Later, the size grew to perhaps 650 or so because screens became capable of displaying 768 pixels width. Later still, screens became capable of displaying more pixels, and the standard web site width became 960 pixels.

Then, mobile devices came along. These devices have much smaller screen widths and so cannot display well a web site designed for a PC / Mac screen. Many web sites initially responded by creating a duplicate of their site but redesigned for a much narrower browser width. These duplicates were not “responsive”, but they were “mobile.”

As mobile device designs proliferated, the number of different device widths increased. So, one mobile site design did not work well on all mobile devices (e.g., phone versus tablet). The need for a “responsive” technology became apparent so that web site developers and designers did not have to design multiple different separate web sites for different devices (e.g., iPhones versus iPads versus MacBook Airs versus large desktop displays).

CSS3 and Javascript provided that technology. (HTML5 and other technologies like jQuery also help.) These technologies allow a web site to “respond” to the size of a web browser and dynamically adjust the size and arrangement of items on the page as the width of the browser changes (wider or narrower) no matter the device on which the browser is running.

The web site developer and designer create only one site and include the CSS3 and Javascript that detects the browser width and changes the CSS3 properties of page elements to adapt to the changing browser size. This kind of web site is a “responsive” web site.

– Howard

While this may seem confusing, the remedy is quite simple.  Mobile responsive designs are simply website designs which can adapt, via mobile browsers, to varying screen sizes.  One website fits a variety of mobile screen sizes.

“Mobile design is really out of vogue.  All design is now “responsive.” says Howard.

Studiopress makes this simple.  The newer themes from Studiopress are all mobile responsive, keeping you way ahead of the game.  All of our customers and our own sites are built upon the sturdy Studiopress themes;  built on WordPress, optimized and now mobile responsive!



Leave a Reply

Your email address will not be published. Required fields are marked *