Neue Website planen | Mit 15 Tipps erfolgreich starten

Neue Website planen – Teil 2: Entwicklung und Design

Basis-Design für die neue Website

Unabhängig davon, ob Sie Ihre neue Website selbst erstellen oder einen Profi damit beauftragen wollen, stellt sich die Frage nach dem Layout. Wie soll Ihre neue Website und besonders deren Startseite gestaltet und gegliedert sein und welche einzelnen Elemente und Funktionen soll sie enthalten?

Natürlich können Sie Ihre neue Website von Grund auf selbst programmieren, d. h. jede einzelne Code-Zeile schreiben (lassen). Bei den meisten Websites würde der Aufwand jedoch in keinem Verhältnis zum Ergebnis stehen. Deshalb basieren moderne Websites heute i. d. R. auf Themes.

Bei einem Theme handelt es sich um eine Zusammenstellung von grafischen Elementen, die das Aussehen von Benutzeroberflächen von Betriebssystemen, Computerprogrammen und Webseiten bestimmen. Innerhalb eines Systems bildet ein Theme eine in sich geschlossene Einheit, die ausgelagert ist und einzeln geladen wird. Dieser Ansatz erlaubt es, das Theme mit geringem Aufwand auszutauschen, ohne dabei andere Funktionseinheiten des Systems zu beeinflussen.

Quelle: › arocom.

Vor allem die meisten Premium-Themes sind heute so gut programmiert und so flexibel, dass für eine professionelle neue Website „das Rad nicht neu erfunden werden muss“. Neben Premium-Themes gibt es in diesen Zusammenhang noch drei weitere Optionen.

Kostenlose Themes

Innerhalb des WordPress-CMS können Sie beispielsweise selbst einfach ein kostenloses Theme, das Ihnen gefällt, hochladen. Falls Sie ein komplettes Hosting-Paket gebucht haben, ist meistens bereits eine bestimmte Anzahl Themes zur Auswahl enthalten. Sie brauchen für Ihre neue Website nur noch das passende aktivieren. Sollte es Ihnen dann doch nicht gefallen, können Sie es ohne finanzielle Verluste durch ein anderes ersetzen.

Abgesehen von der Kostenersparnis sind die Vorteile, dass Sie relativ schnell ein ansehnliches Resultat erzielen und die notwendigen Grundeinstellungen sehr überschaubar sind. Letzteres ist aber auch gleichzeitig der Nachteil. Denn die Möglichkeiten, das Gesamt-Layout, Farben, Schriften, Abstände, etc. zu ändern ist recht begrenzt. Darüber hinaus lässt sich auch der Werbe-Hinweis auf den Entwickler bzw. Anbieter im Footer (Powered by …) i. d. R. weder ausblenden noch an eine andere Stelle verschieben.

Page Builder

Um den Funktionsumfang insbesondere von kostenlosen Themes zu erweitern, wird häufig die zusätzlich Installation eines Page Builders (Seitenbaukastens) angeboten oder sogar empfohlen. Häufig ist in den fertigen Paketen ein Page Builder bereits vorinstalliert. Laut Werbeaussage vereinfacht es sehr die Gestaltung der Website. Abhängig davon, ob Sie die kostenlose oder die Pro-Version eines Page Builders verwenden, erhalten Sie eine großen Auswahl an Gestaltungselementen und Bausteinen, die Sie per Drag & Drop an die von Ihnen gewünschte Stelle der Seite ziehen. Zwar können viele der einzelnen Elemente zusätzlich noch angepasst werden, tatsächlich geschieht dies jedoch selten. Denn die Möglichkeit zur Detailanpassung ist wiederum weniger intuitiv gelöst.

Um diesen großen Funktionsumfang überhaupt verwenden zu können, sind zusätzlich installierte Plugins Voraussetzung. Ohne diese funktioniert auch der Page Builder nur sehr eingeschränkt oder gar nicht. Daraus ergeben sich zwei große Nachteile für Ihre neue Website:

Alle Page Builder wirken sich negativ auf die Ladezeit aus, da auch Elemente und Plugins, die Sie gar nicht einsetzen, immer im Hintergrund mit geladen werden. Außerdem sind alle Page Builder von Haus aus nicht DSGVO-konform. Sie nutzen Google Schriften und bieten Funktionen an, die ohne selbst vorzunehmende einschränkende Maßnahmen in der EU nicht zulässig sind. Darüber hinaus verführt das große Angebot und das einfache Einfügen dazu, die neue Website mit Spielereien zu überladen und Funktionen einzubauen, die nicht notwendig sind und eher von den, vom Besucher gewünschten, Informationen ablenken als sie hervorzuheben.

Fertige Homepages

Unter fertigen Homepages verstehe ich die in Hosting-Paketen oder bei den Rund-um-sorglos Anbietern (s. o.) enthaltenen Vorlagen. In der Regel handelt es sich um eine Auswahl mehrerer Themes für unterschiedliche Zwecke plus Page Builder und Plugins, die der Anbieter bereits entsprechend angepasst hat. Sie als Kunde brauchen sich um gar nichts mehr zu kümmern, sondern ersetzen einfach nur die vorhandenen Platzhalter durch Ihre eigenen Texte. Da bei diesen Homepages oft auch schon eine Reihe von Bildern, Piktogrammen und Icons enthalten sind, brauchen Sie noch nicht einmal Ihre eigenen Bilder hochzuladen.

Was sich so super komfortabel anhört, hat gleich mehrere große Nachteile für Ihre neue Website. Bei jedem Aufrufen wird das gesamte Paket (s. auch Page Builder) geladen, unabhängig davon, welche Funktionen tatsächlich in Verwendung sind (= Bloatware). Darüber hinaus sind auch diese fertigen Homepages normalerweise nicht DSGVO-konform.

Premium-Themes

Einerseits können Sie die meisten kostenlosen Themes upgraden. Andererseits gibt es aber auch einige Theme-Entwickler, die nur Premium-Themes anbieten. In jedem Fall benötigen Sie eine Lizenz, um sie verwenden zu können, wobei die Preise und die Verkaufsart variieren. Manche Entwickler bieten ein Abo-Modell an, das Sie jedes Jahr erneuern müssen. Falls es sich um ein Upgrade eines kostenlosen Themes handelt, können Sie es jedoch auch weiter nutzen, wenn Sie die Lizenz verfallen lassen. Allerdings erhalten Sie dann keinen Premium-Support und keine Premium-Aktualisierungen mehr.

Bei anderen Entwicklern können Sie eine lebenslange Lizenz erwerben. Da diese teuerer ist, zahlt es sich erst aus, wenn Sie sich sicher sind, dass Sie das Theme über mehrere Jahre nutzen werden. Sofern Sie es mit einem seriösen Entwickler zu tun haben, brauchen Sie jedoch anschließend nicht zu befürchten, keine Updates mehr zu bekommen – vorausgesetzt, der Entwickler stellt nicht seine Arbeit ein.

Der einzige Nachteil, der Preis, steht zahlreichen Vorteilen gegenüber. So erhalten Sie ein hochwertiges Theme und können Ihre neue Website wirklich individuell gestalten. Einerseits liefern viele Entwickler ebenfalls Homepage-Vorlagen mit, die aber i. d. R. sauberer programmiert sind als die „fertigen Homepages“. Auch haben Sie selbst bei vorgefertigten Vorlagen die Möglichkeit, nicht benötigte Funktionen zu entfernen und/oder sie gemäß den Anforderungen der DSGVO anzupassen.

Andererseits können Sie für Ihre neue Website auch nur die Basis-Funktionen verwenden und alles drum herum neu und individuell aufbauen. Dementsprechend installieren Sie nur die Plugins, die Sie tatsächlich brauchen. Des Weiteren haben Sie mit einem Child-Theme die Möglichkeit, das Aussehen und die Funktionen beliebig mit eigenen Codes anzupassen, zu erweitern oder zu verändern. Viele Entwickler stellen auf Ihren Websites auch eine Dokumentation zur Verfügung, in der Sie viele nützliche Tipps und Anregungen finden.

