My Beauty Blog has 1 Review
Below are the reviews left by other members on My Beauty Blog. Jump to review form?
amphigory gave it
on 17th Dec 2010 and said:As I'm not much of a makeup enthusiast, I certainly won't be commenting on the quality of content, but I can touch on design & coding.
1. FIRST IMPRESSION
There's a lot of unused open space, which is leading me to believe there are many advertisements. Using a netbook, I need to have AdBlock Plus or the majority of websites I visit end up slowing my computer down to a crawl. That said, it only bothers me when websites don't offer a fallback for advertisements that don't display, i.e., an automatic height for their container.
2. THE DESIGN
a. colors
Wow! Bright. Very bright. As I look through a few of your posts, I notice that it's hard to read the category & related posts links. Cyan is one color that I typically vow to avoid, especially on white.
Coupled with the wording on your "About" page (mentioning that you studied art until 16 but gave no indication otherwise to your current age), your choice of colors makes me think this is targeted towards a very young audience. If that was your intention, well done, but I do think you'd get a better response to your blog if you focus more towards users in their 20s, especially because you're in that age group yourself (yes, I know you who are!)
b. structure
It's awkward, to say the least. Parts of your site that I wouldn't expect to be indented are indented. Those I'm speaking of: your navigation & sidebar headings. If you must indent, keep it limited to paragraphs. It just looks weird when it's applied to content that's supposed to be quick and sweet.
There's some weird padding & margin here and there. On your "Gallery" pages it's most noticeable. Images are moved further in than the "rating" button (probably inclusive with indenting). You have a fairly wide layout, so it actually might be better to use a larger padding overall. Right now it looks like a tiny 5-pixel padding in your content area, and that makes it feel extremely cramped. Your images and lists have the right idea on the margin size.
Text alignment is also sticking out to me, not in a good way. I see all four available: left, right, centered & justified. Stick to two at most and it could really ease up the tension that's seeming to hover over everything. Centering & justification are the two I'd stay away from; the right-aligned article headings are nice (though I'm not a huge fan of the execution; see typography).
c. typography
One of my favorite aspects of design, and the one I always have trouble with and spend hours trying to perfect it. Yours needs some work, mostly in size & position.
Before going into those two, I should mention: limit the number of font families. I count four different families (one is part of what looks like a WP plugin, but it should still have a say in your site), and that "western" slab font is one that really has no place anywhere. If anything, it's distracting enough to make me focus on only words written with that font, rather than the actual content of the page.
As for those headings I mentioned, I have two issues. The first is the tangent dotted underline. I'd suggest either increasing or decreasing the margin under your article headings (or the line height) to bring the underline off of the letter decenders (g, j, p, q, etc.) It's a minor note, but spotting tangents and removing them makes a huge difference. The second is related to category/archive pages. The "Archive for such and such" heading is the same size as the article headings, which just looks weird to me. As it's not as important to tell a user where they are, I'd suggest reducing the size of those headings to bring more prominence to the article headings (why they're there).
Moving on, the list of links on your side bar & the meta data (post in, comments) on your archive pages both need to have their font sizes reconsidered. The first needs to be significantly increased, as I'm having a hard time reading them. The second needs to be decreased, as it's too prominent. Visitors (myself at least) would probably prefer seeing when a post was made rather than where a post was made. The number of comments is important though, as it tells passers-by how active the site is. It might be better if you combine the post date with the number of comments in a way that grabs the user's attention to let them know, "hey, this place is jumpin'." When they see that articles are being posted often and people are commenting on them, they'll be more inclined to join the discussion (the rich get richer). Granted, it's hard to use that as a sort of viral marketing when you don't post often and have few comments, but it's a step in the right direction and will help you when (if) you post more and get a bigger user base.
Oi, it's not just the links. It's also lists. That tiny, uppercase ordeal needs to vanish. Those "10 tips" lists could be good, but as of right now they're more likely to make a visitor vanish. Sure, I'd love to have a big night out! Argh, I wonder how, because I can't read it. The caps makes me feel like you're shouting at me, and I'd rather not be shouted at to paint my nails in the morning.
d. navigation
Confusion, again. It feels more like you're catering to the people who pay you money, rather than the people who are going to make people want to pay you money. I'm talking about the unmistakable "Advertising & Press" link that's one of the first things people see upon visiting your site. In fact, I'd probably move your top navigation to the sidebar and the sidebar navigation to the top, in the form of a drop-down menu. You have few enough parent categories (sort of, you may not want some of them on top) that you can put them in the more prominent navigation without forcing users to think about too much. Having them in a drop-down menu will also remove some of the clutter.
e. general suggestions
I'm noting on the teaser thumbnails at the top of your site. The "most recent video" is the one that sticks out to me. As it's the actual video, it could be difficult for the user. Firstly, it's too small to get any use out of it. Secondly, there's no link to the article that contains that video. Perhaps it would be better to use a thumbnail image for the video that links to the post with it.
The other note is cramping. There seems to be an overwhelming amount of links in your sidebar, and too much text on the main blog. The articles in your main blog, archives, etc., is enough to make a visitor feel like that's the entire article. Ergo, once they read the text on that page, they continue on with what they were doing, rather than visiting the post's page itself and following up with a comment (and it doesn't help that the "read more" link is cyan-on-white). I'd suggest even using only a thumbnail of one of the images or videos that are in your post. That way, the users sees there's an image but can't see enough of it to think that's all there is to it.
f. design conclusion
I'd say your biggest focus should be on typography. It's a very underrated aspect of design, but one that's most important. Excellent text structure will subliminally keep a user engaged. Because of the way it's formed right now, it's making everything feel almost like it's slapped on just to be there, causing the site to be cramped.
3. THE CODING
a. margins & padding
I covered some of this in the design, but I feel I should offer some solutions to weird margins in the coding section.
There's one big thing that I noticed with images, and one that I've always ended up falling into in the past. I'm not sure if it bothers anyone other than me, but it's one of my nit-picking pet peeves. The very first post on your site (at the time of this writing) has an image with text wrapping underneath it. Without looking at your style sheet, I assume you have an equal margin around the image, but the combination of font size & line height is messing up that equal margin and causing an extra-big bottom margin. Since you're using WP, you can tweak your ".alignleft" and ".alignright" classes. Since you have a natural line-height, it's going to cause problems when text wraps under an image. For both of those classes, I'd suggest removing the bottom margin:
.alignleft { float:left; margin:0 10px 0 0; }
.alignright { float:right; margin:0 0 0 10px; }b. line height
This has it's own section mostly because of the little emoticons. I notice it on a vast majority of sites with emoticons, and it's become something that gets to me. When an emoticon is on anything but the first line, it ends up moving the entire line downward, causing some weird appearances. To fix it, make sure your emoticons' heights are equal to or less than the line height, and give them a middle-aligned position:
.wp-smiley { vertical-align:middle; }By default, vertical-align is set to "baseline" which is the bottom of the overshoot of a letter (the bottom of e, a, b, etc., not the bottom of letters with a decender). If you have a line height of 16 pixels and your emoticons are 16 pixels high, they end up pushing your text down 4 extra pixels. Extra annoying.
c. coding conclusion
I don't have much to say on coding as it's not a very important aspect of your site. Tweak the two bits I mentioned above, though, and it'll be generally perfect.
3. FINAL THOUGHTS
As I'm finishing this off, I feel like I may have muddled a bunch of stuff together in an incoherent fashion. If I'm not clear on any part, let me know and I'll reword it. Kinda tired at the moment.
I've already mentioned you have a far more inclusive knowledge of the self-beautification industry than I do, so I'm assuming that the content on your site is up to par. What I do think otherwise, though, is that the site's design needs some tweaks here and there. Having a stand-out design that focuses on your audience can do wonders to keep a visitor's attention without them realizing it. The more interactive (in a way that doesn't impose on fluidity, e.g., not using an overwhelming amount of Flash & JavaScript) the site is, the more a visitor will be willing to participate in it. The "beauty blog" niche is growing quickly, and if you want to have a significantly active site, you have to be better than the others. Of course, your site in its current state is better than most others, but I still think it could use some improvements to keep the attention of people like me who wig out about simple things like tangents.
The design is really the only qualm I have. Your writing is coherent and interesting enough so that while I may not be interested in the topic now, having a stand-out design could bring me back and change that position. Write more!
UPDATED 17 Dec 10:
Absolutely nothing wrong with learning from tutorials!
I was about to list off a couple tutorials/galleries on typography & illustrative web design, but then I went back to your site. Enormous improvement; excellent job! You even went the extra step with @font-face :) I'd bump it to 4 stars, but I'm leaving it at 3 for archival purposes.
A couple more ideas:
- When you're using files in a theme's style sheet, you don't need to use the full URL. For example, instead of
url('http://mybeautyblog.co.uk/wp-content/themes/mac-lipstick/images/leftbg.jpg'), you can useurl('images/leftbg.jpg'). If you need to use a file from another theme, go up a directory:url('../jump/images/bqbg.png'). It's not much, but it saves a few bytes of bandwidth which helps in the long run.- For bonus points, get @font-face to work for those lame Internet Explorer users. IE has supported it since IE5.5 (yeah, wow, right?), but only in the proprietary .eot format. Here's a nice article on attempting to get it to work: @font-face in IE: Making Web Fonts Work. I say "attempting," because I have never been able get Microsoft's WEFT work for me. Last I tried was some time last year, and it gave me some nasty errors. Doesn't hurt to give it a whirl, though.
(Off-topic: I never forgot about our arrangement. As you put it so brilliantly, life's hectic. I'm trying desperately to get my current project finished, but I'll get around to you eventually, if you still want it!)
Using Firefox on Windows | Report This?
Riseykins's Response:
Elia! :) ♥
Thank you SO much for such a detailed review, mostly picking out what sucks in my site.
I have given a lot of thought to what you said and agree with you on it all. I'm really crap at designing, that's for sure. I am also glad you gave me a solution to my padding issue on the images because that was bothering me too. I hadn't fixed it because the code I'd use to align the images was just the default code that Wordpress offers, and I'd not bothered to mess with it at all. I definitely appreciate that.
I also agree that the design probably wouldn't appeal to the demographic that the blog is for. I realised that as soon as I'd made the new template live. But nonetheless, I decided to keep it for a short while.
I've since made a new template, which is actually heavily based on a tutorial I found online. Yes, totally cheating but I've decided that if I want to be able to shine when it comes to creating websites, I need to think about things a bit more. What better way to learn to think in a different way than to learn from others? I'll be following more tutorials in the future in order to gain more experience and learn new techniques.
Thanks! :)
Write Your Own Review
Leave your feedback for My Beauty Blog below, and remember - the longer your review, the more points you receive. Don't forget to look at things like style/design, content, coding and originality as they will all help to improve the quality of your review.
You have to be logged in to write a review.