So gestalten Sie eine Website (mit Bildern)

Inhaltsverzeichnis:

So gestalten Sie eine Website (mit Bildern)
So gestalten Sie eine Website (mit Bildern)

Video: So gestalten Sie eine Website (mit Bildern)

Video: So gestalten Sie eine Website (mit Bildern)
Video: Autopflege FAQs: Mikrofaser richtig waschen? Unsere Tipps und Tricks 2024, November
Anonim

In diesem wikiHow zeigen wir dir, wie du eine reibungslose, professionell aussehende Website gestaltest. Während Sie über das Design Ihrer Website frei entscheiden können, gibt es einige wichtige Dinge zu tun und zu vermeiden, wenn Sie eine Website erstellen.

Schritt

Teil 1 von 2: Erstellen eines Site-Designs

Entwerfen einer Website Schritt 1
Entwerfen einer Website Schritt 1

Schritt 1. Entscheiden Sie, ob Sie einen Website-Ersteller verwenden möchten

Das Erstellen einer Website von Grund auf erfordert ein detailliertes Verständnis des HTML-Codes, aber Sie können eine Website mit einem kostenlosen Hosting-Dienst wie Weebly, Wix, WordPress oder Google Sites erstellen. Website-Ersteller sind für unerfahrene Designer in der Regel viel einfacher als HTML.

  • Wenn Sie selbst codieren möchten, sollten Sie HTML- und CSS-Codierung lernen.
  • Wenn Sie nur ungern Zeit und Energie in die Erstellung Ihrer eigenen Website investieren möchten, können Sie einen Website-Designer beauftragen. Die Dienstleistungen freiberuflicher Designer variieren stark, einige werden pro Stunde und andere pro Projekt berechnet, mit einer Gesamtspanne von Millionen bis zu mehreren zehn Millionen Rupien.
Entwerfen einer Website Schritt 2
Entwerfen einer Website Schritt 2

Schritt 2. Erstellen Sie eine Sitemap

Bevor Sie den Website-Ersteller öffnen, sollten Sie festgestellt haben, wie viele Seiten sich auf der Site befinden, welchen Inhalt jede Seite hat und wie das allgemeine Layout wichtiger Seiten wie "Startseite" und "Über uns" ist.

Es wird Ihnen leichter fallen, die Seiten Ihrer Site zu visualisieren, indem Sie grobe Bilder erstellen, nicht nur Schatten

Entwerfen einer Website Schritt 3
Entwerfen einer Website Schritt 3

Schritt 3. Verwenden Sie ein intuitives Design

Während neue Ideen normalerweise interessant sind, sollten grundlegende Designs diesen allgemeinen Richtlinien folgen:

  • Navigationsoptionen (z. B. mehrere Registerkarten für verschiedene Seiten) sollten oben auf der Seite platziert werden.
  • Wenn Sie das Menüsymbol (☰) verwenden, sollte es sich in der oberen linken Ecke der Seite befinden.
  • Wenn Sie die Suchleiste verwenden, platzieren Sie sie oben rechts auf der Seite.
  • Hilfreiche Links (z. B. Links zu den Seiten "Über" oder "Kontakt") sollten sich am Ende der Seite befinden.
Entwerfen einer Website Schritt 4
Entwerfen einer Website Schritt 4

Schritt 4. Seien Sie konsequent

Unabhängig davon, welchen Text, welche Farbpalette, welches Bildthema und welches Design Sie wählen, stellen Sie sicher, dass Sie auf Ihrer gesamten Website dieselben Entscheidungen treffen. Benutzer werden überrascht sein, dass sich die Schriftart und das Farbschema auf der "Info"-Seite stark von der auf der Startseite unterscheiden.

  • Wenn Sie beispielsweise eine sanfte Farbe für Ihre Startseite verwenden, verwenden Sie auf der nächsten Seite keine helle Farbe.
  • Beachten Sie, dass die Verwendung von hellen oder kollidierenden Farben, insbesondere dynamisch angezeigten (oder sich bewegenden) Farben, bei einer Minderheit der Benutzer Anfälle oder epileptische Anfälle auslösen kann. Wenn Sie sich für die Verwendung einer solchen Farbe entscheiden, stellen Sie sicher, dass Sie vor der betreffenden Seite eine Warnung vor "Anfallrisiko" einfügen.
Entwerfen einer Website Schritt 5
Entwerfen einer Website Schritt 5

Schritt 5. Navigationsoptionen hinzufügen

Das Platzieren von direkten Links zu wichtigen Seiten über der Startseite hilft neuen Besuchern, die für sie wichtigen Inhalte zu finden. Die meisten Website-Ersteller fügen diesen Link standardmäßig hinzu.

Es ist wichtig sicherzustellen, dass alle Seiten der Site durch Klicken auf eine Option innerhalb der Site aufgerufen werden können und nicht nur über die Seitenadresse aufgerufen wird

Entwerfen einer Website Schritt 6
Entwerfen einer Website Schritt 6

Schritt 6. Verwenden Sie passende Farben

Wie alle Gestaltungsformen setzt auch das Website-Design auf gefällige Farbkombinationen. Daher ist die Wahl einer passenden Themenfarbe sehr wichtig.

Wenn Sie verwirrt sind, beginnen Sie mit Schwarz, Weiß und Grau

Entwerfen einer Website Schritt 7
Entwerfen einer Website Schritt 7

Schritt 7. Betrachten Sie ein minimalistisches Design

Das minimalistische Konzept fördert die Verwendung von kühlen Tönen, schlichten Grafiken, schwarzen Textseiten auf weißem Hintergrund und so wenig Schnickschnack wie möglich. Da ein minimalistisches Design nur sehr wenige Elemente erfordert, ist es eine einfache Möglichkeit, Ihre Website ohne großen Aufwand professionell und attraktiv aussehen zu lassen.

  • Die meisten Website-Ersteller bieten ein "minimalistisches" Design an, aus dem Sie beim Erstellen einer Website auswählen können.
  • Die minimalistische Alternative ist "Brutalismus", die härtere Worte, helle Farben, fetten Text und minimale Grafiken verwendet. Es gibt weit weniger Benutzer brutalistischer Designs als Minimalisten, aber wenn der Inhalt angemessen ist, kann dieses Design eine gute Wahl sein.
Entwerfen einer Website Schritt 8
Entwerfen einer Website Schritt 8

Schritt 8. Wenden Sie einzigartige Optionen an

Raster- und gerade Linienelemente sind eine sichere Wahl, aber einige einzigartige Stile verleihen Ihrer Website eine persönliche Note und heben sich von den anderen ab.

  • Haben Sie keine Angst, sich dem Trend zu widersetzen, indem Sie asymmetrische Site-Elemente platzieren oder gestapelte Elemente verwenden, um einen mehrschichtigen Look zu erzielen.
  • Elegante, scharfkantige quadratische Elemente (sogenannte kartenbasierte Präsentation) sind jedoch weniger wünschenswert als weiche, abgerundete Elemente.

Teil 2 von 2: Maximierung der Site-Leistung

Entwerfen einer Website Schritt 9
Entwerfen einer Website Schritt 9

Schritt 1. Nutzen Sie die Möglichkeiten zur Autooptimierung

Mobile Browser bringen mehr Datenverkehr als Desktop-Browser. Dies bedeutet, dass Sie der mobilen Version mindestens die gleiche Aufmerksamkeit schenken sollten wie der Entwicklung der Desktop-Site. Die meisten Auto-Creator-Websites haben bereits eine Autoversion erstellt. Beachten Sie jedoch die folgenden Informationen für mobile Websites:

  • Stellen Sie sicher, dass Schaltflächen (z. B. Sitelinks) groß und leicht zu tippen sind.
  • Vermeiden Sie Funktionen, die auf mobilen Geräten nicht sichtbar sind (zB Flash, Java, etc.).
  • Ziehen Sie in Erwägung, eine Auto-App für Ihre Website zu erstellen.
Entwerfen einer Website Schritt 10
Entwerfen einer Website Schritt 10

Schritt 2. Fügen Sie nicht zu viele Fotos pro Seite ein

Desktop- und mobile Browser haben manchmal Probleme beim Laden von Seiten mit vielen Fotos oder Videos. Während Bilder im Webdesign sehr wichtig sind, können übermäßig viele Medien pro Seite die Ladezeiten verlängern, was Benutzer davon abhält, diese Seiten zu besuchen.

Im Allgemeinen sollte das Laden einer Seite weniger als vier Sekunden dauern

Entwerfen einer Website Schritt 11
Entwerfen einer Website Schritt 11

Schritt 3. Fügen Sie eine "Kontakt"-Seite hinzu

Möglicherweise stellen Sie fest, dass die meisten Websites eine "Kontakt"-Seite bereitstellen, die Kontaktinformationen (wie Telefonnummer und E-Mail-Adresse) enthält. Tatsächlich bieten einige Websites auf dieser Seite ein automatisiertes Anfrageformular an. Die "Kontakt"-Seite ist eine direkte Kommunikationsverbindung zwischen Website-Besuchern und Ihnen, was bedeutet, dass sie auch eine Lösung für die Frage oder Frustration eines Besuchers ist.

Entwerfen einer Website Schritt 12
Entwerfen einer Website Schritt 12

Schritt 4. Erstellen Sie eine benutzerdefinierte 404-Seite

