23

I am trying to create a figure tag that has inside an anchor tag wrapping the image. I was wondering if that structure is legal or not. Here is the code showing how I want it to work.

<figure>
   <a href="/my-picture">
       <img src="img/picture.jpg" alt="My picture">
   </a>
   <figcaption>
       My picture
   </figcaption>
</figure>
armellini13
  • 377
  • 1
  • 3
  • 11
  • Great, thanks. Any place I can check these doubts? @Rasel – armellini13 Feb 23 '15 at 09:31
  • You can validate your markup at http://validator.nu – BoltClock Feb 23 '15 at 09:40
  • For information: You cannot wrap the `figcaption` alone with an anchor. However, you can put the anchor within the `figcaption`. Vaild alternative as stated below, you wrap the entire `figure` with an anchor. – Avatar May 07 '18 at 09:46

1 Answers1

25

Validator says it's proper structure, so yes.

When it comes to semantic I don't see any problem, however always remember that in HTML5 you can wrap whole figure in a link which might be of use as in most of the case you want to wrap description also.

I used this to validate:

<!DOCTYPE html>
<html>
  <head>
    <title>a</title>
  </head>
  <body>
    <figure>
      <a href="/my-picture">
        <img src="img/picture.jpg" alt="My picture">
      </a>
      <figcaption>
        My picture
      </figcaption>
    </figure>
  </body>
</html>
Massimiliano Kraus
  • 3,638
  • 5
  • 27
  • 47
Maciej Paprocki
  • 1,230
  • 20
  • 29