Let our very first CSS showcase be a counterexample about a website which lists everything you should avoid while designing a website. I promise this will be the first and the last bad design we present you and we’ll publish only stunning examples in the future.
The creators of BadHTML.com have tried to list as many deterrent design features on a single page as possible. The funny thing is that we still meet these days many of these bad design practices on the web.
It’s hard to find the focus point of the website among the animated gifs and unnecessary design elements. The good news is that we have the possibility to switch to a more simple skin with a click of a button. Look for this feature in the right bottom corner of the screen.
The site is based on a dark seamless background on a visible table layout, without having an accent color to guide our sight in the right direction. At first sight the home page is just a big mess, but after all this is just a sarcasm site.
A list of inappropriate, ambiguous banners are listed in the header. The fun fact is that this is a collection of logos were actually used as company/organisation brandings.
Going further down we see the logo of Bad HTML which was inspired by the HTML5 logo, using a weird shadow and gradient combination. Then a marquee tool follows along with an onpage music player, and a pair of big eyes is following our mouse movements while pointing at a social button, begging for a Like.
The sidebars contain a rainbow-colored site navigation, some plugins which require a plugin to play, missing images, ‘Click here’ buttons which we can’t tell what do and an under construction banner.
The main content pane in the middle is in a fixed height, scrollable window.
The footer is full of unnecessary web widgets, such as a traffic counter, weather forecast, daily joke, but we can also see the exact server time and we can play Tetris on the page, which proved to be pretty addictive to me.
We strongly recommend browsing this website because it has some really interesting articles. The home page talks about the web design trends in a satirical way, but going further to the subpages we can find the most important knowledge base about the web.