Adriana of Breakthrough Designs‘ review.

Presentation:
Since you took the time to make four skins, I’ll take the time to review them! But before I do, might I suggest fixing your font size?! It’s really hard to read, actually everything on your site is hard to read… work on making your page a lot more user-friendly!

Version 8, Heroe: Your color scheme is so monochromatic and boring! In attempts to make a pleasing layout, you took no risk with the colors and ended up with something so… blue! I think that for the shade of blue you’ve chosen, an equally bright green or yellow would suit the layout as contrasting colors. Or, if you wanted to tone the look down, I’ve always loved the way blue and brown go together. Also, the white song lyrics on top of a cyan blue are illegible, especially on the right side. I would add a black or dark blue drop shadow to these lyrics so they’re more visible.

As for the welcome paragraph, the white isn’t visible on top of the busy print background. I also don’t understand why you placed the welcome box so far below the site title. I’m also lost as to why you have two different navigations: one above the site title and one on the side bar. Not only can this get confusing and messy, but it’s a really amateur mistake! I would stick to keeping the sidebar navigation because I like how you added in all of the sub-navigation as well. I’m also not a fan of your background as a whole–the stripes make it seem like you pulled a linestretch background and I’m not fond of linestretches. I think it would be a lot more attractive if you boxed the content carefully, especially by “closing the box off” with a proper footer. Speaking of the footer, why is it so far below the end of your content? I would fix this problem immediately, there’s no reason for all of that blank space! All in all, I really dislike this skin.

Version 10, It’s My Life: The color scheme on this layout is a lot more toned down than the previous one. I like how you balanced the reds and the neutral colors, it really makes for an eye-pleasing design! I was a bit off-put on how much decor is surrounding your site’s title on this layout: it’s so cluttered and hard to read. I don’t like the “main guy” popping out on the right hand side, I think this layout would be much prettier with the scenes behind him: I like your brush use here. Towards the top of the image, I noticed some text. It’s very washed out and damn impossible to read! Why adorn a layout with text that no one can enjoy? Also, because of the color shift on your secondary site navigation (the image map below your site title), the headings of each section are really hard to read, especially “Guild.” I think this skin would look much nicer with backgrounds on your content. Try adding in a darker tan to differentiate content from background. Lastly, the text in your footer should contrast the background color a bit more.

Version 11, reLiVe: My favorite color is green and you murdered it! To be blunt, this page, especially the print at the top, looks like minty vomit. Not only is it way too busy, but much like your Version 8, there’s basically no color contrast. The scribbly font you used throughout the header is the wrong color for that background and a really illegible font to boot. I think a recurring theme in your layouts is your love of illegible fonts and poor contrast. The neon border you have around the main guy is in poor taste. I think a simple 2-4px black border would make him “pop” from the background more. Speaking of the background, get rid of it! The prints contrast each other horribly, both in design and color. Try muting it a lot so that your site doesn’t look so busy and amateur. It might also be a good idea to make your site’s title text larger, as that should really be the centerpiece of the layout. Lastly, why the hell did you use pink in your navigation headers? It’s ghastly! Generally, pulling colors out from your existing layout looks much better than merely finding the opposite color and using that for the a:link. The one thing I do like about this layout is the fact that the navigation is a bit dynamic–on the sidebar I mean. I like that you can hide and show the subnavigation so easily… very functional!

Version 12, Aki So Nora: This layout is way too bright. I don’t like how you kept using the burn and screen effects, they didn’t work to your advantage. As if that weren’t bad enough, you decided to use bits of your layout as headers and dividers! Don’t go there! If I were you, I’d stick to solid colors that aren’t blinding. Also, try to make the version name and number a bit less hidden–take whatever effect you have on them (screen, darken, etc.) and remove it so we can read properly. Do the same to your image-mapped navigation under the site title. The worst part of this entire layout is the gross looking red fuzzy background you used for the subnavigation. Everything you put on top of that “print,” especially white text will be illegible!! This is probably my least favorite of your skins just because it’s so… bright. I am all for vibrantly colored layouts, but I don’t like the colors you implemented into this page.

Content:
Main Site: I like how in your Terms of Service you attempt to give credit where credit is due in terms of the pictures you “borrowed” from their copyrighted owners. Just to let you know, even if the images you take aren’t being profited off of, they are still technically copyright violations. Also, the most repetitive phrase, or variation thereof, that was basically the centerpiece for all of the millions of sections on your TOS page was: “Don’t steal or redistribute! Give credit!” We get the point. In fact, you probably could have condensed that entire page’s content to those previous two sentences. Try doing that.

