Website-Wireframes sind einfache Strichzeichnungen, die die Platzierung von Elementen auf einer Webseite zeigen. Sie können sich viel Zeit sparen, indem Sie das Layout eines einfachen Drahtgitters zu Beginn des Entwurfsprozesses bearbeiten und nicht später einen komplexen Entwurf.
Die Verwendung von Wireframes ist eine großartige Möglichkeit, um ein Website-Projekt zu beginnen, da Sie und Ihr Kunde sich auf das Layout konzentrieren können, ohne sich von Farbe, Typ und anderen Designelementen ablenken zu lassen. Konzentrieren Sie sich darauf, was auf Ihren Webseiten wohin geht und wie viel Platz jedes Element beansprucht, was sich nach den Bedürfnissen Ihres Kunden richtet.
Was ist in einem Website-Drahtmodell enthalten?
Alle wichtigen Elemente einer Webseite sollten in Ihrem Website-Drahtmodell dargestellt werden. Verwenden Sie einfache Formen anstelle von tatsächlichen Grafiken und beschriften Sie sie. Diese Elemente umfassen:
- Navigation: Schaltflächen, mit denen Benutzer die Hauptbereiche Ihrer Website besuchen können.
- Firmenlogo: Kann nur durch eine Box dargestellt werden.
- Inhaltsbereiche: Wo erscheinen Ihre verschiedenen Inhaltsbereiche?
- Suchfelder
- Benutzeranmeldebereiche
So erstellen Sie Website-Wireframes
Es gibt verschiedene Möglichkeiten, ein Wireframe für eine Website zu erstellen. Sie beinhalten:
Es von Hand auf Papier zeichnen
Diese Methode ist praktisch, wenn Sie sich mit einem Kunden persönlich treffen. Skizzieren Sie Ihre Layoutideen auf Papier mit einem Fokus darauf, welche Elemente wohin gehen sollen.
Verwenden von Adobe Photoshop, Illustrator oder anderer Software
Die meisten Grafiksoftwarepakete sind mit allen grundlegenden Tools ausgestattet, die zum Erstellen von Wireframes erforderlich sind. Sie benötigen lediglich einfache Linien, Formen und Text (zur Bezeichnung Ihrer Elemente), um ein darstellbares Drahtgitter zu erstellen.
Verwenden von Software, die für diesen Aufgabentyp erstellt wurde
Während Photoshop und Illustrator den Trick ausführen können, wurden einige Softwarepakete speziell für diese Art von Arbeit entwickelt. OmniGraffle ist eine Software, die die Erstellung von Drahtgittern vereinfacht, indem Form-, Linien-, Pfeil- und Textwerkzeuge auf einer leeren Leinwand zur Verfügung gestellt werden. Sie können sogar benutzerdefinierte Grafiksets (kostenlos) bei Graffletopia herunterladen, wodurch Sie mehr Elemente wie gewöhnliche Web-Schaltflächen zum Arbeiten erhalten.
03 von 03Die Vorteile
Mit Website-Wireframes haben Sie den Vorteil, dass Sie eine einfache Strichzeichnung anpassen, um das gewünschte Layout zu erreichen. Anstatt komplexe Elemente auf einer Seite zu verschieben, kann es sehr wenig Zeit dauern, ein paar Boxen an neue Positionen zu ziehen. Es ist auch viel produktiver für Sie oder Ihren Kunden, sich zuerst auf das Layout zu konzentrieren… Sie beginnen nicht mit Kommentaren wie „Ich mag diese Farbe dort nicht!“ was für Ihr Design.
