Menschen bauen Websites aus vielen Gründen: um ein breiteres Publikum zu erreichen; zu verkaufen, zu fördern oder auszudrücken; den Gruppenzwang beschwichtigen. Neuheit hat aufgehört, ein Grund um 2001 zu sein. An seiner Stelle haben wir natürlich: Natürlich habe ich eine Website; natürlich müssen Sie eine Facebook-Wand, einen Twitter-Account, ein LinkedIn-Profil oder ein Pinterest-Board haben; Natürlich haben wir alle Emails.

Und natürlich verwendet Webdesign HTML und CSS - zwei Sprachen, mit denen Browserhersteller und Designer eine gemeinsame Basis finden. Aber viele Webdesigner schaffen erstaunliche Vielfalt mit den gleichen Sprachregeln, indem sie fragen, ob, statt natürlich zu fallen.

Andere bleiben bei dem, was funktioniert.

Diejenigen, die der herkömmlichen Weisheit folgen, benutzen nicht nur die Sprache, sondern die gleichen Sätze - in Webbegriffen nicht nur HTML / CSS, sondern auch Arial und Georgia, 960 Pixel breite Layouts oder unterstrichene blaue Links. Die Verwendung solcher Konventionen ist nicht falsch. Aber Designer, die sich nicht für etablierte Muster entscheiden - die der herkömmlichen Weisheit folgen, ohne nach dem Warum zu fragen - verpassen Gelegenheiten.

Die Standardstruktur

Die standardmäßige, einstufige Struktur hat praktische Vorteile. Es ist einfach und einfach ist gut für Termine. Noch wichtiger ist es vertraut. Sowohl die Web-Browsenden als auch die Webdesigner haben unausgesprochene Einigkeit darüber, wie Websites funktionieren. Nach dem Muster home / services / about / contact bedienen Designer und Publikum gleichermaßen ihre Erwartungen.

Andere Begriffe sind so offensichtlich, dass sie leicht zu übersehen sind:

  • Die Benutzer erwarten, dass beim Klicken auf das Wort "Kontakt" E-Mail- oder Telefondetails angezeigt werden.
  • Sie wissen, dass sie in der oberen linken Ecke einer Seite einen Link finden werden. In Verbindung mit einem Logo natürlich.
  • Sie sehen Copyright-Erklärungen in der Fußzeile, oft auf der linken Seite, mit einem Jahr.
  • Sie wissen, dass Websites auf und ab scrollen, nicht Seite an Seite.

Das Gelernte wird durch Reibungserleichterung gemildert. Aber Designer, die Konventionen befolgen, mit oder ohne es zu realisieren, verstärken die Konventionen selbst.

  • Klicken Sie auf das Logo und erhalten Sie ein Kontaktformular? "Das habe ich nicht erwartet."
  • Klicken Sie auf einen Link, der sagt "Lesen Sie mehr" und erhalten Sie eine Pay Wall? "Gib mir einfach den Artikel."
  • Scrollen horizontal statt vertikal? "Das ist komisch. Ist es kaputt?"
  • Die prominenteste Grafik am unteren Rand einer Seite? "Es ist verkehrt herum."

Es ist leicht, die offensichtliche Schlussfolgerung zu ziehen: Brechen Sie die Konvention und riskieren Sie, Menschen zu entfremden.

Aber nicht alle Konventionen sind absolut. Die meisten Websites folgen den Regeln mit ihren eigenen stilistischen Unterschieden. Nicht jeder Link auf jeder Seite ist unterstrichener blauer Text. Nicht jedes Foto ist gleich groß. Nicht jedes Layout verwendet die gleiche Anordnung von Spalten. Menschen passen sich an, weil Variationen von Konventionen selbst Konventionen sind. Leute erwarten, Macken zwischen Seiten zu finden.

Wie erhalten unkonventionelle Websites in diesem Fall einen brechenden Rang? Ihre Designer erfinden neue Konventionen, die leicht zu erlernen sind.

Adaptives Denken

