Recommended Agency

text controls: text only | A A A

How sweet! Ariana Grande sounds excited to meet us #3daysTilFocus, posted 29 days ago

RSS feed icon What is RSS?


articles tagged with: website

Displaying articles 1 - 10 of 58 in total

Hartlepool Now web site launched

Hartlepool Now web site launched

Monday 19th October saw Simon and Annette travel north to join Hartlepool Borough Council for the launch of Hartlepool Now, a new web site created by the team at Focus that helps the local authority meet new information duties from The Care Act 2014.

Taking place at Hartlepool College of Further Education, the launch event was a great success. Attendees had a number of workshops to choose from including a run through of the web site itself, a demonstration of the new online Equipment Finder and a chance to see The Ricochet Project from local charity Incontrolable, which lends tablets to disabled people in the community and provides basic training in using them.

Following the workshops, Hartlepool Now was officially launched by council Chief Executive Gill Alexander, who stated that the new web site "helped Hartlepool set a new standard for publishing clear information and advice".

Our branded cupcakes went down a treat as well.

A massive thanks to the project team at Hartlepool for inviting us to the launch, it was great to be part of the event and hear the positive feedback the web site is already receiving.

Annette Ryske

Created on Friday October 23 2015 11:36 AM

Tags: website thecareact

Comments [0]

Introducing Rife Guide

Introducing Rife Guide

Rife Guide is a dynamic online platform where young people can keep up to date with what’s happening in Bristol and get involved in a wide range of activities. Part of Bristol City Council's pioneering online virtual youth service and created by Focus in partnership with Watershed, Rife Guide is managed by a team of talented young journalists, content creators and editors who know what’s important to Bristol’s young people.

Rife Guide includes a calendar of events and activities in Bristol as well as information and advice on important issues such as housing, drugs and sexual health. What’s more, visitors can create a login that will give them access to a portal of content that is appropriate to them - events and services are suited to their age and preferences and then pushed to them every time they log in, without the need to search.

As well as being a hub for young people, Rife Guide is also a platform where local businesses, organisations and providers can promote their services - they too can create a login and upload the details of their organisation or event which is then moderated by the Rife team before being published to the website.

Annette Ryske of Focus says the involvement of young people at all stages of the project has been crucial in it's success:
"Consultation was key. From the very beginning, we worked closely with Watershed on a series of workshops and engagement sessions with both service providers and target users. This involved visiting local schools, youth groups, clubs and children in local authority care. Our work with providers led the development of systems for publishing their information quickly and efficiently."
"Working with young people showed us that the majority of their internet use was via mobile, they were using social media to share content and the content itself should consist of less text and be rich in images and video."

Now that Rife Guide is live, ongoing engagement with young people is more important than ever, and we are already planning new content and features based on feedback from users. 

Annette Ryske

Created on Friday October 23 2015 09:39 AM

Tags: website

Comments [0]

Designing for Accessibility

Designing for Accessibility

Guesswork can only get you so far before it becomes a problem. My 'genius' theory of 'If in doubt choose B' served me well in my multiple choice French exam. It proved less useful in my oral exam when I told my teacher I keep a large duck in my kitchen every other day.
Yet it's come to light that many people with disabilities are navigating websites with the help of good guesswork, such as assuming the 'Contact' button will be the last link in the navigation bar.

A website should be intuitive to anybody who chooses to use it. Nobody should have to guess their way around and risk missing much of it's content. Accessibility enables people with disabilities to perceive, understand, navigate, interact with, and contribute to the web.

Alastair Campbell oversees both usability and development aspects at Nomense, a company that believes, just as we at focus do, that everybody has the right to access inclusive design, regardless of ability. He spoke with us about the importance of considering accessibility right from the start of the design process. We want to share a few of those things with you.

Skip links
The main content is often not the first thing on a web page. Keyboard and screen reader users tend to have to navigate a long list of links, sub-lists, corporate icons and more before ever arriving at the main content. So these users will thank you for enabling them to bypass or 'skip' over repetitive web page content. You can press the tab key on the Nomensa site for an example of a skip link

