Design

Graphics, Colors & Fonts: 5/20 points

The graphics are super in-your-face, which isn't always a bad thing. In this case, though, the background pattern is way too intense and distracting. It absolutely detracts from the content of the site which should be the primary focus. As always, I love Century Gothic, but it seems out of place here. Be careful when designing your templates that you don't fall into the very common trap of "I put it there because I liked it." A powerful design needs more than that, it needs a logical reason. Most designers start off with, "I put it there because it needed something. I don't know exactly what, but I knew it when I saw it." Over time, that feeling evolves into a concrete logic: "I put it there because Century Gothic complements the sleekness of the template, the soft muted colors, and subtle graphical accents. I used Century Gothic as an accent font, only in the navigation and headers. Body copy was Arial, because it's a soft, sans-serif font that fits well with the design, but it limits the exposure of Century Gothic and is a bit easier to read."

Basically, when we're starting out with anything artistic, especially when it's something we're creating for ourselves, we go through similar phases. Little kids will wear weird ass outfits and love them, because even if everything all together looks like a tiny, colorful tornado, they love every individual article. I can't wait to see you evolve further as a designer and get to the phase where you find something you love and you save it for the perfect template. It's a gradual realization but it will happen.

The colors in this piece don't really exist. The placeholder image is just a placeholder, so I won't really speak to that (and I'm imagining any sort of art in there – a mix of colors, sepia or black and white, all are fine). But the navigation is this bright cornflower blue that just doesn't fit with a faded background image of black and white diamonds. My suggestion to you is to pick one thing that you absolutely love and create a template around that. Build a template around black and white diamonds. Build a template around Century Gothic.

First Impression: 5/10

Oh, my eyes. The diamond background pattern is huge, and fades out. I imagine this template is what would happen if Harley Quinn and The Joker got in a knife fight and Harley Quinn lost. I'd love to have you explain some of your reasons for choosing the elements that you did and talk to you about them. If you want to add your thoughts in comments, that would be way cool. What jumped out at me right away was the odd alignment of page elements. The top banner and navigation are centered, but the content is fixed width left aligned, which looks very weird on larger resolutions. Even though this is clearly designed for a smaller resolution, the top banner is huge, even on comic pages, which means visitors are going to have to scroll almost an entire screen to get to the content.

I completely understand that because it's a comic site, the banner should be large, and I agree – on the front page. On inside pages when people are looking at content, it should be smaller, if possible. I LOVE the latest comic thumbnail effect, and I think it's a great addition to just about every comic site out there. However, there's virtually nothing to make it stand out. It seems to be floating in a white void, adrift from content and headers. It's far enough down the page to seem like an afterthought, though I'm sure it's not – it's too critical to be.

Composition: 5/10 points

The strange alignment issues, the long banner image that's also 200+ pixels smaller than the content of the page – I'm puzzled by all of this. It's jarring and doesn't feel like it was thoughtfully planned or laid out.

Resolution: 0/5 points

This looks wacky on anything over 1024×768. Strangely, you restrict the top banner to 700 pixels wide, making it smaller than the rest of the page content. I'm curious as to why you did this, perhaps to emphasize the background image? One suggestion for templates that aren't entirely fluid width (but do have centered elements) is to create a container div with a set width, and center that:

#container {width: 974px; margin: 0 auto;}

Originality: 5/5 points

I have never seen anything like this before – you're quite right

Function

W3C Valid HTML and CSS: 20/20 points

Hot dog, congratulations! There were no errors on your part, either in the HTML or the CSS. Well done!

User Interface: 5/10 points

There were a few issues with this – the limited, tough to read navigation that was oddly positions below the giant top banner, the floating latest comic thumbnail, the tough to read/oversized content, it just wasn't where it needed to be to get full points on this one.

Cross-Browser Compatibility: 3/10 points

It's almost a given that something's going to be off in IE6, but this does some wacky stuff in IE6 and IE7.

Load Time: 5/5 points

No funky scripts or jumbo images blocking things up. Full points here.

User Experience: 2/5 points

It's just so tough to look at with that background.

Design

Graphics, Colors & Fonts: 5/20 points

Century Gothic is my hands down favorite font, but I have a feeling you really pulled a lot of inspiration from the very similar "cold" template by whistleonwild, and the font wasn't a deliberate choice for this template, so much as a left over piece of the cold template.

The background patterns are exactly that – repeating patterns, detracting from the intended "gruge" feel. For a proper grunge template, there should be unpredictable elements, more interesting backgrounds (not patterns), that are more photorealistic or unexpected. I recommend seamlesstextures.net for some inspiration.

The top banner looks pixellated, not grunge, and that just seems like lazy graphic design more than anything. The gray looks flat, because it lacks texture or variation – it's all one color for the text. Even the white texture looks like a pattern. Overall, it's too calculated and well aligned to be considered grungy, much less a strong design.

Why so much inconsistency in comment style? I understand one's an author comment and the others are user comments, but the author comment at least looks legitimately grungy, if very seamed on the patterned background. The user comments are too smooth and clean looking – again, this throws the whole template theme into a weird middle-ground. It really looks like you took the whistleonwild template and added some of Pyroman's style in (the intensely rounded corners) and tried to call it grunge, which neither designer's style is.

The first, previous, next and latest buttons (all arrows) are obviously the same image repeated over for each. They are identical, and they actually break, falling onto the next line as a result of the jump box. This just looks sloppy and lazy, I'm afraid. The archive page is just red links on a light gray background, which I shouldn't have to tell you is hard on the eyes.

The devil is really in the details. What makes the cold template great is the subtle elements that support the overall effect. It seems very clean and simple, but there's actually a lot going on. The patterns fade into a solid white or gray, the avatars have a shadow effect, you could even accuse whistleonwild of overusing transparency, but it's so subtle, you can't hold it against her.

First Impression: 5/10

This looks like a very generic template, and it doesn't seem like a lot of time or care was put into creating it. It's called Grungy, but it's too clean to really be grungy. The graphics are used to create an effect, but the whole thing is too neat and tidy to support it. The rounded borders at the left top and bottom corners are weird… it feels too modern/80's style and it completely contradicts the intended grunge effect. They're also really extreme. I personally find tighter, smaller rounded corners to look best. They're subtle, but organic.

Composition: 5/10 points

The design is well centered, but it feels huge, like there's too much dead space being incorporated into it, and the text is a bit too large. The alignment of the text in the news posts is really peculiar, too. It looks like everything's centered, which I'm really not a fan of, it'll make everything look like horrendous poetry.

Resolution: 5/5 points

I know you were concerned about a 920 pixel wide template, but honestly, 800 pixel wide screen resolutions are so under used, it makes little sense to worry about it too much. I make all of my designs around 970 pixels wide to fit neatly on a 1026 or wider screen. If you're concerned about the discrepancy between a 1024 pixel wide screen and much larger, consider building fluid width templates.

Originality: 0/5 points

Eep, unfortunately, even though the graphics and colors have changed, this is a straight rip of whistleonwild's "cold" template.

Function

W3C Valid HTML and CSS: 10/20 points

Unfortunately, your template doesn't validate for HTML or CSS, but the HTML isn't all your fault (fix the illegal character in your css, and you'll be fine for HTML), Smack Jeeves throws in junk that will screw up your validation every time. On the CSS front, though, you can't blame the server.

User Interface: 5/10 points

Oh dear, oh dear, when perusing the archive, it looks like no design really took place there. It's just content in a bordered table on a light gray background. Very difficult to read and navigate. I keep questioning the red on gray decision. It's just awful.

Cross-Browser Compatibility: 5/10 points

No – as you stated before, it works dreadfully in IE6.

Load Time: 5/5 points

The design itself loads fine, but the server its hosted on does not.

User Experience: 3/5 points

There's little to get in the way of the visitor actually using this site, with the exception of the hard to see links. I'm taking two points off for the sideways navigation combined with the font used for those buttons. Tough to read, and you abbreviated archives to "arch." Try not to forget that folks who visit your site may not be in on the overall site lingo, e.g. "Favs +" etc.

Thanks!

1. Bragging rights – If you get a great review, post one of our award buttons on your site.
2. Pro tips on how to improve your design
3. Greater exposure for your designs and website through cutething.net

In addition to reviews, we also provide articles and tutorials for improving your website.

A black and white WordPress theme. By cutething.

This is just some text to fill up the space here. Maybe a description of the text, or a first-impression explanation and score? Hmm.

We'll see

I've also hit that designer wall where I keep doing the same things over and over without solving the actual problem. I know that I'll be dreaming in php tonight, and tomorrow will probably figure it out

A brown and blue Spring WordPress theme.

By cutething.

Blar blar blar. Blarh blarh blarg.

Blar.