Wer entwickelt eine neue Website?

Wenn Sie eine neue Website planen, stellt sich die Frage, ob Sie diese selbst erstellen oder einen Profi beauftragen. Nicht unwesentlich für diese Entscheidung ist, welchen Umfang und welche Funktionen Ihre neue Website haben soll und welche Zielgruppe Sie damit ansprechen wollen. Einerseits empfiehlt es sich immer, jemanden an der Seite zu haben, der sich zumindest ein bisschen auf diesem Gebiet auskennt. Andererseits stoßen Sie spätestens bei Geschäfts- und Unternehmensseiten relativ schnell an Ihre Grenzen, weshalb es sinnvoll ist, von Anfang an einen Profi einzuschalten.

Im Internet werden Ihnen bei der Suche nach Fachleuten für die Erstellung von Websites mehrere (Berufs-)Bezeichnungen begegnen. Worin unterscheiden sie sich oder sind es nur mehrere Namen für ein und dasselbe Tätigkeitsfeld?

Web-Entwickler

› Web-Entwickler (Web-Developer) sind Programmierer, die mittels web-spezifischer Programmier- und Skript-Sprachen Software für Webanwendungen und Apps entwickeln. Hierfür müssen sie u a. HTML, HTML5, XHTML; CSS, CSS3; XML und XSLT; JSON; JavaScript/AJAX; PHP8 sowie die Prinzipien der objekt-orientierten Programmierung (OOP) beherrschen.

Bezogen auf einen Internetauftritt sind Web-Entwickler diejenigen, die für das Grundgerüst und die Grundfunktion einer Website sorgen. Zwar ermöglichen ihre Leistungen und Produkte (z. B. CMS, Theme, Plug-ins, etc.) überhaupt erst den Betrieb einer Website, Sie als Website-Inhaber/in werden aber kaum je in direkten Kontakt mit den Web-Entwicklern kommen.

Website-Entwickler

Manche Webdesigner bezeichnen sich als Website-Entwickler, um sich von Designern/Grafikern abzugrenzen und zu betonen, dass Sie nicht nur Gestalter, sondern auch Programmierer sind. Zwar gibt es den Begriff Website-Entwicklung für einen Teilbereich des Webdesigns, den Beruf eines Website-Entwicklers gibt es jedoch nicht.

Webdesigner

Allgemein gesagt sind Webdesigner diejenigen, die einen Internetauftritt erstellen und ihn im Netz auffindbar machen. Folglich sind sie die Ansprechpartner, wenn es um eine neue Website oder das Überarbeiten bestehender Websites geht.

Da Webdesigner keine geschützte Berufsbezeichnung ist und es keine festgelegte Ausbildung dafür gibt, kann sich im Prinzip jeder so nennen. Dementsprechend reicht die Palette von Freizeit-Webdesignern, die damit etwas dazu verdienen wollen, über Grafik-Designer mit Zusatzkenntnissen und Marketing-Spezialisten bis hin zu studierten Informatikern. Daraus erklären sich auch die riesigen Qualitätsunterschiede in dieser Branche. Dasselbe trifft auch auf Webdesign-Agenturen zu, die zwar professioneller klingen, deren Arbeit aber nicht zwangsläufig auch qualitativ hochwertiger ist.

Backend- / Frontend-Entwickler

› Backend-Entwickler (Backend-Developer) kümmern sich um die serverseitige Programmierung von Websites. Sie entwickeln und warten die Datenbanken einschließlich der dort installierten Software und sorgen dafür, dass Ihre neue Website reibungslos funktioniert. Sie wirken also nur im Hintergrund. Als Benutzer oder Inhaber einer Website haben Sie mit ihrer Programmier- und Wartungstätigkeit nichts zu tun, denn Sie sehen nur, ob Ihre Website optimal läuft oder ob es irgendwo hakt, aber nicht woran es liegt.

Anders sieht es bei › Frontend-Entwicklern (Frontend-Developern) aus. Deren Tätigkeitsfeld überschneidet sich mit dem qualifizierter Webdesigner.

