What is Responsive Mobile Web Site Design?
Responsive Mobile Web Site Design is vital for a modern website. A responsive web site is one that ‘responds’ to the size of the viewing screen – whether it is a desktop computer, a tablet or a mobile phone – portrait or landscape.
The blocks of a page rearrange vertically so blocks like the header areas and page content come first and then the sections like the footer area of the web site.
Google and Responsive Mobile Web Site Design
Google has been pushing websites to be more Responsive Mobile Web Site Design for some time now. They want to encourage web sites to be more mobile friendly because over 50% of web site traffic now comes from mobile devices.
To encourage web sites to be use Responsive Web Site Design Google give sites that use Mobile Web Site Design a slight search engine results advantage. IE, if you have a Responsive Web Site your website will do better in google.
We Build Responsive Web Sites
The web sites we build are Responsive and mobile friendly, and have been since about 2013/14 when we started changing the way we built the websites. We still use the WordPress Content Management System to build web sites and the fact that the web sites are responsive does not make wordpress any different to use.
How to test if a web site is Mobile Friendly?
The quickest way is to take a look at a web site on your phone. If it looks the same as on desktop then it may well not be a responsive web site. If it looks different: the navigation has become 3 horizontal lines (a Burger Menu), if the sections of the page are now lined up vertically: header, burger menu, content area, sidebar, footer, then it probably is a responsive web site.
- Right click on a web page and select ‘Inspect Element’.
- A window area appears. Along the top section of this area are a set of icons. Look for an icon a bit like a mobile phone outline over a tablet outline, or just a mobile phone. Click on this icon.
- At the top of the web page area you should see a drop down of screen sizes and rotating screen layout between portrait and landscape. Select one and see..
- There is also an option for Custom or Responsive – this allows you to drag the right hand screen line in and out – and the website changes accordingly
NB: this is not 100% accurate but it gives you a good idea. Sometimes it is better to reload the page if it starts to look a bit messy.