Website Templates

In wenigen Schritten zur optimalen Firmenhomepage. Ganz bequem und ohne Vorkenntnisse. Wählen Sie aus über 2.000 professionellen Website Design-Vorlagen, das perfekt zu Ihnen und Ihrer Branche passende Responsive Webdesign Template für Ihre Unternehmenshomepage aus.

Was sind Webseiten Templates?

Als Webseiten Template bezeichnen wir eine Vorlage für Internetseiten. Es handelt sich um eine Art fertiger Rahmen, in dem die eigene Website aufgebaut wird. Die Vorlagen sind wie ein Baukasten angelegt: Einzelne Elemente werden so zusammengesteckt, dass am Ende eine mehr oder weniger individuelle Website aus den vorgefertigten Elementen entsteht.

Man kann sich das in etwa wie einen Haufen Legosteine vorstellen: Natürlich sehen viele Steine gleich oder fast gleich aus. Die Regeln, nach denen sie zusammengesetzt werden, sind auch immer gleich. Trotzdem schafft man es, aus dem gleichen Bausatz Steine ein Flugzeug zu bauen, ein Haus, einen Dampfer oder eine Meeresschildkröte.

Programme, die Website Templates anbieten, werden oft als WYSIWYG-Editoren bezeichnet. Die komische Abkürzung steht für einen ganzen englischen Satz: What You See Is What You Get. Zu Deutsche heißt das in etwa: Was Sie sehen ist das, was Sie am Ende bekommen. Wer sich schon einmal selbst mit HTML auseinandergesetzt hat, kennt das Problem: Programmcode sagt nur wirklichen Profis auf den ersten Blick, wie das fertige Konstrukt aussieht. Und das ist für viele Menschen bei der Erstellung einer eigenen Website ein Problem.

Verwendet man Templates, werden Grafiken und Texte, Videos und Audio-Dateien einfach über die grafische Oberfläche eingefügt. Templates erlauben also, Internetseiten sehr schnell und damit einfach aufzubauen und an die eigenen Vorstellungen anzupassen – letzteres zumindest in einem festgesteckten Rahmen.

In wenigen Schritten zur eigenen Website

Einfache Bedienung und flexibles Design. Passen Sie Texte und Bilder an, wie es Ihnen gefällt. Dank Responsive Design sieht Ihre Website auf allen Geräten – PC, Smartphone und Tablet – einfach perfekt aus.

Individuelles Design oder Templates, was ist besser?

Ob individuelles Design besser ist als Templates oder umgekehrt, daran scheiden sich die Geister. Templates haben Vor- und Nachteile, und das ist bei individuell entworfenen Seiten nicht anders. Letzten Endes kommt es auf die eigenen Ansprüche an, was die bessere Wahl ist. Wir beleuchten die verschiedenen Punkte, die es zu bedenken gilt.

Kreativität und Individualismus zeigen

Wie viel Konformität darf sein, wie viel Individualismus ist nötig? Totale Freiheit bietet natürlich nur freies Webdesign. Denn da kann wirklich jeder Wunsch nach einer maximal individuellen Gestaltung umgesetzt werden. Bei Templates gibt es einen Rahmen, in dem Anpassungen möglich sind – mehr geht nicht.

Farben, Schriften, Anordnung der Elemente und Inhalte können zwar gewählt werden. Aber das ist nur in einem vorgegebenen Rahmen möglich. Das bedeutet: Zwei, fünf, zehn oder dreißig Farbschemen sind festgelegt, aus denen muss man sich eines aussuchen. Kommt die gewünschte Farbwahl darin nicht vor, hat man Pech gehabt.

Für Schriften, Rahmen und so weiter gilt das genauso. Templates bieten also schon etwas Freiheit, aber auch nur Freiheit innerhalb von Vorgaben. Dafür kann man sich darauf verlassen, dass die Templates nach gängigen Designregeln gut durchdacht sind. Mit Fragen wie “Passen die beiden Farben wirklich zusammen?” muss man sich also nicht abgeben.

Wer genau in diesen Fragestellungen den Reiz der individuellen Gestaltung sieht, der wird mit einem Template nicht glücklich. Aber mal ehrlich: Will man sich nicht Leiber auf das Kerngeschäft konzentrieren als sich mit solchen Details herumzuschlagen?

Zeit ist Geld

Wir stellen hier mal eine steile These auf: Jeder und jede kann HTML lernen. Das ist nicht schwer. Programmieren lernen viele Kids schon in der Schule. Wo ist also das Problem, eine Website selbst aufzubauen? Es gibt kein Problem.

