18th Oct 2017

Designing for the web in 2017

by: Maryam Al Abid Ali

blog hero img

Once upon a time, websites were static pages; all created using the same mould. Fast forward to today, where the web is saturated with creativity & complex systems.

We have responsive design to thank for this. There’s never been a better time to acknowledge how your interface works and is viewed on an array of devices. We’re in the golden age of technology – and there seems to be no slowing down.

 

Why Responsive Design?

In today’s world, a lot of people are using handheld devices (tablets and smartphones) to browse the web and responsive website design (RWD) has emerged as a very likely solution to screen size challenges. Responsive web design in a nutshell is the process of adapting a website to any device/screen size in order to simplify the way in which a user interacts and views content.

At Liquid, we strive to create interfaces that users can interact with regardless of the device they’re using.

 

We’re big on creating lead generating sites & apps – and believe that any device should be capable of that."

 

It’s time to talk figures

As mentioned earlier, technology is booming and as a result, screen sizes are changing. A survey conducted by Google in late 2016 found that at least 27% of users worldwide have a 1366px x 768px screen resolution (which is equivalent to a 15’ display). This is quite the leap from just 19% of users worldwide in 2012. 

 

Making & breaking the grid

Needless to say, we love our grids. We believe grids form the backbone of a design – the content being the very flesh of it. Grids structures vary from project to project – and will ultimately shape the very manner content is laid out, creating a visual hierarchy system. Whilst preserving a consistent grid structure is imminent in any site design, it’s important to note that grids are not prison bars (while they may visually appear that way). Having set templates for certain pages is essential but when working with a more flexible layout (e.g. a freeform page), consider modifying your grid structure to work more effectively with your content.

We generally work with a 16 column (8 column for mobile) grid structure which ultimately defines our inner container for the site. Any area outside the inner container (regardless of screen size) is considered as the margin of the page. In the early days of web design, the margin was recognised as the ‘no-go’ zone for designers alike – ‘thou shalt not pass’. Nonetheless, those days are (thankfully) gone. These days we find ourselves pushing the boundaries (literally) to create a site that is both methodical and visionary. 

 

Is your existing site not responsive? Need a new site built so it works seamlessly across all devices? Contact us to find out more or better yet, Start a Project with Liquid now.

 

ABOUT THE AUTHOR

Maryam Al Abid Ali

Digital Designer at Liquid Agency