Leistungen von Webdesignern / Webdesign-Agenturen

Zu den Aufgaben von Webdesignern gehört im Wesentlichen alles, was Sie und die Besucher einer Website tatsächlich sehen. Da in dem Begriff Webdesign nicht nur Design, sondern auch Web steckt, überschneiden sich die Aufgaben teilweise mit denen von Web-Entwicklern / Backend-Entwicklern.

Selbstverständlich ist die Fähigkeit, eine neue Website optisch gestalten zu können, die Minimalanforderung an einen Webdesigner. Während die Kenntnisse insbesondere bei „Hobby-Webdesignern“ oft nicht wesentlich darüber hinaus gehen, beherrschen die Profis zusätzliche Teilbereiche rund um Ihre neue Website: Technik, Recht, Grafik-Design, SEO und Marketing. Die Übergänge vom Laien mit Grundkenntnissen zum Top-Experten sind fließend.

Je nach Größe beschäftigen Webdesign-Agenturen nicht nur (mehrere) Webdesigner, sondern auch Web-Entwickler, Grafiker, Texter und/oder Marketing-Fachleute. So arbeitet an einem Projekt mitunter ein ganzes Team, dessen Mitglieder jeweils ihren, für das Gesamt-Projekt erforderlichen, Teilbereich betreuen.

In den folgenden Ausführungen schließt die Bezeichnung Webdesigner sowohl Selbstständige als auch Webdesign-Agenturen ein.

Basis-Gestaltung

Was bereits über die Kompetenzen von Webdesignern im Allgemeinen gesagt wurde, gilt auch für die Vorgehensweise bei der Gestaltung. Dementsprechend verstehe ich unter Basis-Gestaltung all die Anpassungen, die sich ausschließlich auf die Optik und das Einfügen von Inhalt beziehen. Die hierzu notwendigen Minimalanforderungen an Webdesigner für eine neue Website, für die bereits ein Webhosting existiert, sind

• Installieren / Aktivieren eines Basis- oder fertigen Themes
• Anpassen der Farben für Hintergrund, Schrift(en), Links, Buttons (mittels vom Theme vorgegebener Farbtöne)
• Auswählen der Schrift(en) aus einem vorhandenen Angebot
• Ersetzen der Platzhalter auf der Startseite durch Ihre Bilder und Texte
• Erstellen der Pflichtseiten (Impressum und Datenschutz nach Vorlage) sowie weiterer gewünschter Seiten
• Einfügen des/der Menü/s sowie bereits vorinstallierter Sonderfunktionen (z. B. Kontaktformular)

Manche Webdesigner beschränken sich auf die oben genannten Leistungen und bieten nur wenige fertige Themes, oft in Verbindung mit Page-Buildern, an. So gesehen könnten Sie Ihre neue Website eigentlich auch gleich selbst zusammensetzen.

Individuelles Webdesign

Webdesigner, die wirklich etwas von ihrem Job verstehen, haben wesentlich mehr zu bieten. Das fängt bei einer wirklich professionellen Gestaltung an:

• Erarbeiten eines Gesamt-Konzepts für die neue Website
• Aufbauen / Programmieren einer individuellen Startseite ohne fertiges Theme-Layout und/oder Page-Builder
• Hinzufügen von Layout-Elementen, auch mittels eigener/bearbeiteter Codes
• Installieren und Anpassen von Plug-ins (Sicherheit, Datenschutz, spezielle Funktionen)
• Frei wählbare Farbgebung für Hintergrund, Schrift(en), Links, Buttons, etc.
• Installieren und Einbinden von Schrift(en)
• Anpassen der Schriftgröße für Titel, Überschriften und Text
• Gestalten eines individuellen Layouts für einzelne Seiten, Beiträge, Archive
• Erstellen der Pflichtseiten (Impressum und individuelle Datenschutzerklärung) sowie weiterer gewünschter Seiten
• Einfügen von Inhalten jeglicher Art inkl.Suchmaschnenoptimierung
• Erstellen und Einfügen eines oder mehrerer Menüs
• Einhalten der gesetzlichen Vorschriften (DSGVO, Urheberrecht)

