Review: Ava Rae

July 17, 2007 | Filed under Reviews

Reviewing: Amber of Ava Rae

Alright, so you actually asked for this review (and I told you I’d do it a month ago…). I don’t know why, considering that half the time I just talk out of my arse, but there you go. First thing you should know is that I’m not going to review your articles. Jack did that recently, so there’s really not much point in me reviewing them again because a) I’m lazy, and b) I’m lazy. I will review the “About”, “Site”, etc. pages though, because I’m nice like that. w00t.

Second thing you should know is that I’ve kind of gotten over that stage in my reviewing ‘career’ where I feel the need to cotton wool my opinions with compliments. If I see something wrong, I’m going to point it out, tell you how to fix it, and then move on. No buts, no maybes…etc. It’s a brusque attitude, but heck, it works!

Layout/Coding

A few things you need to note first up:

  1. Your layout is muffin-topping
  2. Footer colour is too light
  3. Photoshop? Anti-aliasing? Yes? No?
  4. Blog meta information isn’t distinguished enough
  5. Accessibility problems when CSS is turned off
  6. Y’all suffer from divitis?

Wow, I’m really being verbose today aren’t I? Anyway, first point: a muffin-topping layout. I think we all know what a muffin top is, yes? (Except for Matthew apparently, so just ignore him for the time being). Now apply the ‘overflow’ effect to layouts, and what do you get? Essentially, it’s the concept of trying to squeeze too much into too small an area. Observe below, Exhibit A:

avarae muffin top screenshot

Umm…padding? Some space? Anything to give the impression that you’re not muffin-topping the header and content in your layout? Basically, the red circled areas show where you could do with some extra padding/space, in order to ‘balance’ the layout and avoid the overflow effect. The sides of your header, the left side of your content div, the top of the content div (where the first heading almost hits the navigation bar), etc. At an utmost minimum, I’d recommend around about 10px padding for all elements – I certainly wouldn’t go above 25px padding.

Second point – footer bar colour is too light. I’ve no idea what type of monitor you use or have access to, but on my high-definition notebook, I have to tilt the screen back almost at a 135 degree angle in order to see that you actually have a light blue background to the distinguish the footer from the content area. Otherwise, the background looks purely white…and considering that the font in the footer is the same as that of the content div, it’s not exactly an ideal situation. Confusing, need better distinguishing of elements, etc. etc. Why not…make the footer font smaller? Or another colour? Or put a border around it? Or imitate the way your header looks to bring unity to the layout?

footer example

Essentially, whichever it is you choose to do, you need to do something so that the footer doesn’t ‘melt’ into the content area.

rough edges in header

Third point – antialiasing in Photoshop/Paint Shop Pro/image editing program of your choice is your friend! If you click on the image that I’ve so kindly provided on your right, you’ll note the areas I’ve circled in a cute pink colour. These are the parts of the letters in your image that have rough edges – images that seem to have fallen foul of the Alias curse. Just ask Jennifer Garner. It’s crazy man!

The beautiful thing is, it’s so very very easy to fix it. Just click the anti-alias option in Photoshop, and select the ‘Smooth’ option. Alternatively, you can always try another font – I did a mockup, and found that 70pt “Euphemia” (it’s a sans-serif font that comes bundled with new Windows installations) at 90% width with “smooth” anti aliasing worked really well. Experiment!

Fourth point – like the footer text, the blog entry meta information needs more ‘effects’ in order to distinguish it better from the content/normal font. The “Date by Author” text, and “Posted in Category | Comments” text needs to look different from the regular text. I’ve been reading a book on blogging by Jonathan Yang (The Rough Guide To Blogging), and it actually suggests that the date and time of a blog entry should be displayed just as prominently (or even more so) then that of the post title. The theory is that new visitors to blogs look immediately for the ‘last updated’ date of the site – and by displaying the last entry date prominently, you’re reassuring them that, yes, you do update frequently, and yes, they really should stick around and keep visiting to read new things you have to say.