Oder vielleicht doch? Wer sich noch nie mit Programmierung befasst hat, wird lange brauchen, um sich die nötigen Kenntnisse anzueignen. Mit HTML ist es bei einer umfassenden und voll funktionstüchtigen Website auch nicht getan. Für die Gestaltung müssen Stylesheets in CSS entworfen werden, Javascript ist unter Umständen nötig, und vielleicht werden noch andere Extras gebraucht. Ein ganzer Webshop ist noch einmal viel komplexer aufgebaut als eine einfache Web-Visitenkarte.

Denn im Hintergrund werden Kundendaten verarbeitet, Bezahldienstleister wollen eingebunden sein und so weiter. Wer hat schon die Zeit, sich diese ganzen Kenntnisse und Fähigkeiten selbst anzueignen? Webseiten werden selten erstellt, weil man so viel Zeit übrig hat und mal was damit anfangen will.

In der Regel sollen sie verkaufen, und zwar schnell und viel. Zeit ist Geld! Templates erlauben Wirtschaftlichkeit. Denn sie lassen sich mit wenigen Klicks individualisieren, sodass die eigene, mehr oder weniger individuelle Internetpräsenz in wenigen Stunden umgesetzt ist. Wir sind also jetzt an dem Punkt, dass wir die individuelle Gestaltung der Website gegen den Zeitaufwand abwägen können.

Zielsetzung: Was wollen Sie mit Ihrer Website erreichen?

Es macht einen Unterschied, was die Website leisten soll. Und das sieht man den verschiedenen Templates auch an: Da gibt es einfache Seiten mit wenigen Unterseiten und einer begrenzten Anzahl von Elementen. Es gibt die sogenannten One-Pager, also eigentlich nur eine Seite. Deren verschiedene Elemente sind sowohl über Scrollen als auch über einen Klick in der Navigation erreichbar. Und es gibt wirklich komplexe Seiten, die aus einem Webshop, Kontaktformularen, Ratgebern und Verlinkungen, versteckten Mitgliederbereichen, Live-Chats und mehr bestehen. Was soll die Website leisten?

Wer einfach nur im Internet auffindbar sein will, dem reicht eine Web-Visitenkarte. Das sind in der Regel One-Pager, die über Produkte oder Services informieren, Kontaktdaten angeben und eventuell noch die direkte Kontaktaufnahme über ein Formular erlauben. Dafür braucht man im Prinzip kein Template, mit ein paar Grundkenntnissen in HTML ist so ein One-Pager in ein paar Stunden aufgesetzt. Mit dem Template dauert es nur Minuten.

Soll eine Seite verkaufen, wird es schon schwieriger. Denn dann müssen Daten von Kunden und Kundinnen erhoben und verarbeitet werden. Das läuft im Hintergrund ab, für die Besucher und Besucherinnen der Seite sind diese Prozesse nicht sichtbar. Es gibt also ein Backend und ein Frontend. So etwas programmiert man nicht mehr in ein paar Stunden, Tage sind da realistischer. Mit jedem Element, das dazukommt, wird die Seite komplexer und aufwändiger zu gestalten.

Jedes Element mehr ist im Grunde genommen ein weiteres Argument für ein Template. Soll die Seite Webinare hinter einem kostenpflichtigen Log-In anbieten? Oder soll sie regelmäßig mit neuem Content gefüttert werden, der jeweils auf der Startseite den alten Content ersetzt? Templates reduzieren den Zeitaufwand. Zusätzlich bieten sie die Sicherheit einer sauberen Programmierung. Denn je mehr eine Website kann, desto eher schleichen sich Fehler ein. Und die werden, wenn es um die Daten von Usern und Userinnen geht, schnell zu einer ärgerlichen und kostenintensiven Sache

Mit Templates arbeiten

Im Prinzip ist es ganz einfach, mit Templates zu arbeiten. Die Bedienung ist intuitiv, die Gestaltung erschöpft sich darin, den Anweisungen zu folgen. Aber was genau kann man eigentlich im Layout gestalten?

Layout gestalten

Der grobe Rahmen ist beim Layout festgelegt: Verschiedene Farbschemen sind bereits so abgestimmt, dass die Farben zueinander passen, die richtigen Assoziationen bei der (angenommenen) Zielgruppe wecken und dazu noch ansprechend sind.

