Bookalicio.us version 2.0: an attempt to design the prettiest book blog on the net

Sunday Jan 24 2010

It's been quiet on this blog for sure. The latest addition to our family surely requires a lot of time. Now that things have settled down a bit I've finally been able to do a full on new website design and implementation. Bookalicio.us is my wife's book review site. She has been running this site for just a little over a year now and she has managed to become one of the more authoritative YA book blogs. She's become a name in the Twitterverse (heck, she's got twice the amount of followers I have), all major publishing houses are aware of her site and many of them work with her and she's an active member of the book blogging community. This is quite an accomplishment for just one year which is why I thought it's time to take her site to the next level. Professional accomplishments demand a professional looking site. While her previous design didn't look all that bad I felt it was somewhat limiting in terms of what can be done with it. Pam's content could use some more space. Space to grow and to accomodate new things.


A fragment of the new Bookalicio.us

Dark Matter Pro: a premium photoblog template.

Affiliate program available

Theme

Bookalicio.us focuses on YA (Young Adult), fantasy and historical fiction. I thought this last category would make a great starting point for the new design. We went with what I'd call a 'retro-Victorian' look based on... a book. I took a photo of an open book and several hours of photoshopping later I had managed to turn this photo in a set of textures suitable for use in a website design. From there it was just a matter of adding atmospheric design elements that together build a mood of a nice evening at the fireplace with a glass of wine and a good book. I added an antique notebook for the tag cloud and recent comments and used an antique bookmark to function as a site footer.

The 'brand'

The old design
The old design

The image used in the header of the site is based on a photo I took last year. This photo has pretty much become the site's 'branding' over the past year. It's used in Pam's twitter avatar, her Moo cards and more. Therefor it was of vital importance to keep this one element from the previous design intact. I reworked the photo a bit to look a bit old and ragged but the 'feel' of the first design was carefully preserved. As a result the new design still feels familiar to visitors even though pretty much everything else has changed.

Sifting through reviews, YUI datatable to the rescue

All sorts of approaches are being used on review blogs to allow visitors to order reviews by title, author/source, rating and more. For this purpose I figured the YUI Datatable would work great. It allows any kind of sorting in one compact view. The result of this implementation can be seen on the authors page. After taking care of allowing people to easily look through all reviews it allowed for a somewhat more frivolous approach on the reviews page.

WordPress custom fields

While I'm not a huge fan of WordPress it has one feature I really love: custom fields. Custom fields allow all sorts of excellent customization without the need for specialized plugins. I used custom fields to add several bits of metadata to each book review on the site: book title, publisher, amount of pages, rating and a book cover thumbnail URL. This information is used in the YUI datatable I mentioned earlier. It's also used on the actual review pages as shown in the screenshot.


WP custom fields in action

Finally, the thumbnail field allows automatic generation of a page such as the reviews page. Excellent! If you're a WordPress user and you haven't looked into custom fields yet you definitely should!

A strict 'no clutter' approach

If there's one thing that's 'wrong' with most book blogs that would fall under the same category as Bookalicio.us it's the amount of clutter. For some reason most book bloggers have a tendency to stuff their site with banners, badges, widgets and other stuff that distracts visitors from what really matters: the actual site content. While the design of Bookalicio.us is rather 'busy', great care has been taken to keep the content area calm and the sidebar free of distracting elements. After all we do want visitors to actually read the content! I'm pretty sure nobody would like to read a book riddled with irrelevant illustrations, notes in the margins and other things that try to catch the readers eye while reading the story.

My best advice to Pam's fellow book bloggers would be: get rid of all the bits and pieces that don't really matter. It will greatly improve the experience for your visitors!

Phew, I finally get some stuff done again!

It's funny, just like my good friend Stoyan predicted to me, a few months down the road after the arrival of my son Elijah I'm starting to get some stuff done again. I designed a full WP theme from scratch and succesfully implemented it in about 2 weeks of evening hours and weekends. Not too bad. I guess this means 'I'm back'. Missed me?

bookmarking

Commentary

Join the discussion! Leave a comment through the comment form below!

Got something to add to this?

Feel free to leave a comment on this site. You can use Textile and Emoticons. Your email address is only used to show a gravatar. Please stay on-topic and use common decency. Spammers will be shot in front of a live studio audience.

If you plan on posting code, use pastebin please and post a URL to the code. The comment processing doesn't deal very well with code. Sorry for the inconvenience.

Human comment spammers: don't bother posting your crap here. Comments are moderated and I won't let any of your shit through.

Remember personal info?
Yes
No

Trackbacks

If you have an interesting related post on your own site you can leave a trackback. As they say: 'a little AJAX a day keeps the spammers away' which is why you'll have to click below to generate a trackback key. The key will be valid for 15 minutes and can be used only once.

 

  • Featured Links
RockySomewhere near the Orion NebulaBookalicio.usGolden Gate BridgeThames River BankJackie and mePimpin' it