Over the last few weeks I’ve been pinging between web development workshops, kicking off new web design projects and talking to lots of people, all very exciting, lots of fun and of course, we’ve been fielding many questions.

Here are a few links and resources from the guts of my ‘sent items’ folder, based around the search engine optimisation starting points I promised to share a bit wider – covering the basics…

SEO web design – two key refresher’s for everyone

On pretty much all web design kick offs we talk to the web editors and usually chat around where to start with SEO, content planning and on page optimisation. We talk about brushing up on the basics of search engine optimisation and give some tips… at the end of the day anyone who writes web content should have a good basic understanding of SEO, and here are two ‘must read’ (and well read) posts. Firstly…

• SEOmoz – The Beginers Guide to SEO

The 1st three chapters help explain how search engines crawl and index websites, calculate relevance and how people interact with search engines.

Chapter four is all about making content really findable and open to crawling by search engines and bots, including references to ALT tags, TITLE tags, META tags and friendly URL structures, it also touches on the impact of duplication of content – canonicalization.

The guide then runs through keyphrase research and how UX design makes a difference. There’s a nice introduction into links, social sharing SEO tools and tracking, a great starter for 10.

• Google Search Engine Optimisation Starter guide

Although this was published a little time ago, it’s still a great starting point for covering the SEO basics and brushing up on best practices which are often missed, it has lots of easy to understand pictures, screen grabs and illustrations.

So it covers the importance of accurate page TITLES and META descriptions and how they appear in Google SERPs (search engine results pages) – i.e. why you should bother to invest time and effort on them. URLs and friendly URLS are covered and the importance of keyphrases appearing in those page URLs. Also covered are in link anchor text (and why they should contain keywords without ‘keyword stuffing’ of course) and ALT text. The guide then finishes up with a little on mobile websites, social links and links to webmaster tools.

A great SEO framework to follow

Building on the above introduces a post from the guys at SEOmoz from a few evenings ago, billed as ‘An SEO instruction manual for beginners’ it’s valuable information…

• Also How to Rank: 25 Step SEO Master Blueprint

It pulls together lots of their learning’s on how to improve page ranking in Google using an SEO Blueprint touching on Keyword Research, Content, Site Architecture, On-page optimisation and Link Buidling.

Interestingly point 13 is “Design is 50% of the battle”, nice (and quite rare) to see an SEO expert recommend good design and UX as a key factor in ranking.

OK, I’ve just ran out of time, so more signposts coming soon. Of course if you would like to chat about how S8080 could help improve your web design and user experience and web related things, call 01792 485566 and ask for me, Matt Howard, or email info@s8080.com

One of the biggest demands by clients that we face is providing websites and applications for mobile devices. It’s no big news that web design is in a state of flux with the introduction of a wave of mobile devices, each with varying screen sizes and functionality, which raise a whole range of questions about web design best practice. Within the mobile app market, there is much debate over which is the better of two contrasting systems to deliver content to mobile devices – native applications, which can be downloaded from app stores and are installable software, and web apps – effectively websites that respond to being viewed on mobile devices.

Many argue that native apps offer better user experience; they are typically run much faster and utilise device functionality to perform sophisticated tasks, making them feature rich – plus, they don’t always require an internet connect to work. There are however drawbacks – they consume device resources, such as battery life; and require regular updates to maintain security and update their functionality. Not to mention that the issue that comes with market penetration. For example, Twitter’s mobile app might appear exactly the same on both Android and iPhone – but they will be built from different technologies – Java and xCode respectively. This presents large overheads when it comes to maintaining multi-platform apps for one service.

Mobile web apps

There are far fewer constraints when working with web apps – they require an internet connection yes – they are after all typically a mobile optimised version of a website. However, for our clients, they provide the better solution. They are extremely scalable – using standard compliant technologies such as HTML and CSS, website content can easily be optimised for mobile devices through techniques such as content adaption.

There are also other technologies that lend themselves to enriching user-experience that have begun to challenge the UX of native apps – such as HTML5 and various JavaScript platforms. As a web design and development agency, these technologies have provide us with the means to create engaging and highly interactive content that can on the surface behave to a greater extent as native apps would do.

Mobile accessibility

