Muster z

Sobald Sie mit dem Hinzufügen von Elementen mit unterschiedlichem visuellen Gewicht beginnen, ist der Weg, den das Auge durch Ihr Design führt, der Von Ihnen erstellte. Sie können Gutenberg-, F- oder Z-Muster verstärken, wenn Sie möchten, aber Sie sind nicht durch sie eingeschränkt. Das Muster setzt sich weiter unten auf der Seite fort und erstellt weitere Z-Winkel. Und wenn die Zuschauer an vielen Runden ein CTA einbeziehen, werden sie schwer haben, sie zu ignorieren und überredet werden, zu klicken und zu konvertieren. F-Pattern funktioniert, da es den Lesern erlaubt, natürlich zu scannen! Dieses Layout ist natürlich und fühlt es sich wohl, da wir die Lektüre von oben nach unten & von links nach rechts bevorzugen. Es gibt eine Vielzahl von Websites im Bereich der Webanwendungsentwicklung, die dieses Muster verwendet. Die meisten Anzeigen verlassen sich stark auf F-Layout, da es Benutzer-Engagement in einer natürlicheren und komfortableren Art und Weise antreibt. Das Scannen von Z-Pattern erfolgt auf Seiten, die nicht auf den Text zentriert sind (bei textlastigen Seiten wie Artikeln oder Suchergebnissen ist es besser, F-Pattern zu verwenden). Dies macht Z-Muster eine gute Lösung für einfache Designs mit einer minimalen Kopie und ein paar Schlüsselelemente, die gesehen werden müssen. Minimalistische Seiten oder Zielseiten, die sich meist um ein oder zwei Hauptelemente zentrieren, können das Z-Muster implementieren, um das Verfahren des Seitenscannens für die Besucher der Website erheblich zu vereinfachen. In den obigen Beispielen werden Zielseiten – fokussierte Seiten mit einem einzigen Ziel – verwendet, um die effektive Verwendung der F- und Z-Muster zu demonstrieren. Beachten Sie, wie die Hauptkomponente jeder Seite, die CTA im ersten Beispiel und das Formular im zweiten Beispiel, genau entlang des Weges platziert wird, den die Augen einer Person natürlich einnehmen, wenn sie sich die Seite ansehen.

Wenn Sie Ihre wichtigsten Komponenten auf dem natürlichen Pfad platzieren und ein wenig Zielseitenoptimierung durchführen, stellen Sie sicher, dass Sie die meisten Conversions erhalten. Manchmal passt dieser natürliche Pfad genau zum F- oder Z-Muster, aber im Kern geht es bei der Strategie darum, die visuelle Hierarchie zu nutzen, um Menschen zu führen. Alle oben genannten Designelemente sind wichtig, aber dieser Beitrag wird sich auf die Seitenscanmuster konzentrieren, die Eye-Tracking-Studien als relevant für das Lesen von Inhalten im Web erwiesen haben – insbesondere die F- und Z-Muster. Es ist nicht nur wichtig, strukturelle Regeln zu verstehen, sondern auch sensibel auf den Inhalt unserer Texte und Bilder zu reagieren. Während das F-Muster und das Z-Muster als nützliche Werkzeuge für die Strukturierung einer Seite dienen, werden Sie mehr Erfolg finden (und viel mehr Spaß haben), wenn Sie die wahre Kraft des Designs annehmen und eine visuelle Hierarchie erstellen, um die Menschen durch die wichtigsten Teile Ihrer Seite zu führen. Übernehmen Sie die Kontrolle über Ihre Entwürfe und nutzen Sie sie, um Ihre Ziele zu erreichen – Sie werden froh sein, dass Sie es getan haben. Hootsuite verwendet ein F-Muster auf ihrer Zielseite, um die wichtigsten Elemente (über der Falte) hervorzuheben: Wie beim F-Muster, in westlichen Kulturen, die von links nach rechts und oben nach unten lesen, beginnt der Benutzer fast immer in der oberen linken Ecke und scannt über die Oberseite. Das Unterscheidungsmerkmal des Z-Musters ist die “Z”-Form, der es als nächstes folgt. Anstatt nach links zurückzukehren und dann nach unten zu gehen, geht der Blick des Benutzers gleichzeitig nach links und unten und scannt dann erneut eine horizontale Linie von links nach rechts. Textlastige Seiten, z.

B. Blogbeiträge und Suchergebnisse, sind oft effektiver, wenn sie F-Musterlayouts folgen. Schließlich spiegelt diese Art von Design wider, wie unsere Augen dazu neigen, dichten Text natürlich zu lesen und zu verarbeiten. Während das F-Muster ideal für text- oder inhaltslastige Seiten ist, funktioniert das Z-Muster besser für lockerere, spärlichere Seiten. Leider werden die Muster häufig auf Designs angewendet, bei denen es eine vorhandene visuelle Hierarchie gibt, und für Designs, die mehr als Text enthalten.

This entry was posted in Uncategorized by admin. Bookmark the permalink.

Comments are closed.