The theory makes sense to me, which is why I’ve personally changed my post titles to “Date of Entry: Post Title”. There are other combinations of course that you could look into: “Post Title (on Date Of Entry)”, etc. So, assuming you omit the “Posted by Author” tagline (it’s pretty obvious that all entries are posted by you – it is your blog after all!), it leaves only the “Posted in Category | Comments” text to be altered in some way. You could make it smaller, make it larger, use a border, add a background, use a different font, center it…in large, just do something that differentiates it from regular text.

Likewise, you need to do something with your archives links at the bottom of the page. Is it part of the blog entry at the bottom? No? Then set it apart. Use a line break maybe, or chuck in 30px top margin for that particular paragraph class.

Your source code is actually remarkably bloated. Basically, you use too many div classes, which you don’t actually define in your CSS. For example: <div class="post">, <div class="descr">, <div class="entry">. They are necessarily…how/why? If you remove that from your WordPress post templating, it’ll make your source code just that tad less bloated, and thus your page will load just that tad faster. As they say, every little bit helps.

On the whole though, your coding is fine. It’s merely the semantics that you’re let down by. Ever seen your site with CSS turned off (the way that people using PDAs, screenreaders, etc. will see your site)? Download the WebDev toolbar for Firefox, and then go to “CSS: Disable Styles: All Style”. There are a number of issues, some of which I hope you can see for yourself.

  1. Incorrect header usage (mixing up of h1, h2, etc.)
  2. No “welcome” message
  3. No “skip to content” or “skip to navigation” links
  4. A quote at the bottom of the page which doesn’t make sense

Not to blow my own picky coding horn or anything, but most of these are fairly easy to fix. “Skip to content” and “skip to navigation” links are fairly easy to create (you can see my own source code for an example, simply add “display:none” to that particular CSS class and it won’t appear on the screen with CSS enabled). The quote at the bottom of the page should be formatted with the blockquote tag, with a citation of source (which can be hidden with CSS if you find it’s not easy on the eyes).

If you change your current <div id="header"></div> for <h1 id="header"><span class="hide">Welcome To Ava Rae</span></h1>, and add the following as your CSS:

#header {
background-image: url('/avarae/wp-content/themes/TheApprentice/images/header3.gif');
height: 109px;
width: 760px;
margin: 0;
}

.hide {
display:none;
}

With CSS turned off, it’ll give you a level one header, “Welcome to Ava Rae”. The big cahoona if you like, the header which sums up everything to do with your site. You’ll then need to change all your blog entry titles, and sidebar headers to <h2> level headers. Lucky you use WordPress and only need to edit your templates, otherwise it could have taken you ages if you manually coded a million and one pages!

I’m kind of bored now. Might swing onto the little I’ll review of Content, and wrap this review up. By the way, without having taken a deep look into your Harry Potter theme, you can probably apply most of this semantic stuff to that one too.

Content and Organisation

The one thing that’s blatantly missing is any form of contact information. I don’t know if it’s because of your parents crackdown on your Internet activity or what, but surely even a web form of some sort wouldn’t go amiss? There’s no way of tracing your email address from an email form plugin through WordPress (you choose one…there’s hundreds!), so surely that can’t hurt.

I mean, a month or so ago when you’d changed your email address, I tried sending you an email about this review. It bounced back to me, and it wasn’t until I realised you’d added me on MSN with your new address that I could finally email you about it. Surely it shouldn’t be that hard for someone to get in touch with you?

Anyway. Just wanted to mention that first cause I personally had problems with it. And if someone as 1337 as me had troubles with it…well what about all your other less-1337 visitors? Moving on.

I’m not keen on the “About” part of your sidebar. It’s quick and pithy, I’ll give you that. However, as the sidebar introduction is going to be the first place new visitors look for an explanation of who you are/what the site is, you need to be less obscure, more obvious. More “This is Amber and Ava Rae is my website”, less “psycho HP/Apprentice fan”. The latter makes sense to those who know you fairly well, but it wouldn’t make any sense to those who don’t know you at all. Surely you want to reach a larger audience?

Your “About” page is much better in its current state, when compared to the longer piece you had earlier this year. There are a few things to note though:

The statistics on the “read more about me” page would probably be better suited to the actual “About” page. Its short fast details would allow true blog browsers to quickly learn about you without having to dick around clicking subpage links that are hidden at the bottom of the page. With that said, I think that either “Country: England” or “Nationality: British” can be omitted: if you’re British, you live in Britain; if you live in England, you’re British. Pretty obvious really, so why repeat yourself?

