Designe eine Website

Autor: Judy Howell
Erstelldatum: 25 Juli 2021
Aktualisierungsdatum: 1 Juli 2024
Anonim
5 wichtige Webdesign Prinzipien die JEDER kennen sollte! [Tutorial]
Video: 5 wichtige Webdesign Prinzipien die JEDER kennen sollte! [Tutorial]

Inhalt

Das Entwerfen einer großartigen Website kann eine entmutigende Aufgabe sein, aber solange Sie die Grundlagen im Auge behalten, werden Sie den Prozess interessant und unterhaltsam finden. Es geht um mehr als nur gutes Aussehen! Wir zeigen Ihnen die Grundlagen und einige allgemeine Richtlinien, die Ihnen beim Entwerfen von Websites helfen, die immer wieder besucht werden.

Schreiten

Methode 1 von 2: Die 3 Grundregeln

  1. Regel 1:Hören Sie Ihrem Kunden zu. Möglicherweise entwerfen Sie "die weltweit größte Website aller Zeiten in der Geschichte des Universums und darüber hinaus" mit satten Schwarztönen, raffinierten Schriftarten und leuchtenden, künstlerischen Farben für eine Website, die schreit: "Erkunde mich jetzt!" Leider wollte Ihr Kunde eine orangefarbene Menüleiste mit leuchtend rosa und orangefarbenen Buchstaben. Sie wurden gefeuert und Ihre beste Website aller Zeiten - für die der Client die Rechte hat - befindet sich irgendwo auf seiner Sicherungsdiskette, ohne dass jemand sie jemals wieder sieht.
    • Studieren Sie die Corporate Identity Ihres Kunden. Lassen Sie sich vom Kunden einige Websites zeigen, die er liebt. Dies gibt Ihnen nicht nur eine Vorstellung davon, was sie mögen, sondern gibt Ihnen auch einige Designideen, an die Sie vielleicht nicht gedacht haben.
    • Wenn Sie dachten, wir machten Witze über die orange-rosa Website, sollten Sie diese coole, raffinierte Website in Betracht ziehen:
  2. Regel 2:Kennen Sie Ihr Publikum und was es sucht und passen Sie Ihr Design entsprechend an. Der Grund, warum Menschen Websites haben, ist, dass sie möchten, dass andere sie sehen. Es kann informativ oder kommerziell sein oder eine bestimmte Zielgruppe unterhalten. Ihre Aufgabe als Designer ist es, zu wissen, für wen Sie entwerfen, und sie auf der Seite zu halten, wenn sie dort landen.
    • Sie könnten denken: "Wenn es gut aussieht, werden sie bleiben." Dies muss aber nicht unbedingt der Fall sein. Nehmen wir zum Beispiel Immobilien. Hier ist eine Seite mit einem sauberen, lustigen Design. Es hat viel weißen Raum, der ein offenes Aussehen, helle Farben und ein modernes Breitbildformat mit Links an prominenter Stelle gibt:
    • Schauen Sie sich nun diesen Ansatz für den Verkauf von Immobilien in derselben Gegend an: überladen und sehr beschäftigt, stumpfe Farben und voller Werbung.
    • Ratet mal, welches besser für diejenigen geeignet ist, die ein Zuhause suchen? Richtig, der wo Häuser! Wenn Leute nach „Häusern zum Verkauf in Santa Monica“ suchen, ist es ihnen egal, wie eine Website aussieht. Sie wollen nicht über den Immobilienmakler lesen oder schöne Bilder der Stadt sehen. Sie wollen Häuser sehen.
  3. Regel 3:Höre auf dich selbst. Sie verstehen, was der Kunde will und wissen, wonach Ihr Markt sucht. Jetzt ist es endlich Zeit, auf dich, den Designer, zu achten!
    • Erstellen Sie eine Vorlage in der Grafiksoftware Ihrer Wahl. Erstellen Sie die Elemente Ihrer Seite auf verschiedenen Ebenen (damit Sie später Änderungen vornehmen können, ohne die gesamte Vorlage zu zerstören). Diese Elemente können sein:
      • Header. Dies ist ein Element, das auf jeder Seite Ihrer Website gleich ist. Die Kopfzeile besteht aus dem Titel und dem Logo der Website sowie aus Links zu anderen Teilen der Website (z. B. Info, Kontakt usw.). Optisch und praktisch wird dies alles zusammenhalten. Es wird empfohlen, die erste Schaltfläche in einer Menüleiste wieder mit der Startseite zu verknüpfen.
      • Schauen wir uns zum Beispiel Apple an:
      • Wie bei den meisten Apple-Artikeln ist auch die Homepage sehr sauber und unkompliziert gestaltet. Beachten Sie die Menüleiste oben mit logischen Themen für jede Schaltfläche sowie einem Suchfeld - immer eine gute Idee, wenn Ihre Site dies unterstützt. Schauen wir uns nun eine Zielseite für eine der Schaltflächen, das iPad, an, um einige Elemente zu sehen:
      • Die Menüleiste ändert sich nur durch Abdunkeln der iPad-Taste.
      • Das Thema der Zielseite wird in großen schwarzen Buchstaben angezeigt.
      • Ein neues Untermenü wird angezeigt, in dem Sie mehr über das Produkt erfahren können. Wenn Sie auf eine dieser Schaltflächen klicken, sehen Sie, dass jede Seite je nach Thema neuen Inhalt bietet, jedoch in Layout und Design identisch ist.
      • Oft hat jedes Hauptthema in Ihrer Menüleiste unterschiedliche Unterüberschriften, die Sie ausfüllen müssen. Anstatt eine zweite Menüleiste zu erstellen, können Sie Popup-Menüs wie dieses Beispiel von Musicians Friend verwenden:
      • Seitenleiste. Dies wird auf vielen Seiten Ihrer Website angezeigt, aber nicht unbedingt auf allen - der Kontext bestimmt. Es ist jedoch ein sehr wichtiges Element und muss sorgfältig entworfen werden, um intuitiv und nicht zu überladen zu sein. Im Gegensatz zur Menüleiste kann der Inhalt einer Seitenleiste sehr dynamisch sein. Schauen Sie sich diese beiden Seitenleisten von Real Estate Marketer Trulia an. Die erste ist für Käufer:

