MichaelAllenSmith – The Sharpie Redesign

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.


Add yours

  1. XHTML Transitional?


    (temp link removed)

  2. 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. 😉

  3. Awesome man! I removed your Google Analytics code though, so you probably have to put that back in. Sorry about that. 🙂

  4. It is back in. Thanks again!

  5. Well played, well played!

  6. 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. 🙂

  7. 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!

  8. 1- Just added the HOVER images as 1×1 pixels. You can’t even see them. No more flicker.


Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.