Today I got the silly idea to hand draw a web page using a marker. So I took out a piece of paper, grabbed a Sharpie and scribbled out a redesign for MichaelAllenSmith.com. Then I scanned the ditto, chopped it up and added mouseover images with just a splash of color.
I give you The Sharpie Redesign.
Believe it or not, it validates to XHTML 1.0 Transitional.
UPDATE (4/16/2009): It now validates XHTML 1.0 Strict thanks to Joe at ArtLung.com.
Joe Crawford
Apr 14, 2009 — 11:38 am
XHTML Transitional?
Weak.
(temp link removed)
MAS
Apr 14, 2009 — 12:14 pm
Very nice JOE! Thanks!
I like how the hover work is done in the CSS. Much cleaner code. I copied it over to my server and it now validates XHTML 1.0 Strict. 🙂
I’ll use this as a template for some future redesign. I have an idea that involves crayons. 😉
Joe Crawford
Apr 14, 2009 — 1:50 pm
Awesome man! I removed your Google Analytics code though, so you probably have to put that back in. Sorry about that. 🙂
MAS
Apr 14, 2009 — 2:42 pm
It is back in. Thanks again!
Ryan Jacobs
Apr 15, 2009 — 5:32 am
Well played, well played!
Joe Crawford
Apr 15, 2009 — 6:27 am
Two critiques of my work now: 1. There’s a flicker when the images first load. Preloading the mouseover/hover images would be nice at this point. Maybe JS, or maybe just by loading them in-page as single pixel images. 2. Looks not great in IE6 — there’s a little extra margin between the top two hovers which makes a little ugly. If that matters you may need a little hackery.
Otherwise, I’m pretty pleased with my 30 minutes of xhtmling. 🙂
MAS
Apr 15, 2009 — 6:31 am
1- I actually like that flicker, it draws attention to the image. I will experiment with pre-loading though.
2-If you have IE6, the web shouldn’t look good. Your surfing experience should be painful. 🙂
thanks again!
MAS
Apr 15, 2009 — 6:42 am
1- Just added the HOVER images as 1×1 pixels. You can’t even see them. No more flicker.
Thanks!