Kategorie: Webdesign

Neueste Beiträge

Eine Website sollte nicht nur inhaltlich immer auf dem neuesten Stand sein. Heute ist auch die sogenannte Usability, also die Nutzbarkeit, immer wichtiger. Die User greifen mit unterschiedlichen Geräten auf eine Website zu und wollen stets die bestmögliche Darstellung der Inhalte haben.

Das richtige Webdesign spielt optisch und technisch eine große Rolle. Mit welchen Tools du das Design untersuchen und optimieren können, erfährst du in diesem Text.

Die einfachste Möglichkeit, um die eigene Website zu prüfen, ist der sogenannte Entwicklermodus im Webbrowser. Diese Funktion unterstützen inzwischen alle gängigen Browser. Sie anzuwenden ist genauso einfach wie effektiv. Durch das Aktivieren dieser Funktion kann ein Bildschirm einer beliebigen Größe imitiert werden. So lässt sich überprüfen, wie die Website beispielsweise auf einem Smartphone oder auf einem Tablet dargestellt wird.

So erstellst du die Elemente des Webdesigns

Sketch

Soll ein neues Webdesign erstellt werden, geht dies mit Software-Anwendungen, die speziell für diesen Einsatz konzipiert sind. Eine davon heißt Sketch.

Mit Sketch ist es einfach möglich, die nötigen Elemente zu gestalten. Das können Button, Banner oder Grafiken sein, die im Hintergrund liegen. Sketch ist einfach anzuwenden und kann intuitiv innerhalb kurzer Zeit erlernt werden. Die gleichen Arbeitsergebnisse können zwar mit Bildbearbeitungs- oder Vektorprogrammen erzielt werden. Diese sind aber aufwendiger zu lernen. Das ergibt nur wenig Sinn, wenn die Fähigkeiten lediglich einmal für die eigene Website genutzt werden sollen.

Eine Schnittstelle zwischen den genannten Arbeitsbereichen bietet die Anwendung Adobe XD. Es ist die Quintessenz aus den Adobe Programmen Photoshop, Illustrator und Dreamweaver und kann genutzt werden, um ein Webdesign zu erstellen. Für Anwender der Adobe Programme ist es nicht schwer, sich in Adobe XD zurechtzufinden.

Mit Figma gemeinsam an einem Projekt arbeiten

Willst du nicht nur alleine an einem Webdesign arbeiten, dann ist Figma eine gute Anwendung. Sie kann über den Browser geöffnet werden und bietet mehreren Nutzern die Möglichkeit, gleichzeitig an einem Projekt zu arbeiten. Figma über den Browser zu steuern, ist nur eine Möglichkeit. Für die gängigen Betriebssysteme gibt es auch Installationsdateien.

Als letztes Tool möchten wir Ihnen Avocode vorstellen. Hier liegt die Besonderheit darin, dass es Entwürfe im Dateiformat von Photoshop oder Sketch importieren kann. Sind diese als Vorlage vorhanden, muss die kreative Leistung nicht noch einmal von vorne geleistet werden. Es geht dann nur noch um die Umsetzung.

Das muss ein Webdesign Tool können

Ein gutes Webdesign Tool zeichnet sich durch die folgenden Eigenschaften aus. Es kann sowohl direkt an der grafischen Oberfläche als auch in den Codes gearbeitet werden. So können Fehler schnell gefunden werden und gleichzeitig sind die Programme für kreative Köpfe und technikaffine Programmierer nutzbar. Weiterhin sollte der Entwickler ein großes Support-Angebot bereitstellen. Das bedeutet, dass er sowohl bei technischen Problemen weiterhilft, als auch bei der Implementierung behilflich ist. Außerdem helfen Webinare oder Tutorials, in denen die Anwendung des Tools geprobt werden kann. Bietet der Entwickler dies nicht an, gibt es meist große Communitys, die entsprechenden Content publizieren.

Nun haben wir Ihnen gezeigt, welche Tools im Bereich des Webdesigns sinnvoll sind und ihnen weitere Tipps zur Auswahl der richtigen Software an die Hand gegeben. Meistens bieten die Entwickler kostenfreie Testversionen an. Mit ihnen kannst du dich mit den Anwendungen vertraut machen und schauen, welche für Ihre Zwecke am besten geeignet ist.

