Accessibilty: grouping elements in extra divs, is that bad?

HTML-CSS
1

I am tempted to place a couple of p-elements inside a div, and a figure element into another div and place both divs inside a super div. Then I can turn super div into a flexbox container. The three divs have no semantic meaning and are used only to play with the layout of the html-page. Alternatively I can also set a figure to inline-block and have it float next to the text. That works very well except for the h2-title that is weird above it. So, I would place the h2-element underneath the image and then everything looks fine. But placing a heading element underneath an illustration, is not very semantic, is it? So here’s my question: accessibility in mind, how do I deal best with layout issues: add divs to group elements together? Change the order of certain elements? Or do I try to avoid both?

Thank you.

2

div tag was made to do exactly that. Take out all your css and see how your page is displayed, if everything is in the correct order then you’re doing just fine.

1 Like
3

great. I didn’t feel sure so much is changing all the time.
So:

  1. divs are fine
  2. remove all css out of html
  3. respect the order of the elements

thank you.

4

Ya, just to check how your site looks without css, of course you put it back after it :+1: