Czy da się sprawić, by znacznik semantyczny przestał być semantyczny?

Question

Czy istnieje jakiś sposób, aby np. znacznik <section> stał się niesemantyczny?

Może to się wydawać głupie pytanie, ale podczas przeglądania strony, w której użyte były jakieś szablony w postaci arkuszów stylów czy skryptów JS, mogą pojawić się odniesienia do tego na przykład znacznika.

Przykład:

section.menu {padding: 0;}

Tutaj użyty jest w selektorze znacznik <section> o klasie .menu, lecz załóżmy, że nie chcemy w menu (navie) stosować owego znacznika <section>.

Ktoś mógłby powiedzieć, że wystarczy w takim przypadku zamienić section na diva:

.menu {padding: 0;}

Lecz załóżmy także, że nie mamy do czynienia z krótkim stylem takim jak powyższy, ale z całymi arkuszami CSS i skryptami, które bazują na tym, że musi to być jednak <section>.

Czy jest więc sposób na to, by w HTMLu usunąć "semantyczność" tego znacznika?

Podam jeszcze jeden przykład kodu, aby wiadomo było, o co chodzi:

<nav>
  <section class="menu">
  <!-- Nie chcemy tu używać znacznika section, bo
  nie pasuje to do semantyki naszej witryny, ale 
  zmusza nas do tego zewnętrzny CSS -->
    <ul>
      <li>Opcja 1</li>
      <li>Opcja 2</li>
    </ul>
  </section>
</nav>

Przez "semantyczność" mam na myśli to, że dany element jest czytany przez robota Google czy robota czytającego dla niewidomych jako np. sekcja, a nie niewidzialny semantycznie element taki jak div czy span. 

Answer 1

[role=presentation] – niemniej nie mam zielonego pojęcia, jakie jest dla tego wsparcie w narzędziach. Wiem tylko, że powinno to być respektowane przez czytniki ekranowe.

Ogólnie to lepiej byłoby mimo wszystko poprawić kod HTML.

Comments

Czy ten atrybut role="presentation" sprawi, że tylko sam <section> będzie niewidoczny semantycznie, czy że cała zawartość w środku tego znacznika też nie będzie w ogóle czytana przez roboty?

---

Tak, sprawi tylko, że section straci swoją semantykę → https://timwright.org/blog/2016/11/19/difference-rolepresentation-aria-hiddentrue/