Advice

Are you ready for Google’s ‘Mobile-friendly’ Update?

Google first announced algorithm changes to affect mobile SEO back in November 2014. They have since provided a few more specifics and have revealed via a blog post that the algorithm update will happen on the 21st April, and will focus on ‘mobile-friendliness’ as a ranking factor.

Zineb Ait Bahajji, from Google’s Webmaster Tools Team has said that the upcoming mobile-friendly ranking algorithm changes will have more of an impact on Google’s search results than the Google Panda or Google Penguin update did!

Essentially, what Google is saying is that if your site is not mobile-friendly, you need to take the necessary steps to ensure  it is. If 50% of your traffic from is from mobile devices such as smartphones and tablets, if your site is not mobile-friendly (‘responsive’) that potentially your traffic from mobile is at risk.

Why is Google implementing these changes?

Google currently considers that the user experience of many sites featured in their search results is not good enough for the increasing number of people now using Google on their mobile devices. They don’t want to be serving their users with sub-standard search results and so they are making efforts to sort out this problem.

What you need to do

Google have recently provided quite a bit of information for website owners about the performance of their mobile websites and alerting them of any potential issues they may have. Even if your site is responsive and you think it’s mobile-ready, it’s important to have a closer look and do a proper mobile SEO audit. Here are a few things you need to check and action as soon as possible to ensure you’re not left behind –

Run the Mobile Friendly Test

Check out  the mobile diagnostic tool available on the Google Developers website. Begin by testing your home page and then each of the main page templates on your website. Make sure the site resources such as images, CSS, JS are also crawlable.

Analyse your mobile usability report

If you have a look within Google Webmaster Tools, Google now details webpages on your website with errors for mobile users – for instance when touch elements such as buttons or links are too close to one another making tapping them with your finger difficult. Other issues are the use of flash or improperly sized content such as huge images that are being scaled down inappropriately.

Google-Mobile-Usability-blog

See if you have a mobile-friendly snippet

Google have started to display mobile-friendly websites in mobile search results next to the meta description in their search results. If your site is missing these ‘Mobile-Friendly’ labels you are likely to have a problem come the 21st of April.

google-mobile-friendly-snippet

Check your Site Speed

Site speed is another important factor – as you’ll want your site loading as quick as possible via a 3G mobile connection. This is already an important ranking factor for both mobile and desktop sites so use Google’s PageSpeed Insights tool to check for page speed issues on your mobile site.

Google-Site-Speed-blog

Each of these online tools will give you a clear indication on whether your site mobile-friendly or not and what you need to do get there. The chances are that many website owners won’t know that they need to actually improve their site to adhere to Google’s algorithm change until it’s too late – don’t let that be you.

Simple Conversion Optimisation

Clients often approach us with the same dilemma: “We love our new website but we’re not getting any sales.”

 It can sometimes take businesses by surprise when their website just doesn’t work for them in the way that they had hoped, despite it looking the part.

 Thankfully, optimising your conversion rates – which basically means turning your site visits into sales or enquiries – can really be quite easy and a lot of it you can do yourself without having to employ anybody else to do it for you.

 We’ve put together a few key points worth thinking about to significantly improve the success of your site.

Have Fun With A/B Testing

By creating two sites that are identical and making small changes to one of them, you can easily see, after a short amount of time, which site your visitors prefer and which site has the most success. Have a play with your wording, images, headlines and Call-To-Action buttons. All of these small amendments can contribute to big improvements in conversion rates.

Choose a Simple Layout

When a visitor lands on your page, they need to be able to see the information that they require immediately. Is your menu visible? Are your contact details available? Are your products or services easy to locate? Make sure that the relevant information is not being hidden in favour of big graphics and stunning visuals.

Reduce Form Fields

Make it as easy as possible to buy from you and to contact you. Do you really need to know that much about the client? A long form with a lot of fields to fill in is off-putting. You can always have the option to ‘Register’ as a separate optional form, or if you are offering a service to your client, you can gather more information from them at a later date. When we drastically cut down on our fields earlier this year, the result was immediate and quite staggering!

Make Your Call-To-Action Button Obvious

Don’t hide your ‘Contact Us’ and ‘Buy Now’ buttons at the bottom of your page amongst a load of text and other images. Your CTA button should stand prominently on your page, in a contrasting colour, and it should definitely look like a button rather than a link. Test a few options in your A/B testing and see what happens!

Think About Ditching the Image Slider

Whilst the carousel at the top of your home page may look very impressive, it might not be getting the attention that you think it is. It stands at the forefront of your website, in the most useful space that you have. If your viewer cannot keep up with reading the text that keeps sliding away, or can’t decipher how to go back and look again at the product that they just saw and which has now disappeared, you will have a frustrated client.