Für eine eigene Webseite sprechen mehrere Gründe. Im geschäftlichen Bereich ist es oft ein „must-have“, unter einem eigenen Namen erreichbar zu sein. Auch für private Nutzer oder Vereine mit gehobenen Ansprüchen sind eigene Webseiten die Antwort auf entsprechende Anforderungen. Hierzu gehören die komplette Kontrolle über die präsentierten Inhalte, die Privatsphäre sowie Nutzung einer individuellen Email-Adresse.

Der Weg hin zu einer Webseite ist nicht schwer, aber lang

Vereinfacht lässt sich die Planung in drei Bereiche unterteilen, die wiederum in kleinere Einzelschritte aufteilbar sind:

Phase 1: Festlegung des Umfangs der Webpräsenz

  1. Definition, wer die Seite betrachten soll (Zielpublikum)
  2. Welche Inhalte werden bereitgestellt?
  3. Wieviele Inhalte werden bereitgestellt?
  4. Welche Änderungsrate haben die Inhalte?
  5. Wer soll die Inhalte bearbeiten und pflegen?

Phase 2: Technische Umsetzung und Hosting

  1. Auswahl des Hostingtyps
  2. Auswahl der Websoftware (CMS, Forum, Videostream etc.)
  3. Auswahl des Hosters
  4. Planung Backup/Recovery
  5. Planung Domainname

Phase 3: Implementierung

  1. Fertigstellung Grundsystem
  2. Einpflege von Inhalten
  3. Inbetriebnahme Nebentechnik wie Email oder Dateiablage
  4. Rollout incl. Funktionstests

Phase 1

In der Phase 1 sind alle Vorüberlegungen zu den Inhalten zu leisten, die dem zukünftigen Betrachter präsentiert werden sollen. Die Inhalte selbst (Texte/Bilder/Videos) und deren Präsentation (Seriös, Freizeit, Lifestyle etc.) werden definiert.

Daraufhin folgt eine Abschätzung der zu bewältigenden Datenmengen. Dieses hat direkte Auswirkungen auf die Auswahl des Hostingsystems in Phase 2. Wichtig ist ebenfalls, wer Inhalte in die Webseite einbringt: Lädt nur der Besitzer ab und an ein Foto hoch oder bloggt seine Tageserlebnisse, oder läuft hier ein öffentliches Forum mit Kommentarfunktion?

Phase 2

In Phase 2 wird festgelegt, welcher Hostingtyp für die Anforderungen erforderlich und geeignet ist. Die Auswahl reicht hier von recht simplen sog. „Webbaukästen“, die schnell zusammengeklickt sind, über ausgewachsene gehostete CMS (Content Management Systeme) wie WordPress, Typo3, Drupal) bis hin zu frei nutzbaren Webspaces. Wichtig ist hier die Abschätzung, ob für das System SQL-Datenbanken benötigt werden, damit der passende Tarif beim Hostinganbieter ausgewählt werden kann. Abhängig von der zu erwartenden Anzahl der Seitenabrufe sollte der Traffic möglichst inclusive sein, um teure Überraschungen zu vermeiden.

Phase 3

In Phase 3 wird geplant, in welcher Folge und Meilensteinen die Implementierung vonstatten geht. Hier muss ein Grundsystem konfiguriert werden, es werden Templates erstellt, um ein einheitliches Look&Feel zu haben, Inhalte sind einzuspielen.
Emailfunktionalität sowie Backup und Recovery sollten in dieser Phase vor Going-Live getestet sein. Das Thema Datensicherung sollte ebenfalls geklärt sein, ob der Hoster diese erledigt oder der Betreiber selbst tätig werden muss.

Fazit:

Der Weg ins Web ist heute einfacher als je, aber trotz oder gerade wegen der Auswahl an Wegen dahin mit einigen Stolperstellen behaftet. Eine gute Planung hilft hier, den Überblick zu behalten und unliebsame Überraschungen zu vermeiden. Gerne übersehen, aber sinnvoll: rechtzeitige Tests nach jedem Abschnitt helfen, Fehler rechtzeitig zu erkennen. Diese können dann beseitigt werden, bevor sie sich auswachsen.