*Please pardon the un-styled mess why I am rethinking and re-designing my blog!*
In this lovely tutorial I will show you how to create a lovely little ugly website in 3 easy steps!
Go to Flaming Text and make yourself a sweet ass header graphic. Since using professional graphics tools dont really matter this will do just fine! I prefer some nice green text with blue flames. Super cool!
Since we dont really care about usability, readability, or heck…our readers eyes lets search google for some obnoxious animated background. Check out the sweet twinkling stars background I found here.
Since we dont care about design lets more on to content. Tip: Steal content! Why be original? Lets insert some song lyrics that could easily be found elsewhere. Hmmmm how about Brittany Spears song ‘Hit me baby one more time’ Perfect! Now go throw all the crap we gathered from the interwebs and throw it in dreamweaver!
Isnt that just LOVELY???
Remember those slightly (ha) annoying tags (or good friends for some) <Marquee> and <Blink>? Well you get bonus points for using these tags!
If you really want to make page cool I’ll let you in on a secret tip: Embed a nice midi file and set it to auto play and hide it in the corner of your page! Its sure to make all your users LOVE your site!
This tutorial was just my way at blowing off steam and having a bit of fun. I just happened to view way to many crappy websites while doing research today. I spotted wayyyyyy to many Design Fouls out there and just had to get this out of my system!
We provide latest HP0-S23 practice questions with 100% guaranteed success. Join 000-979 online training to successfully completing the 1z0-033 exam.
[25] Comments
Posted in design, Graphic Design, Tutorials, Web 2.OH, Web Design
[...] 19, 2009 by chimes My friend Niki had a blog post about ugly websites on the Design O’Blog that prompted me to send her the link to my fugly website from a LONG [...]
[...] @nebrow: In case you missed it this weekend: How to design an ugly website http://www.nikibrown.com/designoblog/2009/01/18/ugly-website/ « előző | Tamas Bogdan — 2009. 01. 20. [...]
[...] Design An Ugly Website In 3 Easy Steps! | The Design O'Blog Créer un "superbe" design en trois étapes (tags: billet webdesign humour ugly) [...]
[...] falsch verstehen: Ich rede nicht von dilettantischen Websites, Corel-Draw-Clipart-basiert, mit blinkenden Laufschriften in exotischen Schriftarten, neongrün. [...]
Subscribe by rss, email, or in iTunes!
Timothy Long says:
Don’t forget the LCD hit counters!
January 18th, 2009 at 6:43 pm
Mike Cunningham says:
I know this sounds like a nice idea, but isn’t it just easier to use someone else’s MySpace design. 1 in a hundred doesn’t meet all of the above.
God they’re ugly!
Mike
http://twitter.com/mike1mb
January 18th, 2009 at 6:53 pm
Niki says:
@Tinothy Long
Done and Done! LCD counter FTW!
January 18th, 2009 at 6:58 pm
Jen says:
Yeah, those are ugly website ideas. But I remember back in 1999 when websites like that were cool. I even had an ugly website back then.
But people need to MOVE ON. lol.
January 18th, 2009 at 7:12 pm
Liz says:
i think your site gave me a seizure. <3 it
January 18th, 2009 at 7:30 pm
Liz says:
designoblog should have an ugly website contest.
January 18th, 2009 at 7:32 pm
Christopher Francis O'Donnell says:
You forgot to add a warning that takes up the whole are above the fold that says, “Warning! Super awesome website below the fold. But only scroll down if you aren’t epileptic or have been drinking.”
I think that would really add to the authenticity of the example…
January 18th, 2009 at 7:42 pm
Gary says:
I had one of these back in 1996…
I think you’re missing out the framed navigation, and the notice stating: “This site only works in Netscape Navigator v3 or above”
And a guestbook – every good site needs a guestbook.
January 18th, 2009 at 8:23 pm
Brian Hoff says:
So your telling me I should design my website like this? Darn! Now I have to start all over again!
I always enjoy reading your posts Niki. They have so much personality to them. Keep up the great work
January 18th, 2009 at 9:22 pm
Mat "Wilto" Marquis says:
Ah man, I knew screenshots of my portfolio site were gonna get leaked to the public sooner or later…
January 18th, 2009 at 10:58 pm
Paul Davis says:
Haha, It’s Piczo all over again!
January 19th, 2009 at 1:48 am
Neko says:
Flaming graphic header are uber cool
January 19th, 2009 at 7:47 am
MattS says:
Needs animated cursor.
January 20th, 2009 at 12:46 am
Corey Freeman says:
You forgot the obnoxious background music. I think you have three choices:
1) Speed Metal
2) Some kind of 8-bit high pitched jingle
3) Anything by Avril Lavine
January 20th, 2009 at 4:53 am
CreativeNotice says:
Lol Very thorough tut. All the way down to the annoying song.
January 20th, 2009 at 8:53 am
Soh Tanaka says:
http://havenworks.com/
This guy will smoke your bad design skills.
January 20th, 2009 at 9:02 am
Greg-J says:
LOL amazing !!
You just forget to use Comic Sans MS !! xD
January 22nd, 2009 at 5:53 am
Raul says:
u could also add in rainbow gradients
January 29th, 2009 at 11:27 pm
Mara Alexander says:
This would have been funnier if you hadn’t hotlinked an image. Bandwidth stealing really *isn’t* cool.
March 4th, 2009 at 12:20 pm
Cameron says:
I don’t believe this is done in ‘mostly’ semantic code (barring the nice span p /p /span going on there) – where’s the cluttered table layout!? and font=’comic sans’ bgcolor=black!??
awesome otherwise, took me right back to 1997!
March 4th, 2009 at 2:20 pm
Rachel says:
Something JFK said back in the day came to mind while reading your post. “Our problems are man-made, therefore they may be solved by man. No problem of human destiny is beyond human beings.”
November 19th, 2009 at 1:08 am