Der Astrospeicher-Blog

Wie Webseiten gemacht werden

Diese Webseite habe ich am: 4.12.2024 aktualisiert.

Es ist mir bewusst, dass der Inhalt dieser Webseite nicht zum eigentlichen Thema meiner Website, Astrologie und Spiritualität, passt. Aber irgendwie passt es doch, weil ich meine Astrologie-Website selber gestalte und im Internet verwalte.

Ein Bild mit einer Person und einer Webseite
© adobe express

Anfang Dezember 2022 rief mich eine nette Dame an. Sie hat meine Website, die ihr gefallen hat, im Internet gefunden. Das freut mich natürlich. Weiter erzählte sie mir, dass sie eine astrologische Ausbildung genossen hat, und jetzt Menschen mit Problemen astrologisch beraten will. Die gute Frau fragte, ob ich für sie auch eine Website machen kann. Ich erklärte ihr, dass ich diesen Job, unter anderem wegen der vielen Arbeit, die damit verbunden wäre, nicht mache. Dazu kommt noch, dass ich (krankheits-bedingt) kein Gewerbe angemeldet habe. Ich gestalte diese Website als Privat-Person hobby-mäßig. Ich bin auch kein ausgebildeter Webmaster. Ich habe mir das HTML-und-CSS-Wissen, das ich brauche, mit Hilfe von Lehrbüchern und Nachlesen im Internet selber beigebracht.

Nach oben

Wenn Sie HTML oder CSS lernen wollen, empfehle ich Ihnen diese Internet-Adressen als Start-Hilfen:

Eine Website wie meine, erstellt man nicht an einem Wochenende! Da müssen nämlich möglichst viele, ordentlich erstellte und interessante Inhalte rein-gepackt werden, bevor sie von Internet-Suchmaschinen wie Google akzeptiert- und in Such-Ergebnisse aufgenommen wird. Ich will hier aber nicht behaupten, dass meine Website perfekt ist! Wer oder was ist perfekt?

Eine kleine- und somit preiswerte Website mit:

geht im Internet meist verloren, außer das dazu gehörige Gewerbe hat schon einen bekannten Namen, auf dem aufgebaut werden kann.

Nach oben

An meiner eigenen Website arbeite ich seit 2007, einschließlich HTML-und-CSS-Lernen. Das sind jetzt, im Dezember 2022, immerhin rund 15 Jahre. Mehrmals habe ich sie komplett gelöscht und neu gemacht, weil ich mich in meinem HTML-und-CSS-Code-Chaos hoffnungslos verirrt hatte und aufgeben wollte. Ich hatte 2007 nämlich kaum Ahnung vom Internet und keine von Webseiten-Erstellung. Ich habe HTML und CSS, wie weiter oben schon angedeutet, mit Hilfe von Lehrbüchern und Suchen im Internet gelernt. Das hat Jahre gedauert. Ob das bei jedem so lange dauert, weiß ich nicht.

PHP-Programmierung, JavaScript oder ähnliches, für dynamische Webseiten, kann ich überhaupt nicht. Da muss ich passen. Ich kann nur statische Webseiten, so wie diese, codieren.

Es ist nicht damit getan, eine Website auf der Festplatte des eigenen Computers fertig zu stellen. Websites müssen ins Internet geladen werden, wenn sie für ihre Besitzer Kunden oder Besucher anlocken sollen. Websites müssen mit speziellen Computern (Server) ins Internet gebracht werden. Server müssen logischer-weise 24 Stunden am Tag, 7 Tage die Woche und 365 Tage im Jahr eingeschaltet sein, was die Strom-Rechnung ordentlich belastet. Server sind recht schwierig zu konfigurieren und zu warten. Lange nicht jeder kann oder will das selber leisten. Ich kann das auch nicht. Was ist zu tun? Man mietet sich am besten Webspace und Web-Adresse/Domain (bei mir: astro-speicher.de) als Komplett-Paket bei einem der vielen Anbieter im Internet: Suchbegriff → Webhosting-Anbieter. So mache ich das auch. Das kostet monatlich einige oder mehrere Euro, je nachdem welchen Umfang ein Website-Komplett-Paket hat. Das .de im Namen meiner Website bedeutet übrigens: Deutschland, also eine deutsch-sprachige Website.

Nach oben