A slider can reduce the interactivity between the user and the site and can create Banner Blindness, which is when a viewer bypasses the slider completely.

Remove the distraction and replace with a static offer that will encourage your client to hit that Call-To-Action button!

Stop Using Stock Photos

Stock photography can be very off-putting when your client really wants to see the real deal. Opt to take photos of your actual team, within your own office or workplace. This builds their trust and makes you look far more approachable and real.

Use Relevant Images

Don’t use images to fill the gaps. Images should be informative and not used to make your site look pretty. Use your A/B testing to see which images are more appealing to your visitors.

Add a Video

….. but make it a short one! Prospective customers like to see videos of products and services. However, a video should be 2 minutes long or less if you want to really grab your client’s attention.

Give a Special Offer Deadline

Present the user with a reason why they should click that Call-To-Action button now! Don’t let that prospective client leave the site to come back later, as often they won’t. Give them a  deadline:

“Place your order before 2pm for next day delivery.”

“Only 2 hours and 25 minutes remaining to qualify for 25% discount.”

“Only 2 left in stock.”

Provide a Phone Number

So many websites do not provide contact details. By displaying your phone number prominently at the top of your page in big lettering, you automatically appear to be more approachable and the user is reassured that they can contact you if they wish to.

Don’t Use Jargon

Visitors to your site are regular people who don’t want to be wowed with fancy lingo and complicated sentences. They also don’t want to feel excluded by the use of words that they need to look up in a dictionary. Write your copy as though having a conversation with a friend; if you wouldn’t say it in normal day-to-day use, don’t say it at all!

Add Real Testimonials

It’s very obvious when fake testimonials have been used and very often, the real testimonials contain the most useful information for the prospective client. Reading obviously fabricated testimonials breeds mistrust.

Add Badges and Security Seals

If you have been handed an award, display it on your site. Similarly, if your check-out process features a banking security system like Norton, make sure your users know this on the homepage – they will know that they are in safe hands.

Keep Blogging!

If you have a blog, keep it updated. A blog serves as an insight into the business and builds trust between the client and the service you are offering. It should almost serve as your shop door, where the visitor can come in, have a look around, have a chat and feel more informed.  An out of date blog suggests that business is not going well, the doors are closed,  that you don’t care too much about your customers and that you don’t have very much to say of any importance.

 All of these suggestions are things that you can do yourself.

It’s worth noting though that optimising your site is an ongoing process. Once you reach your target conversions, there is no reason to stop tweaking – keep going. See if you can make even more of an improvement. Have fun with it and explore what works best for you and your clients and business.

Getting the Most from your Web Designer

For most businesses these days, a good website is the most effective marketing tool that they have. It’s usually the first point of call for customers wanting information on products and services as well as contact details. The most effective websites will do a good job in selling you a lifestyle, a dream and make their business incredibly desirable to the user.

That’s why it is so important to choose the right design agency for you and to create the right website for your business. It can be a huge step for a company to buy into creating a website, and often it can be an even bigger step for a company to decide to have a redesign of an existing site. To get the very best from your web design project and gain the most efficient results, we’ve put together a few tips:

Budget

Websites come in at all shapes and sizes and as a general rule, and not surprisingly we advise to spend as much as you can afford. A website costing £500 will not do the same job as a website costing £3k. The larger and more established the agency the slightly higher price tag you might expect. However – working with a more experienced agency you’ll benefit from working with multidisciplinary team and get a full package, which might include hosting, design, development, training and continuing support not to mention an overall effective and smooth project process. Work out a realistic budget and include some flexibility for amendments and additions along the process.

Write a brief

Sounds obvious, but before you contact any agencies, make sure that you know what it is that you are aiming for. Writing a brief and having a clear idea of what you are hoping to achieve will make choosing the right agency easier. It will also give the agency a better chance of providing an accurate quote.

What do you want the website to do? Seems a daft question but it’s one that you need to ask yourself and an answer that you need to convey to your designer. You need your designer to want the same as you and to be on the same wave-length from the very beginning. Do you want your site to be mobile-friendly? Do you want it to be top of Google? Do you want your site to be easy to amend later?

In preparing a quote for you, an agency will need to know as much as possible about the work that they are going to carry out for you. Features that might seem like small additions to you, might be more time-consuming than you think and omitting details might end up delaying the project finish and might start incurring additional fees that you haven’t budgeted for.

 

Do your research

There are so many freelancers and agencies out there all hoping to work on your project. Do yourself a favour and look around for the one that will work best for you. Look at other sites and don’t be afraid to get in touch with them to ask about the agencies that they employed. Look at web design portfolios and make sure that the agency that you make your enquiries to can actually do the work that you are hoping for.

