Webseiten-Check · Hundeschule Musterwald

Geschwindigkeit

Desktop 2,1 s · Smartphone 5,4 s bis zum größten Inhalt (Labormessung)

• Auf dem Smartphone dauert es mehr als doppelt so lange wie am Rechner. Die meisten Besucher:innen kommen übers Smartphone — du selbst siehst deine Seite fast nur am Rechner.

• Deine Startseite lädt 4,3 MB. Über Mobilfunk sind das mehrere Sekunden, bevor überhaupt etwas zu sehen ist.

• Am schwersten wiegen beim Aufruf 3 Dateien mit zusammen 3711 KB.

  hero-wiese.jpg · 2539 KB

  team.jpg · 869 KB

  slider.js · 303 KB

• Ein Bild wird in 2,8-facher Breite geladen und dann kleingerechnet. Über Mobilfunk kostet das Ladezeit, ohne dass man mehr sieht.

  hero-wiese.jpg · 4032 px geladen, 1440 px angezeigt

Mobil

3 Bedienelemente sind für den Daumen zu klein

• 3 Schaltflächen sind so klein, dass man sie mit dem Daumen kaum trifft.

  kleinste Kante unter 24 px · 3 in der Navigation

• Eine Schaltfläche ist bedienbar, aber knapp bemessen — etwas mehr Höhe macht sie auf dem Smartphone angenehmer.

  kleinste Kante 24 bis 44 px · im Fußbereich: footer > a:nth-child(1)

• Der Fließtext ist 15 Pixel groß; ab 16 Pixel liest es sich auf dem Smartphone deutlich leichter.

Design

1 Farbgruppe mit Beinahe-Dubletten, 4 Schriftarten

9 verschiedene Schriftgrößen sind auf der Seite im Einsatz. Eine ruhige Seite kommt mit sechs bis acht aus.

• 4 Farbtöne, die dasselbe sein wollten — der Unterschied ist so klein, dass er wie ein Versehen wirkt statt wie eine Entscheidung.

  #f5c518 (header) · #f4c419 (.hero) · #f7c700 (.band) · #f5c61a (footer a)

  #f5c518#f4c419#f7c700#f5c61a

• 4 verschiedene Schriftarten im Einsatz. Zwei reichen fast immer — mehr wirkt schnell zusammengewürfelt.

  georgia · verdana · tahoma · comic sans ms

• 2 Schriftgrößen, die dasselbe sein wollten — nebeneinander sieht das aus wie ein Versehen, nicht wie ein System.

  15 px · 15,5 px

• 3 Schriftgrößen, die dasselbe sein wollten — nebeneinander sieht das aus wie ein Versehen, nicht wie ein System.

  16,5 px · 17 px · 17,5 px

• Die H3-Überschriften kommen in 3 Größen vor, die dasselbe sein wollten.

  16,5 px/700 · 17 px/700 · 17,5 px/700

Recht

Daten gehen an 2 Drittanbieter, bevor zugestimmt wurde

• Beim Aufruf deiner Startseite werden Daten an Google Fonts, Google Analytics gesendet, bevor irgendjemand zugestimmt hat. Damit geht die IP-Adresse deiner Besucher:innen an diese Anbieter.

• Ein Cookie-Banner ist vorhanden — die oben genannten Verbindungen laufen aber schon davor. Der Banner hält sie also nicht auf.

Barrierefreiheit

Nach deinen Angaben greift die Ausnahme für Kleinstunternehmen — Pflicht ist das für dich also nicht.

Die gefundenen Punkte sind trotzdem echte Hürden für einen Teil deiner Besucher:innen — nur eben freiwillig.

• Text und Hintergrund unterscheiden sich an 11 Stellen zu wenig. Draußen am Smartphone oder mit älteren Augen ist so ein Text kaum noch zu lesen.

  axe color-contrast · Text und Hintergrund liegen zu dicht beieinander

  Beispiele: .band · header nav a

• 5 Bilder haben keine Textbeschreibung. Wer sich die Seite vorlesen lässt, erfährt an dieser Stelle nichts — Suchmaschinen übrigens auch nicht.

  axe image-alt · Bildern fehlt ein Alternativtext

  Beispiele: .kurse img

• 2 Links haben keinen lesbaren Text. Vorgelesen heißt das nur „Link" — wohin sie führen, bleibt offen.

  axe link-name · Links ohne erkennbaren Text

  Beispiele: footer > a:nth-child(3)

Erster Eindruck

In der ersten halben Sekunde sehe ich einen gelben Balken, den Namen, ein unscharfes Wiesenbild und „Herzlich willkommen!". Was ihr anbietet, für wen und wo — das steht erst weiter unten, und „Internetpräsenz" klingt nach 2011. Wer euch schon kennt, findet sich zurecht. Wer euch googelt, weil der Welpe seit gestern da ist, sieht nicht in drei Sekunden, ob ihr Welpenstunden gebt und ob das in der Nähe ist. Genau diese Person entscheidet hier, ob sie weiterliest oder zurückgeht.

Anfrage-Weg

Kontakt erst über eine Unterseite erreichbar

• Der Kontakt ist erst über eine Unterseite erreichbar, nicht direkt auf der Startseite.

• Die Telefonnummer ist nicht als Link hinterlegt — auf dem Smartphone kann man sie nicht antippen, um anzurufen.

• Im Fußbereich stehen weder Anschrift noch Öffnungszeiten — genau dort sucht man beides, wenn man kurz vor der Anfrage steht.

• Ein Link auf der Seite führt ins Leere.

  https://hundeschule-musterwald.de/kurse/agility · Status 404

Der eine Hebel

Die Seite lädt am Handy 5,4 Sekunden — das ist der Punkt, an dem etwa die Hälfte der Besucher:innen weg ist, bevor sie überhaupt etwas gesehen haben. Das große Wiesen-Bild allein wiegt 2,6 MB und wird in 2,8-facher Breite geladen.

Was ich zuerst täte

• Das Hero-Bild auf Anzeigegröße verkleinern und in ein modernes Format umwandeln — das allein bringt die Ladezeit am Handy in einen brauchbaren Bereich.
• Die Schriften von Google lokal einbinden und das Statistik-Skript erst nach der Zustimmung starten — dann geht beim ersten Aufruf nichts mehr an fremde Server.
• Über die Kurse eine Zeile setzen, die sagt, für wen ihr da seid und wo ihr trainiert — und die Telefonnummer als Link hinterlegen, damit man sie am Handy antippen kann.