Red Fox New Media, an ally in your organisation’s digital marketing strategy
The word responsive, when talking websites, is something that you hear mentioned a lot these days, it’s something of an industry buzz-word. But what does it mean?
Traditionally the web pages that make up a website are a specific width, these are built to fit on a normal desktop or laptop screen horizontally with, depending on the resolution of the screen, a little room on either side of the content area of the page (left and right margins). Obviously the height of the page varies depending on what it’s displaying, vertical scrolling is a given. This was perfectly acceptable a few years ago, anyone wanting to read a web page when out and about waited until they got to their home or office.
If you; a/ had a capable mobile phone or PDA, were b/ lucky, and c/ patient. The author of the website might have created a cut down version of their website using WML (Wireless Markup Language) which was slowly delivered via WAP (Wireless Application Protocol). These tended to be a shadow of the full website but, if available, could provide some relevant useful information whilst away from a PC.
Enter the smart-phone, and more recently the tablet, along with the relevant network providers ramping up the availability of fast mobile data via 3 and 4G. These days the appetite for browsing the web on the go is insatiable, in some business sectors the majority of the traffic is delivering content to mobile devices. Whilst, for most locations at least, the mobile phone networks are now capable of transmitting the amount of data required in a timely manner, the small screens of the devices used make the websites virtually unreadable without a lot of scrolling and zooming. This is where responsive web design comes in.
With careful consideration to the design of the underlying structure and code a website can be built in a manner that allows the layout to be reconfigured in a flexible and fluid manner. This can be carried out dependant on the detected screen width, in pixels, of the device being used to view the web page in question.
Layout reconfiguration happens on the fly so changing from a vertical to horizontal orientation, with more pixels to play with across the screen, may well change the layout. Text is made larger, controls, such as buttons, a finger friendly size and optionally some content can be removed from view should the site owner wish to only present a sub set of the content. Bear in mind that vertical scrolling will be considerable when viewing what would have been a long web page in a conventional browser.
The technology that makes all this possible? That’s CSSCascading Style Sheets - This is a form of code that dictates the layout and formatting of documents, in the context of web pages it is usually in the form of a separate file that is included into the page header. and HTMLHypertext Markup Language - In the early days of the Internet HTML did the job of controlling both content and layout, these days CSS handles the layout and formatting, HTML defines the basic page structure and content containers that CSS acts upon to format the page. versions that are supported by all recent, and most not so recent, web browsers.
The screen widths where this morphing of the layout of the web page occurs are called breakpoints; there can be more than one, accommodating numerous different device types such as smart-phones, large and small tablets etc.
To avoid frustration of the mobile users of your website, and in the interests of the retaining their attention, Red Fox New Media strongly recommend that a responsive layout is employed when building a new website. When using WordPress look out for a theme that is stated as being responsive, we can advise and offer suggestions.
Whilst it might be possible, depending on how it was originally built, to reverse engineer an existing non responsive website, the costs involved could be considerable. A chance to maybe have a refresh of you web presence with a new up to date website?