I like how in your “Affiliates” page you go into detail about all of your affiliates and put in a nice word for them, that’s a pretty unique addition. Notice how in my browser (Firefox in OSX) the text is nearly illegible, falls off of the “box” and obscures the button? This is a sign of poor coding and no cross-browser compatibility. Please fix this, it was impossible to check all of your affiliate links because I was unable to click on half of the buttons! I also am in the dark as to why on earth you would link “departed affiliates.” What use is it to me to stare at a closed site? When I looked at your “Contact” page, I was first offended by your marquee–who uses those anymore? You misspelled “Affiliation” in the marquee, by the way. Also, if the affiliation is closed, why keep up the rules about applying to become one? One of my pet peeves is centered lists… please left align (un)ordered lists, for everyone’s sake! Also, the background print you chose for the “comments” field clashes with your background print–get rid of it. It also obscures text when you type into it… it’s just really tacky looking. When looking at your “Credits” page, I couldn’t help but cringe at the centered links, yet again! It looks so unprofessional and tacky like that! The following pages didn’t load: “Count Click” (Scripts), “Anime Share” (Brushes), “Painted Passion” (Brushes), “Moargh” (Brushes), “Nonvederi Designs” (Brushes), “Ancient Secret” (Brushes), “Avatar Spirit” (Screencaps), “Distant Horizon” (Screencaps), “Firebender” (Screencaps), “Anime Share” (Website Resources), “Soundless Words” (Website Resources), “Font Freak” (Fonts), “Teextures” (Textures), “Yinyang Graphics” (Inspiration), & “Avatars-Hangout” (Inspiration). In your “Link In” page, I thought that you had a nice mixture of colors in your buttons. They would be even nicer if your site title were legible! The most important part of a plug button is that your site title is visible and memorable, all of your buttons lack both. Try straying away from animation and maybe just putting in a dropshadow so that the text is visible? The “Past Layouts” page is pretty self-explanatory and well written. Your “About” page led to a 404 error.

Designs: Your site has an overwhelming abundance of free layouts for download. While I definitely think it’s great to have such a wide selection available for your visitors, be mindful to not sacrifice quantity for quality. When I clicked the “Div” link in the designs submenu, I was forwarded to a 404 error page. I think it’s a bit off-putting to only have a shoddy screenshot of the free layout–usually sites have a workable “test” page with the layout fully functional that people can preview on. I can’t really comment on all of your “Table” layouts cumulatively, however I think that they’re all in danger of being too monochromatic and boring. You kept with the “cool” colors (blue, green, etc.) and kept to the two column layout. I wasn’t especially impressed with this selection of graphics, however I think it’s awesome that you took the time to make all of them. I wish I could look at workable previews of these pages so I could comment on how they are coded, but alas. In your “Its Personal” layout, I think the tan and green simply don’t go together. I do happen to love the shade of tan you chose, I think a little more “toned” down green would suit the layout better, perhaps a darker khaki or even a baby green; try to stray away from “prints” like the one you have, it makes it too bright and the colors clash. I don’t like how when you click on “Tables” in the sub-menu, the sub-menu disappears from the top of the page. Try keeping this consistent please. I think the first layout available on the i-frames section is really nicely put together–the colors blend well and it’s very professional looking. However, the second one doesn’t work for me. I don’t like how you have such a dark background with a lightened-opacity front graphic. It makes it look like you got a poor quality, dull image. I think the black is meant to provide a sharp contrast between your main character and the background–don’t try to blend them together, it doesn’t work.

In your “Neopets Layouts” section, the “Version: Katara” images didn’t load. You also have “The Avatar’s” 100×100 guild image under the “Fiery Fury” layout–it’s a mistake I assume? I noticed on some of your shop layouts, you often use a really dull-light gradient effect. It doesn’t compliment the layouts at all, but simply washes them out. I also noticed that you used a couple of textures from other graphic sites (e.g. “Irreplaceable” uses one from Tre-exture, I think) and didn’t bother to credit them in the layout itself–if your visitors use them they could unknowingly be accused of stealing graphics. “Striking Back” in your Userlookup layouts is probably the best example of tasteful contrast. It’s one of the few site layouts you have available that isn’t monochromatic–it looks so much nicer than the others! Don’t be afraid to experiment with colors, light blue goes with dark blue, but it’s much more interesting to try brown or yellow! I don’t know why you have “Gallery Layouts” as a page if it’s just “coming soon”, that really bugs me. Your “Myspace Contact Boxes” 404′d. You also have way too many avatars, try categorizing them so people can handle going through them better. It might also be a good idea to weed out the avatars you were less impressed with. Your wallpapers have a nice play of colors, the only one that really struck me as unattractive was the “Lady Katara” one¹. The way you have your sigs page set up with the table is really unflattering. Try doing the same thing that you did on all of your other pages here–it will look a lot more streamlined and less amateur. I think your “Textures” are the best done textures I have seen in a while, I wish you made more of them!! The only problem was that my screen is apparently too small for the un-thumbnail versions (1280×800) so I was unable to close the texture and had to hit the back button.

