Change visual order of things or not
front-endMy question is about accessibility and screen readers. I have in design order of things that goes like this:
img
time
h1
p
Because of accessibility, should I make HTML structure to go
h1
time
img
p
and then make order of things in CSS to go just visually img, time, h1, p...
or should I stick with HTML structure and do not change anything visually with CSS? I heard that for screen readers is good that section or article starts with heading. I ask chatGpt and first time he was saying that it should be changed and second time that should not be changed.
And if not in this case, is there any case where it would be best to change visual order of HTML structure in CSS with flexbox order property?
img
time
h1
p
Because of accessibility, should I make HTML structure to go
h1
time
img
p
and then make order of things in CSS to go just visually img, time, h1, p...
or should I stick with HTML structure and do not change anything visually with CSS? I heard that for screen readers is good that section or article starts with heading. I ask chatGpt and first time he was saying that it should be changed and second time that should not be changed.
And if not in this case, is there any case where it would be best to change visual order of HTML structure in CSS with flexbox order property?
A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.
36,263Members
Resources
Recent Announcements
Similar Threads
Was this page helpful?
