Stop use tag section for layout

Feature Requests / Improvements
1

The <section> tag should not be used to build layout.
Section is semantic element and should be use only to build document semantis.
The name of this element can be Section, but the HTML tag should be DIV.

2

Sections should be used to break up a page. Each separate section of content should be in its own section element.

"The element defines a section in a document.

According to W3C’s HTML documentation: “A section is a thematic grouping of content, typically with a heading.”

Examples of where a element can be used:

  • Chapters
  • Introduction
  • News items
  • Contact information

A web page could normally be split into sections for introduction, content, and contact information."

Above quoted from - W3Schools

3 Likes
3

If you like it that way, just change HTML tag. Or change HTML tag and save as global element and pin new section element.
I think if we are adding section with a container inside it, most of the time these parts are actually section of contents and that should be default.

4

Is this possible to set DIV for section as default?

5

Just use a div rather than section.

A section is a semantic html element. If you do not want to use that then use a plain div with no meaning.

1 Like
6

That’s simply wrong. Look what Dan wrotes.

I also recommend to take a look to mdn

7

I know this very well.
Use <section> to build layout skeleton is very bad idea.
Section element should be DIV tag by default.

8

I assume you also have sources for this very surprising statement?

9

https://www.w3.org/WAI/WCAG21/Techniques/general/G140
Providing separate structure, functionality, and presentation layers allows the semantics implied by the formatting to become programmatically determined via the structure layer.

10

And exactly for this you use sections.

https://html.spec.whatwg.org/#sectioning-content

https://html.spec.whatwg.org/#the-section-element

→ The section element is not a generic container element. When an element is needed only for styling purposes or as a convenience for scripting, authors are encouraged to use the div element instead. A general rule is that the section element is appropriate only if the element’s contents would be listed explicitly in the document’s outline.

And that’s exactly how Bricks the section element uses.
For more inline layout options you use blocks / divs / column elements (which are semantically all divs).

Also under the point Outline you’ll find examples how to use sections in an correct way
https://html.spec.whatwg.org/#outline

1 Like
11

… section of a document …
Website layout is not document element.
You dont’t find sections on this page ARIA Authoring Practices Guide | APG | WAI | W3C
But You find sections on this page: Accordion (Sections With Show/Hide Functionality) | APG | WAI | W3C

12

I don’t know if there is a language barrier, but one has nothing to do with the other.

Well, you’ll do it.

13

Ok I think I got it.

You mean the “section ROLE”

That doesn’t mean that using html sections is bad. It’s only unuseable to add ARIA Role section.

14

Of course aria in this case is wrong practice.
https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/button_role#best_practices

15

Another person confirm that use section tag as default tag for section container is wrong.
https://youtu.be/U_LTJOWgcns?si=alJ73-yfeTGL9DA9&t=95
Why Bricks don’t change section tag to div as default?
Creating website developer have to insert many sections.
We can not change section tag to div every time, because this take many time and is bothersome.
Section can’t be used to build layout view.
But Bricks do it.