Das alte Sprichwort "brich nicht, was nicht kaputt ist" ist ein guter Rat, bis jemand die Definition von "kaputt" ändert.

Seit Beginn des Webs konnten sich Designer darauf verlassen Bildschirme mit einer Breite von mindestens 640 Pixel . In letzter Zeit sind 1024 Pixel und mehr üblich. Ab 2007 sehr kleinGadgets Websites in die Hände von Menschen legen. Plötzlich entwerfen für 320 Pixel war in Mode .

Aber gezwungen, sich zu ändern und zu wählen , sind unterschiedliche Einstellungen. Kreativität hat keine Angst, einem Weg größeren Widerstands zu folgen.

Roberts

Die Roberts-Gruppe Die Website experimentiert mit einem gitterbasierten Layout. Benutzer navigieren auf ihrer Site mit einer "Literal Site Map". Textlinks bieten einen Rückfall für Benutzer, die sich mit dem Grid nicht wohl fühlen.

Wie man Konventionen bricht

Nicht jedes Risiko zahlt sich aus. Die meisten unkonventionellen Webdesigns scheitern nicht, weil sie Muster brechen, sondern weil sie neue Versprechen nicht kommunizieren. Der Trick besteht darin, zu erkennen, warum die Konventionen entstanden sind.

1. Setzen Sie einen Home Link mit einem Logo in der oberen linken Ecke

Problem: Besucher einer komplexen Website können verloren gehen. Ein zuverlässiger Link auf der Homepage fungiert als Reset-Button der Site.

Herkömmliches Denken: Jede Seitenladung beginnt oben auf einer Seite. Da die meisten Web-Layouts nach unten scrollen, ist der Anfang jeder Seite der logischste Ort für eine zuverlässige Schaltfläche.

Unkonventionelles Denken:

  • Verwenden Sie position: fixed, um eine Home-Schaltfläche an der gleichen Stelle in den Browsern der Besucher zu behalten, nicht nur auf der Seite
  • Ermutigen Sie die Nutzer, mit einem prominenten Link unten auf den Seiten durch die Inhalte zu blättern
  • Entfernen Sie die Homepage zugunsten von eine reiche Navigationsleiste

2. Eine Liste von Artikeln wird ihre Titel, Bilder oder "mehr lesen" klickbar machen

Problem: Menschen brauchen offensichtliche Hinweise, um Informationen zu erhalten, die Titel und Beschreibungen versprechen.

Herkömmliches Denken: Titel und Thumbnails repräsentieren am besten den Inhalt, den sie beschreiben. Der kürzeste Weg zu "Ich möchte mehr darüber lesen" besteht darin, es klickbar zu machen. Daher können Titel und Miniaturansichten anklickbar gemacht werden.

Unkonventionelles Denken:

  • Machen Sie den gesamten Teaser - Bild, Titel und Beschreibung - klickbar. Links mit mehr Oberfläche sind gut für mobiles Design und einfach mit CSS zu erstellen
  • Stellen Sie es auf den Kopf: Führen Sie mit einem oder zwei zwingenden Sätzen, dann fügen Sie den anklickbaren Titel darunter in kleinerem Text ein
  • Anstatt "Jetzt lesen", können Benutzer Artikel zu einer Warteschlange hinzufügen, um sie in der von ihnen gewählten Reihenfolge zu lesen

3. Entwerfen Sie eine Vorlage, bevor Sie den Inhalt schreiben

Problem: Ästhetik, nicht Code oder Semantik, schaffen den ersten Eindruck einer Site.

Herkömmliches Denken: Gestalten Sie zuerst das Aussehen der Website. Lassen Sie ein Leerzeichen für den Inhalt.

Unkonventionelles Denken:

  • Verwenden Sie Typografie und Farbe, um den Inhalt mit Stimmung, Stimme und Charakter zu füllen. Dann Design-Elemente, die diesen Charakter bei Bedarf wie Hintergrundtexturen und Sidebars verstärken.
  • Machen Sie den Hintergrund Teil des Inhalts. Ändern Sie die Farben pro Seite, um die Stimmung, das Thema oder die Funktion wiederzugeben.
  • Blenden Sie die Seitenleisteninformationen aus oder verringern Sie sie, bis der Benutzer darauf achtet.
