Her previous site was relatively simple, with a lot of text details on services, rates, hours and Ruths way of working, what she provides and what she expects from clients. There was also a sizeable blog archive built up over many years. What also came out in conversations was that Ruth had certain clients that read her site using a screen reader, a device which reads the content audibly for those with vision impairments or severe motor limitations. Lastly Ruth wanted to raise the profile of her domination and webcam services by creating separate pages for each.
So to work, firstly we had to plan how to structure the new site, content heavy sites can be challenging when trying to make something that is easy to read, visually strong, yet contains all the information in any easy to access way. We decided to restrict the main pages to key information and move secondary information to a "terms and conditions" page where more detailed content could be laid out, some content it was decided to ditch entirely or to provide at the e-mail exchange stage. This allowed us to stress the major positives Ruth brings to her work while keeping the "small print" where it can sought out if required.
With the above decided we set up the basic content management system structure, and moved all the blog posts across to the new site and created the bare bones of the design system. Ruth previously had a video on a page on her site, it was agreed to promote this to the front page as a feature. Video when used correctly and made professionally is powerful, and as most sites do not have this type of content, making a feature of the video seemed logical. For this site we also opted to use a commercial font, again to enhance the visual identity we were keen to create.
Animation also features on the site, in recent designs we have been enhancing our sites with javascript to create such things as moving text blocks, "panel" based displays and enhanced image effects. For this site we have used a reveal and scale effect on all the page images which play on scroll and reverse if you scroll back up. The large name ident at the top of the page also shrinks and expands on scroll freeing up the space for the content as you move down the page.
With all the effects and page structures in place we proceeded to add the content breaking it up into readable soundbite type blocks with links to further details. The site is structured in such a way as to allow Ruth to mix and match content, move blocks around and create new blocks when details change or new content is needed. The colour palette decided upon was a softer version of her previous white background site, with Strawberry colour headings to reinforce her brand. The domination page of the site was given a darker feel by effectively reversing the page background and text colours making it more "dom" looking.
So far so good, but then we came to the screen reader requirements! Now I am happy to admit this is not something I knew much about, we had done some basic work of this type on a site for the late and great Laura Lee who some of you may remember was a great activist for escort rights and specialised in disabled clients. Things however have moved on a bit since then, guidance and technology changes and a lot of reading up and a lot of trial and error was needed to finally achieve what was needed. For example we had to create a separate navigation system as the fancy javascript one you are probably seeing was simply invisible to a screen reader, we also had to create defined areas in the code labelled with descriptions, remove "alt text" from images which were being used as screen decorations, and reposition several key elements. To see how the site appears to a screen reader please note the screenshot below, as you can see nothing like the visual treat the usuall visitor gets, however it is now fully usable and optimised for visitors needing this and I am pleased we were able to produce an inclusive experience for everyone, particularly as my own father was totally blind.
The finished result is now live, I feel it is another milestone (along with several other sites we have produced lately) for 69Design not only for the scripting used in the animation, and the flexibility Ruth has in the layout, but also the inclusive element were able to bring to the site. Lastly I would like to thank my partner Mandy for copying across all the blog posts and encouraging me to always do a little bit better and to Ruth for her input and involvement at each stage of the design. Between us all we have produced something I believe we can all be proud of!