Websites Should Be Mobile Friendly As A Standard
We all knew it was a matter of time before search engines like Google started giving more consideration towards mobile friendly websites. Website design and SEO providers like us have been posting articles about the importance of making your website mobile friendly for awhile now. If you havent taken onboard our advice yet then its time you do.
One of the more obvious signs that Google was gearing up for a mobile friendly era was when they decided to mark there search results with “mobile-friendly” when you made a search using a mobile device.
Even though Google has announced the importance of being mobile friendly and blogs like ours have been talking about it for some time, only 18% of all websites have actually made changes.
A mobile friendly website renders its content to the size of the screen on the mobile device, content like images, text, css blocks, menus, and even the design/layout readjusts to display itself correctly.
We can redesign your current website to make it mobile friendly or build you a brand new one with a new modern design and look. If you want to take on the task of making your website mobile friendly yourself then carry on reading as well as taking a look at our previous posts.
The first thing you want to do is set a meta viewpoint width, the most common width being 700. To do this you simply add the below line of code )how it is) to your header section alongside your other meta tags.
<meta name=viewport content=’width=700′>
Then you want to start working through your content, you can follow these steps in any order you like. You can make any form more mobile friendly by using specific attributes looked for by mobile devices. For example, if you have a form input that asks for an email address you can set it the type to “email” like so:
What’s your email: <input type=email size=20>
This will automatically changes the users keyboard to the one that displays the @ sign.
There are other attributes you can use for other inputs, like this one:
What’s your name: <input type=text size=20 autocorrect=off autocapitalize=words>
Another thing you can do is set the maximum width of your images to 100%, this will help resize them and keep them within the viewpoint, instead of overlapping other content and sticking out like a sore thumb.
Make these changes and then come back for the next article which we will publish tomorrow. Feel free to leave your thoughts and feedback in the comments section below.