Prepare your content

On deciding who you are going to work with and paying your initial deposit, it would be in your best interest to get all of your content over to the designer as soon as possible. Having all of the text and images and videos ready means that the designer can get a better idea of how the site should look and means that the designer doesn’t lose enthusiasm later down the line when waiting for information to come through.

Provide a deadline

If you are working towards a specific launch date, let your designer know. Even if your desired launch date isn’t too important, it’s good to give yourself and your designer a time limit. Designers love deadlines and thrive on the pressure of working towards a launch. It also means that the agency can plan their time and make sure that they give you the hours each day that your project requires. Having a project that drags on means that the designer will no doubt take on several jobs at the same time and they won’t be dedicating all of their attention to your site. As a designer, it’s very easy to become demotivated by a project that seems to go on and on. Having your designer throwing enthusiasm and dedication to a project will undoubtedly get you better results.

Give feedback

One of the most frustrating things for a web designer is lack of feedback from the client. Not getting feedback in a timely manner means the designer might need to move onto other projects to fill the time and can delay projects. So be as clear and concise as possible when providing feedback or when asking for amends. Don’t be vague and avoid saying you’re not sure about something. Tell your designer specifically what you don’t like and how you would like it to be changed. A lot of agencies will ask straight up who in your business has the final say on the project. Too often, the project manager will give the thumbs-up to the designs, only for the director to step in further down the line and decide that the website isn’t working for them. This can be a huge back-step for the designer and could leave them resenting the project. They want to be sure the feedback they receive is from the key decision maker on the project.

By taking these useful guidelines into consideration before you get in touch with a prospective web designer, you’ll be giving your project the very best opportunity to develop into the site you were hoping for.

Designing in the Browser

A recent Forbes study estimated that almost 80% of internet access is now made via a mobile device rather than a desktop computer. With even more mobile devices entering the market, all with different screen sizes,  it’s more important than ever to ensure your site is built to cater for a mobile audience.

Back in January 2013 we went to New Adventures in Web Design in Nottingham. One of the talks that stuck in my mind was by Jason Santa Maria, entitled ‘The Nimble Process‘. Jason spoke about web design processes and how, as designers  we must constantly improve and evolve the way we work. Having designed websites the same way for years I remember feeling quite apprehensive about having to adapt to the rapidly changing landscape of web design. The catalyst for such dramatic change? The mobile internet and ‘responsive’ web design.

Here at Pixel Air we’ve been advocates of responsive web design for some time – although it’s meant that we’ve had to reestablish the way we work. Long gone are the days of the common linear process of design, build and publish. Nowadays we find ourselves combining all three stages right from the start. We’re having to look at the content and figure out how it’s going to be displayed across a plethora of devices and screen sizes.

Efficiency is Key

Faced with this, we’ve had to drastically change our design process. As designers we were used to the tried and tested process of producing flat designs of a desktop home page and content page in Photoshop and presenting these to our client. With the advent of responsive web design we found our workload pretty much tripled overnight. How would we cope with suddenly having to put in so much extra design time?  To get sign-off from a client now, we would not only have to present a selection of pages but also how these pages would look and work at different screen sizes and orientations. The solution? Being more nimble. Jason’s talk suddenly became more relevant than ever. We realised things had to change – our process had to evolve.

It had become clearly apparent that designing responsively in Photoshop was an inadequate method and was too time-consuming. Even after a design was given the OK by the client, any tiny tweaks later on in the process just meant that we had to spend hours going back through each and every one of our template pages to make the change.

So we took the brave step of ‘designing in browser’ – and effectively turned our current process on it’s head. Rather than loading Photoshop – we got stuck into code right away. It not only meant we could produce a design that would scale and adapt to different screen sizes but any design changes could be implemented quickly and efficiently. ‘Designing in browser’ has totally changed the way that we work for the better.

Back to the Drawing Board

One of the first projects that we designed in browser was for Synergy AV. The site consisted of three separate mini-sites that shared a landing page, and if designed in Photoshop, would have taken up most of the budget just getting us through the design phase.

So we started out with some simple wireframe sketches of how the site should would look on different devices and presented these to the client. They were able to provide some immediate feedback on the different proposed content areas and how they’d like things to appear and were even as adept as us at using a pencil and eraser! Once we were all on the same page (literally), we were able to take the sketches and start coding up the HTML wireframes.

The client was able to follow the whole process from their browser. Any necessary changes were able to be made in the code and would be visible on all platforms immediately. We were able to avoid the time-consuming process of tweaking multiple Photoshop comps individually. And because we use SASS, it meant amends to a few variables and the colours, spacing and typography were updated quickly and efficiently.

