articles tagged with: website
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.
Created on Wednesday December 17 2014 03:24 PM
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?
Created on Wednesday December 10 2014 09:43 AM
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.
Created on Monday December 01 2014 04:42 PM
Do you spend hours poring over Google Analytics, fascinated by all those numbers and pages being viewed?
Does it excite you, and empower you to make changes to your site? But you're not quiiiite sure what those changes should be, and wait a minute you've just found a new bit about Demographics, but oh that needs a UA upgrade, how do I do that? And then you decide you'll go back to it next week and make a proper plan... and next week you forget where you got to...
Sound familiar? Our (new) friends at OneSpace were in just that place - in fact quite well informed about Google Analytics, but felt they needed a bit of direction and guidance to get more out of it. So I took a trip out of the office to meet them. We enjoyed a few hours talking about their website objectives, and how they could take some stats from Google Analytics and turn these into some meaningful, achievable tasks.
These, I think, are three of the most valuable tips:
1. Link your site up with Webmaster Tools. Doing this gives you an insight into those '(not provided)' keywords that Analytics teases you with. Can be really handy for improving your content or setting up an Adwords campaign.
2. My favourite - always use 'Secondary dimension'. For everything. It brings a whole new meaning to so many stats. For example, Your top 10 landing pages are reasonably interesting, but add in the 'Device' as a secondary dimension, and suddenly you find that the top three landing pages are actually being viewed on a mobile... and your site isn't optimised for mobile...
3. Lastly, get to grips with Shortcuts. When you've got a really good secondary dimension view set up, save it as a shortcut. Makes it so much easier for next time.
Give these ideas a go, get stuck in and let us know how you get on!
Thank you to Paddy at OneSpace for his kind comments and biscuit supply:
"Thanks again for your time! We found that really helpful. [We've] talked to various SEO consultants in the past and not found it at all helpful, so we're very pleased with today's session."
So how do you work with Analytics? Do you get what you need out of it, and manage to make beneficial changes and developments to your website? Or do you dip in and out and not really have any direction?
Created on Friday September 19 2014 02:34 PM
The BIG launch! The new-look "Go Places to Play" is here - an online park finder that makes it easy for you and your family to enjoy fun and exciting play opportunities in and around Bristol.
We've recently redesigned goplacestoplay.org.uk for Bristol City Council so that it not only looks better than before but it works better. "Go Places to Play" is now even more intelligent so that you can find parks and play areas far more quickly and efficiently. We understand that you live busy lives and need information at your fingertips - wherever you may be. The site is now responsive so it is easy to use on smartphones, tablets and laptops. This means you can quickly find your nearest park when you're out and about. You can click on map points to get further information about the park or site you are interested in, or you can use the postcode search to bring up sites in your area.
The online calendar means you can search for local events that suit your requirements and interests. You'll be provided with results if you search using a relevant keyword, or you can find something more specific using the handy advanced search which allows you to search by event type, location and distance from your chosen postcode.
There are also some great ideas for play featuring tips and suggestions from our Play friends and partners - a particularly good resource for the school holidays. Plus, our brand new FAQs section answers many of the common questions we get asked.
As before the option is there to register as an event organiser which means you can upload your own events to feature on the events calendar. Once approved you will see them published.
People like to feel as though they are a part of a website and the 'community' that use it. Interaction is key so if you find something you like on Go Places to Play you can "Share with a friend". Regular news updates also ensure that everybody is on top of all that's going on. It's a site that seems to have people talking, if you want to be a part of the excitement please like the Go Places to Play Facebook page here: https://www.facebook.com/goplacestoplaybristol or better still, go and check out the site to see for yourself!
Created on Tuesday August 05 2014 04:16 PM
We can't contain our excitement, we simply have to share with you what's bubbling away in the studio!
Improvements are being made to our current online park finder "Go Places To Play" - a website that forms a part of Bristol City Council's campaign to encourage children to play outdoors.
We don't want to give the game away but here are a few snippets of what to expect.
Mobile friendly - We've added more functionality that is based on your current location i.e. your closest park is. It is also a mobile first build; usually mobile sites are designed as a result of a desktop design that is scaled down. Not this site. We've started with the mobile design and scaled up! The build is responsive; meaning you get an optimised view on desktop, tablet and mobile.
User friendly - Much easier to navigate the site. You're guided through it and it is clear to see all it can do and how it can benefit you.
Age appeal - Adults often view the site with their children in mind. The site is much less childlike and now appeals to a wider age range so that it is great for parents to navigate, but still has a family, child-related feel.
Search to suit you - We want people to be able to find personalised information based on where they are and what they like to do rather than just general information.
We've put some serious effort in to not only making the site look good but in making it a useful tool that you feel you can go to and rely on. It's not yet a finished product but we can't wait until it is and you'll be the first to know about it!
If you would like to see the online park finder as it is now, please go to http://goplacestoplay.org.uk/
Created on Monday June 16 2014 09:00 AM
By now, you may have heard of "Heartbleed", a security issue that was announced earlier this week in OpenSSL, which provides the https/SSL security to a significant percentage of the internet's websites (and email services etc.)
It's estimated that Heartbleed affected about 17% of all secure websites at the time of its announcement, and it's a bad issue - it theoretically means that someone can read secure SSL-protected data.
First of all, from a This Is Focus viewpoint, we can confirm that only a very small number of sites we host were ever affected, and those were upgraded within a few hours of the fix's availability - meaning that they're no longer vulnerable. Remember, this issue only affects you if you're running an https:// (SSL) website.
So what does Heartbleed mean? Without going into too much technical detail, it effectively means secure websites were potentially only as secure as non-secure websites - an attacker could see details passing between you and the website whilst they were "in transit" between them.
That's still fairly secure, to be honest - an attacker couldn't see your password unless they were either on the same network as you, your website, or somewhere in between. If you're on your own network (and not, say, on public WiFi), it's still difficult to achieve for a casual attacker - it's only practical for serious, large-scale attackers.
Having said that, the problem has affected a lot of very popular websites - including, but not limited to, Google, Facebook, Yahoo, Dropbox and Pinterest - so it's theoretically possible that someone could have grabbed your passwords for those sites. All those sites have swiftly applied fixes, however. So it's not a bad idea (it's never a BAD idea!) to change your password on those sites, as well as any other sites where you use the same password. (Which ideally, you shouldn't!)
So in summary, everyone should have applied these fixes by now - we have, and all the sites mentioned above have - but it's worth asking/checking if you rely on the security of any other sites.
And this could be a good reminder to change your passwords!
Created on Friday April 11 2014 10:10 AM
Trawl the web for long enough and you'll begin to notice patterns occurring, it becomes clear what is growing popular in the world of web design. Here are 10 design trends that I spotted and have a sneaky feeling we'll be seeing much more of in the coming year…
1. Flat design - OK, so this has been popular for much of 2013 but it's still going strong! Flat design removes all unnecessary elements so the content is the main focus - providing the best user experience. Initially, flat design developed as a solution to simplify Web layouts so that they were optimised across different devices but it's not just popular for practical reasons anymore. I can't get enough of this simple, clean style.
2. Grid-Style Layouts - Page elements are scattered to look like a grid. One familiar example of this would be the Facebook timeline. The grid-style provides a solid visual and structural balance. This sophisticated layout structure gives more flexibility and improves the visual experience of visitors as they can follow the consistency of the page much more easily.
3. Endless scrolling - The good thing is, browsing on our mobiles has gotten us used to it. Scrolling through a website is faster and easier than having to click through links upon links to get where we need to be. It's not content-cluttered either as new design techniques means all information is organised and formatted in such a way that it’s easy to digest. The layout often changes as you scroll, creating sections resulting in the user forgetting they're looking at one long page.
4. Simple Colour Schemes - I have a feeling there will be a lot more websites using only one or two colours. A new trend seems to be to use one bright and clean background colour, such as red, orange or teal, and to include images or black or white text over it. This creates a seriously minimalist and user-friendly effect.
5. Video - Instead of the usual written piece about what the company do, businesses are beginning to opt for short videos. This is most likely due to the fact that videos are easy to produce and share on your site as well as on social media. They also appeal to the short attention span many of us have adopted these days, we want everything now! Videos are an effective way of communicating with an audience and having an impact.
6. Fun with fonts - Designers are once again enjoying 'playing' with typography. Fonts seem to be getting bigger (and in my humble opinion, better!) and siting amongst a variety of others. Also, responsive typography should become a bigger part of responsive web design.
7. Mobile-First Design - Here, a higher priority is placed on the mobile experience which then becomes the foundation of the entire layout. The idea is to first mock-up how the website should look as a responsive layout on smaller screens. To make this work 'fancy' design considered unnecessary excess is removed and we are left with the bare essentials.
8. Mega-Navigation Menus - These menus that expand to hold large blocks of content and links, and can often contain product images seem to be particularly popular with e-commerce or news websites. If done well, this type of navigation can be extremely effective, they allow the user fast access to information located deep within the site.
9. Expanding search bars - Building semi-hidden or expanding search bars into your layout is definitely growing in popularity. When the user clicks a magnifying glass icon or clicks into the bar itself, the search bar expands wider allowing for more text input. This can be seen in a lot of responsive layouts.
10. Parallax Scrolling - That nifty technique that lets background images move slower than foreground images to make visuals appear more dynamic certainly makes for an interesting browsing experience. Handle with care though as too much of it can have quite the opposite effect!
As a designer here at Focus I am super excited about applying some of these trends to our work. Throughout the year I'll be looking out for emerging trends so that I can see you back here in 2015 with a whole new list!
Created on Thursday January 16 2014 11:04 AM
Last month saw us launch a new web site on behalf of the Parent Partnership team at Bath and North East Somerset Council.
Connecting Families is a new programme designed to help families with multiple complex needs in the BathNES region - and is part of the Government's Troubled Families Initiative, which aims to change the lives of 120,000 families by 2015.
The web site provides users with access to a database of support groups and organisations who offer help, guidance and advice. The database is categorised into easy-to-follow scenarios and topics that are relevant to individual family members - so it's clear where everyone can find the information most appropriate to them.
Additionally the site has built using underlying responsive tech - with the layout of each page changing based on the device being used to view it; whether it's a desktop, laptop, tablet or mobile smartphone. We include a responsive layout with all our new web site projects - helping provide engaging user experiences across all devices.
To see the new web site please see:
Created on Friday November 22 2013 10:00 PM
Speed on the web is as important as ever, with figures showing that better performing websites get more business, and that performance may also have an effect on SEO rankings.
Recently, we've been asked by several clients to measure how their site performs, and what could be done to speed it up.
For the first client (a multi-national blue-chip insurance company), they primarily wanted to know how many users their system could support - how many users could use the site in an hour, say?
The first thing we needed here was a program to simulate being a real user. PhantomJS is an excellent tool here, because behind the scenes it's basically the same browser as Google Chrome, but there's no visible front-end - we can "drive" it automatically and measure the results.
So, we produced a PhantomJS script that hit the website, logged in, and performed the operations our client wanted testing. (Measuring all the times as it went.)
We then produced a large queue of those scripts to run, and fired up a whole bunch of Rackspace Cloud servers, and told them to share the queue of jobs - this is to simulate concurrent users, which is very difficult to emulate with a single computer.
We ramped up the simultaneous servers gradually, and found the spot at which we'd hit a limit - meaning that the system couldn't deal with more simultaneous users than we were throwing at it.
Armed with these numbers, we could then dive a little deeper into the figures at certain points of the process, and find some likely candidates for the stages that were specifically slowing things down.
The tools we have available for this kind of work these days are frankly excellent - without PhantomJS (or something similar), our tests would have been significantly less "real", as it wouldn't have used real-life browsers to do the testing. And without Rackspace Cloud, I dread to think of the work involved in actually firing up that many physical servers to perform the tests!
Next time, I'll talk more about what happens next - how web pages can be made faster.
In the meantime, please don't hesitate to get in touch with us if you'd like us to performance-test your website!
Created on Tuesday September 17 2013 01:45 PM
Bristol: 0117 949 8008