|
|
Mention the words ‘responsive web design’ today and you are likely to have an influx of potential clients before you, clamoring for your attention and advice on whether they should look further into the idea or not. Whilst this is not a new idea - in the sense that creating websites that are able to adjust themselves according to the size of the screen they are being viewed upon has been around for a while – it is one that is certainly gaining in popularity in leaps and bounds.
|
This has led to a number of ‘responsive rules’ being changed and others being added to suit responsive design as we know it today. To ensure that your responsive endeavours are as successful as possible, it is important that you follow these rules as closely as possible. This way, you will avoid making some of the more common mistakes that often lead to disastrous websites that simply do not work the way they are supposed to.
|
So, what are the more important of these ‘responsive web design rules’ and how do we go about implementing them in our projects? There are four rules that are currently seen as being the most relevant to the responsive sphere, and they are as follows:
|
|
1. Don’t stop at “squishy”
|
When someone tells you to check out a responsive website that they have come across or possibly worked on, what is one of the first things that you will do? We would imagine that you would probably enlarge and decrease the size of the screen to see how the layout changes. It’s unlikely that you will pull out your smart phone or iPad to see how the site compares to the desktop version. |
This is not how users will visit a website, responsive or not. Users are notoriously impatient and want access to whatever information they visited the site for in the first place. “Squishy” is a term used to describe the linear scaling of the website – does it go from skinny to fat, for example? Responsive design should instead focus on a core feature and load the site outwards from that point.
|
|
2. Embrace change
|
Creating a website is all about embracing change – it’s likely that you don’t use the same programs to create a website today that you did when you first started out. The same attitude should be used to approach responsive design – don’t be afraid to use a number of different programs for finalizing the layout of a site and don’t be afraid to experiment with newer technologies.
|
|
3. Don’t look for an easy way out
|
The reality of the situation is that responsive web design is complicated; there is no way to make the idea any easier. Often, you will start creating the website as a desktop version and will eventually create some mockups of how it will look when viewed on a tablet and a smart phone to show the client. If changes are made, it’s likely to take you days to go through all of the files and make tiny tweaks.
|
The best way to get around this problem is to prototype your wireframes and to present these to your clients. This will allow you to discuss the layout of the site in relation to the various screens that it may be viewed upon without making the discussion about the design. These sorts of changes can be made at a later date, once the most appropriate layout has been agreed upon.
|
|
4. Remember your roots
|
At the end of the day, it is important to keep in mind that both HTML and CSS are naturally responsive entities. From the very conception of HTML all those years ago, the internet was designed to be flexible enough to work seamlessly with any hardware that is able to accept an internet connection. This only changed when designers and developers began leaning towards more fixed layouts.
|
|
The purpose of responsive web design is not to change what you have to say to your visitors; instead, its purpose is to simply change the way in which you are saying it by adjusting its layout to suit the size of the screen it is being viewed upon. To ensure that your responsive ventures are successful, you must follow the four ‘rules’ outlined above. After all, the trend is all about creating websites that work for your visitors, no matter how they browse.
|
Whilst the above ‘responsive rules’ are certainly the way that you should be tackling web design today, there is every likelihood that they will change and evolve in the future. Their basics will probably remain the same (such as remembering your roots and embracing change), but the ways in which each rule is tackled and formulated will have undergone all sorts of revisions. This way, your websites will be best suited to the current time.
|
|
[...] New Rules of Successful Responsive Design – A Complete Guide - What are the more important of these ‘responsive web design rules’ and how do we go about implementing them in our projects? There are four rules that are currently seen as being the most relevant to the responsive sphere. [...]