tag:econsultancy.com,2008:/topics/user-experience-and-usability Latest User Experience and Usability content from Econsultancy 2016-08-24T09:57:53+01:00 tag:econsultancy.com,2008:BlogPost/68197 2016-08-24T09:57:53+01:00 2016-08-24T09:57:53+01:00 Which restaurants deliver the best mobile web UX? Nikki Gilliland <p>A mobile-optimised site will go a long way to helping get customers through the door. </p> <p>In fact, research shows that nearly <a href="http://www.xad.com/press-releases/80-percent-of-uk-mobile-restaurant-searchers-make-a-purchase-most-within-the-day-says-xadtelmetrics-2013-u-k-mobile-path-to-purchase-study/">80% of mobile searches for UK restaurants result in a booking</a>.</p> <p>Of course, mere optimisation is not always enough. There are four extra features which combine to greatly improve the user experience. </p> <ul> <li>Online menu (no pesky PDF's).</li> <li>Location-based services.</li> <li>Ability to book a table.</li> <li>Opening times and click to call.</li> </ul> <p>Here are some examples that deliver!</p> <h3>Online menu</h3> <h4>Nandos</h4> <p>We all know what’s on the Nandos menu, right? We don't even need to look before ordering.</p> <p>However, one thing that’s really great about the mobile site is that – as well as a handy spice-meter – it allows the user to calculate the nutritional value of a meal.</p> <p>A feature that’s likely to be ignored by the masses, but it’s a lovely little touch for anyone on a diet and still in the mood for a cheeky bit of chicken.</p> <p><img src="https://assets.econsultancy.com/images/0007/8100/nandos_2.PNG" alt="" width="200" height="355"> <img src="https://assets.econsultancy.com/images/0007/8101/nandos_3.PNG" alt="" width="200" height="355"> <img src="https://assets.econsultancy.com/images/0007/8103/nandos_4.PNG" alt="" width="200" height="355"></p> <h4>Wagamama</h4> <p>There’s a vast amount of choice, but with its easy-to-navigate and in-depth mobile menu, Wagamama hopes to reduce the amount of time diners spend deciding at the table.</p> <p>A short synopsis explains each meal and a handy side-bar means users can easily switch between categories.</p> <p><img src="https://assets.econsultancy.com/images/0007/8104/Wagamama.PNG" alt="" width="200" height="355"> <img src="https://assets.econsultancy.com/images/0007/8105/Wagamama_2.PNG" alt="" width="200" height="355"> <img src="https://assets.econsultancy.com/images/0007/8106/wagamama_3.PNG" alt="" width="200" height="355"></p> <h4>Jamie’s Italian</h4> <p>It’s easy to dismiss the 40-strong Jamie's Italian as yet another chain, but its mobile site reflects its focus on delivering transparency to the customer.</p> <p>There is a lot of information about nutrition, allergens and even gluten-free eating, and the comprehensive menu conveniently includes a filter to select vegan and healthy options.</p> <p><img src="https://assets.econsultancy.com/images/0007/8115/jamies.PNG" alt="" width="200" height="355"> <img src="https://assets.econsultancy.com/images/0007/8117/jamies_3.PNG" alt="" width="200" height="355"> <img src="https://assets.econsultancy.com/images/0007/8116/jamies_2.PNG" alt="" width="200" height="355"></p> <h3>Location-based services</h3> <h4>Homeslice</h4> <p>A restaurant address is all well and good, but any decent mobile site will have a location-based service.</p> <p>Homeslice cleverly uses copy to point the user’s attention towards its onsite map. Even better, it’s ‘take me there’ button opens up Google Maps.</p> <p><img src="https://assets.econsultancy.com/images/0007/8123/homeslice.PNG" alt="" width="200" height="355"> <img src="https://assets.econsultancy.com/images/0007/8124/homeslice__2_.PNG" alt="" width="200" height="355"> <img src="https://assets.econsultancy.com/images/0007/8125/homeslice_3.PNG" alt="" width="200" height="355"></p> <h4>Dirty Burger</h4> <p>With eleven restaurants in London alone, Dirty Burger’s website it designed around locations. </p> <p>Clicking onto each one, the user is met with contextual copy and an integrated Google Map.</p> <p>The only feature that’s missing is to be able to click out to the app itself, however the added convenience of Deliveroo integration means that it's slightly forgiven.</p> <p><img src="https://assets.econsultancy.com/images/0007/8126/dirty_brger.PNG" alt="" width="200" height="355"> <img src="https://assets.econsultancy.com/images/0007/8127/dirty_burger_2.PNG" alt="" width="200" height="355"> <img src="https://assets.econsultancy.com/images/0007/8128/burger_deliveroo.PNG" alt="" width="200" height="355"></p> <h4>Social Eating House</h4> <p>With its one-click navigation, Social Eating House is one of the most basic mobile restaurant sites I’ve come across. Yet, all the information is there.</p> <p>The 'location’ tap takes users through to Google Maps with just one click – simple yet very effective.</p> <p> <img src="https://assets.econsultancy.com/images/0007/8110/SEH_1.PNG" alt="" width="200" height="355"> <img src="https://assets.econsultancy.com/images/0007/8111/SEH_2.PNG" alt="" width="200" height="355"> <img src="https://assets.econsultancy.com/images/0007/8112/SEH.PNG" alt="" width="200" height="355"></p> <h3>Ability to book a table</h3> <h4>Pizza Express</h4> <p>Whether you need to actually book at Pizza Express is debatable, however its mobile system is definitely worth a mention here.</p> <p>With its bright and friendly design, it’s super easy to find the desired location.</p> <p>What’s more, it gives the option to book with a MyPizzaExpress account, meaning loyal customers will get extra incentives and offers in future.</p> <p><img src="https://assets.econsultancy.com/images/0007/8129/pizza_express.PNG" alt="" width="200" height="355"> <img src="https://assets.econsultancy.com/images/0007/8130/pizza_express_2.PNG" alt="" width="200" height="355"> <img src="https://assets.econsultancy.com/images/0007/8131/pizza_express_3.PNG" alt="" width="200" height="355"></p> <h4>Spring</h4> <p>It’s unusual to find a high-end restaurant affiliated with a third-party booking system, but I was pleasantly surprised to discover Spring on OpenTable.</p> <p>With its simple and elegant typography, the mobile site is very easy on the eyes, too. Being able to book a table makes it a dream.</p> <p><img src="https://assets.econsultancy.com/images/0007/8132/Spring.PNG" alt="" width="200" height="355"> <img src="https://assets.econsultancy.com/images/0007/8133/Spring_2.PNG" alt="" width="200" height="355"> <img src="https://assets.econsultancy.com/images/0007/8134/Spring_3.PNG" alt="" width="200" height="355"></p> <h4>STK</h4> <p>Most mobile booking systems tend to send you onto the third-party (e.g Bookatable), however STK’s is integrated into its own mobile site.</p> <p>The reason I like this is that it makes the whole experience feel entirely seamless, allowing users to search and book a table without leaving the page.</p> <p>Oh, and the prominent purple 'Book' button is impossible to miss.</p> <h3> <img src="https://assets.econsultancy.com/images/0007/8135/STK.PNG" alt="" width="200" height="355"> <img src="https://assets.econsultancy.com/images/0007/8136/STK_2.PNG" alt="" width="200" height="355"> <img src="https://assets.econsultancy.com/images/0007/8137/STK_3.PNG" alt="" width="200" height="355"> </h3> <h3>Opening times &amp; click to call</h3> <h4>Caravan</h4> <p>Caravan splits its information by two locations - listing both its opening times and contact details on one page.</p> <p>Although the phone number could be made clearer, it is clickable, and its location features are also easy to find here.</p> <p><img src="https://assets.econsultancy.com/images/0007/8139/caravan.PNG" alt="" width="200" height="355"> <img src="https://assets.econsultancy.com/images/0007/8140/caravan_2.PNG" alt="" width="200" height="355"> <img src="https://assets.econsultancy.com/images/0007/8141/caravan_3.PNG" alt="" width="200" height="355"></p> <h4>Wahaca</h4> <p>Another restaurant website that is split into locations, Wahaca's contact details are clear and precise - and pink, of course!</p> <p>In fact, its mobile-site is generally above average across the board.</p> <p><img src="https://assets.econsultancy.com/images/0007/8145/wahaca.PNG" alt="" width="200" height="355"> <img src="https://assets.econsultancy.com/images/0007/8146/wahaca_2.PNG" alt="" width="200" height="355"> <img src="https://assets.econsultancy.com/images/0007/8147/wahaca_3.PNG" alt="" width="200" height="355"></p> <h4>Hubbard and Bell</h4> <p>Finally, Hubbard and Bell is hot on letting its customers know how to get in touch.</p> <p>Even better, it deserves extra points for including a phone number alongside its mobile booking sytem.</p> <p>Wait, calling to reserve a table, in London? Well I never.</p> <p><img src="https://assets.econsultancy.com/images/0007/8149/HB.PNG" alt="" width="200" height="355"> <img src="https://assets.econsultancy.com/images/0007/8150/HB_2.PNG" alt="" width="200" height="355"> <img src="https://assets.econsultancy.com/images/0007/8151/HB_3.PNG" alt="" width="200" height="355"></p> <p><strong>Food &amp; Drink is one of the sectors covered at the <a href="http://www.festivalofmarketing.com/welcome?utm_source=econsultancy&amp;utm_medium=blog&amp;utm_campaign=econ%20blog" target="_blank">Festival of Marketing 2016</a>, which takes place in London on October 5-6.</strong></p> tag:econsultancy.com,2008:Report/3008 2016-08-24T09:35:00+01:00 2016-08-24T09:35:00+01:00 Internet Statistics Compendium Econsultancy <p>Econsultancy’s <strong>Internet Statistics Compendium</strong> is a collection of the most recent statistics and market data publicly available on online marketing, ecommerce, the internet and related digital media. </p> <p><strong>The compendium is available as 11 main reports (in addition to a B2B report) across the following topics:</strong></p> <ul> <li><strong><a href="http://econsultancy.com/reports/advertising-media-statistics">Advertising</a></strong></li> <li><strong><a href="http://econsultancy.com/reports/content-statistics">Content</a></strong></li> <li><strong><a href="http://econsultancy.com/reports/customer-experience-statistics">Customer Experience</a></strong></li> <li><strong><a href="http://econsultancy.com/reports/web-analytics-statistics">Data and Analytics</a></strong></li> <li><strong><a href="http://econsultancy.com/reports/demographics-technology-adoption">Demographics and Technology Adoption</a></strong></li> <li><strong><a href="http://econsultancy.com/uk/reports/ecommerce-statistics">Ecommerce</a></strong></li> <li><strong><a href="http://econsultancy.com/reports/email-ecrm-statistics">Email and eCRM</a></strong></li> <li><strong><a href="http://econsultancy.com/reports/mobile-statistics">Mobile</a></strong></li> <li><strong><a href="http://econsultancy.com/reports/search-marketing-statistics">Search</a></strong></li> <li><strong><a href="http://econsultancy.com/reports/social-media-statistics">Social</a></strong></li> <li><strong><a href="http://econsultancy.com/reports/strategy-and-operations-statistics">Strategy and Operations</a></strong></li> <li><strong><a title="B2B Internet Statistics Compendium" href="http://econsultancy.com/reports/b2b-internet-statistics-compendium">B2B</a></strong></li> </ul> <p>Updated monthly, each document is a comprehensive compilation of internet, statistics and online market research with data, facts, charts and figures.The reports have been collated from information available to the public, which we have aggregated together in one place to help you quickly find the internet statistics you need, to help make your pitch or internal report up to date.</p> <p>There are all sorts of internet statistics which you can slot into your next presentation, report or client pitch.</p> <p><strong>Those looking for B2B-specific data should consult our <a title="B2B Internet Statistics Compendium" href="http://econsultancy.com/reports/b2b-internet-statistics-compendium">B2B Internet Statistics Compendium</a>.</strong></p> <p> <strong>Regions covered in each document (where available) are:</strong></p> <ul> <li><strong>Global</strong></li> <li><strong>UK</strong></li> <li><strong>North America</strong></li> <li><strong>Asia</strong></li> <li><strong>Australia and New Zealand</strong></li> <li><strong>Europe</strong></li> <li><strong>Latin America</strong></li> <li><strong>MENA</strong></li> </ul> <p>A sample of the Internet Statistics Compendium is available for free, with various statistics included and a full table of contents, to show you what you're missing.</p> tag:econsultancy.com,2008:BlogPost/68203 2016-08-22T14:33:00+01:00 2016-08-22T14:33:00+01:00 Six 'millennial UX' lessons from insurance brand Back Me Up Ben Davis <h3>1. Information pyramid / visual saliency</h3> <p>The <a href="https://www.backmeup.co.uk/">Back Me Up website</a> has a really clear proposition, never in danger of reaching information overload.</p> <p>To do this, it uses a long explainer page with plenty of white space, high-contrast sizeable text, pictures and iconography.</p> <p>In terms of conveying information, the page doesn't walk before it can run. Think of it as a pyramid, with less information given at the top and more as you move through the signup process.</p> <p>Very cleverly, there is some content that is extremely useful but is nevertheless tucked away in a little JavaScript foldout, available to users when they are ready to click (see an example below).</p> <p>This streamlines the core messaging on the page.</p> <p><em>The 'See here how Back Me Up compares with other insurances' section is tucked away to improve salience of homepage. </em></p> <p><img src="https://assets.econsultancy.com/images/0007/8258/back_me_up_home.gif" alt="back me up homepage" width="478" height="301"> </p> <p>The homepage serves to hold the customer's hand and talk them through the service slowly. It's not a question of digesting lots of size 10 font.</p> <p>The saliency is further improved by some neat and large subheaders - 'How it works', 'Core cover', 'Bolt ons'.</p> <p><img src="https://assets.econsultancy.com/images/0007/8259/Screen_Shot_2016-08-18_at_17.47.23.png" alt="back me up subheaders" width="615" height="403"></p> <p>Compare this 'information pyramid' approach with a more traditional insurer's website, also presenting information about personal posessions insurance.</p> <p>Below I've included screenshots of Co-op Insurance and Direct Line.</p> <p>Neither are terrible, but they both hit the customer with much more information right from the get go, with smaller font and much less clarity.</p> <p>Of course, Co-op and Direct Line both offer many more products and don't have the luxury of such as refined proposition, but the point about information architecture still stands.</p> <p><em>Contrast with a more traditional insurer such as Coop (top) and Direct Line (bottom)</em></p> <p><em><img src="https://assets.econsultancy.com/images/0007/8261/coop_insurance.gif" alt="coop insurance" width="508" height="301"></em></p> <p><img src="https://assets.econsultancy.com/images/0007/8260/direct_line_insurance.gif" alt="direct line insurance" width="508" height="301"></p> <h3>2. Life through a lens</h3> <p>Customers must photograph their stuff in order to insure it.</p> <p>The idea of photographing the items one wants to insure is inspired. Millennials instinctively relate to snap and share culture.</p> <p>Photos can be uploaded via the Back Me Up website, though it's the app that really captures the imagination. Taking photos on mobile is about as close to intuitive as it gets for younger users.</p> <p>Of course, this benefits the insurer, too, as pictoral evidence provides extra information with which to validate a claim.</p> <p>While <a href="https://econsultancy.com/reports/the-reality-of-multichannel-marketing/">multichannel marketing</a> is still relevant (integrating nicely with web, email and direct mail), the more of the signup process a finance brand can bundle into a mobile app, the more younger users will take to it.</p> <p>This is truly mobile-first design.</p> <p><img src="https://assets.econsultancy.com/images/0007/8269/my_stuff.jpg" alt="my stuff" width="300"></p> <h3>3. Video explainers</h3> <p>This is probably my favourite part of the site. There are a number of videos embedded throughout, explaining parts of the service.</p> <p>They are superbly scripted and presented, pitched neither too high or too low. This video content is something financial services brands could learn a lot from.</p> <p>Here's an example...</p> <p><iframe src="https://www.youtube.com/embed/ndXxUWOa9rE?wmode=transparent" width="560" height="315"></iframe></p> <h3>4. Language</h3> <p>We've mentioned already the simple subheaders, but the brand goes much further in its copy, using colloquial/informal language to make everything easier to understand.</p> <p>It's easy to read this copy and hear David Brent in your head, but when this language is in the context of the full webpage, it makes the content easier to scan.</p> <p><strong>'Stuff'</strong></p> <p><strong><img src="https://assets.econsultancy.com/images/0007/8266/Screen_Shot_2016-08-18_at_18.10.44.png" alt="stuff" width="200"></strong></p> <p><strong>'Chill'</strong></p> <p><strong><img src="https://assets.econsultancy.com/images/0007/8263/Screen_Shot_2016-08-18_at_18.12.21.png" alt="chill" width="200"></strong></p> <p><strong>'Join us'</strong></p> <p><strong><img src="https://assets.econsultancy.com/images/0007/8264/Screen_Shot_2016-08-18_at_18.11.18.png" alt="join us" width="200"></strong></p> <p><strong>'Tell your mates'</strong></p> <p><img src="https://assets.econsultancy.com/images/0007/8268/Screen_Shot_2016-08-18_at_18.26.22.png" alt="tell your mates" width="220"></p> <p><strong>'Don't freak out'</strong></p> <p><strong><img src="https://assets.econsultancy.com/images/0007/8265/Screen_Shot_2016-08-18_at_18.11.08.png" alt="don't freak out" width="250"></strong></p> <p><strong>'When things go wrong'</strong></p> <p><strong><img src="https://assets.econsultancy.com/images/0007/8262/Screen_Shot_2016-08-18_at_18.13.00.png" alt="when things go wrong" width="400" height="234"></strong></p> <h3>5. Bold aesthetic</h3> <p>The big blue colours, the chunky iconography - there isn't any new service that isn't confidently branded any more.</p> <p>It was mobile that kickstarted this revolution of bold and <a href="https://econsultancy.com/blog/64732-16-beautiful-examples-of-flat-design-in-ecommerce/">flat design</a>, and it's a visual language that younger users innately trust.</p> <h3>6. Sharing/community</h3> <p>The Back Me Up website has a fairly prominent community section, and everybody who joins the service already has a username with which they are identified.</p> <p>Okay, forums are nothing new, but positioning this community at the heart of the service helps to instill almost a co-op feel.</p> <p>There's something of the spirit of Airbnb in these conversations, where new customers can ask old timers anything they want.</p> <p>Contribution is even gamified with a score assigned to each contributor.</p> <p><img src="https://assets.econsultancy.com/images/0007/8272/Screen_Shot_2016-08-19_at_08.58.48.png" alt="community" width="615" height="404"></p> <h3>Conclusion</h3> <p>There is so much to learn here:</p> <ul> <li> <a href="https://econsultancy.com/blog/68159-five-ways-fintech-upstarts-are-disrupting-established-financial-institutions/">unbundling</a>/rebranding of a product (Back Me Up was created by parent group Ageas).</li> <li>clearly-defined target audience.</li> <li>clarity of proposition.</li> <li>beautifully honest explainer videos.</li> <li>incorporation of selfie/smartphone culture.</li> <li>non-sanitised language.</li> </ul> <p>Hat tip to Back Me Up.</p> tag:econsultancy.com,2008:TrainingDate/3030 2016-08-12T12:05:19+01:00 2016-08-12T12:05:19+01:00 Mobile Usability and UX <p>76% of UK adults own a smartphone and these devices are now the UK’s most popular way to get online (Deloitte &amp; Ofcom data, 2015).  Our 1-day training course will help you design a great mobile experience using best practice guidelines and real world examples.  </p> <p>You’ll also have the chance to engage in lots of interactive exercises to make sure that you’re getting the most out of the day!</p> tag:econsultancy.com,2008:BlogPost/68141 2016-08-09T12:16:12+01:00 2016-08-09T12:16:12+01:00 How UrbanStems uses customer experience to compete with big ecommerce Bart Mroz <p><a href="http://www.ibisworld.com/industry/online-flower-shops.html">Over $4 billion is spent each year</a> on online flower purchases for occasions such as birthdays, celebrations, graduations and more. While gifting flowers can bring great happiness to those receiving them, shopping for them can be a tedious process.</p> <p><a href="https://urbanstems.com/">UrbanStems</a> is a relatively new online flower startup, and is changing the way consumers purchase flowers online by delivering a clean and simple online shopping experience that focuses on customer satisfaction.</p> <p><img src="https://assets.econsultancy.com/images/0007/7796/the_raven_flower_arrangement.png" alt="urbanstems product page" width="615" height="430"> </p> <h2>Urbanstems</h2> <p>UrbanStems boasts a seamless online shopping experience offering a highly curated rotation of fresh and unique flowers, in line with the blooms of the season.</p> <p>On-demand, one-hour delivery is standard and available at no extra charge, making even the most bothersome aspect of the shopping experience simple and convenient.</p> <h3>Clean, visually appealing product page </h3> <p>One of UrbanStems’ most successful assets is its beautifully designed product page. Clean, elegant and filled with vibrant floral images, it is this visually appealing page that attracts consumers to the online florist.</p> <p>As you scroll down, additional images show multiple points of view so that customers can better understand the dimensions, style, potential use, etc.</p> <p><img src="https://assets.econsultancy.com/images/0007/7798/urbanstems_product_page.png" alt="urbanstems product page" width="615" height="433"> </p> <p>Within the clean and modern layout, one can find the key points of information neatly aligned to the right of the featured product.</p> <p>No distracting promotions, recommendations, upsells or other competing features – the platform is entirely user-friendly and mobile-optimized to provide a fluid and enjoyable shopping experience.</p> <h3>Hassle-free checkout process</h3> <p>Once the customer decides on an Urbanstems arrangement, the site automatically displays the necessary options (such as delivery date and address) needed to complete the purchase, therefore making the already simple checkout process even more quick and painless.</p> <p>Other online florists such as Proflowers require nearly twice as many steps to complete a purchase, yet by reducing the number of steps required to checkout, UrbanStems minimizes the likelihood of customer fatigue and shopping cart abandonment.</p> <p>This results in higher <a href="https://econsultancy.com/reports/conversion-rate-optimization-report/">conversion rates</a> and more sales.</p> <p><img src="https://assets.econsultancy.com/images/0007/7799/checkout_urbanstems.png" alt="checkout" width="615"></p> <h3>Flexible customer support options</h3> <p>Through the entire shopping experience, customers have access to a discreet popup tab which provides an instant connection to customer service and FAQs. Questions via chat, email or phone call are always welcome.</p> <p><img src="https://assets.econsultancy.com/images/0007/7800/faqs.png" alt="faqs" width="318" height="488"></p> <p>Providing multiple points of customer service is a great way to ensure that customers receive quick feedback to any of their questions or concerns. If they cannot obtain the information they seek, they are much more likely to abandon their purchase and shop elsewhere. </p> <h2>ProFlowers</h2> <p>ProFlowers is one of the largest online florists in the U.S. but its customer shopping experience is entirely sales oriented.</p> <p>Throughout the entire process, customers are bombarded with various different product options and presented with a myriad of ways to spend more money than was originally intended.</p> <p>Even though these tactics have helped grow the Proflowers business, they degrade the customer shopping experience and have led to many negative customer reviews as well as low customer satisfaction ratings.</p> <p><img src="https://assets.econsultancy.com/images/0007/7802/proflowers_upgrades.png" alt="proflowers" width="615" height="439"></p> <h3>Busy product pages</h3> <p>Proflowers’ product pages are a prime example of information overload – both visual and written.</p> <p>Even before the customer starts evaluating the product he/she has clicked on, they are immediately presented with multiple upgrade options and additional add-ons.</p> <p><img src="https://assets.econsultancy.com/images/0007/7803/proflowers_product_page.png" alt="proflowers business" width="518" height="597"> </p> <p>Why is this unappealing? A product page should highlight the intended product rather than trying to sell as many other products as possible.</p> <p>ProFlowers automatically displays coordinated add-ons, product upgrades and <a href="https://econsultancy.com/blog/65866-how-do-product-recommendations-influence-buyer-behavior/">recommendations</a>. While this may be a great way to generate incremental revenue for the retailer, it overwhelms customers and makes the experience seem highly promotional and sales-driven.</p> <h3>Lengthy checkout process</h3> <p>In order to make a purchase through Proflowers, customers must go through a nine-step process starting with the product page. Few other ecommerce checkout experiences are this lengthy.</p> <p>With so many steps required to make a simple purchase, customers become frustrated and the experience much less enjoyable. </p> <p><img src="https://assets.econsultancy.com/images/0007/7804/proflowers_checkout.png" alt="checkout" width="615" height="365"></p> <p>As soon as customers hit the checkout button (which is actually labeled “Delivery Date”), they are sent to a page filled with add-on gift options.</p> <p>After already being inundated with upgrade and add-on options on the initial product page, this second forceful upsell proves extremely irritating. Only after this page do customers start the actual checkout process.</p> <h3>Limited customer support options</h3> <p>The only visible customer support option that’s consistent throughout the site is the contact number.</p> <p>There are no instantaneous customer service chat options or direct links to FAQs. If a shopper needs customer service help while browsing, they must first find the customer service link at the very bottom of the page and then navigate to that exact page.</p> <p><img src="https://assets.econsultancy.com/images/0007/7805/footer.png" alt="footer proflowers" width="615"></p> <p>Shopping for flowers – no matter the reason – should always be a pleasurable experience, one that is simple and straightforward.</p> <p>New players in the space like UrbanStems are challenging current industry leaders like ProFlowers by crafting customer-first shopping experiences that emphasize the customer rather than immediate revenue.</p> <p>As a result, these new players are sure to not only attract but also retain more customers, leading to increased sales and a bigger market share. </p> tag:econsultancy.com,2008:BlogPost/68109 2016-08-03T15:09:40+01:00 2016-08-03T15:09:40+01:00 Site comparison: Victoria's Secret vs. Nike Women, the battle of the sports bras Nikki Gilliland <p>I didn’t find this fact all too surprising. Athleisure-wear is an increasingly lucrative market after all.</p> <p>However, what did pique my interest was Victoria’s Secret’s decision to call out rivals Nike as part of its online advertising.</p> <p>Including a quote from model Jasmine Tookes, who claims “When I tried these, I threw out all my Nike bras”, the copy is pretty audacious.</p> <p>So, in terms of the website, how does Victoria Sport measure up against Nike Women?</p> <p>Here’s a comparison, split into five separate categories:</p> <ul> <li>First impressions</li> <li>Landing pages &amp; copy</li> <li>Navigation</li> <li>Product pages</li> <li>Checkout</li> </ul> <h3>First impressions</h3> <p>The first thing that strikes me when comparing the two sites (Victoria Sport and the ‘Women’ section of Nike) is that they are remarkably similar.</p> <p>Both use full-width video on the homepage, with both examples showing women partaking in a number of sporting activities decked out head to toe in the respective brands.</p> <h4>Nike</h4> <p>While <a href="http://www.nike.com/gb/en_gb/c/women" target="_blank">Nike’s is a bit jarring</a> for the user, using super fast-moving imagery that feels a little <em>too</em> in-your-face - I much prefer its depiction of strong and athletic women.</p> <p>It nicely falls in line with Nike’s branding and its <a href="http://www.allure.com/beauty-trends/blogs/daily-beauty-reporter/2016/07/nike-plus-size-bra.html" target="_blank">focus on female self-empowerment</a>.</p> <p><img src="https://assets.econsultancy.com/images/0007/7363/Nike.PNG" alt="" width="780" height="401"></p> <h4>Victoria Sport</h4> <p>On the other hand, while <a href="https://www.victoriassecret.com/vs-sport">Victoria’s Secret</a> does show models boxing and doing yoga, the imagery still feels a little too focused on the women’s bodies rather than the actual activity.</p> <p>Sure, it’s a definite move away from the <a href="http://www.statesman.com/news/business/former-victorias-secret-photo-editor-reveals-secre/nr4Tp/" target="_blank">allegedly photoshopped and perfectionist</a> ideal of previous campaigns, yet it doesn’t feel quite as authentic as its competitor. </p> <p><img src="https://assets.econsultancy.com/images/0007/7362/Victoria_Secret.PNG" alt="" width="780" height="391"></p> <h3>Landing pages &amp; copy</h3> <h4>Victoria Sport</h4> <p>As I previously mentioned, Victoria’s Secret calls out Nike with its testimonial from model Jasmine Leer. </p> <p>Unsurprisingly, the rest of the copy is just as bold.</p> <p> <img src="https://assets.econsultancy.com/images/0007/7364/victoria_secret_quote.PNG" alt="" width="750" height="301"></p> <p>Despite the tone coming across as a bit boastful, there’s no denying the lingerie retailer highlights its USP to good effect.</p> <p>Reminding the user that Victoria’s Secret makes sports bras in real sizes (not just small, medium or large), it successfully trumps Nike with its ‘bra expert’ card.</p> <p><img src="https://assets.econsultancy.com/images/0007/7365/victoria_secret_quote_2.PNG" alt="" width="300" height="233"> <img src="https://assets.econsultancy.com/images/0007/7366/victoria_secret_quote_3.PNG" alt="" width="300" height="214"></p> <h4>Nike</h4> <p>In contrast, instead of talking about how good the brand is, Nike concentrates on what the product does for the consumer - again reinforcing its stance on self-improvement and empowerment through sport.</p> <p><img src="https://assets.econsultancy.com/images/0007/7367/nike_copy.PNG" alt="" width="750" height="306"></p> <p>Combined with a humble and slightly self-deprecating tone, I find this copy more appealing from a consumer perspective.</p> <p><img src="https://assets.econsultancy.com/images/0007/7368/nike_copy_2.PNG" alt="" width="300" height="179"> <img src="https://assets.econsultancy.com/images/0007/7369/nike_copy_3.PNG" alt="" width="266" height="182"></p> <h3>Navigation</h3> <h4>Victoria Sport</h4> <p>The navigation for Victoria Sport comes in the form of a fairly standard drop-down header menu.</p> <p><img src="https://assets.econsultancy.com/images/0007/7370/vs_categories.PNG" alt="" width="750" height="283"></p> <p>One thing I particularly like is the ‘sports bra guide section’ – a dedicated page offering advice on fit and a handy little tool to help you find the right product.</p> <p>Again, spinning off of its main vertical of lingerie, this personalised and ‘expert’ approach certainly appeals. </p> <p><img src="https://assets.econsultancy.com/images/0007/7374/vs_guide.PNG" alt="" width="750" height="449"></p> <p>On the category listing pages themselves, the drop-down <a href="https://econsultancy.com/blog/62864-nine-tips-to-help-improve-your-product-filtering-options/" target="_self">filter system</a> is pleasing.</p> <p>Allowing the user to select multiple options as well as easily remove filters, it's very intuitive and easy to use.</p> <p><img src="https://assets.econsultancy.com/images/0007/7383/vs_filter.PNG" alt="" width="750" height="488"></p> <h4>Nike</h4> <p>Nikeis header menu includes a good selection of categories and also curated themes on the left-hand side.</p> <p><img src="https://assets.econsultancy.com/images/0007/7371/nike_header.PNG" alt="" width="750" height="319"></p> <p>With specific categories, plus ‘all sports’ and ‘all clothing’, this provides more options for the user - always a positive.</p> <p>Like its competitor, it also has a good product filter system. My only gripe is that it does not have a 'clear all' button, which Victoria's Secret does.</p> <p><img src="https://assets.econsultancy.com/images/0007/7373/nike_side_nav.PNG" alt="" width="300" height="572"> <img src="https://assets.econsultancy.com/images/0007/7384/Nike_product_filter.PNG" alt="" width="250" height="610"></p> <h3>Product pages</h3> <h4>Victoria Sport</h4> <p>For the <a href="https://econsultancy.com/blog/63462-ecommerce-product-pages-where-to-place-30-elements-and-why/">product pages</a>, I specifically focused on the sports bras section.</p> <p>Clicking through to the category on Victoria Sport, there is an option to quick view each product, which is helpful if you’re browsing in a hurry or aren't sure what you're looking for.</p> <p><img src="https://assets.econsultancy.com/images/0007/7617/VS_quick_view.PNG" alt="" width="780" height="473"></p> <p>Moving on to the main product pages themselves, one thing which seems to be lacking is <a href="https://econsultancy.com/blog/63153-15-tips-for-making-your-product-images-work-harder/">imagery</a>. Some include two or three images, however others have just one, which is poor by any standard.</p> <p><img src="https://assets.econsultancy.com/images/0007/7618/VS_product_page.PNG" alt="" width="780" height="652"></p> <p>When selecting product features, the decision to mark out-of-stock items with a horizontal line isn't very clear. It would be much easier if these items were greyed out or dropped out altogether.</p> <p><img src="https://assets.econsultancy.com/images/0007/7619/Visibility_of_products.PNG" alt="" width="450" height="409"></p> <p>Similarly, the small size of the copy makes it difficult to locate certain features.</p> <p>For example, the 'size and fit' icon is very easy to miss. Which is a shame, especially as when you do click it, it includes some good features like the 'perfect fit' calculator and measurement instructions.</p> <p>The brand could easily make more of this, especially considering its USP is built around specific sizing.</p> <p> <img src="https://assets.econsultancy.com/images/0007/7621/VS_perfect_fit.PNG" alt="" width="500" height="432"></p> <p>The suggestions for ‘completing the look’ are helpful, providing the user with recommendations and outfit suggestions, as well as nicely showcasing the variety of Victoria Sport’s product range.</p> <p>Combined with an extensive review section and an informative description, it’s is a well-designed page overall.</p> <p><img src="https://assets.econsultancy.com/images/0007/7377/vs_complete_the_look.PNG" alt="" width="600" height="350"></p> <h4>Nike</h4> <p>The Nike product pages are similarly user-friendly, but with a few extra features I would say they are slightly better.</p> <p>For one, there are loads more images, allowing the user to get a proper understanding of the product and how it looks in real life. </p> <p><img src="https://assets.econsultancy.com/images/0007/7378/nike_product.PNG" alt="" width="600" height="306"></p> <p>Similarly, there is more of a focus on copywriting to highlight the various features of the bra, plus, there is a great filtering system within the reviews section.</p> <p><img src="https://assets.econsultancy.com/images/0007/7379/nike_product_copy.PNG" alt="" width="600" height="328"></p> <p>While Victoria Sport allows the user to filter by star rating, Nike’s specific filter for ‘most helpful’, or ‘highest rated’ is a very nice touch.</p> <p><img src="https://assets.econsultancy.com/images/0007/7386/nike_reviews.PNG" alt="" width="600" height="534"></p> <h3>Checkout</h3> <h4>Victoria Sport</h4> <p>The checkout process on Victoria Sport is frustrating.</p> <p>Although there are some good features like options for guest check-out and PayPal payment, delivery charge is not disclosed until the user has entered an address.</p> <p><img src="https://assets.econsultancy.com/images/0007/7381/vs_checkout.PNG" alt="" width="600" height="256"></p> <p>Likewise, the various stages are rather clunky, such as this very unattractive option for offer codes (surely these three fields could neatly be replaced with an 'add code' call to action).</p> <p>There should be no need to click continue on an offers section which the majority of users will not need.</p> <p><img src="https://assets.econsultancy.com/images/0007/7622/VS_checkout.PNG" alt="" width="500" height="700"></p> <h4>Nike</h4> <p>In contrast, Nike's checkout experience is smooth sailing, with a pleasingly minimal and integrated design.</p> <p>It provides three options for checkout, including member, guest and Paypal. </p> <p><img src="https://assets.econsultancy.com/images/0007/7624/3_checkout_options.PNG" alt="" width="780" height="468"></p> <p>Nike highlights the estimated delivery time and charges up front and also tempts the user into signing up to be a member (which brings free delivery and returns).</p> <p><img src="https://assets.econsultancy.com/images/0007/7625/Nike_checkout_2.PNG" alt="" width="780" height="759"></p> <h3>Summary</h3> <p>All in all, Nike Woman and Victoria Sport deliver a decent user experience.</p> <p>Both utilising strong creatives, bold copy and user reviews, there’s a lot of similarly pleasing stuff.</p> <p>While Victoria Sport wins on product filtering, Nike trumps it on user reviews.</p> <p>But overall, I'd certainly say that Nike's less-is-more approach makes it the most appealing.</p> <p>By really honing its brand voice, and combining it with a streamlined design, it's much more authentic and customer-centric than Victoria Sport. </p> <p>It's refreshing to see the latter experiment with a different tack, but of course, it takes more than calling out the competition to prove value.</p> tag:econsultancy.com,2008:BlogPost/68070 2016-07-25T11:12:46+01:00 2016-07-25T11:12:46+01:00 Eight examples of fashion ecommerce product filters: Good & bad Nikki Gilliland <p>(Note - as there are a few differences on mobile, such as abridged filters, I am solely concentrating on the desktop experience for now.)</p> <h3>H&amp;M</h3> <p>H&amp;M’s ‘Shop by Feature’ filter is designed to point the user in the direction of curated themes.</p> <p>While creative in theory, it actually seems to be quite pointless.</p> <p>What the retailer seems to have forgotten is that the whole point of a filter system is to narrow down products in order to point the consumer in a specific direction – not lead them down a random path to ‘off duty denim’ when it’s far easier to just filter by ‘jeans’.</p> <p><img src="https://assets.econsultancy.com/images/0007/7155/H_M.PNG" alt="" width="477" height="419"></p> <p>Aside from this, the regular filter is very user-friendly.</p> <p>With options to choose by colour, size and style - plus a handy 'clear all' button - it's easy to narrow down exactly what you're looking for.</p> <p><img src="https://assets.econsultancy.com/images/0007/7310/H_M_filter.PNG" alt="" width="750" height="580"></p> <h3><strong>River Island </strong></h3> <p>River Island’s filtering system is slightly fiddly in that it only allows you to select one filter at a time (selecting mutliple filters involves multiple reloading of the results page).</p> <p>However, one feature I quite like is that it allows you to see how many items each one includes. While this might sound slightly off-putting (I did occasionally find myself focusing on the number rather than the actual category I was selecting) – it is pretty helpful.</p> <p>For instance, if a filter returns just two items, you’ll know ahead of time rather than clicking through just to be disappointed.</p> <p><img src="https://assets.econsultancy.com/images/0007/6999/river_island_filter.PNG" alt="" width="600" height="699"></p> <h3><a href="https://econsultancy.com/blog/67581-six-reasons-i-love-zara-com-and-a-few-reasons-i-don-t/"><strong>Zara </strong></a></h3> <p>Zara’s filter system is a mixed bag. By placing it at the top of the page instead of the left-hand side, it focuses the user’s attention.</p> <p>It also enables you to select multiple features at once, using specific elements like ‘characteristics’ and ‘colour’.</p> <p>And we mean specific… Anyone happen to know what an ‘ecru’ coloured shirt looks like?</p> <p>Well thanks to its filtering system, you do now.</p> <p><img src="https://assets.econsultancy.com/images/0007/7002/zara_filter_2.PNG" alt="" width="780" height="512"></p> <p>On the other hand, its filter button is not the most visible, nor are highlighted filters, a fairly major UX issue.</p> <p>Annoyingly, there is also no option to sort filtered results.</p> <p><img src="https://assets.econsultancy.com/images/0007/7375/Screen_Shot_2016-07-24_at_18.44.10.png" alt="zara" width="615" height="256"></p> <h3><strong>Ted Baker</strong></h3> <p>Much of Ted Baker’s website is slick, so it’s a little disappointing that its filtering system is less so.</p> <p>While it does offer a decent number of options to filter by, including patterns, colours, sizes etc, like River Island it only allows you to choose one option (i.e. colour <em>or</em> size) before you have to repeat the process to choose another.</p> <p>Furthermore, the drop-down menu is a little slow, making the whole process feel slightly frustrating.</p> <p>Luckily, with its creative copywriting and <a href="https://econsultancy.com/blog/67999-seven-inspiring-examples-of-ecommerce-lookbooks/">lookbooks</a>, there's a lot to enjoy elsewhere on the site.</p> <p><img src="https://assets.econsultancy.com/images/0007/7003/Ted_Baker_filter.PNG" alt="" width="513" height="670"></p> <h3><strong>Hunter</strong></h3> <p>Like Ted Baker, Hunter’s filter is in the form of a drop-down menu, however, with separate tabs for each filter option – it’s far easier to use.</p> <p>It also includes some nice touches like a tick appearing as you narrow down the search, and an instant reset button.</p> <p><img src="https://assets.econsultancy.com/images/0007/7004/Hunter_filters.PNG" alt="" width="780" height="539"></p> <h3><strong>Marks and Spencer</strong></h3> <p>User reviews is a feature that many retailers fail to utilise. Functioning as a vote of confidence, rating systems are always useful for consumers that are unsure of what products to buy.</p> <p><a href="https://econsultancy.com/blog/67883-marks-spencer-what-does-putting-the-customer-at-the-heart-of-everything-mean/">Marks and Spencer </a>is one of the few retailers to shrewdly include them.</p> <p>Allowing users to filter by star ratings (1 and above, 2 and above and so on), it helps out the consumer who values other people’s opinions. While it’s located at the bottom of the left-hand side and so fairly inconspicuous, it’s still a worthwhile addition.</p> <p> <img src="https://assets.econsultancy.com/images/0007/7006/M_S_filter_2.PNG" alt="" width="350" height="669"></p> <h3><strong>Suit Supply </strong></h3> <p>In contrast to H&amp;M, Suit Supply is a great example of how to use product filtering in a more creative fashion.</p> <p>Instead of words, it utilises visuals to highlight various product features, cleverly showcasing the retailer’s wide variety of options.</p> <p>From collar type to style by context, this element is simple but effective, and something I've not come across before.</p> <p><img src="https://assets.econsultancy.com/images/0007/7007/Suit_supply_collar.PNG" alt="" width="780" height="330"></p> <p><img src="https://assets.econsultancy.com/images/0007/7008/Suit_supply.PNG" alt="" width="780" height="527"></p> <h3><strong>ASOS</strong></h3> <p>With such a large amount of items, it’s a good job that ASOS offers such as comprehensive filter system.</p> <p>From brand and style to fit and sleeve length, there any many different options to choose from, and with different filters across different categories - it’s cleverly executed.</p> <p>As well as helping to guide the consumer to find what they like, it also allows ASOS the brand to showcase its wide variety of products.</p> <p><img src="https://assets.econsultancy.com/images/0007/7017/ASOS_filter_2.PNG" alt="" width="300" height="408"> <img src="https://assets.econsultancy.com/images/0007/7019/ASOS_jean_filter.PNG" alt="" width="300" height="435"> </p> <h3>What can we learn?</h3> <p>While H&amp;M's example might not work, the brand's willingness to experiment with product filtering should be applauded.</p> <p>If done right, a decent filter can massively improve the user experience.</p> <p>Fast, with clear visuals and the ability to select multiple options... that's the dream.</p> tag:econsultancy.com,2008:BlogPost/68103 2016-07-22T14:31:13+01:00 2016-07-22T14:31:13+01:00 A day in the life of... Online Capability Consultant at BT Ben Davis <p>But before we do - if you're in the market for a digital job, check out our <a href="https://jobs.econsultancy.com/">jobs board</a> or benchmark your digital knowledge using our <a href="https://econsultancy.com/training/digital-skills-index-lite/">Digital Skills Index</a>.</p> <p>Alternatively, if you would like a Day In The Life profile, you can email us via press@econsultancy.com.</p> <h3>Please describe your job, Tom! What does an Online Capability Consultant do?</h3> <p>At BT we want to be number one for customer service and my role is all about ensuring that happens across the digital estate.</p> <p>I am responsible for turning our customer management and service journeys into an online experience that’s easy and efficient for our customers to use.</p> <p>I am responsible for creating and eliciting all the new requirements, defining user experience and <a href="https://econsultancy.com/blog/63462-ecommerce-product-pages-where-to-place-30-elements-and-why/">wireframes</a> and managing the development and launch of the product.</p> <p>Our team is working on some great experiences for our customers and ranging from paying a bill or reporting a fault right through to changing their TV package and tracking an order online.</p> <p><img src="https://assets.econsultancy.com/images/0007/7349/tom_barton.jpg" alt="tom barton" width="336" height="336"></p> <h3>Whereabouts do you sit within the organisation? Who do you report to?</h3> <p>I sit within the Digital team in BT Consumer, in a sub team called Digital Capability which includes both in life and project work.</p> <p>I report to the Senior User Experience manager.</p> <h3>What kind of skills do you need to be effective in your role?</h3> <p>You certainly need to be analytical, to allow you to review data quickly and to make effective UX and process decisions.</p> <p>Strong <a href="https://econsultancy.com/blog/66616-the-virtues-of-user-testing-under-the-influence/">user testing</a> skills and an inquisitive mind really help to get to the crux of the problem to ensure what you design is fit for purpose and allows customers and advisors to perform their task as effectively as possible.</p> <p>Strong people skills to ensure you can take everyone on the digital journey – our commercial and operational colleagues have great ideas and plans, but it’s up to me to give them clear options for how they turn them into reality online.</p> <p>The ability to learn quickly and grasp technical concepts at a high level allows you to marry your technical and design knowledge to spot how to cut risks, fix issues and save money. </p> <h3>Tell us about a typical working day…</h3> <p>My role is really varied so it really does depend on what needs doing!</p> <p>I start every day with a stand up to ensure we all know what everyone is doing and if anyone needs any support with the day’s activities.</p> <p>After that it can get quite varied but most days involve defining and writing requirements for the next piece of functionality. I will chat with the process SMEs to help turn complex business processes into an online experience.</p> <p>Once we have these I will brief our UX designers to start bringing the idea to life. </p> <p>After a call with the development team to ensure what we have designed is feasible we will update the wireframes and brief the Visual Design team to the final functionality created.</p> <p>After all this it’s time to optimise what we already have live and work closely with our marketing team to analyse the data and be on the lookout for changes that make the online experience even better.</p> <p>Busy day eh!</p> <p><img src="https://assets.econsultancy.com/images/resized/0007/7351/postits-blog-flyer.jpg" alt="post it wall" width="470" height="351"></p> <h3>What do you love about your job? What sucks?</h3> <p>I love working for such a high profile company and especially in their digital team. We are a relatively new team and have grown from 20 to 130 in a matter of years.</p> <p>The team has a great mix of ages and backgrounds and everyone is great to work with – also not wearing a suit is always good!</p> <p>It’s great being able to see an idea turn into something a customer can actually use. I know it’s cheesy but I really think we are making a positive difference to people’s lives – making everything they do online easier, quicker and more personal.</p> <p>I think my favourite thing about my role is its variety. One day I’ll be creating wireframes, the next analysing Omniture data to ensure we are getting the most out of what we have – I really get the chance to get involved in all aspects of the online journey.</p> <p>The only negative is the time it takes to implement change. We’re getting better with more agile processes coming in but with such a big company getting things changed can be a bit frustrating at times.</p> <h3>What kind of goals do you have? What are the most useful metrics and KPIs for measuring success?</h3> <p>We use quite a lot at BT but the main ones we use are Channel Share and Propensity to Contact.</p> <p>Our goal is to remove calls from the call centre and help people self-serve as much as they can, the more people we can get online the better. We want customers to have the same personal experience online as they do when they call up.</p> <p>Propensity to Contact (or PTC) measures how many customers go online and then phone up within seven days. We take the approach that if someone has gone online and then had to phone up, we’ve failed – the lower this measure the better.</p> <p><img src="https://assets.econsultancy.com/images/0007/7350/Screen_Shot_2016-07-22_at_14.08.26.png" alt="contact BT" width="615" height="366"></p> <h3>What are your favourite tools to help you to get the job done? </h3> <ul> <li> <strong>Axure</strong> – wireframe tool. It can be pretty complicated when you start learning how to use it but when you get the hang of it, what it can do is pretty impressive</li> <li> <strong>Omniture and Excel</strong> – To crunch those numbers</li> <li> <strong>Treesorter</strong> – A lot of what we do involves getting people from A to B in the easiest way. Treesorter allows us to test where the best place to put everything is</li> <li> <strong>Trello</strong> – A great online tool to help with lists and team tasks</li> <li> <strong>Jira</strong> – Our defect tracking and requirements tool</li> </ul> <h3>Which brands do you think are doing digital well?</h3> <p>I think digital is really exciting at the moment and there are loads of brands that are doing some pretty great stuff, but if I had to pick some I would go for:</p> <p><strong>John Lewis</strong> – The way they marry up online and offline activities make shopping extremely painless. When I have had queries or issues, is has been such a stress free experience it solve these.</p> <p><strong>Amazon</strong> – Similar to John Lewis, however I know there is so much more they could do with the data and resources they have. I feel they are just testing the water at the moment – Watch this space!</p> <p><strong>Skyscanner</strong> – I’m convinced I have booked more flights since I started using Skyscanner! The amount of data it has to crunch in such a short space of time is impressive. It’s so easy to use and the ability to customise everything really helps with usability. It translates seamlessly from desktop to mobile as well</p> <h3>Do you have any advice for people who want to work in ecommerce?</h3> <p>Try to learn as much as you can about the full customer lifecycle and how digital can affect every aspect of it. </p> <p>The more exposure you get to more roles such as marketing, <a href="https://econsultancy.com/reports/seo-best-practice-guide/">SEO</a>, UX etc the better as it will allow you to understand how each role comes together to create the full end-to-end experience.</p> <p>It’s really important to stay up to date and read articles and blogs on the latest trends and digital best practice. It’s easy with so many free resources online – many companies also offer free conferences that are great to attend.</p> <p>No matter what your role is in digital, it’s vital you keep the end user in mind, whether that be a customer or a back end user. It is vital everything is designed with them in mind.</p> <p>I think most importantly just have passion for getting into digital and work hard, and the rest should come naturally.</p> tag:econsultancy.com,2008:BlogPost/68031 2016-07-19T12:14:01+01:00 2016-07-19T12:14:01+01:00 Answering the key question of content auditing: Where do I start? Michael Hewitt <h3>Existing content</h3> <p>When it comes to investment in content marketing, it isn’t a huge surprise that much of it goes on producing new content, new material and new campaigns.</p> <p>Plenty of marketers will talk at length about how much content they are producing, how packed their <a href="https://econsultancy.com/blog/64587-eight-free-content-calendar-templates-to-help-plan-your-output/">editorial calendars </a>are and how they are preparing to launch their “next big campaign”, but what about the content that they already have?</p> <p>Content marketers are focused so heavily on producing new content that meets the evolving needs of both their audiences and the expectations of search engines, that they are neglecting to ensure that their existing content does likewise. </p> <h3>A daunting prospect</h3> <p>The phrase “content audit” conjures up many feelings, and few of them positive. </p> <p>For many, it is a laborious process that involves hours upon hours, days upon days or even weeks upon weeks of manual review, fiddling around in analytics, and identifying gaps in coverage. It’s not, for many, the most enthralling responsibility in the job description.</p> <p><img src="https://assets.econsultancy.com/images/0007/6721/content-audit.jpg" alt="" width="400" height="300"></p> <p>Even if you do manage to conduct a thorough audit, it can often be difficult to force through changes on key brand pages due to the influence of various stakeholders, compliance issues and various other obstacles.</p> <p>Many also find the results and impact of a content audit difficult to measure, and so decide to focus their efforts elsewhere.</p> <p>But content auditing is something that needs to be a prominent and regular part of not only your content marketing strategy, but your wider digital marketing strategy.</p> <p>Just think about how many search algorithm updates that there may have been, how many new devices have been launched and how many new media platforms have emerged since you last reviewed your content – that could be quite a sobering realisation. </p> <h3>The case for a content audit</h3> <p>The ultimate purpose of any content audit is to understand how your content is performing, how it is delivering for your customers and what value it is providing. </p> <p>There are plenty of both tangible and intangible measurements for successful content, but this doesn’t necessarily confirm that content is useful, relevant or could be considered ‘quality’ by most reasonable measures.</p> <p>You could, for instance, use social shares as a measurement of quality content but, in doing so, it’s likely that you’ll reach conclusions that, whilst they may drive engagement, don’t necessarily drive a commercial return. Providing content that your audiences will engage with is undoubtedly a starting point but, and I hate to break this to you, human beings may not always be the best judges of quality.</p> <p>What your content audit is ultimately about is ensuring that every piece of content on your site is making some form of contribution to improving conversion rates, search visibility, user experience, and relevance.</p> <p>Get it right and you could even start stealing that prized <a href="https://econsultancy.com/blog/66672-semantic-search-the-future-of-search-marketing">Google Knowledge Graph</a> real estate. </p> <h3>The manual approach</h3> <p>If you’re in a position where you are managing a relatively small site with a handful of pages, then manual content auditing might not be such a hardship.</p> <p>Starting with your URL and keywords, you can start to build a picture of where your brand ranks for these key terms, which pages consistently rank for those key terms, and how your competitors perform. </p> <p>It is then down to you to make a human assessment of each of these pages, and you can look at multiple factors to judge <a href="https://econsultancy.com/blog/66971-a-content-manager-s-practical-guide-to-doing-just-enough-seo/">how well optimised your pages are for search</a>, and how they contribute to the user journey. These factors could include URL optimisation, title tags, meta description, ‘H-tag’ optimisation and hierarchy, keyword coverage and word count.</p> <p>You can then add layers of insight from Google Analytics, social monitoring tools and start to understand how these pages contribute to the customer search journey.</p> <p>Are there pages that are haemorrhaging traffic through unusually high exit rates? If so, this page might not adequately serve the customer search query. </p> <p>With only this very top-level and basic approach to content, you can already start to understand just how much time that you're going to have to spend with your head in an Excel spreadsheet, and why many marketers are reluctant to run a manual content audit at any sort of scale.</p> <h3>A scientific approach</h3> <p>But content auditing doesn’t have to be such a daunting prospect, and it is possible to take a more scientific, algorithmic approach to content auditing.</p> <p>At Stickyeyes we use SCOT (<a href="http://www.stickyeyes.com/content-optimisation-tool/">Stickyeyes Content Optimisation Tool</a>), to look at content in the same way that a search engine may look at it, and identify key areas of success and areas for improvement. In short, addressing that critical first hurdle – where to start.</p> <p>The factors we consider include technical elements, such as keyword coverage, meta data and the use of header tags, as well as engagement factors for which there is evidence of a correlation with higher search rankings – factors such as bounce rate, time on page, social engagement and brand awareness for example.</p> <p>For those with sizable websites, this kind of process can be invaluable in understanding just where to focus effort and resource. Here is just one example of a typical output for a printing brand that we ran through the tool. </p> <p><img src="https://assets.econsultancy.com/images/0007/6722/graph1.jpg" alt="" width="668" height="276"></p> <p>What we can see clearly is that whilst the brand in this example does have some strong content optimisation scores, in excess of 85%, there are a number of revenue-driving keywords for which the domain scores poorly – notably “cheap leaflet printing”, “cheap flyers”, and “cheap flyer printing”.</p> <p>Evidently, this brand has struggled to provide content for search terms with a “cheap” prefix and this therefore provides some direction for their content review.</p> <p>Of course, it may be that the brand sees itself as a quality brand and therefore may not want to specifically target search terms such as “cheap” and “low cost”, but the level of insight provided allows the brand to make that decision.</p> <h3>Identifying the quick wins</h3> <p>Of course, any content appraisal and audit needs to have a degree of human intervention, but what this algorithmic approach does is allow us to automate large parts of the process and using this insight, content managers can start to make some key decisions and prioritise their actions. </p> <p>There are, in this example, a number of pages that score highly and, with a few minor tweaks, can potentially drive further value. These are what we would classify as “quick wins”. </p> <p>Of course, it isn’t simply enough to throw a few keyword-heavy paragraphs into the page in the hope that Google will deem that to be more relevant, but we can now start considering how we can enhance the user experience for these pages and these terms.</p> <p>It may be that we create specific content for these terms, we may change the site structure to make our existing pages more prominent, or we may actually decide to remove certain pages to focus traffic on more valuable pages.</p> <p>What we are essentially trying to do is enhance the user journey rather than hinder it; and there are different ways to do that depending on the circumstances. </p> <p>This process makes it easier to run audits on a more regular basis, allowing you to monitor the success of any changes that you do make, understand the contribution that your new content is making and identify the next key actions for your optimisation strategy. If something appears to be having an adverse effect, this can be identified and rectified very quickly. </p> <h3>The impact on search</h3> <p>We have been using this approach for a number of brands and what we have found is that as we continually work on improving our content scores within SCOT, we have experienced increased visibility within organic search. </p> <p><img src="https://assets.econsultancy.com/images/0007/6723/graph2.jpg" alt="" width="814" height="336"></p> <p>Of course, what we can’t do is isolate the impact of these content amendments from the various other elements of activity that may have been undertaken to improve search performance, but there is evidence of a strong correlation between the quality of on-page content and search rankings. </p> <p>And it is important to stress that whilst we may be looking to introduce an algorithmic approach to content auditing, this shouldn’t be mistaken as an algorithmic approach towards content creation.</p> <p>What we are trying to do here is to ensure that our <a href="https://econsultancy.com/blog/67605-why-content-marketing-isn-t-seo-and-why-seo-isn-t-just-content/">content strategies plug key gaps</a> in what our audiences are looking for, but this shouldn’t turn content creation and optimisation into little more than a box ticking exercise. </p> <p>What matters above all else is that your brand is still providing value to the end user and delivering the best possible experience. Adding a layer of technical competence helps to deliver that user experience, but is also valued by search engines as they look to deliver the most relevant results. </p> <p><a href="http://www.stickyeyes.com/content-optimisation-tool%20">Try the latest version</a> of SCOT for free.</p> tag:econsultancy.com,2008:BlogPost/68061 2016-07-18T13:09:12+01:00 2016-07-18T13:09:12+01:00 23 clever uses for colour in ecommerce UX Ben Davis <h3>1. Virgin America - green for validated fields</h3> <p>Let's start with something simple but beautiful. Upon validating my data entry, <a href="https://econsultancy.com/blog/65065-30-little-things-i-love-about-the-new-virgin-america-website/">Virgin America</a> turns each field green.</p> <p>Purple is also used to highlight a field that hasn't been completed yet, as I click into it.</p> <p><img src="https://assets.econsultancy.com/images/0007/7055/virgin_validation.gif" alt="virgin america" width="615"></p> <h3>2. ASOS - flagging up sales in a mega menu</h3> <p>You might say this design touch is almost imperceptible, but using red text to highlight sales and savings in a mega menu will catch the eye.</p> <p>A great way to encourage increased browsing and basket value.</p> <p><a href="http://www.asos.com/women/"><img src="https://assets.econsultancy.com/images/0007/7044/Screen_Shot_2016-07-13_at_14.07.25.png" alt="asos website" width="615" height="477"></a></p> <h3>3. Nike - showing off product and encouraging add to cart</h3> <p>I've included Nike for its conspicuous lack of colour. The black and white design lets its products impress with their own colour.</p> <p><a href="http://www.nike.com/gb/en_gb/"><img src="https://assets.econsultancy.com/images/0007/7034/Screen_Shot_2016-07-13_at_12.12.34.png" alt="nike homepage" width="615" height="331"></a></p> <p>The one place where a splash of orange is used? The 'add to cart' button, for obvious reasons.</p> <p><img src="https://assets.econsultancy.com/images/0007/7035/Screen_Shot_2016-07-13_at_12.12.47.png" alt="nike product page" width="615" height="332"> </p> <h3>4. The Trainline - contrast, clarity, fun</h3> <p>The combination of bold colour and smart iconography makes <a href="https://econsultancy.com/blog/67022-nine-things-i-love-about-the-trainline-app/">the Trainline's app</a> and website easy and fun to use.</p> <p>Contrast in the booking engine allows users to methodically follow the booking process, taking one step at a time without fear of making a mistake.</p> <p><img src="https://assets.econsultancy.com/images/resized/0006/7779/img_2228-blog-flyer.png" alt="trainline app" width="300"></p> <h3>5. Pure Cycles - product differentiation</h3> <p>Pure cycles sells bikes online. What the retailer understand very well is the way that colour can be used to differentiate between products or present them in an appealing way.</p> <p>Lots of these bikes have similar elements (certainly in appearance), so using different colour on the wheels and frames allows Pure to create a diverse looking catalogue that the customer is not bored to browse.</p> <p>There's something for everyone, rather than an academic exercise of distinguishing between materials and detailed specs.</p> <p><a href="https://www.purecycles.com/"><img src="https://assets.econsultancy.com/images/0007/7042/Screen_Shot_2016-07-13_at_14.01.58.png" alt="pure cycle" width="615" height="352"></a></p> <p>This approach extends to cheaper products, such as grip sets. Pure Cycles displays all the colours together, to aim for high impact from an ostensibly functional and boring item.</p> <p><img src="https://assets.econsultancy.com/images/0007/7043/Screen_Shot_2016-07-13_at_14.04.15.png" alt="pure cycle products" width="615" height="341"></p> <p>When it comes to Pure Cycles' glow bikes, it really goes the extra mile to make product imagery stand out.</p> <p>Sales is all about the product, so making it look great on an ecommerce site should be aesthetic priority number one.</p> <p><img src="https://assets.econsultancy.com/images/0007/0134/bike_glow.gif" alt="pure cycles" width="505" height="280"></p> <h3>6. Pelican - more contrast and comprehension</h3> <p>A brand with rich heritage in design, it's unsurprising that Pelican's ebook-buying website is bold, simple and uses colour to instantly convey the distinctive clarity of Penguin's non-fiction house.</p> <p>This clarity helps reassure the customer that reading a book on their personal device (possibly a smartphone) will be an easy and enjoyable process.</p> <p>Clarity through contrast is something that many subscription and service businesses try to achieve, as these are often interfaces that the customer expects to use frequently, and wants to enjoy using (e.g. Spotify).</p> <p><img src="https://assets.econsultancy.com/images/0007/7038/Screen_Shot_2016-07-13_at_12.20.41.png" alt="pelican library" width="615" height="339"></p> <p><a href="https://www.pelicanbooks.com/"><img src="https://assets.econsultancy.com/images/0007/7037/Screen_Shot_2016-07-13_at_12.20.38.png" alt="pelican book" width="615" height="340"></a></p> <p>Though you might regard this as a publishing website, it still sells stuff through a checkout - maybe you'd like to emulate its chunky design?</p> <p><img src="https://assets.econsultancy.com/images/0007/7036/Screen_Shot_2016-07-13_at_12.20.20.png" alt="pelican checkout" width="615" height="338">  </p> <h3>Houzz - branding &amp; conversion</h3> <p>Houzz isn't strictly an ecommerce website (<a href="https://econsultancy.com/blog/67987-home-sweet-home-why-houzz-is-worthy-of-the-best-app-award">and app</a>), it's a marketplace where consumers can find designers, architects and products.</p> <p>But apart from the lack of a checkout, there's lots of features here that are directly transferable to a 'traditional' ecommerce site.</p> <p>The site and app's UX revolves around the use of brand colouring (green) to highlight certain elements in the design. It's a very effective way of encouraging or reassuring the user whilst asserting the brand.</p> <p>Lots of ecommerce sites do this, but Houzz takes it to the nth degree.</p> <p><strong>7. Highlighting products in UGC</strong></p> <p>Green is used throughout the very good Houzz app. Of note are the green price tags that signify products that can be clicked on, within photographed interiors.</p> <p><img src="https://assets.econsultancy.com/images/0007/7041/IMG_3040.PNG" alt="houzz app" width="350"></p> <p><strong>8. Highlighting reviews</strong></p> <p>This is often done in orange, but Houzz uses brand colouring to pick out reviews, bringing some social proof to the selection of designers and architects.</p> <p><a href="http://www.houzz.co.uk/"><img src="https://assets.econsultancy.com/images/0007/7016/Screen_Shot_2016-07-13_at_11.13.15.png" alt="highlighting reviews" width="615" height="271"></a></p> <p><strong>9. Ghost buttons</strong></p> <p>A feature of modern web design on desktop, in green again.</p> <p><img src="https://assets.econsultancy.com/images/0007/7015/ghost.gif" alt="ghost button" width="615"></p> <p><strong>10. Calls to action</strong></p> <p><em>'Visit store' call to action</em>  </p> <p><strong><img src="https://assets.econsultancy.com/images/0007/7024/Screen_Shot_2016-07-13_at_11.23.17.png" alt="call to action - houzz" width="615" height="311"></strong></p> <p><strong>11. Picking out breadcrumb trails and filters</strong></p> <p>This is a nice way to keep customers oriented.</p> <p><img src="https://assets.econsultancy.com/images/0007/7023/Screen_Shot_2016-07-13_at_11.20.27.png" alt="houzz breadcrumb" width="615" height="315"></p> <p><strong>12. Product rollovers</strong></p> <p>Another piece of UX assistance. Here Houzz highlights the save button (for creating a wishlist of sorts) and the email icon (to send the product listing to a friend).</p> <p><img src="https://assets.econsultancy.com/images/0007/7020/rollover_products.gif" alt="rollovers houzz" width="500"></p> <h3>13. Wish - discount flashes</h3> <p><a href="https://econsultancy.com/blog/67873-12-examples-of-persuasive-mobile-ux-from-ecommerce-app-wish/">Wish</a> is an ecommerce website and app aimed at bargain hunters.</p> <p>Its heavily discounted and promoted products and highlighted with orange flashes to show percentage discount, number remaining, and time remaining.</p> <p><img src="https://assets.econsultancy.com/images/0007/5257/IMG_2923.PNG" alt="wish app" width="300">  <img src="https://assets.econsultancy.com/images/0007/5248/deal_clocks.PNG" alt="wish app" width="300"></p> <p>Wish even uses this tactic in the checkout, again using an orange banner.</p> <p><img src="https://assets.econsultancy.com/images/0007/5247/checkout_incentive.PNG" alt="wish app" width="300"></p> <h3>14. Helbak - alternative to white space</h3> <p>Helbak Ceramics uses pastel shades to back product photographs on the hompage.</p> <p>This helps to delineate space and perk up the overall design, as well as add lustre to the products.</p> <p><a href="http://www.helbak.com/"><img src="https://assets.econsultancy.com/images/0007/7106/Screen_Shot_2016-07-14_at_13.03.30.png" alt="helbak" width="615" height="343"></a></p> <h3>15. Best Buy - flagging items in your cart</h3> <p>This is standard procedure - a cart that highlights when it has items in it, so the user knows to checkout.</p> <p>A lot of sites do this - here's Best Buy using its brand yellow, which it also uses for its 'add to cart' buttons.</p> <p><img src="https://assets.econsultancy.com/images/0007/7070/Screen_Shot_2016-07-14_at_08.38.51.png" alt="best buy" width="615" height="211"></p> <h3>16. Crayola - branding &amp; sheer fun</h3> <p>No other menu will give you this much joy in ecommerce. If websites should reflect their brands, Crayola nails it here.</p> <p><a href="http://www.crayola.com/"><img src="https://assets.econsultancy.com/images/0007/7045/Screen_Shot_2016-07-13_at_14.41.35.png" alt="crayola website" width="615" height="330"></a></p> <p><em>And on mobile</em></p> <p><img src="https://assets.econsultancy.com/images/0007/7046/crayola.gif" alt="crayola on mobile" width="227" height="309"></p> <h3>17. Flipkart - highlighting notifications</h3> <p>Notifications are becoming more common in ecommerce, a messaging feature used to flag up offers to customers, which are often also pushed to app users.</p> <p>Flipkart uses yellow to make the bell icon stand out.</p> <p><img src="https://assets.econsultancy.com/images/0007/7071/Screen_Shot_2016-07-14_at_09.04.23.png" alt="flipkart" width="615" height="222"></p> <h3>18. Currys - checkout progress indicator</h3> <p>Another bit of practical colouring here. Many ecommerce sites do this.</p> <p><img src="https://assets.econsultancy.com/images/0007/7095/Screen_Shot_2016-07-14_at_12.09.19.png" alt="currys" width="615" height="386"> </p> <h3>19. Lush - product contrast</h3> <p>We love lush (<a href="https://econsultancy.com/blog/67158-why-lush-is-the-undisputed-master-of-b-commerce/">see this article</a>). Like the Nike example above, Lush's copious whitespace allows its colourful products to shine.</p> <h3> <img src="https://assets.econsultancy.com/images/0006/8739/Screen_Shot_2015-11-05_at_19.12.09.png" alt="lush website" width="615"> </h3> <h3>20. Kayak - making sense of a booking engine </h3> <p>Booking engines can be dauntingly rich in information. Kayak uses its brand orange to pick out important features or information.</p> <p>It also uses a secondary colour, green, for persuasive elements such as savings and reviews.</p> <p><a href="https://www.kayak.co.uk"><img src="https://assets.econsultancy.com/images/0007/7063/Screen_Shot_2016-07-13_at_15.57.11.png" alt="kayak booking page" width="615" height="416"></a> </p> <h3>21. Odd Pears - product illustrations</h3> <p>I haven't seen many ecommerce sites do this - use illustrations instead of product photographs. Obviously, this will only work for a predictable commodity such as socks, but here it is quite effective.</p> <p>The patterns are given extra vibrancy in 2D and the uniformity between the images makes users want to collect them all.</p> <p>Adding colour swatches underneath each image adds to the attraction.</p> <h3><img src="https://assets.econsultancy.com/images/0006/8727/Screen_Shot_2015-11-05_at_18.03.34.png" alt="odd pears" width="615"></h3> <h3>22. IKEA - checkout errors</h3> <p>Another standard feature, using red to highlight where a user has missed a field or given incorrect information.</p> <p>Some checkouts only use red text and have generic messaging - IKEA is much clearer, bordering the field in red and including an intstructive message in red.</p> <p><img src="https://assets.econsultancy.com/images/resized/0007/7103/screen_shot_2016-07-14_at_12.43.51-blog-flyer.png" alt="ikea checkout" width="470" height="364"></p> <h3>23. AO.com - colour coding products</h3> <p><a href="https://econsultancy.com/blog/66768-ao-com-the-best-ecommerce-experience-available-online/">AO.com</a> uses colour well, with its brand green picking out key features such as delivery information and calls to action.</p> <p>The site also adds the energy rating flags of each appliance (traditionally coloured green to red depending on efficiency). This allows energy conscious users to quickly pick out the best machines.</p> <p><img src="https://assets.econsultancy.com/images/0007/7069/Screen_Shot_2016-07-14_at_08.30.52.png" alt="ao.com" width="615" height="526"> </p>