Logo webuftritt.ch

WEBUFTRITT.CH

by Rita Ludwig-Helmchen

Webdesignerin, Logodesignerin, Code-Versteherin

  1. Software
  2. Domain und Hosting
  3. CMS (Content Management System)
    - Sites von cm4all
    - WordPress
  4. Frameworks
    - W3.CSS
    - Bootstrap
  5. HTML und CSS

Technische Umsetzung

Ab jetzt beginnt der schwierige Teil. Jetzt müssen Sie sich entscheiden, wie Sie die Seite technisch Umsetzen wollen und ob Sie das selber in die Hand nehmen oder einem Profi überlassen.

Auswahl haben Sie mehr als genug und ich stelle Ihnen in diesem Bereich die verschiedenen Programme kurz vor. Genauere Ausführungen werden dann unter Subdomains verlinkt.


1. Software

Es ist jedem selber überlassen, mit welcher Software er arbeitet. Ich empfehle hier nur solche, mit denen ich über die Jahre hinweg gearbeitet habe. Sicher sind OpenSource Produkte nicht schlecht oder viel weniger gut. Es lohnen sich auch Investitionen in Programme, sobald diese Zeit sparen und man dadurch schneller voran kommt.

OpenSource

  1. LibreOffice - zum erstellen von Briefen
  2. Gimp - Grafiksoftware
  3. Visual Studio Code - Editor zum schreiben von HTML/CSS
  4. Brackets - Editor zum schreiben von HTML/CSS

Software, die etwas kostet

  1. Affinity Publisher - zum erstellen der Ansichten und Texte
  2. Affinity Designer - zum erstellen von Logo und Icons
  3. Affinty Photo - zum bearbeiten von Foto’s

first: 14.09.2019


2. Domain und Hosting

Da Sie sich inzwischen ausgiebig Gedanken gemacht haben, sollten Sie hier schon so weit sein, das Sie einen Namen haben für die Webseite. Suchen Sie sich im Internet einen Anbieter Ihres Vertrauens, bei dem Sie die Domain und ein Hosting für die Webseitendaten und Ihre E-Mails mieten können .

Lassen Sie sich nicht beirren von technischen Möglichkeiten. Ihr Registrar und Ihr Hostinganbieter werden Ihnen die Informationen, welche Sie benötigen zur Verfügung stellen und allenfalls bei den Einträgen helfen.

Je nachdem wie Sie die Zukunft Ihres Unternehmens oder der Webseite sehen, können Sie die Endungen wählen.
.ch - Domains sichern Sie sich für den Schweizer Markt
.com - Domains, wenn Sie International unterwegs sein möchten

Je nach Wunsch gibt es inzwischen fast unzählige Domain-Endungen. Wählen Sie auch Domains, welche beispielsweise die Mehrzahl von Ihrem Wunsch sind. Unter https://domain.ch/ finden Sie die Domains nach Kategorie sortiert, was Ihnen die Auswahl etwas einfacher macht.

Technisch haben Sie nach dem Kauf der Domain 3 verschiedene Möglichkeiten.
Beispiel: Sie kaufen/mieten eine Domain bei einem Anbieter und entscheiden sich, die Seite bei einem anderen Anbieter zu erstellen.

1.) Sie wollen die E-Mails bei dem Registrar Ihrer Domain erstellen und verwenden:
Setzen Sie A-Record (IP-Adresse) und/oder CNAME in der DNS-Zone Ihrer Domain, die mit den sogenannten MX-Records auf die Server Ihres Registrars zeigt. Das klingt komplizierter, als es ist. Man spaltet die Domain quasi auf und sagt Ihr, welche Elemente/Daten wo zu Hause sind.

2.) Sie wollen alles, von der Webseite bis hin zur E-Mail beim gleichen Anbieter, doch die Domain bei Ihrem Registrar:
Dafür stellen Sie die Nameserver bei Ihrer Domain um, damit diese auf den Hostinganbieter zeigen. Bei Ihrem Registrar bleibt damit nur der Vertrag und die leere Datenhülle der Domain. Alle DNS-Einstellungen müssen bei Ihrem Hostinganbieter gemacht werden.

