toddseal.com Review

[tsguitar2004]

I think I'm ready for a review.

http://www.toddseal.com/

Do your worst. I'll forgive you later. Maybe much later, but later.
-ts

[Jalenack]

ooo...a chance for revenge ;)

Well its pretty damn good if you ask me.
Here are some things I might consider changing:
making the top of the notepad look a little bit more like a note pad.
your little slogan at the top is a little dull, but hey ...you're the english teacher and i'm just a freshman :-)
The titles on each page don't do much for me - maybe you could fiddle with them a little bit - they just don't connect with your content like they could.
Sidenote - it kinda punishes those of us with huge screens ... but i guess its fine
Resizing the text works except for the navigation which gets completely thrown off...

Stuff I like:

Colors - very well done

Paper rendering - looks like actual paper without using too much bandwidth on texture images

Renders exactly the same on all my mac browsers (IE, Opera, Safari, Netscape, and Firefox)

Good overall design value

Hope this helps :)

Cruising your site a bit - noticed typo on your portfolio when your talking about your own site- it says dealine instead of deadline :D

[tsguitar2004]

Top of the notepad: I have a few other images that show more paper ripped off the top. I just changed it, so have a look.

Slogan at the top: I'm trying to be blunt up there. I'm not a marketing expert, though, so I take your point.

Page titles: see above (you're talking about the little slogan headers for each page, right? those don't connect for you? darn...)

Punishing wide screens: I want to move away from the centered look that so many sites have. If I were to design this to be gumby-ish and stretch, that would compromise the overall design. So the left alignment is something I opted for. By punishing you mean giving you so much colored screen with nothing on it, right?

Resizing the nav: I could give the nav the same treatment that I gave the center content in order to make it work, but it seems a lot of work for not that much return. Thanks for pointing it out, though.

Stuff you like: Thanks. I'm stoked that it renders the same all over. It's looking identical in IE, NS, and Opera on a pc, so it's rendering well and I'm happy about that. As a side note, all of those pieces of paper are real pieces of paper that I took a photo of or scanned in. That note pad was on my friend's desk for a few weeks. I Photoshop'd out the "Mead" across the top. The nav paper was originally a blue piece of paper a kid gave me as a late pass.
-ts

P.S. Fixed the typo. It's bound to happen. Think of all the words I spelled correctly!

[AaronW]

The titles are backwards... You have the blurby thing in <h3> and the actual concise title in <h4> elements afterwards... Were it my site, I'd have the site title in <h1>, page/nav title in <h2>, and your blurby thing in merely a <div class="blurb">.

Another quick thing: Your titles, like "Portfolio", could stand a wee bit more padding. If only on the bottom. The baseline is like right on the edge of the paper strip thing. Bugs me.

Other than that, good stuff I think :)

[tsguitar2004]

Good point, Aaron, about the header tags. I'll look into that in the morning.

As for the page title, I took one pixel off the top padding. Does that sit any better with you. I may have to get into photoshop and make that image a bit taller, which is what I might have to do with the navigation hover image, too.
-ts

P.S. Aaron, I thought of putting in greeking for the "about" page, but decided that you beat me to it!

[Jalenack]

yah it was pretty obvious that you were staying away from centering your site...i was just throwing it out there that the huge chunk of olive that was blank was the first thing i noticed till i resized...but honestly i wouldn't worry about it too much - it doesn't detract from the design value...

actually for the page titles i was thinking the little words with paper-like backgrounds such as "manifesto" and "portfolio" - Overall I like what you're saying in them and in the little slogans...those are all good...i just think they're presented a little randomly...

oo just reloaded - the notepad top is improving..everything could pop out from the page a little more and it would still work great...maybe give it more 3d treatment like you did at the bottom of the pad..im sure it would be tricky to make tho...

good work
P.S.yay now im a CF regular
P.P.S. ts do you have AIM or any sort of IM..might make it easier to chat things out :)

[mindlessLemming]

Tasty pixel pushing :thumbsup:

Now I've stroked your ego, here comes the critique... :p

It's a little over-jpg'd for me, but that's the old bandwidth/quality trade off and I'm sure you've already sweated over it laboriously. One thing that really deserves more bandwidth is the logo; currently it is too mangled by the wonders of compression, which lessens the perceived quality of your branding and therefore your services as a professional.

I found the content text unappealling because it is to confined and blocky. Adding this lets the eye relax more while scanning
#content p {line-height:1.6;}


I think the tag lines (h3) should be capitalised, if not capitalised and quoted.
Try adding the following changes and see if you like the effect.

#slogan1
{
color: #330;
margin: 0px;
padding: 0px;
text-transform:capitalize;
}

#slogan2
{
color: #663;
text-align:right;
margin:10px;
padding: 0px;
text-transform:capitalize
}

I would not capitalise every leading character like the CSS property does, but it's a good way to get an idea of what it would look like.

The menu container should be a three-parter like your content and wrapper... someone was feeling lazy, perhaps? ;):D

Other than that, you just need something to break up the text in the content (an image? screenshot of a featured piece of work?) and you'll have a fine site :)

