Web Designers and Developers throw around the term ‘Responsive website’ all the time but do you really know what it means?
Back in the 90’s before we were all glued to our smartphones and before we knew what our school friend we haven’t seen for 10 years had for dinner last night, a website was a website. All it needed to do was to tell the person on their laptop of desktop computer what your business was all about.
Fast forward to the present where we have smartphones, smartphone plus, 8″ tablets, 10″ tablets etc etc etc….. A web designer can’t know what size screen their website is going to be viewed on.
So now we have a problem.
No longer can a left hand column be 100px and the middle column 600px and the right column 100px. That might look okay on a desktop but a user viewing on a smaller smartphone is only going to see 1/3 of the site…. So what do we do?
Use percentages… That’s going to work right? That way each column will assign it’s own width within the screen. that’s great but now the page scrolls to infinity with three words per line!
So we have to tell the site that when a user with a screen smaller than 650px (a mobile) all the columns need to default to 100% so the content spans across the whole screen. This often causes layout issues in itself so we have the ability to reorder columns or hide some completely on different views. Sometimes we go so far as to have duplicated elements each formatted for a. different view on desktop, mobile and tablet.