Seiteneinteilung, die vorhandenen Elemente und Unterseiten bis hin zu Rahmen und Hintergrundbildern gehören zum Layout dazu. Das Design für das Hauptlayout ist mit der Wahl eines Templates festgelegt. Darin sind in der Regel auch die Anzahl und Art der einzelnen Elemente einer Seite festgelegt.

Wo genau was positioniert wird, ob das Menü oben oder an der Seite erscheint, wo sich die Loginformulare befinden und so weiter – das entscheiden Sie selbst. Die Module können also in einem definierten Rahmen durchaus individuell angeordnet werden. Auch Styles können variiert werden. Es macht einen Unterschied, ob es sich um einen Blog handelt oder eine Nachrichtenseite, um einen Webshop oder eine Umfrage.

Farben wählen

Hier gibt es zwei Möglichkeiten. Bei vielen Templates ist das Farbschema bereits festgelegt. Allerdings kann dann für ein Template zwischen zwei, drei, fünf, zehn oder mehr verschiedenen Farbsets gewählt werden. Die darin enthaltenen Farben sind aufeinander abgestimmt. Es gibt aber auch immer mal wieder Templates, bei denen eine oder mehrere Farben direkt im Template Manager oder im Code der CSS-Datei geändert werden müssen. Beides ist möglich.

Wie sinnvoll es ist, sich für eine konkrete Farbe oder ein Set von Farben zu entscheiden, darf diskutiert werden. Denn die Farben sehen am Ende auf jedem digitalen Endgerät anders aus, abhängig von den Einstellungen der User und Userinnen. Je nach Qualität und Technik des Displays wirken sie verschieden. Und es gibt immer mehr User und Userinnen, die beispielsweise das Smartphone im Schwarz-Weiß-Modus verwenden, die den Kontrast individuell einstellen oder Filter nutzen, um beispielsweise am Nachmittag oder am Abend den Blauanteil des Bildschirmlichts herauszufiltern. Das bedeutet: Ganz egal, welches Farbschema gewählt wird – jeder User und jede Userin sieht ohnehin etwas anderes.

Bilder und Schriften

Größe, Auflösung, Rahmen, Effekte – abhängig vom Template kann individuell festgelegt werden, wie jedes einzelne Bild erscheint. Schnelle Ladezeiten sind ein Wettbewerbsvorteil, der nicht unterschätzt werden sollte – daher sind kleine Dateien in einer niedrigeren Auflösung meistens die bessere Idee. Mehr Effekte bedeutet in der Regel, dass die Bildinformationen komplexer werden und sich die Ladezeit verlängert.

Schriften werden in der CSS Datei des Templates festgelegt. Die gesamte Internetpräsenz erhält dadurch ein einheitliches Erscheinungsbild. Das ist bei einem One-Pager noch nicht so wichtig, bei zahlreichen Unterseiten dagegen schon. Nicht jedes Template bietet allerdings diese Möglichkeit. Manchmal sind auch einfach ein bis zwei Schriften festgelegt, die verwendet werden können.

Welcher Browser?

Browser unterscheiden sich, und sie werden hin und wieder mit einem Update versehen. Dann sind alte Templates unter Umständen nicht mehr optisch ansprechend. Templates können ohne große Umstände für einzelne Webbrowser angepasst werden.

Es ist völlig egal, welchen Webbrowser und welche System-Upgrades Sie selbst benutzen. Relevant ist, dass die Besucher und Besucherinnen Ihrer Website, die die neueste Version nutzen, Ihre Website auf die angenehmstmögliche Art und Weise sehen. Übrigens wird auch zwischen dem Template für das Frontend und dem Template für das Backend unterschieden.

Was müssen Webseiten leisten?

Es wurde schon kurz angesprochen: Websites können ganz unterschiedliche Zwecke erfüllen. Die einfachste Version ist in etwa so etwas wie eine Visitenkarte: Ihre geschäftlichen Kontaktdaten und eine kurze Vorstellung Ihrer Produkte oder Services wird aufgeführt, oft mit einem Bild von Ihnen, mehr nicht. Aber im Internet ist natürlich noch viel, viel mehr möglich!

Von der Visitenkarte bis zur Mall

Je mehr eine Website kann, desto komplexer ist sie gestaltet. Um bei dem genannten Beispiel zu bleiben: Das eine Ende der Skala dessen, was möglich ist, stellt die einfache Visitenkarte dar. Am anderen Ende der Skala finden Sie eine gut ausgebaute Shopping-Mail mit einer Chat-Ecke, einer Bibliothek für Fachliteratur, verschiedenen gut sortierten Fachgeschäften, einer Clublounge nur für Mitglieder und so weiter.