Methode 2 von 2: Richtlinien

  1. Entwerfen Sie eine gute Benutzeroberfläche. Positionieren Sie die verschiedenen Elemente der Website wie Titel, Seitenleisten, Logos, Bilder und Text auf jeder Seite an derselben Stelle, um Ihre Website navigierbar und intuitiv zu gestalten.
    • Behalten Sie den gleichen Header oben auf jeder Seite. Stellen Sie sicher, dass der obere Rand jeder Seite gleich ist, unabhängig davon, ob der Inhalt Ihrer Website viele sich wiederholende Elemente zulässt oder nicht.
    • Verwenden Sie Logik in Ihrem Design. Die Elemente auf einer einzelnen Seite sollten logisch nach Wichtigkeit oder Thema geordnet sein. Die verschiedenen Seiten auf der Website sollten auch sein.
  2. Erstellen Sie einen einheitlichen Stil. Wo das Layout Ihrer Site strukturelle Konsistenz verleihen soll, sollte der Stil thematische Harmonie bieten.
    • Halten Sie sich an zwei oder drei Hauptfarben und stellen Sie sicher, dass sie gut zusammenpassen.
    • Vermeiden Sie es, zu viele Schriftstile oder -größen zu verwenden. Wenn Sie einige abwechseln möchten, verwenden Sie sie auf jeder Seite auf die gleiche Weise.
    • Verwenden Sie Cascading Style Sheets (CSS), um einen einheitlichen Stil beizubehalten und das Ändern von Elementen auf einer gesamten Website zu vereinfachen, ohne jede Seite einzeln aufrufen zu müssen.
  3. Maximieren Sie die Lesbarkeit. Um das Lesen Ihres Textes zu erleichtern, können Sie ihn in kleinere Teile aufteilen.
    • Verwenden Sie Untertitel und den richtigen Abstand, um die einzelnen Teile zu trennen.
    • Verwenden Sie fette Buchstaben oder verschiedene Größen, um die Hierarchie und Wichtigkeit der Themen anzuzeigen.
    • Achten Sie darauf, wie Sie mit Text umgehen. Machen Sie die Schrift nicht zu klein und vergrößern Sie den Zeilenabstand, damit große Textblöcke besser lesbar sind. Große Textfelder sind schwieriger zu lesen. Teilen Sie es in kleinere Absätze auf.
  4. Machen Sie Ihre Website universell lesbar. Verwenden Sie Standard-HTML und vermeiden Sie Tags, Funktionen und Plug-Ins, die nur für eine Marke oder Version eines Browsers verfügbar sind.
    • Während die meisten modernen Browser und Computer komplexe Bilder verarbeiten können, sieht alles schlanker aus, wenn Sie Ihre Bilder für das Web verkleinern und optimieren. Wägen Sie die Bedeutung der Qualität gegen die Bedeutung der Geschwindigkeit ab.
  5. Testen Sie Ihre Website. Stelle sicher das Jeder Link funktioniert wie zu erwarten, und Bilder werden korrekt angezeigt.
    • Möglicherweise möchten Sie einige Benutzertests organisieren, indem Mitglieder Ihrer Zielgruppe die Klarheit und Benutzerfreundlichkeit Ihres Designs testen und Feedback zu Ihrer Website geben.
  6. Veröffentlichen Sie Ihre Website. Kaufen Sie einen Domainnamen, falls Sie dies noch nicht getan haben. Überprüfen Sie regelmäßig, ob die Links noch funktionieren, und hören Sie sich Vorschläge an, die Besucher Ihnen per E-Mail senden.

