Reviewee: Aurora Designs
Site: Aurora DesignsOwner: Ayumi
Start review date: Oct 7, 2007
End review date: Oct 13, 2007
Quick Nav
First impression
I've been to your site before, and to be honest, the current layout is very disturbing. Not only is it fobby, but I've seen people make better layouts on MS Paint than this. Your past layouts were definitely a lot better than this one. The only part of the layout that seems like you put some effort into is the lipstick glitter, even though they're maple leaves.I'm already disapproving your huge and uneffective banner, it's no doubt this review isn't going to be a good one; I do not expect any professionalism in your site.
Design
The images you've used are just wack. I think you should put a lot more effort into this layout if you want it to appeal to more people. The cropped characters should have been extracted instead of just randomly cropping it (you could have made it look like something).Take a look at the space between the girl wearing the pink hat. You see bricks. And you've repeated that image. This just makes things worse if the image itself doesn't have high-quality.
As for the background colours, they don't even match the content area. I see you've used mango, golden yellow, orange, pink, white, black, magenta, and a few other colours in your banner; yet you only have beige, orange, pink, white, and a little red used in the content area. This is very disappointing. I'd say the content area looks a lot more neater than the banner, where you've used too many bold colours you didn't bother to use in the content area.
The bottom of the banner isn't cropped properly either. You've made it look like you just randomly drew a white squiggly border. And it clashes badly with your overall site's look. I know you want to add different artistic aspects, but you don't see much abstract used anywhere on your site anyway, so you should've just made it a rectangular line. It matches your site's format, but also makes it look neater.
And take a look at the navigation area where it's touching the content (the part I've circled on the image on the left).
Then take a look at your navigation links and content font. Compared to them, that area (^) looks way too blurred to me. You should have sharpened it a little. It gives your site an off-balanced look because the navigation and content looks like they've popped out of the crappy background.
Also, as a first-time visitor, the background pattern is just too distractive. You've used hearts in your banner and content header, but in your navigation header and pattern, you've used flowers. I don't see the bond between them, despite their similar colours. The pattern also doesn't match the whole layout. You should have changed the colour tones of the pattern if you wanted to use it so badly to make it look more subtle. A background colour should always be very close in constrast. A 5% contrast is as most as it should get; your pattern's contrast is definitely more than 5%. A 100% contrast would be black against white.
The lip shown near on the top-left corner looks distorted. It doesn't even look like a backwards lip. You should definitely do something about that since the version is "Chu-Lip". I doubt people would know what the meant. But since it's featuring lips in your version, you should incorporate that idea into your layout more. I only see two lips in the whole banner, two flowers and three hearts. You should combine these aspects more carefully.
You should have made your site title capitalized on the banner; since your internet browser title is in uppercase, and so is it on your content, it should follow this trend.
Since the CSS looks very messy on the layout, I suggest making the font all tangerine orange; the background content colour needs to be changed; you need to incorporate more black into the fonts; the headers should change to red; and a ton more could be changed to make your site look more appealing with the banner.
Then of course, the layout image is too focused. Not everyone's into the whole androgynous thing. It may not be their thing, despite it being trendy this month. A more refreshing stock aspect would definitely fulfill this notion.
I've checked your site in IE, Firefox, and in Opera, and it looks fine. But in Firefox, your headers and navigation links are a different font from the IE and Opera one. Make sure you get that straightened.
Now let's take a closer look at your coding.
I see you've made some careless mistakes on your HTML.
You haven't written much in your <HEAD> tags, so I suggest you put some keywords in your site. This way, you'll get more relevant hits. Put the code,
<meta name="keywords" content="KEYWORDS HERE">.<img src="images/main.jpg"/></img> The slash needs to be removed.I see you've repeated
<td height="20"> frequently. You could just use <br> tags. Here, you've added an extra quotation mark:
<table width="475""border="0" cellpadding="0" cellspacing="0">
Here, Layout designed and coded by Ayumi & Ash. Textures from <a href="http://gender.livejournal.com/" target="new"/>Gender</a>, you've again, added an extra slash.I see this,
At the end of the post, that person tags and links to 8 other people and then visits those people�s in your Must Read area in your content. I honestly don't know how that got there, but it should be "people's".Otherwise, I am actually impressed by the way you coded your tables.
When I go to your CSS, I see a number of little errors.
You have a scrollbar code. This is very unprofessional, and doesn't show in Firefox anyway. This also goes for your customized cursor. People may get confused since everyone uses the universal one. So don't add that cursor code in.
table {background-repeat: repeat;
font-family : Arial;
font-size: 12px;
color: #db5173;
text-align: left;
font-weight: normal;
cursor: crosshair;
}
The font weight is normal by default; the text alignment is left by default as well.
.navhead {
background: url(images/navbg1.jpg) repeat-x;
font-size: 18px;
color: #ffffff;
font-family: Lucida Sans;
text-align: left;
font-weight: normal;
padding-right: 0px;
padding-top: 0px;
height: 37px;
}
First you've written text-align:left, then you've written padding-right: 0px. Obviously it's aligned left by default, so there's no point in writing "text-align:left"; the "padding-right: 0px" was pointless because it'd be disputing against the "text-align:left". The header text would be aligned to the right if you didn't write "text-align:left". So just remove all of that stuff I've striked out, and it'll remain the same as it is now.
I'm also assuming that the height you've put is the same height as the header image's height.
Same goes for this:
.header {
background: url(images/headbg.jpg) repeat-x;
font-size: 18px;
color: #e79251;
font-family: Lucida Sans;
text-align:RIGHT;
font-weight: normal;
padding-RIGHT: 42px;
padding-top: 3px;
height: 42px;
}You just forgot to define the width of the content and navigation. This way you don't need to have the "repeat-x".
Also, you've written more junk:
A:link {text-decoration: none; font-weight:normal;color:#9a0d17;}
A:visited {text-decoration: none; font-weight:normal;color:#9a0d17;}
A:active {text-decoration: none; font-weight:normal;color:#9a0d17;}
The only code you need is a {text-decoration: none; font-weight:normal;color:#9a0d17;}.
And even more junk:
a:hover
{color:#c95058;
cursor: crosshair;
font-weight: normal;
}You've already given the "cursor:crosshair" code for your .border and table, so you don't need this. Also, the font weight is normal by default.
I see you've written the same concept for your bold, underline and italic:
b{color:#5f4e58;
font-weight: bolder;
padding-left: 0px;
font-size: 12px;}
You obviously don't need that font-weight value in there, because bold is bold by default. You've written "padding-left 0px" for both your bold, underline and italic. This should be removed because it's nonexistent. You've also written "font-size: 12px" when you know the bolded word is going to be in the content, and you've already specified the size of the content font.
Overall Remarks - There are a few more small errors in your coding, but most of them are related to adding extra values when they're already there by default like your "font-weight" codes.
I am overall pleased with your formatting, but your colours of your CSS could be improved as well as your banner to make it more attractive and effective.
But despite your layout looking putrid, I hope your content will satisfy my standard a little more.
