Bad HTML Tips That Still Haunt The Web
Bad HTML 🚧 The Ugliest Website On The Internet
Bad HTML shows common web design mistakes with jokes and clear fixes - so you can build pages people can actually use.
We launched Bad HTML more than 10 years ago. Back then "bad HTML" meant blinking text, autoplay music, table layouts, and a hit counter in the footer. The joke was simple - build the ugliest page we could - so you can see what not to do. 🙂
The web moved on - and so did the mistakes. Today nobody ships a marquee - they ship a cookie wall, a 5 MB script bundle, and a purple landing page that an AI tool drafted in ten seconds. This page sorts them into three eras - old and new.
10+ years online
4 designs to switch
11 short guides
30 AI-slop signs
Three Eras Of Bad HTML
Every decade finds a new way to put decoration first - and the reader last.
The Loud Web 1990s and 2000s
Blinking text, tiled backgrounds, background music, and layouts built from nested tables. Pages shouted - because they could.
Fix: one font, calm colors, and tags used for what they mean. The obsolete code list shows what to retire.
The Heavy Web 2010s
Popups, cookie walls, autoplay video, hijacked scrolling, and megabytes of script before the first word shows up. Pages got quiet - and slow.
Fix: ship less. Start with smaller images and the responsive checklist.
The Slop Web 2020s
AI tools draft a whole landing page in seconds - and the drafts all look the same - purple gradient, glass cards, three feature boxes, and a headline that could sell anything.
Fix: say what the product does in plain words. The AI-slop design page lists 30 signs to check.
Bad HTML, Then And Now
The tools changed - the habits did not. Read each row left to right.
| 1990s | 2010s | 2020s AI slop |
|---|---|---|
| Blinking text and marquees | Autoplay video in the hero | Pulsing dots and scrolling logo rows |
| Tiled rainbow backgrounds | Stock photo of a handshake | Purple gradient with a glow behind |
| Nested table layouts | Div soup, twelve levels deep | Three identical feature cards |
| A hit counter as proof of fame | An "As seen on" badge row | "Trusted by 10,000+ teams" |
| "Best viewed in IE7" | "Please disable your ad blocker" | "Supercharge your workflow" |
| Under Construction gifs | Newsletter popups | "Coming soon" badges |
| Comic Sans everywhere | Thin grey text on white | Inter everywhere |
Each era has its own full list of habits - with a better move for each one - on the Evolution of Bad HTML page.
AI slop has infested posters, restaurant menus, and shop signs too - an image generator made this menu board - glow and all.
Switch The Design
This site has four designs - one for each era and a quiet one for reading. Pick one here - or use the same boxes in the footer of every page.
Use Minimal when you are learning - use the other three when you want to show a friend "please never ship this."
Quick Questions
Is this site serious?
The tips are real - the design is the joke. Every page pairs a bad habit with the fix - so you can laugh first and repair your own page after.
Why is the default design so purple?
Because that is what AI tools draw - when nobody gives them a direction. The AI-Slop design copies the signs from our AI-slop page on purpose.
Was the AI-Slop design really made by AI?
Yes - an AI assistant wrote it and an image generator drew the reaction icons. A person asked for it to look this generic - which is the only original part of it.
Is anything in the glowing boxes true?
No. The testimonials, the big numbers, and the chatbot are made up - the articles and the tips are real.
Can I get the old ugly site back?
Yes - press 90s in the design switcher. The gifs, the snow, and the music are all still there.
One Habit To Drop This Week
Pick a single problem on a page you own - missing alt text, a 2 MB hero image, a cookie wall, or a "Click Here" link. Fix that one thing, measure the file size or clarity gain - then move on. Progress beats a guilt stack of unread tabs.
Questions, praise, or "my boss still wants Comic Sans" stories can go through the contact page. Bring snacks - for BadCAPTCHA.
Where To Start On This Site
Bad HTML is a small site - you can finish the sidebar in one sitting. A good path looks like this:
- Basic web words - so the jargon stops feeling alien
- AI-slop design tells - so modern templates do not fool you
- The evolution of Bad HTML for the classic, modern, and AI-slop lists
- Validators and free editors - for quick fixes
- Bad-habit deep dives for HTML, CSS, file names - and on-page SEO
- Practical extras: image prep, responsive checklist - and the tools list
If you only have ten minutes, open one article, fix one habit on your own project - then come back. Tiny wins beat a perfect reading marathon - you never finish.
When a redesign turns into endless "make it pop" notes, the designer and client page is a useful reality check.