Avatar Basic Info: Ick. I start off this section with a horrible first impression: your about page isn’t written by you and you didn’t credit the author. Firstly, never preface anything with “I will write my own version soon!” Secondly, always credit your sources!! It’s really absurd to admit you stole the summary from someone else and even more absurd to not credit them. So please, impress people by writing your own summary. Your “Characters” page is also woefully absent, making 2/3 of this entire section utterly useless. I don’t get the point of having categorized icon bases if you only have split them up into two categories–you could probably consolidate them and it would be just as well.

Interactive: Your “Shipping” page is all out of sorts. Firstly, you don’t adequately explain what makes this page interactive, or what the purpose of the banners are. Secondly, and probably most importantly, your page is miscoded and shows up funky in my browser–the form overlaps on your images and isn’t Firefox-friendly (as depicted to the left). Besides this, having so many prints is really confusing and loud, you might really want to address this in the designs aspect of your site. As for the “Music Videos,” I’ve never seen a more egregious violation of copyright. Aside from all of the images and designs on your site being the art of someone else, you’ve gone and posted whole videos that you didn’t produce! I think that you should remove this section of your site immediately, especially since such large file sizes can be annoying to load for dial-up users. In the “Avatar Guilds,” page, since all of the links are external and going to Neopets, you might want to specify that in the introduction. I don’t know that this page is even strong enough in content to be alone, perhaps you should put it in your “Links” page? I don’t know why your “Link Exchange” page is in your “Interactive” section as it’s probably more suited in a site section. As for the links themselves, “Harlequinade,” “Chrome Anime,” and “Kyuusho Enzeru,” have either moved or no longer exist. Keep this page as updated as possible. In your “Requests” page, you misspelled “Openings,” (you gave it two n’s instead of just one), and since it’s closed you should remove the page altogether. No need to have an unnecessary something just sitting there… The “I Glomped” page is a bit confusing, is the image you have up for someone who submitted? If so, you should specify.

Family/Affiliates: I noticed all of your links open in a new window. Not only is this against the W3C standards, but it is also really annoying to people who don’t have tabbed browsing. You should keep them opening in the same window, most browsers have the option of giving the visitor the ability to right-click and choose whether or not to open it in a new tab, window, or in the same window. That being said, a cursory look-through of your links indicates that they’re all intact. Thanks for keeping them updated.

Coding:
Just from all of the consistencies in the look of your site, I can tell your coding is going to be a mess. Let’s dive deeper, yes? The first major error is your doctype is missing, you haven’t specified (according to W3C standards) what type of coding you wish to implement throughout your site… HTML 4.0.1? XHTML 1.0? Strict? Transitional? This article at W3C explains why it’s important to have a doctype, and links articles to help you choose the right one for you. Also, I noticed in your doctype you have a stylesheet correctly included in your document, however the ids you defined in a separate code , #popitmenu, can be defined in the actual .css file.

Also, your ImageReady slices aren’t correctly coded:

<table width=848 border=0 cellpadding=0 cellspacing=0 align=left>

Be sure and add quotes around values and give values other than zero a measurement. It should be:

<table width="848px" border="0" cellpadding="0" cellspacing="0" align="left">

But an even easier way to go about it is define an id in your style.css document like so:

#layout {
width : 848px;
border : 0;
cellpadding : 0;
cellspacing : 0;
align : left;
}

And change your code to:

<table id="layout">

Isn’t that much neater? Separating stylistic elements from content greatly reduces the amount of code in your index page. It will allow you to catch errors easily and will make layout changes a lot more smooth. I suggest you make w3.org your new bible and get your coding validated. I’m sure all of your errors will disappear (you have 47 of them according to the W3C validator results).

Rating:
Your site’s layout isn’t really compatible in my browser, half of your content is missing, and your coding isn’t really up to standards. I think you have a lot of room to grow and with some hard work you can fix your site up. Hopefully in a few days with some minor adjustments you’ll notice improvement. Good luck and it was a pleasure.

1. Lady Katara hasn’t been particularly represented in a flattering manner at all on your site [↩]

This entry was posted on Saturday, October 6th, 2007 at 11:02 am and is filed under Reviews Brianna. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.