I always forget that you have the same birthday as me. There was someone else as well…Shawna I think. Huzzah for us!

I’m not keen on the lists at the bottom of this page. You can do so much better than boring generic lists – how about some reasoning and explanations to go with them? Why you like them, why they stand out from other TV shows/books/movies, etc. Something that explains why you as a person like them. Also – there are just a few clumsy grammatical errors on this page with missing commas that would make for easier reading, etc. Look into it? Re-read/proofread?

The Site page seems overly bloated. You’re using three or more sentences to say something that could easily be summed up with one short sentence. Take this for example:

Ava Rae was actually suggested by a close friend of mine as – would you believe it? – a joke. However upon hearing the way it rolled off my tongue (a bit like “osteoporosis”, my favourite word) I decided that the name was to be. A bit like when a baby first comes into the world you know instinctively if it fits or not. For me, Ava Rae fits. I quickly Google searched it and as there were no real search returns I decided that there were merits to it. (This is because Jenny informed me that sometimes you can create a site with a stripper name.)

Couldn’t that be better summed up as:

Originally suggested by a friend as a joke, Ava Rae struck the right notes – instinctively, I knew that the fluidity of the name was right for me. When a quick Google search confirmed that I would be the only Ava Rae around (consider the amount of Amber’s out there!), the decision was made.

I mean to be honest, I don’t think many people actually read super-long site pages. What’s really the point? Anyway, if you apply the same concept (shortening and combining sentences) to the rest of the page, you’d be onto a winner.

I’m going to skip Writings and Links. Like I said, Jack already reviewed Writings, and Links is sort of self-explanatory anyway. Though uh…maybe something to format the Links page better? I like the way Nan has two columns – it’s so neatly presented, and prevents extreme scrolling like what you currently have.

Summary

Would you be offended if I said that you’re very much like myself? I’d venture a guess and say that layout and presentation doesn’t matter all that much to you either – for you, blogging, content, words, are your passion. Likely as not, you don’t care much for the aesthetics of a layout – as long as it’s readable and browser-able, you’re content. And that’s fine – I’m much the same myself.

Though if you decide to go down this route, you really have to concentrate on accessibility (hence my concentration on coding and the like in this review). Words make up the bulk attraction of your site, so you need to make it easy for your visitors to read/access what you have to offer. Take care with your coding, markup, semantics, etc. – always view your site with CSS turned off to see what vision-impaired Jaws-using visitors might experience when they visit your blog. If you’re not going to offer images, you’ve lost the graphics community so you need to maximise other potential visitors by ensuring that your site is as accessible as possible.

5 Responses to Review: Ava Rae

  1. “by the age of 30 = by the age of thirty (personal preference, but seeing one odd number out after mountainloads of text is fairly jarring)”

    English teachers of school years past have recommended writing out any number less than 100, so maybe it’s not just personal preference after all.

    Anyway, nice review! I’m going to implement some of these suggestions for my site, too.

    Julianne on July 17, 2007 #

  2. Clearly you and I need to combine forces. :) Good review.

    Jack on July 18, 2007 #

  3. I’ve gotten pass my reviewing phase as well. They’re just too tedious and fatigue my eyes because of all the things that need to be looked at. I commend you for actually committing your time to writing up this long, insightful review. I only read half because I’m lazy as well, but that’s better than nothing right?

    Jennifer on July 18, 2007 #

  4. I no longer review anyone. I used to do it quickly in my mind when I would view a site. Not anymore. It’s just… bah. If your website is your hobby, then I don’t think reviewing should be a part of it. You should do what you like and how you like it. If you get viewers, great. If you don’t, oh well, as long as you love your work because hey, it’s just a hobby!

    Kimmie on July 18, 2007 #

  5. Thanks for the review, Amanda. Now I need to get off my lazy arse and implement the changes.

    Amber on July 19, 2007 #

Trackback URI | Comments RSS

Leave a Reply

I reserve the right to edit or delete your comment as I see fit, though I only delete comments from anonymous commenters, or people with multiple aliases. Using a genuine name/email combination will ensure that your comment is approved.