Keyboard test
You should be able to achieve everything with keyboard controls alone.

• tab key to progress through links and controls
• shift-tab to reverse
• enter to follow links
• space to select form controls (e.g. tick boxes)
• cntl-f / cmd-f to find a link or text

Have a go on the BBC website for a good example and the Zoopla one where you'll get lost the moment you reach the first drop down menu

Zoom view
On many sites, the closer you zoom in, the more of the site's content is lost off-screen. Not with the Microsoft website: this responsive site behaves as if you are viewing it on a smaller device each time you zoom, so eventually you are looking at a mobile view with all content still easily accessible.

User input
Make sure the results of user input happens close to where they perform the action. To experience the difficulties that incur if you don't, zoom in on this website and add something to the basket. When you do, you're left wondering as nothing appears to change, unless of course you navigate all the way to the top right of the screen and view your basket. Do the same on amazon and an 'Added to Basket' notice immediately appears within view. Yes, that ab-cruncher I'll never use is mine all mine!

Alistair, photographed above, says there are 4 questions to ask yourself:

• Can you use it with a keyboard?
• Can you see it when zoomed?
• Does it provide appropriate information to
screen readers?
• Is it easy to understand?

Yes, it's a lot to take in and on the surface it may seem that this will limit your creativity. If anything, these guidelines will push these limits as you discover visually pleasing designs that improve the online experience for a wider set of users. And that's a fact. Even in French.

Jordana Jeffrey

Created on Friday October 16 2015 11:42 AM

Tags: website technology web-development accessibility ux

Comments [0]

Screenreader Compatibility Tips

Screenreader Compatibility Tips

