What is responsive web design?
Your business website needs a desktop and mobile friendly design to adapt to each device and screen size. To achieve this we use HTML and CSS media queries. This results in a custom responsive website design that will render fast, and be easy to use for someone on mobile phone, tablet or desktop.
The exact same information as seen on desktop is presented on your mobile friendly web site but in an easier way for mobile users to see and navigate through.
Basic principles of mobile website design
- Website becomes one column layout.
- Text/font size is increased.
- Padding around clickable elements is made larger.
- Images are dynamically re-sized.
- Elements like fixed headers are re-worked.
- Web forms are HTML5 and use native inputs to each device.
Smart-phone devices operate at an average resolution of 750×1334px, ie. very small! At small sizes links can be difficult to click on, text can be difficult to see if too small etc, so it’s very easy to rectify this situation and present a mobile version of your web site for users using responsive web design.
Google recommends responsive web design!
Just read here Google’s recommendations for mobile web design.
Google also are ranking responsive web sites differently on mobile results, see below for more info, we do know that mobile friendly web sites are ranking higher in search results. Coding to Google’s recommended standards will always be good for the overall health of your site!
1. Responsive web design: Serves the same HTML code on the same URL regardless of the users’ device (desktop, tablet, mobile, non-visual browser), but can render the display differently (i.e., “respond”) based on the screen size. Responsive design is Google’s recommended design pattern.
Google mobile first indexing
Our websites are fully suitable for Google mobile first indexing. This is arguably the most important algorithmic change and shift in user habits in years when it comes to search engine optimisation. It’s never been more important to have a responsive website that performs just as well on mobile as it does on desktop.
Mobile-first indexing means Google will predominantly use the mobile version of the content for indexing and ranking. Historically, the index primarily used the desktop version of a page’s content when evaluating the relevance of a page to a user’s query. Since the majority of users now access Google via a mobile device, the index will primarily use the mobile version of a page’s content going forward. We aren’t creating a separate mobile-first index. We continue to use only one index.
With mobile-first indexing, Googlebot primarily crawls and indexes pages with the smartphone agent. We will continue to show the URL that is the most appropriate to users (whether it’s a desktop or mobile URL) in Search results.
Read more about google’s mobile first indexing change at https://developers.google.com
We use Adobe XD to create your new mobile first website.
We design using a mobile first ethos. Meaning we first create the design to suit mobile screens, and then expand it out to suit desktop. You get a private viewing of our mobile and desktop layout before we start to code, meaning all of your edits are fully taken into account before we start to code your design.
Website prototyping allows us to quickly create designs and work out the best way to present the content in order to save time when it comes to hooking your website into the content management system.
Mobile Website Cork
If you are viewing our website on your phone you already know what we mean, if not simply resize your browser window until you see the mobile design appear!
Contact Hilary for prices on responsive mobile web design