When a construction worker builds a house, he does not frame it with just a single hammer; his decisions are thoroughly planned out. He has a number of tools to help frame the house, and these tools are chosen well before the first wall stands up. A lot of challenges and obstacles are met head on before the printing of blueprints, or the flipping of a light switch. Many different instruments are used throughout the construction process. Building for the web is comparable to framing a house, albeit there is considerably less sweat.
As web designers, we have our own procedures to building solutions for problems we face. We document and outline the steps needed to take an engagement from the beginning stage all the way through deployment. We can break up the project into digestible components and use it as a road map to completion. The best way to engage users can be told through the user’s interaction with the content, and what the measured analytics are telling us.
Worldwide, the total combined number of web users scarcely reached 361 million in 2000. Move the hands of the clock forward to 2012 and the number jumps to 2.27 billion—That’s an increase of nearly 630%. A lot of varying technology has come to market since. Fortunately, we’re an adaptive species—we embrace change relatively well.
As web designers, we have our own set of tools in our toolbox. The scope of the project will tell us which tools work best. As display sizes have become more and more dissimilar, Responsive Web Design (RWD) is a tool which has picked up an incredible amount of momentum over the last few years. RWD is an approach to encounter the same optimized viewing experience across a wide range of devices. Designers deal with constraints and limitations, and responsive design accommodates for the inconsistent screen widths on browsers for desktops, mobile devices, tablets, e-readers, televisions, etc. In the words of Jeffrey Veen:
Day by day, the number of devices, platforms, and browsers that need to work with your site grows. Responsive web design represents a fundamental shift in how we’ll build websites for the decade to come.
Media queries, fluid grids, and flexible images are the basic elements for responsive design. This is a new way of thinking outside the desktop, and some areas of the world have already surpassed the desktop to mobile ratio. Mobile traffic is steadily growing, and does not seem to be slowing down any time soon thanks to the growing population of tablet and smartphone users. The days of designing for one platform are promptly fading out.
During the discovery phase it is essential that everyone is on the same page. If responsive design is intended to be used during a project the designer should plan it in the initial mockup. It’s important every team member understands what responsive design is, and more importantly, validate that it’s the best tool for the project. RWD is not cut-and-dry—so allow for plenty of time for markup, revisions, and testing. If possible, buy real devices for the purpose of testing. This is a sure-shot way of knowing if your code is doing its job properly. Responsive websites can be very complex and take time. Don’t rush or overlook it. Speaking from personal experience, I’ve seen projects go from marking up HTML which is close to being delivered when the client finally asks “…how does this look on mobile and iPad?”
Manage client expectations; good communication can lead to a much smoother project. It’s very difficult to switch from a static design to a design which responds to varying screen sizes during a Friday afternoon. Not planning for this can make cost go up, fire drills go off, heads explode, and clients severely over-reacting. Ask what devices need to be supported before the project is started, and make sure it’s hashed out in the contract!
It’s 2013. Mobile phones and tablets are becoming the new desktop. Make sure you’re developing a strong foundation or considering for these platforms.