Darüber hinaus können Sie bei professionellen Webdesignern noch einige der folgenden Zusatzleistungen erhalten:

• DESIGN:
• Unterstützung der Identität eines Unternehmens durch Corporate Design
• Erstellen von Logo, Web Icon, Piktogrammen und sonstigen Grafiken
• Bildbearbeitung
• Größenanpassung und Komprimieren von Abbildungen

• INHALTE:
• Alle Aspekte der Suchmaschinenoptimierung
• Gliedern und Anpassen von Inhalten (Online-Lesbarkeit, Barrierefreiheit)
• Optimieren von Titeln und Überschriften
• Überprüfen von Rechtschreibung und Grammatik
• Entwerfen und Schreiben von Texten

• TECHNIK:
• Unterstützung bei Fragen rund um die Website (Support)
• Überwachung der Funktion der Website
• Software-Aktualisierung und Fehlerbehebung über das CMS
• serverseitige Verwaltung und Wartung
• Hosting

Außerdem sind vor allem bei größeren Agenturen häufig auch Marketing-Experten (z. B. für die Social Media Präsenz) und Fotografen beschäftigt oder sie arbeiten mit entsprechenden Partnern zusammen, deren Service Sie zusätzlich buchen können.

Welche Kosten sind zu erwarten?

Hinsichtlich der Preisgestaltung gibt es nach oben so gut wie keine Grenzen. Dabei spielt nicht nur der Umfang und der Arbeitsaufwand eine Rolle. So kann Sie eine neue Website sowohl bei Webdesignern als auch bei Agenturen wenige Hundert Euro, aber auch mehrere Tausend Euro kosten. Manche Webdesigner machen in ihrem Leistungsverzeichnis gar keine Preisangaben, andere geben Ihnen anhand der angegebenen Basis-Kosten zumindest einen Anhaltspunkt und manche bieten preisgebundene Komplett-Pakete an.

Warum nicht die neue Website selbst erstellen?

Falls es sich nur um eine kleine, mehr oder weniger private Website handelt, könnten Sie es auch selbst versuchen. Aber selbst wenn Sie sich für eine „vorgefertigte“ oder ein „Rund-um-sorglos“- Website entscheiden, können Sie nicht davon ausgehen, dass sie auch wirklich professionell programmiert und in der EU zulässig ist.

1. Informieren Sie sich über die aktuellen gesetzlichen Bestimmungen (DSGVO, Urheberrecht, Impressumspflicht)
2. Überprüfen Sie, ob auf Ihrer Website Verknüpfungen mit Google-Diensten (Fonts, Analytics, Maps, Videos, etc.) bereits vorinstalliert sind
3. Erkundigen Sie sich bei Ihrem Hoster, ob es Verbindungen zu externen Servern (z. B. Cloudflare/CDN, AWS) gibt.

Einfügen von Inhalten

Unabhängig davon, ob Sie Ihre neue Website selbst gestalten oder später Änderungen am Layout oder Inhalt vornehmen wollen, nehmen Sie sich Zeit, sich in das Redaktionssystem einzuarbeiten. Obwohl die modernen Redaktionssysteme sehr an Microsoft Word oder Apple Pages erinnern, gibt es doch einen gewaltigen Unterschied. So weicht die Textgestaltung für Webseiten relativ stark von der für Print-Medien oder sonstige Dokumente ab. Kurz gesagt, Sie schreiben nicht auf Papier und müssen deshalb auch keinen Platz sparen.

Die Struktur der Texte auf Websites wird durch HTML (Hypertext Markup Language) definiert. Wenn Sie die Texte aus Word/Pages in das CMS kopieren, werden die Anweisungen (Fett, Schriftgröße, Farben, Absätze, etc.) von Microsoft/Apple zwar mit übertragen, stellen aber nur unnötigen Ballast dar. Denn die Auszeichnungssprache der normalen Dokumente kann von Browsern nicht interpretiert und angezeigt werden.

