So Erstellen Sie Ein Website-Layout

Inhaltsverzeichnis:

So Erstellen Sie Ein Website-Layout
So Erstellen Sie Ein Website-Layout

Video: So Erstellen Sie Ein Website-Layout

Video: So Erstellen Sie Ein Website-Layout
Video: So erstellen wir ein Webseiten Layout für einen Kunden | Web Labels 2024, April
Anonim

Im letzten Jahrhundert war das Layout von Webseiten die Domäne einiger weniger Profis. Der technische Fortschritt hat diese Aufgabe stark vereinfacht. Jetzt kann jeder Internetbenutzer eine Website erstellen.

So erstellen Sie ein Website-Layout
So erstellen Sie ein Website-Layout

Es ist notwendig

  • - Softwarepaket für das Layout von Webseiten;
  • - ein Rastergrafikeditor zum Erstellen von Designelementen.

Anleitung

Schritt 1

Erstellen Sie eine Liste der Elemente, die auf der Site vorhanden sein werden. Dies können Komponenten wie ein Navigationsmenü, ein Suchformular, ein Werbe- oder Informationsbanner, eine Freundesliste sein. Der Name des Projekts wird normalerweise oben auf der Seite angezeigt, es kann ein horizontales Navigationsmenü geben. Der zentrale Teil ist dem Hauptinhalt der Site zugeordnet. Am unteren Rand der Seite sind normalerweise Anwesenheitszähler platziert, Kontaktinformationen für Feedback.

Schritt 2

Erstellen Sie ein Website-Layout in einem grafischen Editor. Die Hauptaufgabe besteht hier darin, das Aussehen der Elemente und ihre relative Position zu bestimmen. Verwenden Sie keine zu hellen Farben. Eine neutrale Farbpalette wird am besten wahrgenommen. Verwenden Sie einen einheitlichen Stil für die Blöcke. Versuchen Sie, das Design so benutzerfreundlich wie möglich zu gestalten. Vermeiden Sie Elemente, die in HTML und CSS schwer zu implementieren sind.

Schritt 3

Speichern Sie das Seitenlayout im Bitmap-Format ohne Qualitätsverlust. Definieren Sie die zu rendernden Stilelemente mit HTML. Dies können Menüs, Links, Tabellen, Suchformulare sein. Extrahieren Sie die restlichen Elemente aus dem Layout und speichern Sie sie in separaten Dateien. Erstellen Sie zwei Textdokumente auf Ihrer Festplatte. Ändern Sie die Erweiterung einer von ihnen in.htm. Es enthält den Code, der für die relative Position der Elemente verantwortlich ist. Die zweite Datei enthält die Stylesheets.

Schritt 4

Öffnen Sie die erste Datei in einem HTML-Editor. Platzieren Sie auf der Seite Gestaltungselemente, die zuvor in Bitmap-Dateien gespeichert wurden. Erstellen Sie Textlinks, Tabellen und andere Elemente, die in HTML gerendert werden müssen. Attribute von Elementen, wie Farbe, Schriftgröße, Vorhandensein von Rahmen, in eine CSS-Datei schreiben. Wenn Sie Seitenelemente animieren müssen, verwenden Sie JavaScript.

Empfohlen: