Responsive Web Design : Going Mobile? It’s A Requirement.

By Cenay Nailor | FAQ

Jan 01

First Impressions Count. Does Your Site Render Well On Mobile?

As a web designer or site owner, you owe it to your customers to offer a place on the web they can visit to learn more about you, on the device of their choice. Sites that display only one way are doing to be missing out on a LOT of potential visitors, especially as the smart phones, tablets and iPad’s take center stage in the mobile users world.

So, if you aren’t thinking about it, now is definitely the time.

Mobile Means A Rethink Of Your Web Design

Your site, your brand and your web presence can no longer just be a fixed width site (or blog) that only displays if the device is 960 x 1000 minimum width. That smart phone your savvy customer is using might be the first impression you make. Make it poorly, and you’ve lost them.

Within the web design world, there are a few *buzz words* being tossed around. Liquid Layout. Fluid Design. Responsive Sites. They all mean essentially the same thing. Change the way the content displays, depending on the device doing the viewing.

Responsive, Liquid, Fluid and Elastic Web Design: Understanding The Difference

Liquid or fluid layouts change width based on the user’s unique device viewing size. Elastic layouts change width based on the user’s unique text size. Responsive is just another word for Liquid Design.

Both types of flexible design offer clear benefits to users, who can view sites at sizes that work for their needs, but they can pose challenges to web designers who are used to perfect pixel control. Still, when planned and constructed correctly, flexible layouts can be visually appealing and reasonably easy to build. And the concepts and techniques of flexible web design can benefit fixed-width CSS designs too, as designers learn how to design for the inherent flexibility of the web, instead of the rigid qualities of print media or grid-based layouts.

Flexible Web Design: Creating Liquid and Elastic Layouts with CSS by Zoe GillenwaterIf you are the do it yourself type (I most certainly am!), you need to start brushing up on the skills necessary to build sites (or blogs) that respond to devices.

Towards that goal, I just purchased Flexible Web Design: Creating Liquid and Elastic Layouts with CSS by Zoe Gillenwater. I read the first 50 pages within a few minutes of downloading it to my Kindle reader on my iPad (yep, I am a mobile consumer as well).

Already I am impressed with her style, ease of explanation and clear thinking. It’s a project based book (my personal preference) because it will allow me to work through real live examples as I learn it. This reenforces the new material, converting it to long term memory (good for us old folks) much faster.

So, watch for some new projects coming out, and probably a conversion of my blog theme. Are you a do it yourselfer? Go get the book and we can chat about the concepts. Looking forward to hearing from you.

Follow

About the Site Owner

Cenay is a self-proclaimed geek with mad technical skills she loves sharing with Videos, Coaching and Articles. Need help? Click the Book 30 Minutes to find out if this is a good fit.

Leave a Comment:

(6) comments

I’m very glad you like my book and are finding it useful in creating responsive web layouts! Thanks very much for the kind words. For those that want to learn more about the book, download excerpts, download code, etc, you can head to http://www.flexiblewebbook.com.

Reply

Zoe, just a quick follow up… I haven’t had as much time as I hoped to get through your book, but I am making headway. Loving it!

Thanks for your clear and easy style and obvious breadth of knowledge.

Reply

Web designers who are designing a mobile web page must remember to keep things simple.
There shouldn’t be any large files associated with any pages and there is generally less content to put on.
Also, you shouldn’t use flash so that your web page will be visible to all phone users.

Reply

Hello Cenay –

Great post … here is another tidbit for your readers to think about when designing for mobile devices: you will want to keep your designs simple. The use of flash, excessive images, and complicated menus will not translate well to a mobile platform. Keep your page clean and simple, or create a specific mobile site for your users.

Thanks!

George

Reply

[…] Responsive Web Design becoming more of a requirement, here’s a new theme that I designed for […]

Reply

When using mobile marketing, try to use text as much as possible and avoid using large files such as pictures. You might have the best mobile device with super screaming fast 4G download speeds where you can access the net from anywhere, but your customer likely does not. So design your mobile marketing in ways the work for everyone.

Reply
Add Your Reply

Leave a Comment:

..also