Verwenden Sie möglichst für Schriften, Links und Buttons keine blassen Farben auf hellem Hintergrund. Insbesondere von Sehbehinderten, auf kleinen Bildschirmen oder bei sehr heller Umgebungsbeleuchtung sind sie sonst schlecht erkennbar / lesbar. Dasselbe gilt natürlich auch für dunkle Farben auf dunklem Hintergrund. Der Kontrast sollte immer ausreichend groß sein.

Nachdem Sie sich darüber soweit im Klaren sind, prüfen Sie die Hosting-Angebote mehrerer Unternehmen. Schauen Sie dabei nicht nur auf den Preis. Die wirklich billigen / nahezu kostenlosen Angebote sind nur durch starke Einschränkungen bei der Individualität und persönlichen Unterstützung (auch nach der Fertigstellung) möglich. Darüber hinaus sind die fertigen Pakete was Datenschutz und Sicherheit betrifft fast immer bedenklich bis mangelhaft. Wenn es dumm läuft, wandert das für Ihre neue Website eingesparte Geld irgendwann als Bußgeld in die Staatskasse.

Dasselbe gilt auch für das Redaktionssystem. Bausteine sind zwar ganz praktisch, haben aber mit einem auf die jeweiligen Anforderungen abgestimmten und fachgerecht umgesetzten Webdesign wenig zu tun. Zwar können Sie Ihre neue Website später ändern und/oder auf einen anderen Server/zu einem anderen Anbieter umziehen, aber das verursacht in jedem Fall zusätzliche Kosten. Gerade bei „Billiganbietern“ erstellte Websites lassen sich i. d. R. auch nicht einfach herunter- und woanders wieder hochladen. Infolgedessen müssten Sie am Ende doch eine vollkommen neue Website einrichten.

Wenn Ihre neue Website geschäftlichen Zwecken dienen und potentielle Kunden oder Besucher außerhalb Ihres Bekanntenkreises ansprechen soll, ist das Beauftragen eines professionellen Webdesigners immer zu empfehlen. Wie auch beim Hosting sollte auch hier der Preis nicht der allein ausschlaggebende Faktor sein. Denn ein hoher Preis bürgt nicht unbedingt für Qualität und ein Webdesigner im mittleren Preissegment kann durchaus qualitativ hochwertige Arbeit leisten.

Neue Website – Zusammenfassung

Ohne jegliche Vorkenntnisse eine neue Website zu starten, führt selten zu einem wirklich professionellen Ergebnis.Überstürzen Sie nichts.

Bitten Sie nach Möglichkeit um ein persönliches (kostenloses) Beratungsgespräch, in dem Sie Ihre Wünsche und Vorstellungen für Ihre neue Website darlegen. Achten Sie darauf, wie Ihr Gesprächspartner darauf eingeht,
ob er nur seine „fertigen Produkte“ verkaufen möchte,
ob er Ihnen zu mehr rät, als tatsächlich notwendig wäre und
ob er Sie ggfs. auch über die Vor- und Nachteile einzelner Optionen informiert.

Vor allem erkundigen Sie sich nach dem Service „rundherum“. Viele Webdesigner / Webdesign-Agenturen erstellen zwar Ihre neue Website, kümmern sich aber anschließend nicht mehr darum. Auch bei Nachfragen zur Pflege des Inhalts oder zu Updates werden Sie später nicht selten allein gelassen.

Fazit

Überlegen Sie zuerst, welche Zielgruppe Sie ansprechen möchten sowie welchem Zweck die neue Website dienen und welchen Umfang sie haben soll. Vergleichen Sie das Preis-Leistungsverhältnis mehrerer Anbieter und sehen Sie sich die Referenz-Websites kritisch an. Sehen sie alle irgendwie gleich aus, haben sie einen ihrem Zweck entsprechenden individuellen Charakter und passt der Gesamt-Eindruck zu dem jeweiligen Unternehmen / Produkt.

Abbildungen © eb | › Externe Verlinkungen: Dieser Beitrag enthält keine Affiliate-/Partner-Links.