So yesterday I talked about the launch of a new website mrbison.com and how we had taken the opportunity to recode it as a responsive web site.
But what does that mean…what is a responsive web site?
Simply put, it is a site that will give the visitor an optimal viewing experience regardless of what device they are using to access it- desktop, laptop, tablet or phone. And as I am all about graphics let me show you in pictures exactly what I mean.
Here is the site on a 24″ desk top monitor
Here it is on an iPad – both portrait and landscape orientation
and here it is on an i Phone
The way the site is coded means it automatically “responds” to what ever device it it viewed from. Here are some of the things that happen
- Automatic adjustment the overall width of the site
- Re sizes all the images – see how the entire width of the header graphic and call to action banner are visible whatever the device
- Adjusts the placements of page elements – on the phone the elements that were displayed horizontally ( the block of text and video) are now displayed vertically
- Optimization of the navigational tool. If viewed on a phone a clunky navigational bar would detract from the site content. Instead the user is presented with a menu button, which, if selected, will display a drop down menu.
You don’t have to view the site on all of these different devices to see this responsive nature in action, simply visit the site and re-size your browser window…getting smaller and smaller as you do.. see how the site changes?
Last week saw the release of a new book by one of our clients, Edward Bison. His book, Mr Bison’s Journal, is a very funny collection of stories and observations and is a laugh out loud read. I was commissioned to not only illustrate each of the stories but also design the book cover. It was a fun project and fingers crossed it will become one of the top humor books of 2012/2013. It would make a great Christmas gift -see it on Amazon as a paperback and Kindle ebook
As part of the launch we updated his website www.mrbison.com moving it from a blogger powered blog, to the all singing and dancing WordPress platform and giving the site a mini design overhaul.
The home page now features a prominent call to action to buy the book and a video clip of a sample chapter. The site navigation was revised to include such as his Facebook fan Page
We also took the opportunity to re-code it as responsive website – I’ll fill you in on the ins and outs of that tomorrow.
As a graphic designer I have designed many things, logos, brochures newspaper ads, business cards, invitations, menus, graphics for t-shirts, 20ft banners that have hung on the side of a building, I could go on and on but I won’t bore you.
There is something however I have never tackled before and that is the design of a book cover, until now.
Here is a sneak peak at the cover of a new book by freelance writer Edward Bison
The book is a funny, light hearted collection of observations and stories geared towards the adult market.
I was also commissioned to illustrate the book , which was another first.
A revamped website will be launched shortly to coincide with the publication.