@@Phlix
Ich hab dein Posting mal lesbar gemacht. Das nächste Mal bitte selbst formatieren.
die Homepage wäre Meine Homepage
Dazu ein paar Anmerkungen:
<!DOCTYPE html> <html>
Hier fehlt die Angabe der Sprache des Seiteninhalts: <html lang="de">
<meta name="content-language" content="de" />
Diese Zeile ist sinnlos.
<meta http-equiv="content-type"content="text/html; charset=utf-8">
Das kannst du kürzer haben: <meta charset="utf-8">
. Und das sollte als allererstes im head
stehen.
<style type="text/css"></style> <script language="javascript" type="text/javascript"></script>
Die Zeilen sind sinnfrei.
BTW, type="text/css"
ist in HTML5 ebenso unnötig wie type="text/javascript"
. language="javascript"
war schon immer Unsinn.
<body> <div class="container"> <div class="jumbotron">
Diese Container-div
s brauchst du nicht; mit html
und body
sind bereits zwei Container-Elemente vorhanden.
<img id="mitte" src="Maurer_Maxl.png">
Hier fehlt der Alternativtext alt
– für Nutzer, die keine Grafiken sehen können.
Es sei denn, es handelt sich (wie hier) um eine Schmuckgrafik. Dann sollte das mit role="none presentation"
gekennzeichnet werden und es muss trotzdem alt=""
vorhanden sein (andernfalls würden Screenreader den Dateinamen vorlesen).
Noch besser wäre, wenn eine Schmuckgrafik gar nicht im HTML auftaucht, sondern als Hintergrunsgrafik im CSS.
<p><a class="btn btn-primary btn-lg" href="https://www.google.com" data-toggle="tooltip" data-placement="bottom" title="weiter zu www.google.com" role="button">Seite verlassen!</a></p>
Ein Link ist ein Link ist ein Link – kein Button! Das Stylen eines Links als Button ist fragwürdig; role="button"
ist an der Stelle völlig falsch.
Links führen zu anderen Seiten; Buttons lösen Aktionen auf einer Seite aus.
BTW, einen Link zu Google braucht niemand. Ein Sucheingabefeld ist im Browser bereits vorhanden. Und meins führt aus Gründen nicht zu Google.
<a href="https://www.checkdomain.de/unternehmen/garantie/ssl/popup/" onclick="window.open(this.href + '?host=' + window.location.host,'','height=600,width=560,scrollbars=yes'); return false;"><img id="logo" src="https://www.checkdomain.de/assets/bundles/web/backend/controller/ssl-certificate/img/ssl-150x150.png?20170622-152736" alt="SSL-Zertifikat" /></a>
Das wäre wohl ein Button. Hier wäre role="button"
angebracht (zumindest wenn JavaScript ausgeführt wird) – oder noch besser gleich das button
-Element verwenden.
<div class="Copyright"> <p><b>© PHW</b><p> </div>
Das wäre besser ein footer
, kein div
.
LLAP 🖖
“When UX doesn’t consider all users, shouldn’t it be known as ‘Some User Experience’ or... SUX? #a11y” —Billy Gregory