Dazwischen ist alles möglich. Bevor man sich für ein Template entscheidet, steht eine wichtige Entscheidung an: Was genau soll die Website eigentlich leisten? Soll sie informieren oder verkaufen? Vielleicht beides? Was soll in welcher Form genau stattfinden? Informieren kann ein Newsticker genauso wie ein Blog oder eine Ratgeberseite mit vielen Unterseiten zu verwandten Themen. Verkaufen kann ein Katalog, der online die Produkte und Dienstleistungen vorstellt und zum Besuch des Ladenlokals aufruft. Aber auch ein gut ausgebauter Webshop kann verkaufen. Wer sich nicht selbst mit den Details wie Download digitaler Produkte, Bezahldienstleister und so weiter herumschlagen will, holt sich einen Dienstleister dafür ins Boot. Es gibt für jede Funktion verschiedene Möglichkeiten, sie umzusetzen.

Wenn erst einmal klar ist, was genau die Website leisten soll, ist auch klar, was das Template leisten muss. Denn alle Elementen die die Website bieten soll, müssen im Template als Module zur Verfügung stehen. Im nächsten Schritt geht es dann um die Zielgruppe: Wen soll die Website ansprechen? Konservativ gestaltete Designs in seriösen Blautönen sprechen andere Menschen an als flippige, stark bewegte Elemente in Pink und Orange.

Je genauer man seine Zielgruppe kennt, desto besser lässt sich das Template passend auswählen und im Anschluss gestalten. Und hier haben Templates wieder einen großen Vorteil: Einmal eingerichtet, ist es ganz einfach, einzelne Elemente oder Designpunkte wieder zu ändern. Meist braucht es nur ein oder zwei Klicks, um das Farbschema der gesamten Website inklusive Unterseiten einheitlich zu überarbeiten.

Wichtig ist auch, dass viele Templates für das Content-Management-System Joomla oder für Word Press existieren. Das ist dann ein Pluspunkt, wenn Sie oder Mitarbeiter und Mitarbeiterinnen künftig regelmäßig und möglichst einfach neue Inhalte auf der Website einpflegen wollen.

Barrierefrei gehört zum guten Ton

Barrierefreiheit wird im Alltag häufig gefordert: Da soll in öffentlichen Gebäuden ein Aufzug zur Verfügung stehen, oder auf der Straße werden spezielle Steine verlegt, die durch die Schuhsohle tastbar sind. Das dient dazu, beeinträchtigten Menschen den Alltag zu erleichtern und Teilhabe am öffentlichen Leben zu ermöglichen. Wie sieht das bei Ihrer Website aus? Tatsächlich wird heute immer wieder gefordert, dass auch Websites barrierefrei sein müssen.

Das bedeutet:

Die Farben müssen so gewählt sein, dass auch Menschen mit Rot-Grün-Sehschwäche oder Blau-Gelb-Sehschwäche die Seite gut erkennen und sich darauf orientieren können.
Die einzelnen Elemente müssen so kontrastreich gestaltet sein, dass auch Menschen mit schwachem Sehsinn sie erkennen und bedienen können.
Die Sprache muss so gehalten sein, dass auch Menschen mit Dyslexie oder einer anderen Lern- oder Leseschwäche die Informationen idealerweise beim ersten Lesen schon verstehen.
Die Bedienelemente müssen übersichtlich und auf den ersten Blick erkennbar angeordnet sein.
Die Website muss so gestaltet sein, dass sie bei Menschen mit Lernschwächen oder im Autismus-Spektrum sowie bei Hochsensiblen keine Überreizung auslösen.
Gleichzeitig muss die Website für nicht-beeinträchtigte Menschen gleichermaßen ansprechend gestaltet sein.

Barrierefreiheit ist also ein Punkt, der in Farbwahl und anderen Punkten des Designs in Betracht gezogen werden muss. Von Hintergrundfarben über die Anzahl an verschiedenen Elementen auf einer Seite bis hin zur Wahl der Schrift wird jede Entscheidung davon gesteuert. Selbst programmieren ist in diesem Fall gar nicht einfach, und tatsächlich lassen immer noch viele Webdesigner diesen Punkt außer Acht. Mit einem barrierefreien Template ist das alles ganz einfach.

