Full Width [alt+shift+f] Shortcuts [alt+shift+k]
Sign Up [alt+shift+s] Log In [alt+shift+l]
Articles [alt+h] Reading List [alt+r] [alt+s]

HTMHell

Visit Blog

Sort By

Recent [alt+2]

Change View

List View [alt+w] Expanded [alt+e]
#35 a perfectly structured button button table { margin: 0; } .fa-arrow-left::before {content:"←"} Bad code <button type="button"...
11th Sep 2025
1

#35 a perfectly structured button

from HTMHell [alt+shift+b] in programming

11th Sep 2025
button table { margin: 0; } .fa-arrow-left::before {content:"←"} Bad code <button type="button" onclick="window.open('https://example.com/other-page')"> <table> <tbody> <tr> <td> <i class="fa fa-arrow-left" aria-hidden="true"></i> </td> ...
Direct Link [→] Remove from reading list Add to reading list [alt+a]
A link on a logo in the header, what should the alt-text be? by Rian Rietveld It's a common pattern to use a logo in the header as a link to the homepage. Fun...
1st Dec 2024
69

A link on a logo in the header, what should the alt-text be?

from HTMHell [alt+shift+b] in programming

1st Dec 2024
by Rian Rietveld It's a common pattern to use a logo in the header as a link to the homepage. Fun fact: the alt text of the image inside a link, will be added to the link text. The problem with linking a logo is that it serves 2 purposes: a logo, that tells you which site you are...
Direct Link [→] Remove from reading list Add to reading list [alt+a]
#34 a button is not a link Bad code <button type="button" onclick="window.open('https://example.com/other-page')">Link target...
26th Nov 2024
65

#34 a button is not a link

from HTMHell [alt+shift+b] in programming

26th Nov 2024
Bad code <button type="button" onclick="window.open('https://example.com/other-page')">Link target description</button> Issues and how to fix them A button opening a link will be unexpected behavior for screen reader users. No matter how it is styled. Links disguised as buttons...
Direct Link [→] Remove from reading list Add to reading list [alt+a]
#33 make me one (input) with everything The good intentions were there but in the HTML and Accessibility world, less is sometimes more. Bad...
27th Aug 2024
86

#33 make me one (input) with everything

from HTMHell [alt+shift+b] in programming

27th Aug 2024
The good intentions were there but in the HTML and Accessibility world, less is sometimes more. Bad code <label for="textinput">First name</label> <input type="text" id="textinput" aria-label="First name" placeholder="First name" title="First name"> Issues and how to fix them The...
Direct Link [→] Remove from reading list Add to reading list [alt+a]
The UX of HTML by Vasilis van Gemert Recently when I gave a coding assignment — an art directed web page about a...
1st Dec 2023
36

The UX of HTML

from HTMHell [alt+shift+b] in programming

1st Dec 2023
by Vasilis van Gemert Recently when I gave a coding assignment — an art directed web page about a font — a student asked: does it have to be semantic and shit? The whole class looked up, curious about the answer — please let it be no! I answered that no, it doesn’t have to be...
Direct Link [→] Remove from reading list Add to reading list [alt+a]
How to transfigure wireframes into HTML Soon enough in your career as a web developer, you encounter the situation where a designer hands...
1st Dec 2022
33

How to transfigure wireframes into HTML

from HTMHell [alt+shift+b] in programming

1st Dec 2022
Soon enough in your career as a web developer, you encounter the situation where a designer hands over a wonderful web design in all its large-screen glory. Your mission now is to transform it into code to present a prototype as soon as possible, starting with nothing but an...
Direct Link [→] Remove from reading list Add to reading list [alt+a]
#32 almost a proper close button Bad code <button display="flex" role="button"> <svg role="img" viewBox="0 0 13 13"...
18th Jul 2022
32

#32 almost a proper close button

from HTMHell [alt+shift+b] in programming

18th Jul 2022
Bad code <button display="flex" role="button"> <svg role="img" viewBox="0 0 13 13" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" height="15px" width="15px" fill="#000" name="close"> <title>Close dialog</title> <path d="…"> </path> </svg> </button> Issues and...
Direct Link [→] Remove from reading list Add to reading list [alt+a]
#31 additional “assistance” Bad code <a href="/contact" aria-label="If you find that you need additional assistance in...
12th Apr 2022
32

#31 additional “assistance”

from HTMHell [alt+shift+b] in programming

12th Apr 2022
Bad code <a href="/contact" aria-label="If you find that you need additional assistance in navigating or accessing the content of this website, please call our customer service toll free number 1-800-666-8654309" title="If you find that you need additional assistance in...
Direct Link [→] Remove from reading list Add to reading list [alt+a]
#30 Bullet “list” Bad code <p> • HTML <br> • CSS <br> • JavaScript </p> Issues and how to fix them Use <p>...
13th Jan 2022
31

#30 Bullet “list”

from HTMHell [alt+shift+b] in programming

13th Jan 2022
Bad code <p> • HTML <br> • CSS <br> • JavaScript </p> Issues and how to fix them Use <p> for paragraphs, not lists. The standard way for creating basic lists is <ul> (when the order doesn't matter) or <ol> (when the order matters), and <li> for each item. The “list”...
Direct Link [→] Remove from reading list Add to reading list [alt+a]
#29 Randomly grouping content Bad code <section> <aside> <div> <section> <header> <a href="/"> ...
10th Dec 2021
33

#29 Randomly grouping content

from HTMHell [alt+shift+b] in programming

10th Dec 2021
Bad code <section> <aside> <div> <section> <header> <a href="/"> <img src="logo.svg" alt="Logo"> </a> </header> <main> <a href="/services">Services</a> <a href="/products">Products</a> ...
Direct Link [→] Remove from reading list Add to reading list [alt+a]

The best way to read the internet.
Made for nerds, by a nerd.

The best way to read the internet

© 2023 Bored Reading. All rights reserved.

Legal

Terms of Service Privacy Policy

External Links

Borderline.biz Buy & Sell Apps PixelsOnGrids App Design Agency

Explore

Top Blogs
Suggest a Blog [email protected]

bored reading

v. 229.328 compliant with
earth/mars-x8292 communication
protocol 29xjw899992

When Google killed Google Reader, the bloggosphere took a severe hit and the content quality went down because there weren't enough readers to justify the effort it takes to maintain a high quality blog.

What's left is a decaying wasteland of blogs, most abandoned, a lot are now SEO spam, and 99% are not worth reading. BoredReading is a way to read the remaining great blogs that survived the ice age.

To add your favorite blog, please suggest it here! I get emails every day which helps me maintain a high quality selection of blogs!

Avatar

Made by,
Kumail Hunaid

@kumailht on Twitter.
My website and email.

Close [esc]
📚 BoredReading

You seem to be enjoying this.

Join free to unlock everything.

Create free account

Already have an account? Sign in