Importance of Responsive Websites Design

The realm of web design can change at a dizzying rate. We at ECA technologies are very aware that our clients are concerned with staying relevant in the online marketing and media frenzy of the digital age. The web industry is constantly evolving, yesterday’s side bar widget is today’s large header image; code rapidly changing to HTML 5, jquery, CSS3 etc. It is our job to keep up with these trends.  More importantly,  it is our job to make sure these trends continue to be relevant for our clients needs. (You may not need the bells and whistles and we’re here to see the flower for the weeds when it comes to your web design needs).

That being said, it is always good to know what trends are here to stay. For the foreseeable future, the latest and greatest trend is Responsive Websites Design.

What is it?

To understand what Responsive Websites Design is you first need to understand what brought about it’s creation. Ten years ago we were working in the world of laptops and desktops, website design reflected this type of screen design. Today we have tablets, mobile phones, smart TV’s, desktop computers and laptops. Because of this, our screen size and thereby the website’s layout design needs to vary from device to device. Designing and developing a website so that the layout changes from device to device is called Responsive Website Design, a termed coined by its creator, Ethan Marcotte.

Responsive Website  Design is not an actual technology, or bit of software that can be downloaded and applied to a website like a widget or standard template theme. Rather, it is a design technique used to anticipate users needs regardless of their device.

Why is Responsive Website Design so important?

As technologies (desktop to laptops to smartphones to tablets) continue to evolve web design needs to find new, creative ways to meet the needs of consumers to “reach” out for information on the web that is easily accessible and translatable between devices.

Before the concept of Responsive Website Design was put together, web designers would need to code separate desktop and mobile sites, often at increased cost to the client with inconsistent user experience and higher hurdles in terms of difficulty for future updates of that coding. Responsive Website Design eliminated these hurdles and created a consistent platform from which all devices displayed from.

How to integrate Responsive Website Design in to your website:

Because Responsive Website Design is a collection of techniques, your integration of Responsive Website Design will occur using the following methodology: flexible grid with variable enhancements.

Flexible grid

Traditional web design occurred through the following process: Step 1. Website is designed in Photoshop given a static design based on a set pixel dimension. Step 2. This design is translated in to code. This is where things start to fall apart when it comes to different devices.  Even if the website can be view on all devices, it often becomes distorted or the information is not displayed in a relevant manner. To depart from this system requires a solution that is fluid and allows the design to stay in proportion to its elements. This solution is Variable Enhancements.

Variable Enhancements

Variable enhancements focuses on the content being presented- rather than on the strict, static graphic design- in a given device or browser. The approach to this style of design is to enrich the web design by creating semantic HTML markups and giving the first position of design too accessibility of information and priority content.

How this approach would look on a mobile device

With the smallest of interfaces, the mobile device poses the largest challenge in Responsive Web Design. Sticking to the idea that content is king in the new world order of web design, we first must designate what the top priority content is. i.e. if you had a dog grooming business, content such as contact information and services rendered would be considered first position content. The design would then be focused on ensuring that this information always is relayed first, while secondary information (Social media or RSS links) can be added lower down in the design, or only included in content for larger screen sizes, such as tablets, laptops or desktops.

When looking for your next web design, make sure that you talk with your designer about Responsive Website Design and go in thinking about your content in terms of priority information you would like to relay across a variety of platforms and devices. The experts at ECA technologies can help you through this process.

 

Margaret

About Margaret

For the past three years, Margaret had worked within the non-profit sector doing grantwriting, copy writing for social media and print platforms, Website and CMS management and graphic design. She recently left her job as the executive director of the Alaska Farmland Trust to focus on other things, but she still enjoys the challenge of helping others with their website and technical copy writing needs, skills thatI she has had the chance to develop for years.

Leave a Reply

Your email address will not be published.

CALL (416) 855 0322 OR EMAIL US TODAY