Eine Website wird, meines Wissens, nie fertig! Immer wieder entdeckt man, in scheinbar längst fertigen Webseiten, Fehler, Ungenauigkeiten oder Wissens-Lücken, die beseitigt- oder mit neuen Inhalten gefüllt werden müssen. Oft will man auch einfach etwas Neues in scheinbar fertige Websites einbauen. Ich habe das selber immer wieder so erlebt. Ich denke hier zum Beispiel, daran, dass Webseiten neuerdings auch für Mobil-Telefone optimiert werden sollen oder müssen. Das war früher, als es noch keine Smart- oder iPhones gab, kein Thema. Viele Website-Betreiber haben diesen schwierigen Weg noch vor sich. Meine Webseiten sind inzwischen für Mobil-Telefone optimiert.

HTML-und-CSS-Codes sind auf einer Editor-Basis zuständig für die Gestaltung von Webseiten und werden ständig weiter-entwickelt. Mittlerweile sind wir bei HTML-5 und CSS-3 angelangt. Das sagt den meisten Internet-Nutzern wahrscheinlich nichts, aber Webmaster sind gut beraten, wenn sie hier am Ball bleiben. Das alles kostet natürlich Geld, wenn man seine Webseiten von Fachleuten codieren und hosten- also im Internet verwalten lässt. Da kann es sich schon lohnen, sich selber in die HTML-CSS-und-Internet-Thematik einzuarbeiten.

Nach oben

Einige HTML-Codes

HTML-Codes werden in (HTML)-Editoren geschrieben! Gerne auch im recht spartanischen Windows-Editor. Diese Editor-Seiten werden zu Webseiten, wenn sie mit der Codierung: UTF-8 und der Endung: .html abgespeichert werden. Namen für Webseiten sind frei. Sie sollen aber weder Umlaute noch Leerzeichen enthalten. Ich bin mir nicht sicher, ob Namen von Webseiten Sonderzeichen enthalten dürfen. Ich schreibe vorsorglich keine rein. index.html heißt die Startseite (Homepage) einer Website (Internet-Präsenz).

Fetter Text
<strong></strong>
<b></b>
Textblock
<p></p>
Cursiver Text
<em></em>
<i></i>
Unterstrichener Text
<u></u>
Gelber Text-Hintergrund
<mark></mark>
Überschriften
<h1></h1>
<h2></h2>
<h3></h3>
<h4></h4>
<h5></h5>
<h6></h6>
Sortierte Liste
<ul>
<li></li>
<li></li>
<li></li>
</ul>
Überschrift-Liste
<dl>
<dt></dt>
<dd></dd>
<dd></dd>
<dd></dd>
</dl>
Einige Farbcodes
#008000 #0000FF #00FFFF
#808080 #FFD700 #FFFF00
#FFA500 #FF0000 #800000
#808000 #000080 #FF00FF
#4682B4 #EE82EE #C0C0C0
Einige Farbcodes
#00FF00 #F0C88C #F5F5DC
#FFFFCC #FFFF66 #FFFF99
#000000 #FFFFFF #A9A9A9
#008080 #708090 #800000
#FF6347 #6A5ACD #DDA0DD

Nach oben

Ein weiter-führender Link, innerhalb einer Website, wird so codiert:
<a href="webseite.html">Linktext</a>

Ein weiter-führender Link, zu einer anderen Website, wird so codiert:
<a href="https://www.website.de">Linktext</a>

In Mobil-Telefonen werden lange Code-Zeilen umgebrochen. Bei HTML-Schreiben kann man lange Code-Zeilen aber in eine Zeile ohne Umbruch schreiben.

In den Head-Bereich jeder HTML-5-Grundstruktur gehört auch dieser Code, der für die saubere Darstellung von Webseiten in Mobil-Telefonen zuständig ist:
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
Wegen seiner Länge passt er aber nicht in die obige Darstellung der HTML-5-Grundstruktur.

Ein Code (im Head-Bereich) für ein SVG-Favicon sieht so aus:
<link rel="icon" href="/favicon.svg" sizes="any" type="image/svg+xml">

Ein Code (im Head-Bereich) für eine CSS-Datei sieht so aus:
<link href="css/style.css" rel="stylesheet">

Nach oben

Suchmaschinen-Optimierung

