3 Tipps zur Umsetzung
Unser Screen-Design steht. Doch auf was muss man bei der Umsetzung noch achten? Andreas Berning, unser Webdesigner, nannte uns drei Tipps.
1.Suche dir gescheites Framework
CSS-Frameworks benutzt man, um eine Website nicht von Anfang an neu erfinden zu müssen. Sie bestehen aus einer Sammlung an verschiedenen Gestaltungselementen. So sind Schaltflächen, Menüs, Eingabefelder oder auch graphische Elemente wie Schriftarten und Icons schon vordefiniert. Vor allem im Zeitalter des mobilen Webs ist es wichtig, dass sich Websites an die verschiedenen Formate wie iPad, iPhone und Android-Geräte automatisch anpassen und Navigationsleisten beispielsweise je nach Endgerät automatisch umbrechen. Mobile Friendliness ist hier das Stichwort, worauf auch Suchmaschinen achten! Suche dir deshalb ein Framework aus, das Responsive Design kann und setze dein Screen-Design in einem leeren Template um.
Andy‘s Linktipp:
Das sagt Andy dazu:
„Bootstrap kann ich sehr empfehlen, da es eine sehr umfangreiche Sammlung für Webdesigner enthält, um schnell und einfach Projekte für alle möglichen Geräte zu realisieren. Alles ist sehr ausführlich dokumentiert und es eignet sich für Einsteiger genauso wie für erfahrene Webentwickler.“
2. Baue interaktive Elemente ein
Eine Studie zeigte, dass Menschen in Deutschland mehr als zwei Stunden täglich im Netz unterwegs sind. Dabei suchen wir meistens nach bestimmten Informationen, die schnell und ohne großen Aufwand abrufbar sein sollen. Text-Nuggets können dabei helfen, eine Website einfach zu gestalten. Aber nur Text kann schnell langweilig werden. Mache deine Website interessanter und baue interaktive Elemente ein. Interaktiv ist ein Element schon dann, wenn sich beim Klick eines Buttons die Mouseover-Farbe ändert. Wenn man seinen Besuchern aber noch gezielter Informationen bieten möchte und sie vielmehr durch die Website begleiten möchte, eigenen sich interaktive Infografiken. Präsentiere beispielsweise dein Unternehmen nicht auf einer üblichen „Wer-wir-sind“ Seite, sondern zeige in einer Illustration deinen Arbeitsplatz und schaffe durch interaktive Klickflächen mehr Raum für weitere Informationen.
Andy’s Linktipp:
https://webcraftplugins.com/image-map-pro/
Das sagt Andy dazu:
„Image Map Pro ist ein tolles Plugin, das ganz einfach in WordPress integriert werden kann. Es ist sehr intuitiv. In nur wenigen Sekunden kann man beeindruckende Infografiken kreieren, die in Sachen „Spaß“ ganz vorne mitmischen – und das ganz ohne Programmierkenntnisse.“
- Überlege, wie Endkunden ihre Inhalte einpflegen können
Als Webdesigner versteht man es mit einem langen Code umzugehen und Inhalte in komplexen und kryptischen Dokumenten richtig zu platzieren. Doch wenn es darum geht, dass Kunden selbstständig Texte, Angebote oder Blogbeiträge publizieren, benötigt man ein Content-Management-System (CMS). Neben dem bekanntesten Open-Source-CMS wie Typo3 können auch weitere CMS genutzt werden wie WordPress oder Joomla. Wichtig ist jedoch, dass man schon vor der Programmierung einer Website weiß, welches CMS man nutzen möchte. Somit ersparst du dir einigen Programmierungsaufwand, wenn es darum geht, welcher Inhalt einer Website vom Kunden eigenhändig geändert werden kann.
Andy’s Linktipp:
Das sagt Andy dazu:
“Mein Lieblings-CMS ist WordPress, weil es sehr benutzerfreundlich ist. Ursprünglich war es als Blog-System gedacht, weshalb die Templates früher nicht so ansprechend waren. Aber weil WordPress sich schnell im Netz verbreitet hat, sind die Templates zu wirklich guten Werkzeugen geworden.“
Mehr zum Thema:
Webdesign vom Feinsten
Parallax-Effekt und Co: Keyfacts und Trends für Websites
Mobile Friendliness: Mit Responsive Design zu einer besseren User-Experience
#WebdesignvomFeinsten