Responsive Designs: Chic und praktisch auf jedem Endgerät

Smartphones haben einen schmalen, hohen Bildschirm. Tablets haben einen kleinen, breiten Bildschirm. Bei Laptops kann der Bildschirm unterschiedliche Abmessungen haben, und beim Desktop PC sind noch einmal mehr Größen möglich. Tablet und Smartphone können vom Querformat ins Hochformat und zurück geklappt werden.

Wie schafft man es nun, dass die Website auf allen Geräten gut aussieht, keine hässlichen vertikalen Scroll-Balken erscheinen und auch kleinste Schaltflächen immer nutzbar bleiben? Responsive Designs sind die Lösung. Die Templates sind so programmiert, dass sich das Layout, die Breiten und Höhen der einzelnen Elemente, die Anordnung der Module und manchmal noch viel mehr ändert, abhängig jeweils von der Bildschirmgröße des Nutzers oder der Nutzerin.

Will man das selbst programmieren, ist das sehr viel Arbeit und Rechnerei, dazu noch fehleranfällig. Responsive Designs in Templates dagegen können einfach eingesetzt werden – sie sind bereits so angelegt, dass die Designs auf jedem Endgerät wirken. Aber Vorsicht: Nicht jedes Design ist responsiv, es gibt auch fluide und adaptive Templates!

Intuitive Bedienung

Es gehört schon viel Erfahrung und Einfühlungsvermögen dazu, eine Website so zu gestalten, dass alle Nutzer und Nutzerinnen sie intuitiv bedienen können. Intuitive Bedienung bedeutet hier, das niemand irgendetwas suchen oder ausprobieren muss, sondern immer sofort weiß, wie die eigenen Anliegen auf de Website erfüllt werden können.

Gute Design erlauben das, sie sind auf den ersten Blick klar erkennbar und nutzbar. Die meisten Templates sind so angelegt, dass eine intuitive Nutzung überhaupt kein Problem darstellt. Auch nach den üblichen Anpassungen im Layout sind sie noch hervorragend übersichtlich und klar gestaltet.

SEO – im digitalen Telefonbuch sichtbar werden

Websites sind heutzutage nicht nur für Menschen gemacht, sondern auch für intelligente Programm. Wir holen etwas weiter aus, u diesen Punkt genauer zu erklären: Früher nahm man das Telefonbuch, das Branchenverzeichnis oder die Gelben Seiten zur Hand, wenn man ein bestimmtes Geschäft oder Handwerk gesucht hat.

Heute geben die meisten Menschen einfach ein paar Begriffe in eine Suchmaschine ein. Woher weiß die Suchmaschine, was auf einer Website angeboten wird? Richtig: Sie muss sie lesen können. Das tun Programme, sogenannte Crawler, die bestimmte (markierte) Bereiche der Website auf Schlüsselbegriffe hin untersuchen und sie dann entsprechend indexieren. Sollen Suchmaschinen eine Seite lesen können, spricht man von Suchmaschinenoptimierung, kurz SEO.

Templates, vor allem bei Word Press, stehen in dem Ruf, es den Nutzern und Nutzerinnen in Sachen SEO wirklich einfach zu machen. Und das ist nicht gelogen! Die relevanten Bereiche sind genau erklärt. Bei den meisten Templates ist die Optimierung der Seite für Suchmaschinen ein Kinderspiel, weil die Elemente dafür bereits angelegt sind und nur noch gefüllt werden müssen.

Schlüsselfertige Webseiten – individualisierter und einfach anzuwenden

Bei einer so großen Auswahl an Templates ist es gar nicht so einfach, die passende Vorlage für das eigene Web-Business zu finden. Mehr als 2.000 Templates stehen Ihnen hier zur Verfügung, und sie sind alle schlüsselfertig! Was heißt das nun wieder? Eine Website ist grundsätzlich angelegt wie eine Architektur.

Es gibt tragende und stützende Strukturen, eine Statik, verschiedene Ebenen und Räume. Und bei einem Haus bedeutet schlüsselfertig, dass Sie ganz einfach einziehen können! Bei Ihrer Website ist das nicht anders. Sie passen noch ein paar Kleinigkeiten im Layout, hinsichtlich der Farben und Schriften an.

Um Grundstück und Adresse müssen Sie sich übrigens auch nicht bemühen: Domain und Hosting gehören selbstverständlich zum Service dazu. Einfacher geht es nicht! Wann ziehen Sie ein?