Something that used to be considered bad practice in the days when we were all coding in XHTML days, and also would not validate is nesting block level elements inside of anchor tags.
HTML 5 now allows anything to be nested inside anchor tags so the following would indeed validate and still allows us to write semantic code
<p>I'll get back to you asap.</p>
It’s even possible to nest divs inside anchor tags!
Why would we want to nest elements inside an anchor tag? How would a huge clickable anchor area be beneficial?
Well, here’s one example of a very useful place to have big clickable blocks – Mobile.
It’s also nice to keep things semantic too, say the title of a blog post was a link – It would make semantic sense for that to be a heading. a tiny snippet from the post should be in paragraph tags. The ability to nest block elements inside anchor tags is, in my opinion a very useful thing.
What are your thoughts?
Is this something you will use in your designs? Does it feel a bit dirty to nest in these block elements, knowing for so long that it was once bad practice? Please share!Posted in Best practices, HTML 5 | No comments