google's response to "responsive design"

5

Click here to load reader

Upload: softcontrolnet-ltd

Post on 11-Jul-2015

50 views

Category:

Internet


0 download

TRANSCRIPT

Page 1: Google's response to "Responsive Design"

IT Peace of Mind

Helping Users Find Your Website Easier By: SoftControl.Net, Ltd.

28 November 2014

Page 2: Google's response to "Responsive Design"

IT Peace of Mind

Today, mobile devices such as smartphones and tablets are being adopted at ever-growing rates, have now overtaken desktop PCs and laptops the preferred medium for accessing the internet, and are thus the major cause of declining PC sales. To serve this important segment in your website visitors, it’s imperative that your website is designed for a flawless mobile experience in mind, as well as for those accessing it from a desktop PC or laptop. Responsive design is the design approach that makes the experience across multiple platforms possible. Essentially, responsive design means that you have only one single website, and yet it works across different platforms and screen sizes. In this day and age when we differentiate our businesses with multiple forms of content, media and information, the task at hand is how to communicate your business and brand messages effectively. In this paper we set out to give you and overview of recent expert thinking on web design in the age of the mobile device..

How is Google responding to the responsive design trend? Often when we do a Google search on our mobile device, the websites we find and visit can be hard to read

and navigate. Links that are so small they are impossible to click, text that is too small or otherwise

awkwardly formatted and hard to read, or parts of the page cut off or not appearing on screen, so you have

to scroll to the side to continue reading….When you

encounter such a website it means the site has not

been optimized for mobile use.

As you can probably understand, your customers will

become frustrated and disenchanted if they cannot

find what they are looking for. Or maybe a partner or

investor is looking for specific business information – have you considered what it might say about your

business values and professionalism if your website does not welcome mobile users?

Recently, Google has added a search feature that will help mobile users find information better, by marking

responsively designed website with the label ‘mobile-friendly’ in Google search results.

For a webpage to be labeled mobile-friendly, it must meet the following criteria:

The web-page avoids use of software that isn’t commonly used on mobile devices, such as Flash

The web-page has text that that can be read without zooming in or out

The web-page automatically lays out and sizes web content elements so they fit on one screen size…instead of forcing the visitor to zoom or scroll horizontally

The web-page spaces its hyperlinks so that they can easily be tapped on, without missing the links or clicking on something else.

How can I ensure my web-page qualifies for Google’s “mobile-friendly” criteria? The good news is, Google offers a quick test right here: Mobile-Friendly Test. Go and check your web-page by entering the address, as shown on image.

Page 3: Google's response to "Responsive Design"

IT Peace of Mind

If the page meets all of Google’s criteria, a message will be shown: “Awesome! This page is mobile-friendly”. If your page does not meet the criteria, the message will say “Not mobile Friendly”. Usefully Google shows a number of aspects and reasons for not qualifying as mobile-friendly. If our page has not qualified as mobile-friendly, there are a whole range of things you can do to amend the situation:

Have a look at the Google documentation on our Webmasters Mobile Guide – there you can find smart tips and guidance on improve your mobile site

Go to Google Webmaster Tools, and check the Mobile Usability Report. This reports detects the main mobile usability problems on your entire website (not just on one web-page)

Google’s how-to guide for third-party software (for example WordPress or Joomla) gives advice on migrating your CMS-hosted site hosted on a CMS (Content Management System) to a new mobile-friendly template

Once you have identified and understood both the flaws and the Google suggested solutions, go ahead and make the required changes

Think about communicating your values too … across all screen sizes It’s important to be mindful that quick-fix, band aid solutions to responsive design challenges can create further problems. Always think about the overall impression you leave to visitors and how you site is consistently presented across different platforms and devices:

Does your navigation stay the same or does it change depending on which device is used? Do not employ hover states for touch sensitive devices. Also design all touch regions so they enable easy clicking – this usually means making the touch regions relatively large

Ensure that all call-to-action elements are easy to find, view and use, on all devices and screen sizes

Check that all text copy, imagery and video elements still have the desired effect across screen sizes…which should be to communicate to your audience who you and your brand or business are. This means you may have to optimize these elements afresh for large and small screen sizes

When using interactive elements to engage site visitors, are you sure they work as desired on all devices? Also keep in mind that the quality of video playback and overlays is not the same on all mobile devices.

What about brand? A website is always an expression of your brand. This means your brand values must come across clearly at all times and across all devices and screen sizes. At the start should be a well-considered brand message and visual strategy that can then be translated into a responsive design strategy. From the strategies you can make sensible decisions about where and how to feature important messages, and how the layout and composition of the site meets your strategic goals.

Search Marketing and Email also make demands on Responsive Design When you consider a website de-design or re-launch, you should make responsive design a priority. Your customers and other website visitors are increasingly using mobile devices to access your site – you don’t need a more compelling reason to make your website responsive and mobile-friendly. The same reason applies to your other digital domains:

Page 4: Google's response to "Responsive Design"

IT Peace of Mind

Mobile website visitors often arrive at a site from different starting points…maybe clicking a link from another external site, via organic search or a pay-per-click ad. When this happens, the visitor usually gets their first impression with a landing page. This makes it imperative that the landing page is optimized for mobile use and communicates your strategic brand messages clearly on first encounter. If you get this right, visitors will have a positive first experience and are more likely to engage with the site, and be converted into sales. To make your landing pages responsive requires the same methods as for creating a responsive website. To find out which kid of design solution is best, you can design a number of landing pages and then test them on different devices. The best sites use an approach where every page on the website is a landing page. Check that:

Your most important content stands out most strongly

Calls-to-action are highlighted prominently, ideally both in the front and in the centre

The story you want to tell is told clearly and engagingly

An example of a responsive landing page with the content optimized for different devices and screen sizes

Conclusion Responsive design is now the standard method to make a website be useable across multiple platforms, devices and screen sizes. Websites are key to communicating brand values, plus have the role of attracting , engaging and converting business – without a mobile friendly site these ambitions would be seriously compromised. To rebuild your site and make it responsive:

Study analytics and user research and let the learnings inform your site re-design and architecture

Choose a Content Management System (CMS) which gives control of how content is presented across devices and screen sizes

Build responsive landing pages as well as email templates to facilitate Search Engine Marketing and optimize for better conversions

Use an experienced and professional web development provider to help design, build and support your mobile-friendly site

Page 5: Google's response to "Responsive Design"

IT Peace of Mind

About SoftControl

Founded in Bangkok in 1993 by a team of German and Thai entrepreneurs, SoftControl has helped

global companies in Thailand and worldwide focus on growing their business for more than two

decades.

Over this period, we have delivered ITC services and solutions, including responsive websites in

more than 20 countries, to more than 200+ local and international customers including small and

medium size companies as well as enterprise level businesses across different industries. For many

of our long list of satisfied customers we continue to be a preferred IT consultant and provide

ongoing IT support and strategic advice.

SoftControl’s success and continuity as an IT partner of choice arises from always placing your

business interests firmly at the centre of the innovative solutions and services we offer. Our know-

how and expertise as an IT partner is aimed single-mindedly at giving customers the freedom to get

on with business – a vision which we call IT Peace of Mind.

Read more about SoftControl SEO and web analysis here: http://www.softcontrol.net/seo-and-web-

development/website-analysis-and-seo

Ream more about SoftControl’s responsive design here: http://www.softcontrol.net/seo-and-web-

development/responsive-web-design

For ICT business solution in Thailand: call us +66 2 105-4068 or send email to [email protected].