Und dann kommt noch die Suchmaschinen-Optimierung. Das ist eine Wissenschaft für sich. Dass es so etwas gibt, habe ich erst 2017 oder 2018 erstaunt zur Kenntnis genommen, als ich wissen wollte, wie-viele Internet-Nutzer meine Website eigentlich besuchen beziehungsweise finden. Es waren - damals - nicht viele! Suchmaschinen-Optimierung bedeutet, dass man seine Webseiten-Codes- aber vor allem die eigentlichen Inhalte so schreibt, dass sie von Suchmaschinen, wie:

Einige Suchmaschinen

ausgewertet, verstanden und als brauchbar akzeptiert werden können. Suchmaschinen erkennen mittlerweile Defizite, Mängel und Schwachstellen von Websites im Internet erstaunlich treffsicher. Gibt es in einer Website zu viele davon, bedeutet das, dass Suchmaschinen solche Websites als problematisch bewerten und nach hinten schieben, sodass sie es kaum bis in die Suchergebnisse schaffen. Wenn man die Suchmaschinen-Optimierung der eigenen Website auch von Fachleuten machen lässt, kostet das natürlich auch wieder Geld. Da kommen schnell einige Hundert Euro zusammen.

Nach oben

Homepage, Website, Webseite?

Homepage ist übrigens nicht, wie viele Laien meinen, das britische Wort für eine vollständige Internet-Präsenz, sondern nur die Startseite einer solchen. Ein anderes Wort- oder der Fachausdruck für eine Internet-Präsenz ist: Website. Eine Website besteht aus einer Startseite (Homepage) und einigen, etlichen oder vielen einzelnen Webseiten.

HTML-und-CSS-Software

Nun zu CMS-Systemen (Content-Management-Systeme) wie Word-Press, Drupal oder Joomla. Mit solchen HTML-Softwares kenne ich mich nicht aus. Ich schreibe meine HTML-und-CSS-Codes lieber selber. Einige Male habe ich in WordPress reingeschaut, weil mein Website-Verwaltungs-Paket das anbietet. Wenn ich das richtig verstanden habe, arbeitet man mit Word-Press an den Webseiten im Server-Bereich. Ist in diesen Bearbeitungs-Zeiten eine Website überhaupt besuchbar? Weiß ich nicht! Dann ist mir bei Word-Press aufgefallen, dass man sich als Laie da zuerst einmal einarbeiten muss, bevor man produktiv damit arbeiten kann. Wie lange das dauert, habe ich nicht ausprobiert. Es gibt auch sogenannte Wysiwyg-HTML-Editoren. Wikipedia übersetzt Wysiwyg wie folgt: Was du siehst, ist das, was du bekommst.

Nach oben

Wysiwyg-HTML-Editoren interessieren mich. Diese können auf eigene Computer installiert werden. Es gibt auch Online-Wysiwyg-HTML-Editoren. Wenn man mit diesen HTML-Editoren arbeitet, muss man HTML und CSS nicht selber lernen, um Webseiten machen zu können. Es ist aber von Vorteil, wenn Website-Betreiber sich mit HTML und CSS auskennen. Mit der Zeit habe ich festgestellt, dass viele (ältere) Wysiwyg-HTML-Editoren nicht HTML5-und-CSS3-fähig sind, weil deren Entwickler irgendwann aufgehört haben, ihre Softwares weiter-zu-entwickeln. Das ist natürlich nicht gut. HTML 4.01 funktioniert auch noch, gilt aber als veraltet. Dafür sind Wysiwyg-HTML-Editoren oft kostenlos nutzbar, was ich wiederum positiv finde. Die Quell-Codes, die Wysiwyg-HTML-Editoren produzieren, sind oft nicht Regel-konform, aber in der Praxis durchaus brauchbar. Das alles ist für Laien wahrscheinlich verwirrend. Des Rätsels Lösung ist wie so oft: Viele Wege führen nach Rom!

Neuerdings arbeite ich mit dem kostenlosen HTML-Editor Phoenix-Code Früher habe ich mit dem Windows-Editor gearbeitet. War auch nicht schlecht, obwohl viele Fachleute sagen dürften, dass das HTML-Steinzeit ist. Phoenix-Code ist wesentlich komfortabler als der Windows-Editor. Microsoft bietet auch einen HTML-Editor gratis an: Visual-Studio-Code. Welcher der beiden - Phoenix-Code oder Visual-Studio-Code - besser ist, kann ich nicht beurteilen. Für mich fühlt sich Phoenix-Code besser an.