Webtools für
Website Aufbau
Du träumst von deiner neuen Wohnung und hast auch schon eine Vorstellung davon, wie sie aussehen soll. Nimm Papier und Bleistift und zeichne deine Traumwohnung auf.
Website Art
Was für eine Art Wohnung suchst du? Was für eine Website?
Es ist wichtig sich diese Gedanken zu machen, damit die Wohnung zweckmässig ist und sich die Gäste wohlfühlen. Genau gleich ist dies bei der Website.
Eine Seite
Einfach eingerichtete Wohnung/Website.
Beispiel
sphere Landing Pages
Komplexität
meter-slow
Einfach
Blog
Viele kommen zu dir in die Wohnung und freuen sich über Neuigkeiten.
Beispiel
sphere Web Tagebuch
Komplexität
meter-slow
meter-medium
Einfach bis Mittel
Portfolio
Du hast viele Bilder in deiner Wohnung aufgehängt.
Beispiel
sphere Foto Homepage
Komplexität
meter-slow
Einfach
Shop
In deiner Wohnung verkaufst du Dinge.
Beispiel
sphere Web Shop für Solarleuchten
Komplexität
meter-medium
meter-fast
Mittel bis Hoch
Firma
Du hast viele Bilder in deiner Wohnung aufgehängt.
Beispiel
sphere Firmenwebsite
Komplexität
meter-slow
meter-medium
meter-fast
Einfach bis Hoch
Web App
Deine Wohnung wurde sehr aufwändig und spezifisch eingerichtet.
Beispiel
sphere Word als Web App
Komplexität
meter-fast
Hoch
Beispiel kuba-reisebericht.ch Ich brauche eine Portfolio Website, da ich in meinem Kuba Reisebericht viele Fotos mit Text publiziere.
Deine Art Website pencil
Website Struktur
Ein paar Tipps zur Website Struktur
Bei der Struktur einer Website gibt es ein paar wenige Dinge am Anfang zu beachten:
-
Kopfzeile (Header) user
-
Normalweise ist dies ganz oben bei einer Website angeordnet
-
Dies beinhaltet normalerweise das Menu (Navigation)
-
Menu-Punkt1
-
Menu-Unterpunkt1
-
Menu-Unterpunkt2
-
-
Menu-Punkt2
-
Menu-Unterpunkt1
-
-
Menu-Punkt3
-
-
Die Eingangstür deiner Wohnung ist ein Haupt-Menu-Punkt (vielfach "Home"). Deine anderen Türen sind die weiteren Menu-Punkte
-
Das gleiche Menu wiederholt sich immer wieder auf den anderen Websites. Somit müssen Anpassungen am Menu nur einmal vorgenommen werden. Der Benutzer kann auch viel einfacher navigieren, wenn das Menu immer gleich aussieht.
-
Das Logo ist meistens oben links oder oben in der Mitte. Das Logo mit der Start Seite verlinken, dies erwarten die meisten Benutzer.
-
-
Inhaltsbereich (Body) user-tie
-
Hier kommt der Blickfang und vor allem Dein wertvoller Inhalt, der Nutzen stiftet.
-
Hier ist ganz wichtig, richte deine Wohnung so ein, dass sich deine Besucher wohlfühlen und von selber wiederkommen möchten!!! Du musst deine Website ansprechend gestalten mit passenden Bildern ("Ein Bild sagt mehr als tausend Worte") und mit Text der dem Kunden einen Mehrwert bietet, ein Problem für ihn löst. Aber nur soviel Text wie nötig verwenden und auf das Wesentliche konzentrieren. Am Schluss den Text nochmals kürzen, damit nur das Wichtigste bleibt.
-
-
Fusszeile (Footer) footprint
-
Normalerweise ganz unten angeordnet und bildet den Abschluss. Er beinhaltet Informationen die nicht auf den ersten Blick ersichtlich sein müssen. Seit Jahren wird die Fusszeile benutzt für einen Impressum und Datenschutz Link (dies wird in den meisten Ländern vorgeschrieben, bitte schaue im jeweilige Land nach).
-
Google "Impressum Generator Schweiz"
-
-
Beispiel kuba-reisebericht.ch "kuba-reisebericht.ch" ist so aufgebaut
Tipp Es ist wichtig diese Struktur zu kennen, wenn es darum geht eine Website zu erstellen. Dann wird die Arbeitsweise der Tools auch klarer, welche im Thema Website Erstellen vorgestellt werden.
Website Usability
Website Benutzerfreundlichkeit
Du solltest deine Website Benutzer freundlich gestalten, damit er deine wertvollen Informationen möglichst schnell findet ohne viel lesen zu müssen, egal ob auf dem Computer oder auf dem Smartphone. Man verwendet hier oft den Begriff "Usability". Setze am richtigen Ort Bilder und Videos ein. Ich habe ein einziges Buch zu diesem Thema und ich kann es empfehlen "Don't make me think", gibt es auch in Deutsch.
Beispiel Kapitel 5 im Buch Titel: "Lassen Sie nutzlose Wörter weg" (Die Kunst des Nicht-Schreibens für das Web). "Werfen Sie die Hälfte aller Wörter auf jeder Seite raus und vom Rest noch einmal die Hälfte" (Krugs drittes Gesetz der Usability).
Beispiel kuba-reisebericht.ch Auf der Einstiegsseite (Homepage) sticht ein bildfüllendes Foto von einem Oldtimer in Kuba hervor, mit ein wenig Text der umschreibt, dass es sich um einen Kuba Reisebericht handelt, dies wird sehr stark unterstützt mit dem Domain Name der kuba-reisebericht.ch heisst. Somit weiss der Besucher sofort um was es geht. Die ganze Navigation ist mit Kuba Fotos (eigene von meinem Smartphone) erstellt. Der Fokus liegt auf Bilder, da dies für einen Reisebericht sehr wichtig ist.
Tipp Ich liebe einfache, intuitive, schön gestaltete und sinnvolle Websites. Ich versuche auch, solche auf anhieb erstellen. Ich bin kein Usability (Benutzerfreundlichkeit) Profi. Ich ertappe mich vielfach selber, wie ich am Anfang die Website zu kompliziert erstelle und danach wieder vereinfache. Mit den heutigen Möglichkeiten um Websites schnell und einfach zu erstellen ist dies ein kleiner Aufwand. Schau dir jetzt doch gleich nochmals deine Website Skizze, deine Website Struktur an und überlege dir, ob die Usability einfach und sinnvoll ist. Frage deine Freunde, was sie davon halten.
Website Skizze
Zeichne deine Website
Es ist enorm hilfreich, wenn du deine Wohnungseinrichtung bildlich aufzeichnest. Nimm einfach ein leeres Blatt und male deine Vorstellungen deiner Website auf.
Beispiel kuba-reisebericht.ch "Website Skizze Kuba Reisebericht"
Deine Skizze pencil
Tipp Es gibt viele Programme im Internet um Website Skizzen oder Prototypen anzufertigen. Sie sind im Internet zu finden unter "Wireframe", "Mockup", "Prototyp" und noch andere. Ich habe mir einige solcher Programme angeschaut und für mich persönlich bringen sie zu wenig Mehrwert. Der Aufwand um mit dem Tool umgehen zu können, ist zu hoch. Von daher nehme ich einen Stift zur Hand und zeichne den Aufbau der Website einfach auf ein Blatt Papier. Wenn es dann soweit ist, mal einen Prototypen herzustellen, dann sollte gleich das richtige Werkzeug (Tool) verwendet werden. Ich empfehle das gleiche Tool zu verwenden, mit dem ich auch die eigentliche Website erstelle. Unter dem Menu Punkt Website Erstellen findest du mehr Info zu den Tools.
