Wenn semantisches HTML und ARIA verwendet werden, ist es einfach, den wesentlichen Inhalt der Website zu erkennen. Deshalb solltest du die Option „Zum Hauptinhalt springen“ bei deiner Website einfügen, damit die Besucher leichter zum wichtigen Content geleitet werden können.

Die Option “Zum Hauptinhalt springen” ist standardmäßig in der englischen Version “Skip to main content” in allen Templates eingebunden. Du kannst die Option sehen, wenn du die Website öffnest und dich mit der Tab-Taste durch die Website bewegst. Der Button wird dann in der oberen linken Ecke sichtbar. 

Um “Zum Hauptinhalt springen” in deiner Website einzubinden (oder den Button-Text zu übersetzen), folge diesen Schritten:

1. Klick auf “Code” in der unteren rechten Ecke im Website Builder
2. Gehe zu “Global” > “HTML”

3. Vor dem {{content}} füge dieses Snippet hinzu 

   <a href="#main-content" class="button wv-link-content">Zum Hauptinhalt springen</a> 

   In diesem Snippet steht jetzt “Zum Hauptinhalt springen”, aber in der englischen Version würde hier “Skip to main content” stehen. Dieses Teil einfach austauschen mit der deutschen Version.

4. Speichere die Website

Optionen für Mehrsprachigkeit

1. Du kannst den Button-Code anpassen und die Beschriftung verschiedener Sprachen über HTML-Tags setzen: 

   <button>
       <span lang="en">Skip to main content</span>
       <span lang="de">Zum Hauptinhalt springen</span>
   </button>

2. Du kannst den Code aus “Global” > “HTML” entfernen und als HTML-Element ganz oben auf den Seiten einfügen in der entsprechenden Sprache
3. Du kannst ein JS-Snippet nutzen, um den Text je nach Sprache zu verändern (KI kann dir dabei helfen ein entsprechendes Snippet zu erstellen)