Tipps

  • Während Sie das Layout basierend auf Ihrer persönlichen Vision oder den Dingen, die Sie auf anderen Websites gesehen haben, frei gestalten können, kann es einfacher sein, ein fertiges Design zu kaufen.
  • Bombardieren Sie den Besucher nicht mit niedlichen, besonderen Bildern. Flash-Animationen, leuchtende Farben, gemusterte Hintergründe und Musik, die beim Laden der Seite automatisch abgespielt wird, waren in den 90er Jahren lustige Experimente, aber jetzt werden sie Benutzer abschrecken. Halten Sie sich an einfache Hintergründe, die sich für maximale Lesbarkeit von der Textfarbe abheben.
  • Sie können jederzeit CSS verwenden, um den Absatzabstand zu optimieren.
  • Für Besucher mit Hör- oder Sehbehinderungen können Sie Videos untertiteln, Audio transkribieren und eine Meldung zur Barrierefreiheit hinzufügen. Während Tabellen eine effiziente Möglichkeit zum Organisieren von Informationen darstellen können, hören sehbehinderte Besucher, die eine Bildschirmlese-Software verwenden, das Material möglicherweise nicht in der richtigen Reihenfolge.
  • Lassen Sie Ihre Besucher Tinte sparen: Verwenden Sie zum Drucken von Seiten ein separates Stylesheet.
    • Deaktivieren Sie Hintergrundbilder, wenn Sie die Druckparameter einstellen.
    • Verwenden Sie schwarzen Text auf weißem Hintergrund.
    • Entfernen Sie die Menüleiste und unnötige Bilder.

Warnungen

  • Vermeiden Sie Plagiate und befolgen Sie alle Urheberrechtsgesetze. Fügen Sie keine zufälligen Bilder, die Sie online finden, oder sogar Strukturelemente ohne Genehmigung ein. Alles, was Sie auf Ihrer Website verwenden, muss sowohl legal als auch ethisch sein.