The art of responsive web design is continuously evolving.
As the times pass, we learn better ways to tackle different challenges and
improve the technique of building responsive websites. Because of this, something
that was right and spot-on a few months ago could be wrong or not as effective
right now.
This is not like fashion; rather it’s the natural process of
continuous improvement, furnishing us with newer and more effective ways to
achieve the same goals. Below we highlight a few outdated practices in
responsive web designer singapore. If you've made them, not to worry, I've made all of them
before learning not to:
1. Don’t
disable the magnification
You know this block of code, commonly used to disable the
zoom facility on a responsive site:
<meta name="viewport" content="width=device-width initial-scale=1, maximum-scale=1, user-scalable=no">
By so doing, you’re taking control out of the hands of the
users, which can be taken very antagonistically. You’ll make users think you
don’t like them, and that’s not nice.
2. Don’t
use device widths to set breakpoints
In the beginning, it was common to design style sheets
catering to widths of well-known devices. It was easy enough because there was
just 480, 768 and 1024 pixel devices. Right now, you have the iPhone 5, Kindle
Fire, HTC and a vast array of mini-tablets and phones of varying screen size.
You can’t set style sheet for all of them, I promise.
A better way is to
place a breakpoint where the design breaks, meaning a new layout is necessary
from that point. It’s a bit tedious, since you’ll have to test it on as many
devices as possible, but it works.
3. Don’t
have ginormous file sizes
You may think nothing of using images as large as 100 or
even 200kb as backgrounds for web pages until you try to load them on a phone.
If you’ve been spoilt by broadband and its crazy-fast speeds you know what I’m
saying. Think about the user who’s got a slow 3G connection and will think
nothing of aborting because your site is taking eons to load.
4. Don’t
hide content
You know this, hiding content simply because you’re unable
to fit it into your smaller screen:
Forget this code, bury it for good. Work with the assumption
that your mobile visitors want to do everything that the desktop user would
want, perhaps even more!
5. Don’t
compromise on the design
Tempting though it might be to design a webpage or site that
seamlessly folds down into a neat view on mobile devices by prioritizing ease
of development over visual design, be careful. Avoid the trap of allowing
technology to suppress your creative muscle, otherwise you’ll have similar
looking responsive websites, and that’s just boring.
Responsive web design is not easy, but when done properly,
you’ll love the result. Don’t be afraid to put in the work.
6. Don’t
forget the touch
Everything that is clickable should be the size of a
thumb-click. Put your buttons too small and close together and the
‘fat-fingered’ users will take out a hit man on you. Ensure links are
adequately spaced, and have acceptably sized mobile controls (Apple recommends
44 pixels).
Now go ye forth and be a great designer! Visit http://www.create360.com.sg/ for more details.