It’s no secret, people are completely glued to their phones and if your site is not giving the masses a good experience, you’re truly missing out. Studies estimate that nearly 60% of web traffic is being viewed on smart phones and tablets. If you’re not giving your users a mobile experience, you’re missing out on over half of the Internet population. With all this mobile traffic, Google has taken notice and is making updates to improve the mobile experience for users. Come April, Google will start penalizing websites that aren’t mobile friendly. How do you know if your site is mobile friendly you ask? Start by testing it with this nifty tool: Google Mobile Friendly Test.
With Google’s update in mind and mobile traffic climbing, its no wonder we’re discussing why building websites for mobile is important. The question is then, how do we make a site mobile? In the web industry, something mobile is synonymous with saying, ‘Is your site responsive?’ Meaning, does your site respond to the width of the device it’s being viewed on. With the advent of smart phones being all sorts of widths / dimensions, you can no longer simply target your site layout to fit the iPad and iPhone. Android is now pushing over half of the mobile market so it’s safe to say your site will need to look good on every device.building websites for mobile
Using what web developers call Media Queries in their code, they are able to target the layout of your site at specific dimensions. The standard size of an iPad is 1024 pixels by 768 pixels (if you’re not familiar with what a pixel is, here’s a good breakdown). Since you can use an iPad in landscape or portrait, much like any smart device, the user experience can vary greatly by simply rotating the device to the opposite orientation. If your site is truly 100% responsive, the user’s experience will not skip a beat and they will continue viewing the site as you had planned.
One of the most important things for your site being responsive is that you target different pixel break points. As mentioned above, it is very important to account for an array of pixel dimensions. Designers will typically make several layouts, also known as ‘mocks-ups’ or ‘mocks’, that accommodate each one of these pixel break points. Depending on the scope of the project and need for different layouts, single pages may have close to 3 or 4 layouts to cover the possible dimensions the site will be viewed on. As you can see, web development and design can be very expensive, depending on the project budget and size of the site.
Next time you’re looking for a website to be made or you hear that a site is mobile, it’s always a good idea to ask the web developer this, ‘Is our site going to be truly responsive on all devices?’ This will be a good indication of the work the developer can deliver as well as what the potential cost may be. There is always something to be said for expensive work. Although expensive, if you’re trying to cut corners, you might run into issues along the way that require re-work causing the website project to swell to more than double the cost of originally quoted ‘cheap’ website.
At Trademark, nearly all of our sites are 100% responsive, (depending on the desire of the client). If you get a chance, take a look at our site on your mobile device. You will notice that the experience is different than on a desktop machine but rather, the experience is tailored to your device. This is because we know that over half of the Internet is using mobile and that it pays big to have a mobile site. Come see what we’re doing and how we can help you with your next project!