Over the years, access to the Internet using mobile devices
is rapidly increasing. As it stands today, it is more than one-fifth of the
total Internet usage.
Mobile devices such as smartphones and tablets are capable
of connecting to the Internet and are easily accessible, thereby causing the
rise in Internet usage using them. This is an indication that web designers and
developers should consider mobile devices while designing or developing a web
application. The display size of mobile devices is different from the regular
desktop; which means that they interact in a different way and so should the
design. Tablets and smartphones have a smaller screen size than desktop
computers which limits them to the amount of information they can display
without any input from the user such as scrolling.
Nowadays, most organizations or clients want a mobile version
of their website. Practically, it is very essential because different designs
for different devices and all screen resolutions must be compatible too. Very soon,
there will likely be the need for additional inventions.
Responsive Web Design
There are many definitions of responsive web design.
Ethan Marcotte mentioned in the introduction of his book Responsive
Web Design that “Recently, an emergent discipline called “responsive
architecture” has begun asking how physical spaces can respond to the presence
of people passing through them. Through a combination of embedded robotics and
tensile materials, architects are experimenting with art installations and wall
structures that bend, flex, and expand as crowds approach them. Motion sensors
can be paired with climate control systems to adjust a room’s temperature and
ambient lighting as it fills with people. Companies have already produced
“smart glass technology” that can automatically become opaque when a room’s
occupants reach a certain density threshold, giving them an additional layer of
privacy (Marcotte, 2011).”
Responsive web design is the approach that design and
development should response to the user’s behavior and environment based on
screen size, platform and orientation (Kholmatova, 2017).
Responsive web design makes web pages look good and
attractive on all devices (computers, phones and tablets). It is about
resizing, shrinking, hiding, enlarging or moving content to make it look good
on any screen using HTML and CSS (www.w3schools.com).
Digesting this technique into web design, it transforms into
a whole new idea. The need to create a specific design for each group of users
is not needed. With responsive web design, a website automatically adjusts
itself without the need to create any customized solution for various
categories of users.
Responsive Web Design
In the past, only desktop computers were used for browsing
websites. It was not important then for website developers to design a
responsive website. But presently, we are in an era where people want to use
the latest and best gadgets. This lead to invention of more and more new
technologies. With the emergence of these technologies and gadgets, people want
to browse faster without any stress. This development encouraged website
developers to adopt the responsive design to enable users browse with any
device. The website is designed in such a way that it gives the users
information in different screen sizes and resolutions. Businesses and
e-commerce websites have a greater advantage using the responsive designs
because it allows their visitors to use their websites with any type of device
Another thing that has become clear is that mobile
devices (tablets and smartphones) are rapidly
taking over internet browsing. The use of these devices is not limited to browsing
only. They are used for everything from online shopping, checking emails,
social media and a lot more. For this reason, the responsive design is very
important so that users can enjoy browsing with their mobile gadgets.
Responsive web design is not limited to screen resolution of
resizing images. It has completely changed the way websites are designed these
days. It comes with a lot of features that make its
success in accomplishing the goals of designing websites. Some of the
features are explained below.
Experience: An Excellent responsive design will offer users an optimized
and outstanding experience regardless of which device they use. It adjusts the
device’s screen size so that the user does not through multiple pages to look
for the content they are trying to find. Recently, Google adopted the best
responsive design for their website to give mobile device users a smoot
Responsive designs allows developers to upload content once, instead of
uploading it on different versions of the website. This saves time, resources
and energy that would have been spent on
uploading content on different sites for different devices.
Optimization: Everyday, search engines get smatter and know how to
distinguish between desktop and mobile websites. Most search engines display
responsive sites at the top of their search results.
Developing different versions of websites for different devices increases the
workload of developers because they effect changes on more than one website. For
responsive websites, changes are made once because there is only one layout
that works on all devices thereby reducing the developers efforts and workload.
Statistics for a responsive website are split into two i.e. mobile and
desktops. This allows the website administrator to get a complete insight of
visitors depending on which type of device they are using. The administrator
can view either mobile only or desktop only visitors or both.
Challenges of Responsive Web Design
Responsive web design has some few challenges that can
easily be fixed. Some of these challenges and how they can be avoided are
Browser Compatibility: Older versions of Internet Explorer are
not compatible with a responsive website because they do not support CSS3 Media
Queries. The contents of a responsive site do not display properly on a mobile
can be put in use to make changes in page layouts.
Slow or Downtime: Due to high traffic from both mobile and desktop
users, a responsive site may become very slow to load. Another contributing
factor is the weight of the site, which contributes greatly to slow loading. A
research by Evans Technology indicates that “74% of users abandon sites that
take more than five seconds to load or provide what they expect”. To avoid this
issue, conditional loading could be enabled for the websites. This means that
the site loads only what the user needs (for example, instead of