Of course, we still used our much loved Photoshop – but more as a tool for preparing assets these days – and to mock up the occasional idea. It’s unlikely that we will use Photoshop as a core design tool as we have done traditionally. It certainly has its place within our work. With CSS3 you can pretty much create any effect that you would have done previously in Photoshop – rounded corners, gradients and shadows – you name it – but with the added layer of interaction to demonstrate different buttons states or transitions.

Stripping Back Design

It’s probably not a bad thing to take some of the fuss out of the design process anyway. Often you’ll see too much form and not enough function; designers who are hell-bent on producing an all-singing, all-dancing website that looks amazing. However, take it onto mobile and it’s hard to navigate and read, and potentially it’s  slow and bandwidth hungry.

As we know, designing responsively with a mobile-first approach means that from the start, you have to think about the content. Designing in browser lets you see very quickly how it will display and scale across devices in a fluid layout. You can focus on the delivery of the content rather than aesthetic embellishments and visual flourishes.

The Technical Stuff

Ok, so it’s not for everyone, just yet. The main disadvantage to designing in browser is the fact you need to know HTML and CSS. However, just learning the basics and having a small understanding can bridge the communication gap between designer and developer. You’d be amazed at how a developer will suddenly understand your design ideas when speaking their own language and showing that you understand things from their point of view.

Here, at Pixel Air, we try to be fairly savvy with our code and have embraced the challenge of  browser-led-design with relish. It’s always good to be learning new tricks, especially with a really solid foundation to start with. The industry in which we work is always changing, due to it’s very nature, and with the promise of more efficient processes, we welcome this change with open arms!

“Progress is impossible without change, and those who cannot change their minds cannot change anything.” George Bernard Shaw

Google Will Warn When Your Site Is Not Responsive

We wrote an article not so long back about the importance of keeping your site up-to-date with technology and with your user.

With more people using mobile phones to access search engines than ever before (set to overtake desktop searches), it seems it is more important than ever to make sure your website is responsive.

Google has announced that it will start to warn its search engine users of which sites will not be compatible with the device they are using.

If your business relies on customers finding you through Search Engines, it’s a good time to get responsive!

Read article here…

Are you Responsive?

You’ve got a great business and you’re the proud owner of a beautiful website. But when it comes to mobile, your site just doesn’t look quite so good. The content doesn’t fit, the images are squashed, the text is illegible.

If you’re not happy with the way your site looks from your mobile phone, you can bet your customers aren’t either.

What is Responsive Web Design?

Responsive web design uses “media queries” to adapt the design and layout of your website specifically for the device it is being viewed on . With this in mind, making your website responsive will make it future-proof, requiring you to have only one website that is coded to adapt to all screen sizes including, mobile phones, tablets, PCs, TVs, watches, glass walls, whatever the future may hold!

61% of adults in the UK last year accessed the internet through their mobile phone or tablet. With these devices becoming more accessible, the rate is set to increase this year.

Rather than designing websites specifically for iPhone, iPad, Kindle, Blackberry etc, a website should have the technology to automatically respond to the users’ preference.

Why Responsive?

In 2013, 61% of adults in the UK had used a device such as a mobile phone or a tablet to access the internet, and almost all of these (94%) had accessed internet ‘on the go’. The most popular way to access internet ‘on the go’ was from a mobile phone with over half of all adults (53%) accessing the internet this way. This has more than doubled since 2010.

According to an Ebay and Deloitte Study, Smartphones and tablets are creating a breed of ‘Super Shoppers’ that account for 70% of UK retail spend (£200bn in 2013).

Super Shoppers use omnichannels via various devices, pausing their shopping, and resuming again, at home, on the bus, whilst in-store, to look at prices and reviews, deciding when and where to shop, stock-checking, and hunting for mobile and social media offers. Customers fully expect their favourite stores to be joined up to their websites.

Are you leading your customers to sites they can’t see?

78% of daily active use of Facebook comes via mobile access. There are similar figures for the use of other social media sites. A business that interacts with it’s customer base on Facebook, Twitter etc, will find that it is essential to have a mobile friendly site.

It should also be noted that 25.8% emails are opened on a mobile device and so, any marketing sent via email, should contain links to mobile friendly websites.

If a user does land on your mobile website and is frustrated or doesn’t see what they are looking for, there’s a 61% chance that they will leave and go to another website. It is also said that if they have a positive experience with your mobile website, they are 67% more likely to make a purchase or use a service. (Google Think Insights)

Pixel Air Are Responsive

At Pixel Air, we are proud to have been working on responsive web design for the last 2 years and now, the majority of the sites that we work on are built mobile-first.

Let's Work Together

We’ve helped hundreds of clients to get their business online. Speak to Alex today and tell us about your project.

Get in Touch

Meet Alex