Web Design: Wie Inhalt auf einer Webseite präsentiert

Wenn Ihr Drahtmodelle bauen, denken Sie daran, dass Sie nicht auf eine statische Darstellung von Text und Grafiken beschränkt sind. Viele Technologien, von Flash-Animation zu DHTML, helfen Sie Ihren Platz auf der Seite und präsentieren Inhalte in interessanter und interaktiver Weise zu maximieren.

Anzeigetext auf einem Drahtgitter

Weil Sie gleich Wireframes mit Kunden und Teammitgliedern teilen, geben Sie alle Navigationselemente und Schlagzeilen für großen Content-Abschnitte mit lesbaren Text zu ihnen orientieren. Alle anderen Kopie Komponenten können mit angegeben werden, so genannte griechischText (die eigentlich Latein Kauderwelsch ist), die ihnen zugewiesenen Zeichenzahl (die Anzahl der Buchstaben, Satzzeichen und Leerzeichen) reflektiert, so dass Sie ein Gefühl der eigentliche Text-Blockgröße zu bekommen.

Sie können die Web-Suche Lorem ipsum Generator zu finden Websites, die Absätze der griechischen Text erzeugen - und sogar spezifischen Charakter zählt -, die Sie direkt in Ihre Wireframes kopieren und einfügen können.

bild0.jpg

Das Arbeiten mit einem Content-Management-System

EIN Content-Management System ist eine benutzerfreundliche Website oder Anwendung, die Site-Administratoren sicheren Zugriff auf die Datenbank, die ihre Website auffüllt bietet. Mit der Anmeldung bei einem CMS kann eine Website-Manager leicht hinzufügen, entfernen und den Inhalt in der Datenbank gespeichert aktualisieren. Der Vorteil eines CMS der Verwendung von Text und Grafiken zu speichern, ist, dass, wenn Sie eine Reihe von Content-Typen definieren, wie # 147-Kurzbeschreibung, # 148- # 147-Produktname, # 148- und # 147-Miniatur Bild, # 148- Sie Instanzen dieser Objekte zu erstellen, füllen sie mit tatsächlichen Kopie oder Bilder, und sie dann auf einen oder mehrere Web-Seiten zuweisen. Auf diese Weise, wenn Sie die Instanz im CMS aktualisieren, aktualisiert die Inhalte automatisch überall dort, wo es auf der Website verwendet wird. Diese Strategie trennt den Inhalt von der Webseite Präsentation Ihnen mehr Flexibilität für zukünftige Gestaltung und inhaltliche Änderungen zu geben, so dass die Website leichter zu pflegen.

Wenn Ihre Website ein Content Management System verwendet, arbeitet ein Content Strategist eng mit dem Architekten-Informationen (auf kleineren Teams, kann dies ein und derselben Person) zunächst die verschiedenen Inhaltstypen identifizieren eine Website hat und dann bestimmen, welche Inhaltstypen gehen auf jeder Seite.

Maximieren Sie Ihr Platz auf dem Web

Die meisten Menschen haben einen kleinen Computer-Monitore, und viele Menschen Websites, die über Smartphones und Geräte durchsuchen. Wenn Sie ein 8-1 # 8260-2 x 11-Zoll-Stück Papier horizontal halten, sind Sie auf die Größe der meisten Menschen Fenster auf dem World Wide Web suchen. Nachdem Sie in der Browser-Schnittstelle mit allen Tasten auf der Oberseite, Favoriten Registerkarten und blättern Kontrollen Faktor wird der Betrachtungsraum auf dem Web gewidmet zu einer Postkartengröße gestutzt oder etwa 800 x 600 für viele Benutzer. Diese dürren Fenster ist Ihre Web-Design Leinwand.

Hier sind einige organisatorische und interaktive Strategien, die Sie besser zu helfen, Ihre Inhalte auf dieser wee wenig Raum präsentieren:

  • Blättern Sie weniger wichtige Inhalte zu sehen. Sie können nicht einfach alles in den sichtbaren Bereich schieben - die ersten 800 x 600 Pixel des Browserfensters. So legen Sie die Elemente mit hoher Priorität innerhalb dieser ersten Fenster und Objekte mit niedrigerer Priorität unter der Falte.

    Geben Sie visuelle Hinweise Benutzer wissen, mehr Material unter der Falte ist durch gezielte Schlagzeilen oder die Spitzen der Bilder zeigt, die unten zu mehr Material führen. Benutzer nicht stört Scrollen, nur so lange, wie die Seite nicht ewig weitergehen. Eine gute Regel ist es, die gesamte Seitenhöhe auf das Doppelte der ursprünglichen sichtbaren Höhe (so 1200 Pixel für eine 800-Wide-by-600-hoch-Seite) zum Ziel.

  • Verwenden Sie zu horizontalen Raum. Sie können 5-Technologien wie Flash oder HTML verwenden horizontal zu präsentieren Inhalt oder ein Scrollen # 147-Karussell # 148- Inhalts drehen.

  • Layer Ihre Inhalte. Eine andere Möglichkeit, den Betrachtungsraum zu maximieren Schichten von Inhalten auf der Web-Seite zu zeigen, wie der Benutzer den Mauszeiger über oder klickt etwas. Sie können Inhalte Schichten durch Technologien wie javascript, DHTML (Dynamic HTML) und Flash-und ausblenden.

    Ein Benutzer Rollover erweitert diese Content-Modul auf einem Disney-Website, um mehr Informationen zu offenbaren. [Kredit
    Ein Benutzer Rollover erweitert diese Content-Modul auf einem Disney-Website, um mehr Informationen zu offenbaren.
    DHTML kann ein & # 147-enhanced & # 148- Drop-Down-Menü erzeugen, das die organisierte Optionen bietet, wenn ein Benutzer
    DHTML kann ein produzieren # 147-enhanced # 148- Drop-down-Menü, das die organisierte Optionen bietet, wenn ein Benutzer den Mauszeiger über einen Navigationspunkt.
  • Entwerfen Sie eine Drehtür des Inhalts. Da Web-Seite Raum an einer Prämie ist, dass Sie eine andere Dimension zu beachten müssen, ist Zeit. Wenn Sie nicht alles passt, die Sie innerhalb des sichtbaren Bereichs möchten, können Sie über Animieren das Gebiet zu denken.

Anmerkungen versehen Wireframes

Manchmal Web-Seiten enthalten interaktive Komponenten, die in den Wireframes über Anmerkungen erklärt werden müssen. Anmerkungen einfach Randnotizen, die beschreiben, wie die Elemente auf der Seite der Arbeit, was die Interaktion auslöst und welche Inhalte Displays in verschiedenen Szenarien. Durch die Nummerierung Bereiche des Drahtgitter-, und Nummerierung Ihre Notizen, können Sie effizient die Interaktion Detail beschreiben. Oft werden Sie auch einen Einsatz Diagramm enthalten müssen, die einen anderen Zustand zeigt, die auf eine Benutzeraktion wie zum Beispiel ein Rollover oder Klick angezeigt.

Diese kommentierte Drahtmodell mit nummerierten Beschriftungen hat auch Einsätze, die die verschiedenen Zustände von c zeigen
Diese kommentierte Drahtmodell mit nummerierten Beschriftungen hat auch Einsätze, die die verschiedenen Zustände von Inhalten zeigen, wie der Benutzer damit umgehen.

Menü