The benefits don’t end there – one of the biggest advantages web apps has over native apps, is ensuring accessibility standards can be met. Mobile accessibility standards for web apps focuses on standardising the implementation of HTML in an effort to ensure that content are viewable on mobile devices. Back in the day, WCAG 1.0 concerned itself with standardising good, accessible HTML – but post 2008, due to the diversity of technologies that were supported by modern browsers, such as CSS and JavaScript, WAI were prompted to revise their guidelines to create for more holistic standard. The outcome, WCAG 2.0 – which has since remained the gold standard.

It is important to remember that accessibility standards beyond the browser exist outside of web content accessibility standards. These guidelines don’t apply to the mass app markets we see available for the tablet and smartphone operating systems. Additionally, with native app SDK’s being made freely available to developers, regulating accessibility standards for native apps is near non-existent.

Of course we haven’t touched in this post on responsive designs for mobile web design which we are currently doing lots of work on… so more coming on that.

Resources

• Wired magazine – Native apps vs mobile web
• The guardian’s smart accessibility is packed full of useful information about mobile accessibly.
• http://www.w3.org/WAI/mobile/overlap.html
• The W3C – WAI mobile accessibility
• IBM – how do native apps measure up to accessibility

If you would like to chat about how S8080 could help improve mobile website design and user experience, call 01792 485566 and ask for Chris or Matt, or email, info@s8080.com.

This post is about content audits and inventories, tools we use as a key step in the reshaping of the information architecture and content strategy on any web design project. It has to be said they are an essential but often daunting first step of a big old redesign, restructure or migration…

Why bother with content analysis, content audit’s and content inventories?

When we redesign or restructure websites the aim is to provide users with better information, user experience and to hit key organisation metrics. To do this we need to know what content there is on the current website, then with some user research we can provide recommendations for gaps, where content may need to be reworked and where we think content can be removed to de-clutter.

It has to be said it is not the task any UX professional looks forward to – but as we work through the site and create a content audit or inventory (typically hundreds or thousands of rows in a spread sheet), we get really under the skin of the website and the content – a crucial step in the UX design process.

The content audit – a sample of the website content not a full inventory

We use the content audit when sampling an existing site in order to inform the UX phase.

The content audit gives a really good feel and flavour for the content of the site, it doesn’t guarantee to have every piece of content logged in a spread sheet – that’s what a full content inventory is for. The content Audit does allow us to understand what is in the existing site so we can reorganise it along with user feedback and the organisation’s objectives.

All of the results are logged in a spread sheet along with annotated images – we typically start on the home page and follow the key links on the page – the key sections of the site. Then for sub sections of the website’s IA we do the same – follow the key links, and then we look at high traffic areas of the web site too.

When we are auditing the content we will be looking at qualitative attributes, like readability, relevance to audience, things that are going to require human or editorial input. We also give a description of the content and we categorise the content – allocating it to themes or genres.

The content inventory – a monster spread sheet

We create a content inventory when we are performing a migration and have to account for every item, the output is a huge spread sheet. The content inventory is a detailed page by page log of all the pages in the site, it helps us to keep track of all of the content and map it to a revised IA, and of course helps us to estimate the amount of effort needed for the migration.

The content inventory is more quantitative than the audit and includes: page title, current URL, H1 tag etc. The content inventory will then evolve into a core part of the web editorial calendar and on-going content strategy by manually adding the content owner, person responsible for migrating and updating the page, review period, when it was published, date it was last edited, ROT status and new Location that we are migrating it to.

For inventories we’ll use crawlers alongside a manual inspection and audit of key pages.

What about content analysis on really large sites – 5,000 pages plus?

We are regularly asked to help on big websites with between 5,000 to 20,000 pages, sometimes XXL websites that exceed 50,000 pages in multiple languages. When we work on larger sites we will typically do an inventory including every page on the site using automatic tools and then layer on top a human audit of the top 2 or 3 levels, plus exceptions, and of course we look in detail at high traffic areas of the site.

Ok that stage of the UX phase was painful… but key

Now we really know what is on the website when layered into the user research (user surveys and card sorting) we can really provide solid recommendations to shape the information architecture – and work through the really fun parts of the user experience process!

If you would like to chat about how S8080 could help improve your web design and user experience, call 01792 485566 and ask for me, Matt Howard, or email, info@s8080.com.

Customer ratings (those little stars) and reviews are well used by web designers and digital marketing agencies on shopping and community sites – users like them, and they influence us – yes they do. But why?

The key research on web design & persuasion by recommendations

As far back as 2007 De Vries and Pruyn studied the effect of recommendations on users buying digital cameras, and in a nutshell they found that when recommendations were provided for a particular item it sold 20% more than when there was no recommendation.

So why do I listen to strangers opinion online (I wouldn’t down the pub)?

Online ratings and reviews unconsciously trigger our desire for social validation. Social validation is the process where we look to what others are doing, helping us make a decision more quickly, we look to other people to guide us – the important thing to realise is that we do this automatically and unconsciously.

So on web sites like Amazon and App Stores when  we are looking to make a purchase, we quickly evaluate the worth of a product based on reviews by others. If a page doesn’t have those customer stars and ratings on the first page, the page risks losing your attention very quickly.

Hey – I’m completely rational, logical… those stars only help me when I want help – I make the final decision…

For the most part we are all conformists, and the power of those little stars and reviews, and the triggers for social validation, are so strong that very few of us will be able to fight it and buy a product which has lower stars!

I know I like to do some research before buying – all those data sheets, statistics, pictures, graphs and specifications just allow me to tell myself I’m making a wise and conscious choice… but really this is in the main,  post rationalisation of an unconscious trigger on social validation.

Of course the problem now is that most popular products on Amazon and similar sites now seem to have 4.5 or 5 stars, interesting…

If you would like to chat about how S8080 could help improve your web design and user experience, call 01792 485566 and ask for me, Matt Howard, or email info@s8080.com

When we are talking about web design, website accessibility and how to make website content accessible with clients I’m often asked by about making video accessible and working with third-party media streaming services such as YouTube or Vimeo.

Embedding these third-party technologies has been a standard means to deliver video content through websites for a long time – they’re free, highly reliable and can be added to webpages with ease.

Moreover, there’s no question that these technologies offer great user experience – they pack large amounts of information into small areas of web page real-estate. Not to mention, 3G and 4G networks are now more than adequate to support streaming direct to mobile devices. They have become a UX necessity and a marketer’s weapon of choice.

However when you also consider that accessible video ensures inclusive design and can really help improve SEO and search engine findability (by adding video title, tags, captions, annotations and transcripts) the reasons to make sure video content is accessible become very clear.

Closed captioning

Despite this, there are still misconceptions surrounding how accessible these technologies are. W3C’s Web Content Accessibility Guidelines 2.0 (WCAG) has always leant towards limiting the use of embedded multimedia content such as Flash and Java – due to their content being out of reach for assistive accessibility technologies.

But that shouldn’t mean avoid them. YouTube for example, has since 2006 focused on developing inclusive technologies that make their video content accessible with the introduction of automated closed captions.

This is an excellent feature which allows video publishers to add text captions to specific points of the video. They present a mechanism for delivering time-based content in an accessible way. They provide subtitles, and caption text can be exported to create video transcripts – plus closed captions are searchable.

Shortfalls of Vimeo, mixed in with the pros

From an accessibility angle, YouTube has all the right ingredients for delivering accessible content and deliver it very well. But with more and more authors opting to use video to enhance their content, the motives from selecting alternatives to YouTube has begun to make online video prone to potential accessibility pitfalls.

Vimeo is a good example – it has a less cluttered and better looking interface than YouTube which makes it a very attractive option. More importantly, it has also resisted the urge to commercialise its service meaning that viewers aren’t presented by an interface littered with adverts. For this reason, its adoption, especially within the educational and public sectors is steadily rising. This does however come with a cautionary note; in its strive to retain what it sees as its bestselling points, features such closed captions are not yet supported by Vimeo exposing limitations in being a viable accessible technology… for now.

If you would like to chat about how S8080 could help improve your web accessibility and user experience, call 01792 485566 and ask for me, Matt Howard, or email info@s8080.com.

Some useful resources:

• W3C Mulitmedia Accessibility FAQ
• 3Play Media a commercial product for adding transcripts to Vimeo content
• Audio Accessibility blog – Vimeo and Captioning

In this post we take a quick look at some simple best practices work to help improve the accessibility of website design.

As a website design company, one of the more challenging elements of good web design that we face is often in providing the means to deliver engaging visual content for that enhances user experience – but equally as important, ensuring our websites adhere to web accessibility guidelines (WAI WCAG 2.0) and best practice.

Web accessibility and good user experience can sometimes be at loggerheads: on one hand, being conscientious of good user experience principles will prioritise design aesthetics and bespoke functionality to create novel and innovative interfaces. On the other hand, accessibility standards, particularly the more stringent web accessibility AAA standards often present many hurdles for web designers – stipulating strict measures for displaying and surfacing content.

Though AAA standards are strict, it shouldn’t mean that meeting them compromises visually striking web design – nor does it mean web design should be text-heavy with minimal colour combinations.

Colour contrast analysis tools to improve web design

From our experience, working with clients who require websites to meet web content accessibility guidelines, particularly those who operate within the public sector, one of the most common web accessibility standards we find to be overlooked regularly is colour contrast. As a web design agency, we focus on custom web design and website development that adheres to the necessary WCAG standards and accessibility best practice.

But that’s only half the story; what happens after website goes live can really affect how well WCAG standards are maintained on a website over the longer term.

Content authors who generate their own content using authoring tools can overlook simple WCAG compliant best practices – especially when adding their own decorative styles to text and when working with image content. Though CMS websites and WYSIWYG editors allow authors to add heading tags to text headings, and ‘ATL’ tags to images, there is no in-built functionality to assess how accessible colour contrast ratios work.

There is however a range of free, but effective tools available online that can validate the colour contrast of content. They allow authors to analyse colour contrast to meet the success criterion 1.4.3 guidelines for WCAG 2.0. Ultimately, these tools offer the means to generate accessible, yet highly visual, image rich content.

Here are a few colour contrast tools worth looking at which will help improve web accessibility

Contrast Analyser – a free desktop application that determines the how well colour contrast ratios adhere to Web Content Accessibility Guidelines 2.0. intuitive and simple to use – considered widely as an industry standard.

Colour Contrast Check is a free web-based validator that allows you find which foreground and background colour combinations are accessible – a simple and easy to use solution.

Luminosity Colour Contrast Ratio Analyser is a simple, free, online colour contrast analyser. By adding the foreground and background colours you intend to use to style your text area or images, this free app can determine how accessible the combination is compared to the success criterion 1.4.3 guidelines of WCAG 2.0.

If you would like to chat about how S8080 could help improve your web accessibility and user experience, call 01792 485566 and ask for me, Matt Howard, or email, info@s8080.com.

We have just launched two more EpiServer CMS web sites. The EpiServer development was for CITB, following on the successes of the recent launch of www.citb.co.uk. Our team of .NET developers are really enjoying the quick build time, customisation and flexibility of the CMS platform and it’s robust nature.

• Web design – Creative & look and feel
• Web template development
• EpiServer CMS
• Technical services, hosting & support
• Web usability & consultancy
• User centred design, personas and UX design

• User testing, card sorting & eye tracking
• Training workshops
• Website accessibility and accessibility testing
• Creative strategy & online style guides
• Creative concepts, designs & online campaigns
• Email &email newsletter design and broadcast

Live sites:
www.citb.co.uk/jobs/
www.citb.co.uk/thebirches

If you would like to chat about how S8080 could help develop your web site on EpiServer CMS, please 01792 485566 and ask for Chris Cowell, or email info@s8080.com.

S8080 certainly is!

We have just won a national workplace health and well-being award backed by Welsh Government, basically, the Corporate Health Standard for SME’s.

As we have an ‘ISO’ in place for team welfare (OHSAS 18001), a lot of the requirements were already in place including regular display screen assessments (the whole team have new twin flat screen monitors), health and safety training, workplace ergonomics and a modern and pleasant working environment right on the sea front.

But it’s the other stuff we do that makes the difference to our digital agency…

• Friday treats, where we provide hyper-healthy snacks alongside the ever popular muffins and pain au chocolat
• Hand sanitiser on every desk that helps keep colds and bugs at bay
• A humidifier running during the winter months to keep the air comfortable
• Our office is on a Sustrans cycle route
• A few of us started the ‘Couch to 5K’ running programme
• We’ve entered a sizable team to take part in the BHF Gower Bike Ride this summer
• Fresh fruit and veg brought in to share by the gardeners in the team (yes, there are quite a few of us!)
• But we do still have the occasional Domino’s pizza day too

We are generally a healthy bunch of web designers and developers, with a good mix of sport and fitness interests including cycling, running, mountain biking and surfing. But as all of our team are 30 plus, it pays to keep expanding waistlines and illness at bay – and we have almost non-existent illness absence, so it’s working!

After a period of consultation and guidance, we were assessed by the Workplace Health team at Public Health Wales and awarded the Bronze standard Small Workplace Health Award, with the Silver standard to hopefully follow later this year. We’d like to say a big thank you to Rhian and Val from Public Health Wales for their knowledge, encouragement and enthusiasm.

You can contact them at workplacehealth@wales.nhs.uk or telephone  08456096006.

It’s valuable to S8080 on many obvious levels, but most importantly, the whole team feed in with ideas and opportunities to do fun stuff together rather than just a drink after work.

Picnic on Pen y Fan anyone?

Update 7th May…

We have made the Enterprise Zones Wales site live, it’s been a great project working with the team in Welsh Government over the past few months. The project was a rapid turnaround Drupal CMS deployment focusing on the key 7 enterprise locations in Wales.

• Drupal CMS
• Web usability & consultancy
• Information architecture
• Wire frame design and prototyping

• Web template development
• Website accessibility and accessibility testing
• SEO services & online marketing

Live site: enterprisezones.wales.gov.uk

We have just hit send to another big email broadcast to over sixty thousand (yes 60,000)  anglers throughout the UK for Fishing Wales and the Environment Agency. The email was a quick visual email to announce the new season announce the new another issue to the ever successful to the e-zine we design and built. The online analytics showed yet again a huge hit. Here’s a link to the latest e-zine: www.wildfishingwales.com/

• Email & email newsletter design and broadcast
• Digital marketing &SEO
• Web analytics, audits and customer insight

• Digital illustration
• Strategy
• Viral

• Design
• Digital illustration

• Digital strategy
• Branding

• Design
• Digital illustration

• Digital strategy
• Branding

• Design
• Infographic
• Digital illustration

• Digital strategy
• Branding

Live site: www.gov.uk/government

• Design
• Infographic
• Digital illustration

• Digital strategy
• Branding

• Design
• Infographic
• Digital illustration

• Digital strategy
• Branding

• Designs
• Website design
• Website build
• Templates for your CMS
• Drupal content management system
• Drupal custom web development

• Information architecture
• Analytics
• User needs & persona development
• Wire frame development
• Usability
• Accessibility

Live site: business.wales.gov.uk

• Designs
• Website design
• Website build
• Templates for your CMS
• Drupal content management system
• Drupal custom web development

• Analytics
• Information architecture
• Wire frame development
• Usability
• Accessibility

Live site: www.rcoa.ac.uk

• Designs
• Website design
• Website build
• Templates for your CMS
• Drupal content management system
• Drupal custom web development

• Analytics
• Information architecture
• Wire frame development
• Usability
• Accessibility

Live site: www.technocamps.com

• Designs
• Website design
• Website development
• Templates for your CMS
• EpiServer content management system
• EpiServer custom web development
• Information architecture

• Analytics
• Focus groups, workshops
• User needs & persona development
• Wire frame development
• Usability, usability testing
• Accessibility

Live site: www.citb.co.uk

The team at S8080 wish you all a very happy St David’s Day – Wales’ national day. Treat yourself to a bunch of daffodils for your desk and knock up a batch of Welsh Cakes.

The persistent winter rain seems to have stopped for the moment and the mornings and evenings are getting lighter. It looks like spring is finally with us. A wonderful time of year.

Our good friends at Wales.com asked us to help them celebrate St David’s Day by creating a little interactive and iPad friendly fun. Visit their interactive home and learn more about Wales.