anwaryou.de Startseite zeigt Anwar im Gespräch mit einem Kunden

Light Website Test: anwaryou.de

Written by: Alp Uçkan

Seasoned IT consultant and web developer with a passion for helping businesses succeed online. Founder of Islamic Marketplace and ethical web development.

Goal fulfillment

Hier haben wir es mit der Landingpage eines Verkaufsexperten zu tun, der seine Kurse (“Bootcamps”) an Firmen bringen möchte. Die Message kommt auch im ersten Fold an. Verkaufsverdoppelung. Der CTA-Button führt zur Sektion der angebotenen Bootcamps und der sekundäre Button zur Sektion darunter. Hier stimmt die Reihenfolge der Buttons nicht. Der primäre Button kommt gewöhnlicherweise zuerst, der sekundäre danach. Ob der sekundäre Button überhaupt nötig ist, lässt sich diskutieren; besonders wenn das Ziel nur ein paar Zentimeter darunter ist. Leute können scrollen. Die gesamte Benutzerführung mit Buttons, die von einer Sektion zur anderen springen ist auffällig auf dieser Seite. Doch dazu später mehr unter “Usability”.

Insgesamt ist mir zu viel Text auf dieser Landingpage. Da sollte man da eher in den Amerikanischen Raum schauen, wie es dort gemacht wird. Es muss nicht alles auf einer Landingpage stehen, man kann sich auch 2-3 extra Seiten und Menüpunkte leisten, auf denen man dann Details nachlesen kann. Ich wage mal zu behaupten, dass ein sehr großer Prozentsatz nicht alles liest.

Bei so viel Text dürfte man auch meinen, den CTA-Button öfter zu sehen. Er sollte öfter in die Sektionen hereingestreut werden. Und das Ziel des CTA-Buttons ist suboptimalerweise eine Calendly-Seite, wo man sich einen Termin buchen kann. Da gibt es für WordPress bessere, nativere Alternativen.

Score: 7/10

Technical appropriateness

WordPress ist hier gewiss keine schlechte Wahl, aber das Potential ist mit dem WPBakery-Plugin nicht im Ansatz ausgeschöpft. So ein CMS erlaubt z.B. eine bessere Informationarchitektur, mit der man Inhalte auf verschiedene Seiten aufteilen kann. Grober Überblick auf die Startseite, textlastige Details auf andere Seiten, wäre ein typischer Informationsaufbau. WordPress hat auch eigene Terminbuchungs-Kalender, weswegen man nicht auf Drittlösungen zurück greifen muss. So könnte die Website einen professionelleren Eindruck machen.

Ich kenne WPBakery nicht, aber eine LandingPage, oder gar eine komplette Website lässt sich mit Builder-Tools wie Divi besser machen. Zusammen mit einem geeigneten Hoster, wäre dann vielleicht auch eine bessere Performance möglich.

Score: 6/10

Visual Design

Das Design stimmt, allerdings wirkt die Typografie ein wenig unruhig. Es wird zwar immer die selbe Schriftart eingesetzt, aber in verschiedenen Größen. Das kann man machen, aber nur wenn die Texte kürzer sind.

Hier ist ein Beispiel von der selben Art von Text in einem Blickfeld, der unterschiedlich formatiert ist und eigentlich in der selben Größe und Formatierung sein sollte.

Auch der primäre CTA-Button (der zu Calendly führt) sollte immer gleich aussehen; statt dessen gibt es ihn in 3 optischen Varianten.

Der Einsatz von Bild-Icons trägt zur optischen Unruhe bei und wäre für das Design nicht nötig. Zumindest könnte man sie den Überschriften voranstellen.

Score: 8/10

Usability

Die Usability ist gut genug, dass die Botschaft rüber kommt, aber wie oben erwähnt, ist die Benutzerführung etwas spaghetti-artig. Man wird in den Sektions-Buttons von einer Sektion in die andere geschleudert und braucht relativ lange, um zur Haupt-Action zu kommen (wenn man sie ganz oben verpasst hat), der Terminbuchung. Hier könnte ein sticky header provisorisch aushelfen.

Ich würde allgemein einen anderen Aufbau der Sektionen empfehlen:

Überschrift – beschreibenden Ein- bis Zweizeiler – Link zu weiteren Details oder als PopUp – CTA-Button zur Terminbuchung

Die meisten potentiellen Kunden wollen nicht alles durchlesen, bevor sie ein Bootamp buchen. Nicht jeder prüft so scharf oder vertraut dem Text auf Websites. Das persönliche Gespräch ist da eher das Mittel der Wahl und sollte deshalb auch in jeder Sektion stehen, anstelle von Buttons, die in eine andere, darunterliegende Sektion verweisen.

Score: 6/10

Accessibility

Thema Barrierefreiheit, WCAG AA ist Pflicht ab 1. Juli, eine gewisse Quote von Mitarbeitern mit Behinderungen ist auch schon heute in Unternehmen vorhanden. Im Light-Test teste ich nur die Grundlagen, wenn diese erfüllt sind, auch mal mehr.

Der Grün/Weiß-Kontrast ist leider zu wenig, aber es fehlt nicht viel. Ein satteres Grün könnte da schon helfen.

Einen Linkfehler gibt es auch, der Anchor führt nirgendwo auf der Seite hin. Ein Klick auf den Button bleibt wirkungslos.

Und doppelte IDs sind nicht nur invalides HTML, sondern können auch ein paar assistive Technologien verwirren.

Die Überschriften-Hierarchie stimmt nicht. Die sind ein wichtiges Navigationselement für Benutzer assistiver Technologien.

Da die Icons keine zusätzliche Information transportieren, und die wie oben unter “Usability” gesagt, auch gar nicht nötig wären, bräuchten sie kein Alt-Attribut, wenn sie als Hintergrund umgesetzt wären.

Die Timelines, die graphisch schön dargestellt sind, transportieren semantisch zwar die richtige Reihenfolge der Ereignisse in Bootcamps, aber die zeitlichen Abstände gehen dabei verloren. Hier sollte man mit ein paar fürs visuelle Design versteckten Informationen nachhelfen.

Einer der besagten Tielines

Score: 4/10

Communication design

Der Kommunikationsstil ist der Zielgruppe angemessen.

Score: 10/10

Ethical Analysis

Hier scheint vieles korrekt zu sein. Man weiß, mit wem man es zu tun hat und der Betreiber hat auch ein LinkedIn-Profil.

Es werden wenige Drittanbieter eingebunden, eine Datenschutzerklärung existiert. Dort wird allerdings die Existenz des Fingerprint-intensiven hCaptchas verschwiegen. Ein Cookie-Consent-Banner wurde bei meinem Besuch auch nicht geladen.

Ansicht der verschiedenen Fremdresourcen, die die Website lädt.

Score: 6/10

0 Comments

Read on