3.) Jetzt haben Sie noch eine ganz andere Möglichkeit, bei der es 3 beteiligte gibt.
Sie setzen die Nameserver bei Ihrem Registrar auf das Webhosting bei einem zweiten Anbieter, möchten Ihre E-Mails jetzt aber ganz woanders haben. Dafür erstellen Sie bei Ihrem Hostinganbieter in der DNS-Zone der Domain die oben erwähnten MX-Records.

Kurz noch zum Thema Web-Hosting. Es ist wie die Miete einer Wohnung, nur das Sie in diesem Fall einen Platz für Ihre Daten mieten.
Mein Hosting habe ich seit 2008 bei Hostpoint und konnte die Bemühungen um Sicherheit und Kundenwünsche miterleben. Die Möglichkeit so viel selber zu machen hat mir schon immer gefallen. Mit den Tools die über die Jahre dazu kamen, haben Sie wieder Sympathiepunkte gesammelt.

first: 14.09.2019


3. CMS (Content Management System)

Sites von cm4all

Dieses Programm kommt ohne Datenbanken aus.Bei Hostpoint gibt es dieses Programm vorinstalliert auf einemm Hosting in zwei Variationen. Je nach Branche und Kategorie werden unterschiedliche Designs vorgeschlagen und ist für Einsteiger eine gute Möglichkeit innerhalb kurzer Zeit eine Webseite auf zu bauen.

WordPress

Hierbei handelt es sich um ein Datenbankbasiertes Programm, das Sie bei Hostpoint recht bequem installieren können. Es ist eines der beliebtesten CMS und hat eine weltweite Community. Es wird durch etliche Plugin, welche man zusätzlich installieren kann zu fast allem, was möglich ist. Von der SinglePage-Seite bis hin zu einem Webshop. Viele der Plugins und Designs (Themes) sind kostenfrei und können mit ein paar Kenntnissen in HTML und CSS grafisch angepasst werden.
Mit der aktuellen Version von WordPress sind die wöchtentlichen Updates nicht mehr zwingend nötig. Betreffend WordPress habe ich ganz aktuell eine separate Domain und Webseite online gestellt, wo Sie bei den ersten Schritten unterstützt. Schauen Sie hierfür auf webuftritt.support

last: 03.03.2021

first: 19.09.2019


4. Frameworks

Dafür benötigen Sie ein Verständnis, wie genau die unterschiedlichen Daten verarbeitet werden. Die jeweiligen Anbieter, bieten Ihnen aber Hilfestellungen für Erstellung einer Webseite. Ebenso benötigen Sie ein Editorprogramm. Schauen Sie sich beide an und entscheiden dann, welches Ihnen mehr liegt.

W3.CSS

https://www.w3schools.com/w3css/
Hierbei handelt es nicht nicht um ein Programm. Es besteht aus vielen Bibliotheken, welche im head-Bereich des HTML-Dokumentes eingebunden werden. Es hat umfangreiche Erstellungsmöglichkeiten und mit mehr Kenntnissen in HTML/CSS können die Vorgaben auch personalisiert werden.

Bootstrap

https://getbootstrap.com
Dies ist auch bibliothekenbasiert, verfügt über andere Funktionen wie W3.CSS. Es ist definitiv geschmackssache, welches einem jetzt mehr liegt. Es ist ein wenig komplexer, hat aber auch gute Beschreibungen für Einsteiger.

first: 19.09.2019


HTML und CSS

Hierfür benötigen Sie ein entsprechendes Editorprogramm, welche oben aufgelistet sind. Umfangreiche Kenntnisse, die man sich nicht mal eben so schnell aneignen kann sind dafür notwendig. Dafür kann man hier auf Updates verzichten und muss nur alle paar Jahre mal das Geschriebene anschauen. Wenn Sie Zeit haben, kann ich zwei Foren empfehlen.
https://www.w3schools.com/ (Englisch)
https://wiki.selfhtml.org/wiki/Startseite (Deutsch)

Es gibt noch das eine oder andere hilfreiche Tool, welche ich gern nutze um alles zu prüfen zu lassen.
W3C Markup Validation Service und
W3C CSS Validation Service

last: 07.03.2021

first: 19.09.2019