Stories at Longboard World

Geschichten bei Longboard World trotzt nicht nur der Regel "Teaser muss Text sein", sondern lernt daraus eine Lektion Fitts Gesetz indem Sie die gesamte Notecard anklickbar machen.

Richtlinien zu Regeln

Das erlernte Verhalten der Öffentlichkeit zu brechen bedeutet, ein Versprechen zu brechen. Konventionen stehen für Vertrauen. Der beste Weg, etablierte Regeln zu durchbrechen, besteht also nicht darin, sie zu brechen, sondern sie zu ersetzen.

1. Ersetzen, nicht brechen, Regeln

Um die Konvention zu ändern, müssen wir respektieren, warum alte Regeln funktionierten.

  • Frühe Browser mussten Links sichtbar machen, daher unterstrichen sie den anklickbaren Text.
  • Textzeilen, die breiter als 400 Pixel sind, können nur schwer Zeile für Zeile folgen. Die Spalten kürzen nicht nur Linien, sondern ermöglichen auch eine horizontale Organisation.
  • Content-reiche Websites verursachen organisatorische Kopfschmerzen. Mithilfe von Suchwerkzeugen können Nutzer nach einer bestimmten Wortgruppe suchen, anstatt willkürliche Kategorien zu durchsuchen.

2. Halten Sie sich an Ihre eigenen Regeln

Sobald die Leute zum Beispiel orangefarbene Schachteln mit Links assoziieren, sollte das Design nicht von diesem Versprechen abweichen. Jedes Mal, wenn ein orangefarbener Kasten auf eine neue Seite klickt, wird diese Regel verstärkt. Jede orangefarbene Box, die das Gegenteil bewirkt, wird die Regel verschlechtern.

3. Gib es Zeit

Sowohl die öffentlichen als auch die widerstrebenden Website-Eigentümer gewinnen durch ihre Präsenz Vertrauen. Design kann helfen, indem man die Lernkurve senkt - die Regeln werden klar.

4. Verwenden Sie Ziele

Konventionen funktionieren. Sie sind einfach für Designer und Publikum gleichermaßen. Für die Veränderung zu brechen, tut niemandem einen Gefallen. Ziehe die Probleme vielmehr überdenken.

  • Der Volkskonsens steht dieser Legislatur entgegen. Wenn Leute die Website besuchen, haben wir weniger als eine Sekunde, um sie zu gewinnen. Wie können wir den Geist so schnell ändern?
  • Wir möchten mehr als 200 Fotos zeigen. Wie können wir das Navigieren für Menschen so einfach machen?
  • Unsere Produkte sind sicher, aber wir haben den Ruf, sich nicht um die Umwelt zu kümmern. Pressemitteilungen bedeuten nichts. Wie können wir im Subtext ernsthaftes Interesse zeigen?
  • Wir haben ein Überangebot an Inventar. Niemand kauft. Wie können wir das zu unserem Vorteil nutzen?
Evolution of the Web

Evolution des Webs wagt es, die "Rechtsfalte" des Browsers zu brechen, indem er sich seitwärts erstreckt. Die Animation am Start zeigt den Nutzern, was sie für das Side-Scrolling bekommen.

Mit der Weiterentwicklung des Webdesigns ist das Einhalten von Konventionen risikoreicher als das Experimentieren. Wenn die Öffentlichkeit unkonventionelle Designs bemerkt, die gut funktionieren, ob mobil oder nicht, werden sie auch auf Websites aufmerksam, die sich auf die Konventionen von gestern beschränken. Designer, die dies bestätigen, können große Fortschritte beim Aufbau besserer Websites machen.

Brechen Sie Regeln oder gehen Sie auf Nummer Sicher? Welche Regeln des Webdesigns würden Sie gerne umschreiben? Lassen Sie es uns in den Kommentaren wissen.

Ausgewähltes Bild / Vorschaubild, unkonventionelles Bild über Shutterstock