Web designers have begun to understand that it is very important to put mobile first, while designing websites. Just a few months ago, there were arguments and debates if a mobile-first approach was really necessary. With smartphones and tablets driving more traffic than traditional computers, a mobile first approach is finally grounded in web designing nomenclatures, for good. However, occasionally web designers ask us questions why they must put mobile first and why they can’t create the complete website and then begin the reductionist process of creating a version for tablet computers and the for smartphones.
Getting Accustomed to Responsive Web Designing
Responsive web designing allows websites to respond to their surroundings and approach multiple devices in a unique manner. Ideally, the web designer would not have to worry about the various sizes of the screens, resolutions and width or even worry about different operating systems and mediums. Responsive web designing also allows users to experience websites with minimal differences in style, content and cognitive efforts. A user would no longer have to invest cognitively each time he or she changes a device in order to understand how the same website appears on each of the devices he or she uses. Web designers must realize that responsive web designing is not the same as fluid web design. Of course it is, but with a lot of added frills, bells and whistles. Designers would already know that responsive web designing depends on media queries. It targets different minimum or maximum screen widths.
Psychology behind Mobile First Approach
Image source: https://www.psychologytoday.com/files/u107/Psi.jpg
Web designers might again question why they have to put mobile first even while using responsive web designing techniques. It all boils down to psychological concepts of information processing and information creation. Cognitive effort is significantly reduced when flesh is added to the skeleton. A mobile version of the website can be understood as the skeleton and by adding flesh and muscles, it could be built for tablets, and after clothing the tablet version of the same website, one could build the full browser version. The idea is to expand outwards and to think small in the beginning. By concentrating on the parts first, rather than the whole, mobile-first approach defies gestalt theory of “whole is greater than the sum of its parts”.
Utilizing Gestalt Principles in Creating Responsive Websites
The above pictures are immediately understood as a circle and a square, instead of a collection of meaningless lines.
A visitor to a website usually perceives an entire page as a ‘whole’. He does not look at the various parts like content, images, advertisements, banners and any other media in particular. He usually looks at the page as a single entity which is comprised of several parts. This basic Gestalt principle holds good in web designing as well. What is perceived is always greater than the sum of all the smaller entities that a page comprises of.
So what must a web designer do then, if he has to design with a mobile-first approach in mind? Well, the same Gestalt principle is reversed. The reverse Gestalt approach requires a web designer to create a skeleton (basic site for mobile devices) and fill the flesh and muscles to create fuller and wholesome versions of the website for browsers. Unfortunately, even if the creation of a website defies Gestalt principles, the way a user perceives a website always remains true to this fundamental law of psychology.
No matter which device a user uses, he will always perceive the website as a single entity that comprises of several parts. With that in mind, web designers must understand that the perception of a website is always wholesome and full – in accordance with Gestalt principle. However, while building a website, a web designer must start from the bottom, from the basic skeleton and move towards a wholesome webpage.
Web Designers Need Psychology 101!
As web designers, it is extremely important to know the fundamental principles of psychology, human information processing and cognitive processes. When even a fraction of a second is important to retain visitors on the product or company webpage, designers must make every attempt to retain and sustain attention and concentration. As technology changes and the way we consume information changes, it becomes extremely important to stay grounded in the fundamentals of psychology and understand that building a webpage may not always be in accordance to psychological principles though the end result – the web page, must adhere to the laws of cognitive science in order to provide a better user experience.