I watch as person after person pulls furiously on a door handle before giving it a shove, flying through the doorway much to their surprise and quickly patting down their disheveled attire.
(I'm allowed to laugh as it makes me feel better about doing it myself shortly before, only much less gracefully).
The problem here? The door handle was giving the wrong message. What looked like a handle was indeed a hinge.
My point is, the need for accessibility is everywhere and it is as important in web design as it is in architecture.

When designing for web we must consider various factors such as colour contrast and text size but many forget to consider screenreader users (Screen readers are audio interfaces that convert text into synthesised speech so that users can listen to the content). Luckily there are a few simple things that can be done in order to improve usability for screenreader users, and ultimately all web users...

Logical linearization
Unlike sighted web users who can scan a web page and pull out at random what they consider to be the important information. Screen reader users tend to listen to a page from start to finish, top to bottom, left to right. So it is best to have the important parts towards the top of the page.

Descriptive page title
The first thing a screen reader user hears is the page title. It is imperative that this gives users a clear idea of what to expect from that page. Obviously this benefits everyone as anyone can use the page title to orientate themselves and confirm they are where they want to be on the website.

Descriptive headings
One of the most important usability features for screen reader users is on-page headings. The page structure can then be more easily understood. Although text on the page may appear to be a heading for sighted users, screen readers read through the HTML code so it must be labelled as a heading within that. The screen reader will then announce it as such.

Descriptive link text
Screen reader users can call up a list of on-page links and browse a web page that way. They simply activate links of interest to them. Therefore non-descriptive link text like ‘click here’ is meaningless out of context so avoid it like the plague!

Using lists within the HTML code is super useful as screen readers announce the number of items in each list before reading them out. This way screenreader users have a better idea of what to expect when hearing a list of items, for example site navigation.
A bit like the way an answer machine tells you how many messages you have received rather than just reeling them off one after the other. You feel more prepared for what you're about to listen to. The use of lists (using the <li> tag) is a behind-the-scenes change to the code that shouldn't really affect what the website looks like.

The great thing about these screenreader friendly tips is that each and every one of them will improve overall user experience.
We as humans like to know what to expect and are comfortable with what feels familiar. It's always good to bear this in mind when designing for web and there is no reason this should jeopardise your creativity. Maybe give the web equivalent of dodgy door handles a miss though, just a thought!

Jordana Jeffrey

Created on Wednesday August 26 2015 03:06 PM

Tags: website technology web-development accessibility communication usability screenreader

Comments [0]

Making Information Accessible

Making Information Accessible

"We are drowning in information but starved for knowledge" - know who said that? You have two guesses... if neither of them were author John Naisbitt, you don't win a prize (well you don't win one either way but it feels good to be right doesn't it?)

Accessible Communications Consultant, Katie Grant, kicked off her engaging talk with that very quote. Katie quite rightly pointed out that information often comes at us faster than we can make sense of it, regardless of disability. So if you're the one dishing out all that know-how, you might want to consider whether it is meaning as much to your audience as it is to you. You should be thinking about:

Language - keep it clear and simple.
Tone of voice - is it appropriate to your audience and your organisation?
Message - should be clear and targeted.
Structure - have a clear intro and overview of the subject.
Content - keep complex data separate.
Readability - pitch at the correct reading level.

Web accessibility should focus on people with all types of disabilities - visual, auditory, physical, speech, cognitive, and neurological disabilities - including older people with age-related impairments.
Potential audience groups who may benefit from an accessible website also include:

- people with long term health conditions.
- those for whom English is not their first language.
- people with low literacy levels / poor social access.
- people with neurodiversity conditions such as autism.

Some say what has caused a lack of awareness is a lack of empathy. Hearing from those who require accessible websites is so valuable and there was a lady present who kindly shared her needs and preferences with us. She has a few conditions including dyslexia and favours websites with accessibility bars that have the option to change the background colour (you can see this on many sites designed by Focus i.e.

Focus work with many charities and enjoy enriching the lives of others through our technology but there are benefits to be had by all when accessibility is considered seriously. Legal & General spent a lot of time and money making their website accessible. In doing so they experienced many side benefits: visitor numbers almost doubled, maintenance costs halved and there was a huge increase in traffic to the site. Even though it's a few years old their case study is an inspiring read and you can view their case study online.

The message is simple. It's a pretty good idea to make accessibility the aim behind communicating any information. Whatever your reasons are for doing so, the benefits are countless.

Jordana Jeffrey

Created on Monday June 01 2015 12:18 PM

Tags: website charity technology userexperience usability accessibility

Comments [0]

Election Night: The web sites kick off

Back in May 2010, one of our most popular blog articles took a quick look at the web sites of the leading four political parties just before election night. It turned out that Labour had the worst performing web site in terms of code validation - and look how that turned out for them.

So clearly, the true test for how an election will end up is a test of their web site against W3C standards (obviously). Five years later, and it's time to do it all again before we all go off to the polling station.

Here's how the seven (seven?!) main party web sites fared:

1. Conservatives.
Does it pass Google's Mobile Friendly test: Yes.
Validation errors: 7 errors and 3 warnings, that's a worse performance than 2010 for the Tories.

2. Liberal Democrats.
Does it pass Google's Mobile Friendly test: Yes.
Validation errors: 27 errors and 2 warnings. Oh dear. However, they do comply with the EU's Cookie Policy.

3. Labour Party.
Does it pass Google's Mobile Friendly test: Yes.
Validation errors: 16 errors and 11 warnings. Much better than 2010's stats of 286 errors and 45 warnings. But web site usability not helped greatly by the instrusive splash / signup page on entry.

4. Scottish National Party
Does it pass Google's Mobile Friendly test: No! Our first fail.
Validation errors: 3 errors. But lots of points lost for all those tablet and mobile users.

5. Plaid Cymru
Does it pass Google's Mobile Friendly test: No! Disappointing again.
Validation errors: It gets worse, the W3C validator is unable to validate Plaid Cymru's web site due to an encoding issue. Doesn't bode well for May 7th.

Does it pass Google's Mobile Friendly test: Yes.
Validation errors: Oh dear Nigel. 115 errors and 33 warnings. 

7. Green Party
Does it pass Google's Mobile Friendly test: Yes!
Validation errors: 4 errors and 1 warnings, not bad at all.

So it's quite clear - on the 8th May we'll have a Green Party majority, and UKIP will be in the pub fixing those validation errors. But some time on the naughty step please for the SNP and Plaid Cymru for those mobile-unfriendly web sites. *


* yes, we know there are other parties, but this is a bit of fun and in no way endorses any political party or policy - apart from having a responsive web site.


Simon Newing

Created on Friday April 24 2015 02:57 PM

Tags: website

Comments [0]

Should you be worried about 'mobilegeddon'?

Should you be worried about 'mobilegeddon'?

You may have seen 'mobilegeddon' trending across social media over the past few days, as well as being the subject of some high profile articles on The Guardian and the BBC

At the heart of this rather apocalyptic term is a fundamental change to the way that Google is ranking search results. Up to now, web sites that are suitable for display and use on a mobile phone were highlighted in their search results, but Google are now ramping things up and taking the 'mobile friendliness' of a web site as a significant factor in how highly your site will be ranked on their results pages. So if your web site isn't optimised for being used on smartphones and tablets, you could start to lose some valuable Google rankings.

This could spell big problems for business-critical sites such as eCommerce stores and SaaS platforms, with USA Today claiming at least 40% of 'top web sites' could be hit. The commercial aspect of  search engine rankings are vital for online businesses, particularly where the majority of their traffic comes from Google searches. But just as important is the effect this will have on non-commercial sites, where users often search Google to find relevant information, advice or support.

This is, of course, another good reason to ensure that your web site is optimised for mobile - something that we at This is Focus have been doing for over three years now. For our customers, 'mobilegeddon' means their web sites will appear healthily in search results, with a nice reassuring 'mobile friendly' label. 

But there's other important reasons for optimising your web site for mobile:

  • User experience: ensuring that whatever device your users employ, they can obtain the information they need.
  • Accessibility: why should users who only have access to a specific device be penalised? 
  • Sustainability: new devices surface so quickly. Being 'mobile friendly' is more than 'doing a mobile version of your web site'. There are many combinations of screen sizes - iPads have mini-versions, iPhones have big versions. Our technology means we take screen size as the key factor in how a web site is displayed - not just the device accessing it.

There's no doubt that Google set trends and in some ways, govern the way that web sites are delivered. Google react to how users search for information, and they clearly think that this core change in their ranking tech is delivering users the content they want in a format they need. It could be the first of a series of changes they implement that favour well designed, robust and useful web sites.

Handily, Google have provided a nice online tool to check if your web site is 'mobile friendly'. Simply visit: and enter your web site address. If it fails, then please do feel free to have a chat with the This is Focus team to see how we can turn that red cross into a green tick....

Simon Newing

Created on Friday April 24 2015 11:17 AM

Tags: website google seo search

Comments [0]

Google's new "Mobile Friendly" label

If you've been doing some Google searches on your mobile phone recently you may have seen a new "Mobile Friendly" label turn up as part of the search result pages.

The global rollout of this new feature started in late November 2014 and is designed to highlight to the user web sites that are optimised for viewing and using on a mobile device, and those that are not. This is quite important - some of our client sites receive up to 40% of their traffic through mobile phones, and optimised web sites are also favoured by Google themselves in terms of search rankings.

Google used a number of automated tests to determine the 'mobile friendliness' of a site including the detection of unsupported software (such as Adobe Flash) and ensuring that links on the page are sufficiently spaced so they can be easily 'tapped'. Google have also provided a handy online tool for checking to see if a web site would achieve the 'mobile friendly' label:

So if you find that Google decides that your web site isn't as mobile friendly as you'd like it to be, then please do give the Focus team a shout.

Simon Newing

Created on Wednesday December 17 2014 03:24 PM

Tags: website google

Comments [0]

Annette's a Rails Girl

Annette's a Rails Girl

Heard of Rails? Heard of Girls? What about RailsGirls?!

(Ruby on) Rails is, and I quote Wikipedia: "an open source web application framework written in Ruby". In layman's terms, it's what our clever web developers use to make our websites.

Girls are... well, insert your own answer here.............. (try wonderful, clever etc). But for me as a Girl, I didn't know much about Rails, or Ruby - and in fairness, I don't need to - but I was starting to want to.

Over the three years I've been here at Focus, I've seen and heard lot of code-y, tech-y stuff, like 'Gems', 'Frameworks', 'Scaffolds' and the like. I see black screens with white text on that looks like something out of the Matrix, and I am DEAD impressed. So when I heard about the latest Rails Girls event in Bristol, I signed myself up to find out more.

So a couple of Saturdays ago I headed over to At-Bristol (where loads of cool stuff was going on with kids flying drones and all sorts!), and got stuck in to a really informative, interesting and empowering day. The guys running the sessions all had different experiences with Ruby and Rails. We learnt some basic information, terminologies and the like, did some tutorials, had a yummy lunch, and then onto the highlight - building our own web application. With the assistance of several experienced helpers, I managed to set myself up a server and make myself an 'ideas application'. I made CSS styling changes, created new 'ideas' (headlines with text), I even made buttons that facilitated an image upload.

Back at work on the Monday after the event I proudly showed off my work. I think the developers sniggered into their sleeves a bit :-) but everyone was interested in what I'd done and how I'd done it.

Moreover, I now feel better informed; when talking to our developers and also hearing them talk, and seeing what's happening on their screen when I ask for changes to a website. I know what a Gem is, and what it means to create a new scaffold. And it helps talking to clients about their website work, I can better picture what might be involved with what sounds like a simple change...

So huge thanks to @RailsGirlsBriz - I enjoyed the day and learned lots of new stuff. And the fact they run these events for free I think is marvellous. Can I go to the next one?

Annette Ryske

Created on Wednesday December 10 2014 09:43 AM

Tags: website open-source web-development bristol rubyonrails ruby rails programming

Comments [0]

Web Testing on real phones & tablets

Web Testing on real phones & tablets

There are so many ways a website can be rendered on screen. Not only is there a huge variety of phone shapes and sizes but all of these can have multiple browsers (e.g. Chrome, Firefox, Safari, Opera and Internet Explorer). Then there's the fact that they can display in landscape or portrait mode. Users aren’t using a mouse but are instead using their fingers (some with 'digits' a little less delicate than others!).

It’s difficult for us developers and designers at web design agencies to predict just how our latest website might look online. There are of course websites that are meant to emulate how it will look but they're not always accurate.

This is where Open Device Lab steps in to make life that little bit easier. We headed over to their offices at Aardman to test one of the responsive website designs we're currently working on. We were able to test it on multiple popular devices from the iPad to a Blackberry. In doing this we could avoid the on-line emulators, we didn't have to pester friends with a different phone to ours to "borrow it for a second".
At ODL we could use a pretty handy piece of kit called 'Ghostlab'. Ghostlab synchronises browser testing. It scrolls, clicks, reloads and form inputs across all connected clients. So what you're testing is not the simple page load, but the full user experience. We also had the option to abandon that and fiddle with each device individually which is good for spotting usability issues that could possibly go unnoticed otherwise.

ODL Bristol are sponsored by the digital marketing agency 'Noisy Little Monkey', these guys made us feel super welcome and we were comfortable knowing we had coffee and support at hand (if required). More importantly, we left feeling we had done a thorough job of testing for our client.

So what did this cost us?... absolutely nothing. We're not sure if that's ever due to change but at the moment so long as you book ahead, you're welcome to pay them a visit. A the moment this gem feels like our little secret but you know what we're like at Focus, we promise to keep you guys updated with all things digital and this is definitely worth 'whispering' about.

Jordana Jeffrey

Created on Monday December 01 2014 04:42 PM

Tags: website technology web-development mobile-internet web-design ux responsive

Comments [0]