Case study 4: Sara Ayad
A small brochure site & Wordpress blog for a freelance picture researcher. Designed using HTML5/CSS3 to repurpose the layout for smartphones, tablets & desktop devices.
Overview
I designed Sara's original brochure site a few years ago and it had served her well but a fresh look was in order and the layout desperately needed freeing from its table-based HTML/CSS.
Due to the specialised nature of the industry and Sara's reputation, most of her work comes through recommendation and word of mouth, so SEO wasn't top priority.
Adding content wasn't a priority but Sara wanted a blog to add news, updates or any articles of interest to her profession.
Solution
Looking through the stats revealed that most visitors to the site used a Mac and/or modern browsers. This gave me the opportunity to use HMTL5/CSS3 and try out a responsive design (repurpose the layout for smartphones, tablets & desktop devices).
A large background image was used to give a 'pictorial' feel to the site and the next step is to add a different background image for each page. One cool feature of CSS3 is the ability to add multiple backgrounds. A noise effect was added as a separate tiled background over the main background, which almost halved the download size of the image.
Wordpress was used for the blog, however, the main site was constructed in static HTML to allow more flexibility within the individual page designs.
The website is now live barring a few tweaks. The blog is also live but still in the process of styling the theme to match the main site.
Logo Design
The logo uses Frances Uncial, a lino-cut font I designed at letraset.