[tsguitar2004]

Ok, ok, I'll take care of the navigation. Sheesh...
Yep;just lazy. That and the fact that the paper is tilted throws me for how to make it a three part container.

The site title isn't mangled by compression; I was going after a crumpled look to match the paper. But mayhap that doesn't come across.

Yeah, screen shot of latest project would be nice. I actually like the portfolio page the best because of the images. That's another thing I was waiting to hear, Andrew. What about a link to my latest piece of writing (a hidden menu item right now)? I could make some kind of image to display something about it. Right now, I'm trying to put together a quick "how-to" for making alternating color rows in PHP. A screen shot of that would work...

Capitalization...I like the lower case and it's a subtle part of what I've done on the site. I tried the capitalization and didn't like it. And they aren't quotations, so the quotation marks make them look like they are simply unattributed, plagarized quotes. Maybe I'll just make the first letter a bit bigger font size? Hrm...

Much inspiration from your site, Mindless, but I hope that doesn't show. I love your spiral notebook paper edges!
-ts

[tsguitar2004]

Jalenack, welcome to the land of regulars. You'll be here for a while.

Anyhow, what do you mean by presented randomly? Are you thinking that you should see "portfolio" BEFORE you read my two little slogan things?

Reload and look at the top again. That's as far down as I created an image for.

And no IM for me.
-ts

[mindlessLemming]

Ok, ok, I'll take care of the navigation. Sheesh...
I started writting my reply before the nav had been mentioned ;)


The site title isn't mangled by compression; I was going after a crumpled look to match the paper.
The site title is mangled by compression. The jaggy, random fuzz directly surrounding each letter is caused by a jpeg which is of too low quality. You've achieved your crumpled look well, that wasn't what I was inferring.

What about a link to my latest piece of writing
"Featured Article" always works well, plus it gives a good impression to potential clients.

Much inspiration from your site, Mindless, but I hope that doesn't show. I love your spiral notebook paper edges!

Hehe, thanks Todd :o I felt a little dejavu when I saw the paper w/ masking tape navigation... I think I might copy that for my sidebar :p
Just between you and me, everything I used is real, as real objects are an easier starting point -- the paper is from a sketch pad that doubles as my mouse mat. I scrunched the paper, soaked it in weak coffee, dried it flat, scrunched it again and tore the edges before scanning it. The masking tape is real, but has been heavily photoshopped. The sidebar started life as a polaroid and all the wood was from one plank of a polished floor that I photographed...

Oh damn, I just told you all my secrets! :eek:

[tsguitar2004]

Now that I have your secrets, Andrew, the world is mine!! <insert maniacal laughter here> Wait, no it isn't.

Ok, now then, I'll look closer at the source image for the top and see what I can do to clean it up a bit.

Ooooo! I tried *really* hard to make that tape that holds the nav paper different from yours, hence why I went for scotch tape as opposed to masking. I also tried to dirty up the tape a bit more. So you just had a slight tinge of deja vu, right? Not an overwhelming sensation? Just the vaguest tingle...

Actually, the hover effect is supposed to be like a highlighter pen. Maybe I need to lighten that image up a bit.

[Jalenack]

hey - can't quite seem to pinpoint what's bothering me about your slogans/titles - maybe try doing a bit of what Andrew suggested with quotes and capitals and stuff - I know thats what a lot of people do for their slogans on their sites. And you're also trying (and succeeding) to make your site different..

I think i liked your last notepad top a little more - just go one up...it would be really nifty if you posted the links to the different tops and we could compare them hehe...

sidenote-wow I never woulda guessed all that stuff on leftjustified is real lol...it gives a nice perspective on how to "pixel-push"

[AaronW]

About the highlighter thing: Try making each button's highlight unique. Right now it's a bit weird that the highlight mark is identical on each. You might also try animating each marker "swoosh" so it looks like you're actually highlighting it :)

[Venom989]

Nice site, I like the design. Very clean and simple, but the only thing that was bugging me was that the whole thing was alinged to the left. I think it might look a little more "balanced" if it were centered ? Just a thought.

[tsguitar2004]

I considered the centered idea. It's a tough decision. Thanks for your comments, though.

This has been a tougher week than I thought it would be, so the work on my own site is low on the totem pole. I'll get to it next week, it looks like.
-ts

[chilipie]

Nice :D !

Al though centred sites often look better, I think this an exception. Unlike lots of sites that are on the left, the content isn't squeezed into a really narrow column. I'm not really sure about the navigation. I don't like the fact that the mouseover effect is the same on all of them (I think someone already said that, but hey :) ). Maybe see what it looks like with a tape effect on mouseover? Finally, I think mindless is right when he said about the toddseal.com image (top.jpg) being a bit fuzzy.

Good job though ts (I'm jealous of you, you've got such a cool name :cool: .)

[AaronW]

Doesn't even have to be perfectly centered. Heck, with a design that's supposed to look like a cluttered desk, might as well put it to like 40% or 60% so it's off-center. Heh. Would be unique.