Wenn ein Besucher auf eine bestimmte Seite gelangt, die nicht erstellt wurde oder nicht existiert, wird eine Seite mit dem Fehler 404 angezeigt. Die meisten Browser bieten eine integrierte 404-Seite, aber Sie können ihr Aussehen in den Einstellungen des Website-Erstellers anpassen. Wenn Sie eine benutzerdefinierte 404-Seite erstellen möchten, geben Sie die folgenden Details ein:

  • Lustige und lustige Fehlermeldungen (z. B. "Herzlichen Glückwunsch, Sie sind auf einer Fehlerseite gelandet!")
  • Link zurück zur Startseite
  • Liste der Links, die Besucher normalerweise sehen
  • Das Bild oder Logo Ihrer Website
Entwerfen einer Website Schritt 13
Entwerfen einer Website Schritt 13

Schritt 5. Geben Sie nach Möglichkeit die Suchleiste ein

Wenn die von Ihnen verwendete Website-Erstellungsmethode das Hinzufügen einer Suchleiste unterstützt, empfehlen wir, sie hinzuzufügen. Dadurch wird sichergestellt, dass Benutzer die gewünschte Seite oder den gesuchten Inhalt finden können, ohne sich durch alle Navigationsoptionen klicken zu müssen.

Die Suchleiste ist auch sehr nützlich, wenn Besucher nach allgemeinen Begriffen suchen möchten, ohne sich in zufälligen Seiten zu versuchen

Entwerfen einer Website Schritt 14
Entwerfen einer Website Schritt 14

Schritt 6. Achten Sie mehr auf die Startseite

Wenn Besucher die Startseite aufrufen, sollten sie den Kern des Themas Ihrer Website kennen. Außerdem sollten alle Elemente der Startseite schnell geladen werden, inklusive Navigationsmöglichkeiten und Bildern. Die Homepage sollte auch die folgenden Aspekte bieten:

  • Call-to-Action (z. B. eine Schaltfläche zum Klicken oder ein Formular zum Ausfüllen)
  • Symbolleiste oder Navigationsmenü
  • Einladende Grafiken (z. B. ein durchgehendes Foto, Video oder mehrere Fotos mit ergänzendem Text)
  • Keywords, die sich auf den Service, das Thema oder den Schwerpunkt Ihrer Website beziehen
Entwerfen einer Website Schritt 15
Entwerfen einer Website Schritt 15

Schritt 7. Testen Sie Ihre Website auf verschiedenen Browsern und Plattformen

Dies ist sehr wichtig, da Browser Aspekte einer Website auf unterschiedliche Weise verarbeiten. Bevor Sie für Ihre Site werben, versuchen Sie, Ihre Site in den folgenden Browsern auf Windows-, Mac-, iPhone- und Android-Plattformen zu öffnen und zu verwenden:

  • Google Chrome
  • Feuerfuchs
  • Safari (nur iPhone und Mac)
  • Microsoft Edge und Internet Explorer (nur Windows)
  • Der Standardbrowser einiger Android-Telefone (Samsung Galaxy, Google Nexus usw.)
Entwerfen einer Website Schritt 16
Entwerfen einer Website Schritt 16

Schritt 8. Halten Sie die Site auf dem neuesten Stand

Designtrends, Links, Fotos, Konzepte und Schlagworte ändern sich ständig. Auch Sie müssen also immer Veränderungen vornehmen, um mit der Zeit Schritt zu halten. Sie sollten die Leistung Ihrer Website mindestens einmal alle drei Monate (vorzugsweise öfter) überprüfen und mit ähnlichen Websites vergleichen.

Tipps

  • Barrierefreiheit ist auch ein ebenso wichtiger Aspekt bei der Website-Entwicklung. Die Barrierefreiheit umfasst Beschreibungen für hörgeschädigte Besucher, Audiobeschreibungen für sehbehinderte Besucher und Lichtempfindlichkeitswarnungen, wenn Ihre Website potenziell anfallsauslösende Effekte verwendet.
  • Die meisten Website-Ersteller stellen Vorlagen bereit, mit denen Sie das Layout und das Design bestimmen können, bevor Sie die gewünschten Elemente hinzufügen.

Warnung

  • Die meisten YouTuber-Websites sind kostenlos, aber wenn Sie Ihre eigene Domain verwenden möchten (z. B. "www. Ihrname.com" anstelle von "www. Ihrname.wordpress.com"), müssen Sie eine monatliche oder jährliche Gebühr zahlen.
  • Vermeiden Sie Plagiate und lernen Sie alle Urheberrechte kennen. Fügen Sie ohne Genehmigung keine zufälligen Bilder aus dem Internet oder Strukturelemente ein.

Empfohlen: