This course is brought to you by Appy
Pie as part of our Academy series.
You might have heard the term responsive website and static websites so what
are they the corner of the day is where a website is just accessed from a
chunky desktop sitting at home the world has gone mobile and the rise of
smartphones and a boom of Internet connectivity has enabled people to access
websites access Internet and hosts of Internet services anywhere from any
device so you need the website to be capable of being displayed correctly on
all devices with the mirror of different screen sizes basically the website
should be able to adapt to the screen size it is being viewed on and this is
called responsive website you don't need a smartphone or a tablet to check
whether a website is responsive or not you can do it right here on your
computer so let me show you an amazing website which I personally believe is a
design inspiration the website is of Karnataka BSNL circle why do I say it's a
design inspiration if someone can take this website and make it amazing and
modern I will hands-down worship that person this website is a classic example
of a website that is stuck in the early 90s you can make out the blingy stars
which are showing out the important notifications you can see the jiff which is
continuously changing and I'm not even able to comprehend what it's saying you
can see that it's running flash which is pretty much going to be phased out in
the next three years and you can see the toolbar is completely out of place
this is a bad website now we can simulate the screen size of a mobile phone by
changing or the size of our browser window you can see that this pretty much
resembles a screen of a mobile phone a rectangle now an unresponsive website
basically you would have to cite scroll to see the entire website over here and
it does not adapt to the screen size this is an unresponsive website so now let
us see an example of a responsive website so let me head over to Chrome again
and go to the National website of BSNL that is nothing but BSNL dot oops again
BSNL dot code in and you can see this is a fantastic website glorious user
white space clear text beautiful iconography covering sections for the customer
to take the relevant actions they have a beautiful call-to-action to download
their mobile phone apps slider with animations for a lot of images over here on
also a press release which basically gives out latest news and everything and a
beautiful footer this website is a good website and it being one of the largest
telecom companies in India would be experiencing a lot of traffic and I bet the
website back end or the servers are really optimized so let's see whether this
website is responsive or not again I'm gonna do what I did with the Karnataka
OBS another website and I am going to change the window excellent you can see
that the website completely adapted to the screen size it's being viewed on in
this we are trying to simulate the screen size of our smartphone and you can
see that whatever was horizontal automatically stacked up vertically and the
entire menu has been condensed into something what we call the hamburger menu
because it resembles a hamburger and on clicking it you can see that it creates
a drop-down it's a beautiful responsive website let's try to simulate the size
of a tablet and see how it behaves fantastic you can see that the headers are
automatically aligning to the screen size they have and once it is being viewed
on a sizable device automatically the hamburger menu is gone and a full-fledged
header is brought back up this is an example of a responsive website so why
should we build responsive websites well the first reason is smartphone
penetration is growing at an exponential rate it is easier to get online than
it was a few years ago certain design philosophies have also cropped up for
example there are a lot of websites which follow a mobile-first approach they
design particularly for a mobile phone the desktop version takes a sideline
mobile is growing more people are going to be accessing the Internet doing
stuff ordering products on their smartphone not on their laptops mobile
responsive websites are the future also with the integration of various payment
processes such as Samsung pay Apple pay the mobile phone is going to outgrow
the desktop inconvenience portability ease of use and user experience.
Write a public review