Suchmaschinengerechte Programmierung

HTML, CSS, JavaScript, PHP - wie man kostenlos bei Suchmaschinen nach oben kommt.

Zielgruppe: Der Artikel Suchmaschinengerechte Programmierung, HTML, CSS, JavaScript, PHP wendet sich an Privatpersonen und berufliche Anwender, die endlich kostenlos bei Google, Bing und anderen Suchmaschinen nach oben - auf die erste Trefferseite - gelangen wollen.

Ein Inhaltsverzeichnis mit direkten Sprungmarken und Überblick über alles zu Suchmaschinengerechte Programmierung finden Sie als Pop-Up.

Erfolgsgarantie: Der Autor hat alle hier erklärten Tipps und Techniken seit Jahrzehnten persönlich bei seinen eigenen sowie Kundenauftritten im Internet erfolgreich in der Praxis angewendet.

Irrtümer bezüglich der Suchmaschinen-Optimierung

Vorab: Google oder andere Namen von Suchmaschinen stehen hier nur als Stellvertreter. Fast alle Suchmaschinen arbeiten heute sehr ähnlich.

Bezahlte Spitzenplätze

Bei Google kommt man bei den Suchergebnissen nur nach oben, wenn man dafür bezahlt.

Korrekt ist, dass Google und andere Suchmaschinen bestimmte Links / Treffer als bezahlte Werbung Einblendungen zu jedem denkbaren Suchwort anbieten.
Wer bereit ist, bis zu hohe einstellige Euro-Beträge für ein einziges Erscheinen eines einzigen Werbelinks zu seiner Seite bei einem einzigen Suchwort zu bezahlen, der kann und soll dies tun.
Jeder möge aber selbst einmal die Kosten bei einem Suchwort ermitteln, das eventuell tausende Mal je Tag eingegeben wird. Da kommen je Monat schnell beängstigende Summen zusammen, die nur ganz wenige Internet-Aufritte noch einspielen. Rechnen Sie es bitte selbst nach.
Bitte beachten Sie ferner, dass viele Suchwörter mehrfach von bezahlenden Kunden belegt sind. Dann werden oft 3-6 derartiger bezahlte Werbeblöcke untereinander geschaltet. Wer am meisten bezahlt, liegt meist oben.
Mit dem bloßen Erscheinen der Werbung an erster Stelle ist überdies keine Garantie verbunden, dass irgendjemand diesen Link auch anklickt, da inzwischen immer mehr Menschen den Unterschied zwischen bezahlten Werbelinks und realen (werbefreien) informativen Textlinks nicht nur erkennen, sondern auch missbilligen, indem sie absichtlich die Werbung überspringen.

Bezahlte Rück-Links

Der Algorithmus bei Google etc. belohnt nur viele Links fremder Auftritte auf die eigene Seite.

Korrekt ist, dass - früher - ein wichtiger Bestandteil der hoch-komplizierten Berechnung des Listenplatzes von der Anzahl der Links Dritter auf die eigene Seite bestimmt wurde. Man ging um die Jahrtausendwende davon aus, dass diese Popularität einer Seite etwas über den Wert der Inhalte aussagt.
Deshalb kamen betrügerische Schlaumeier schnell darauf, bezahlte Links zu verkaufen. Am besten geschah dies in sogenannten Link-Farmen, deren einzige Aufgabe darin bestand, Links zu anderen Seiten zu schalten.
Der alte (öffentlich publizierte patentierte) Google-Algorithmus wurde jedoch schon lange verfeinert. Links sind - vor allem aufgrund der massiven Betrügereien - folglich seit vielen Jahren nicht mehr das wichtigste oder einzige Kriterium.
Im Übrigen wurde bereits früher gerne übersehen, dass es nicht auf den Link zum Gesamtauftritt ankommt, sondern auf die Link-Bewertung der einzelnen Unterseite, auf die das einzelne Suchwort schließlich leitet.
Inzwischen haben auch die meisten Betreiber eines Internet-Auftrittes begriffen, dass es wertlos ist für den Firmennamen Geld auszugeben. Wenn jemand bereits weiß, dass er die Firma Fenster Hugendubel sucht, dann wird diese Suchwortkombination auch ohne Geld ganz oben angezeigt. Oder der Kunde gibt die Adresse mit Bindestrich und dem nationalen Endungszeichen direkt in die Adresszeile ein (www.fenster-hugendubel.de).

Bezahlte SEO-Spezialisten

Bei Google kommt man bei den Suchergebnissen nur nach oben, wenn man dafür teuer bezahlte SEO-Spezialisten anstellt / beauftragt.

Unter SEO versteht man Search Engine Optimization - Suchmaschinen-Optimierung.
Korrekt ist, dass manche SEO-Spezialisten das sogenannte Page-Ranking - also die Platzierung der Seite in Suchtreffern - positiv beeinflussen können.
Sehen wir einmal von den absolut unseriösen SEO-Spezialisten ab, welche illegale Tricks dazu verwenden, die sowieso entweder dem Suchmaschinenbetreiber selbst oder den Mitbewerbern auffallen, welche es wieder an die Suchmaschine melden, so führt dies maximal zu kurzfristigen Vorteilen. Aber in der Regel werden Sie als Betreiber des Internet-Auftrittes (nicht der SEO-Spezialist) dafür bestraft. Meist wird Ihr Auftritt auf unbestimmte Zeit entweder ganz ausgeschlossen oder bei den Suchtreffern an das Ende der Liste gestellt. Ein klassisches Eigentor. Das hat sogar schon die größten sowie mächtigsten Firmen wie z.B. BMW betroffen. Da verstehen die Suchmaschinenbetreiber keinen Spaß mehr. - Bei Verstößen gegen das Wettbewerbsrecht drohen Ihnen dann zusätzlich sogar noch Abmahngebühren und Schadenersatzansprüche der Mitbewerber sowie die Rechtsanwalts- und Gerichtskosten.
Daneben gibt es halbwegs seriöse SEO-Spezialisten. Die meisten werden Ihnen zu sündhaft teuren Werbeverträgen bei den Suchmaschinen raten, da sie dafür hohe Provisionen erhalten. Das können Sie auch ohne Provision selbst tun, sofern Sie es wollen.
Seriöse SEO-Spezialisten raten Ihnen fast immer zu Textoptimierungen. Das ist ohne Zweifel richtig. Das habe ich jedoch alles auch schon hier in zahlreichen Artikeln kostenlos beschrieben. Nur Textinhalt ist letztendlich für die Platzierung in Textsuchmaschinen hilfreich. Aber Sie werden doch wohl selbst wissen, was Sie schreiben wollen. Nur Sie selbst kennen Ihre Kunden und wissen, was diese suchen, wie sie suchen und welche (oft merkwürdigen) Suchworte sie dafür bei Anfragen bei Ihnen verwenden. Kunden sind nicht immer Experten. - Aber dasselbe gilt für SEO-Spezialisten. Kaum ein SEO-Profi kennt sich in Ihrer Branche und mit Ihren Produkten oder Dienstleistungen oder exakt Ihren Kunden aus.
Vorsicht sollten Sie walten lassen bei Standardsprüchen der naiven SEO-Berater. Die Zeiten, in denen man mit einem 100 Mal wiederholten Stichwort im Text, am besten noch unsichtbar formatiert, Suchmaschinen täuschen konnte, sind schon lange vorbei. Ebenso veraltet sind pauschale Antworten wie die überall anzutreffende Behauptung, dass ein Suchwort im Text der Zielseite mindestens einen Anteil von XX Prozent haben müsse, damit man bei Suchmaschinen hoch gerankt würde. Sie werden an meinen weiter unten folgenden Beispielen erkennen, dass ganz normaler Text viel höher bewertet wird.
Nochmals im Klartext: Wenn Sie nicht selbst wissen, wo die Vorteile Ihrer Produkte und Dienstleistungen liegen, und was Ihre Kunden wünschen, dann hat Ihr Internet-Auftritt (wie Ihre ganze Firma) auch mit SEO-Spezialisten keine Chance auf Erfolg.
Hören Sie Ihren Kunden zu und texten Sie exakt für diese Zielgruppe.

Ergonomie

Auf Ergonomie und Fehlerfreiheit legen die Suchmaschinen keinen Wert. Die arbeiten mit künstlicher Intelligenz und bügeln alles aus.

Korrekt ist, dass Suchmaschinen mit erstaunlich vielen Tippfehlern in Texten bei Einzelwörtern klarkommen. Das heißt jedoch nicht, dass daraus derselbe Sinn entsteht, den Sie bei korrekten, fehlerfreien Texten erzielt hätten.
Die Fehler bleiben trotz künstlicher Intelligenz sichtbar: Sowohl im Index der Suchmaschine - also der Trefferanzeige - als auch auf Ihrer Seite. - Ein erheblicher Image-Schaden. Viele Nutzer klicken heute keine Links mehr an, die Schreibfehler enthalten. Wer sich so wenig Mühe gibt, dessen Produkte und Dienstleistungen werden wohl auch fehlerhaft sein.
Korrekt ist ferner, dass viele Browser und deshalb auch Suchmaschinen mit erstaunlich vielen Fehlern in der Programmierung klarkommen. Sie zeigen die Inhalte meist dennoch halbwegs korrekt an. Aber das gelingt nicht immer. Vor allem bei der Verkettung oder Verquickung von mehreren Programmierfehlern hat sich schon so mancher Browser (auch in der neuesten Version) verschluckt und zeigt dann etwas entweder nicht, oder zumindest nicht korrekt an. Sicherlich sind Ihnen schon einmal die sinnlosen und unverständlichen Sonderzeichen im Text aufgefallen, die man oft an Stellen sieht, an denen man deutsche Umlaute oder das ß erwartet.

Schlampigkeit

Die dreisteste Lüge der Internet-Berater, die mir mindestens einmal pro Woche als Gutachter aufgetischt wird: Fehlerfreie Programmierung gibt es nicht.

Doch: Fehlerfreie Programmierung ist das Mindeste, das Sie als Auftraggeber verlangen und erwarten dürfen.
Eine nicht funktionierende Bremse würden Sie - zu Recht - bei einem neuen Pkw auch monieren. Lassen Sie sich da nicht über den Tisch ziehen.
Internet-Unternehmer, die Ihnen solche vorsätzlichen Unverschämtheiten auftischen, sind entweder zu faul oder zu dumm, um fehlerfreie Programme abzuliefern.
Die Fehlerkorrektur gehört wie der ausführliche Test zu den unabdingbaren Ausliefer-/Abnahmekriterien des Herstellers / Programmierers.
Wenn diese hanebüchene Falschaussagen, dass man Programmierfehler nicht vermeiden kann und Fehlerfreiheit irrelevant sei, zutreffend wären, dann gäbe es nämlich weltweit keine dutzenden von Testsoftware-Pakete zur Überprüfung aller Programme auf Fehlerfreiheit.

Fakten

Erfolgskriterien

Wie beeinflusse ich Suchmaschinen?

Indem man ihnen die ziemlich schwierige Aufgabe der Seitenindizierung - der Aufnahme des gesamten Textes (und auch sonstigen Medien wie Fotos und Videos) in den Suchindex - erleichtert.
Schon vor ca. 20 Jahren dozierte ich als Lehrbeauftragter an einer Universität die Grundregeln: Suchmaschinen arbeiten wie seh- oder lesebehinderte Menschen. Die Ergonomie respektive leichte Zugänglichkeit der Inhalte (meist Texte) ist das oberste Kriterium.
Setzen Sie einen Blinden an Ihren Internet-Auftritt, und Sie werden schnell die Schwachstellen erkennen. Er hat dieselben Probleme wie eine Suchmaschine.
Vergessen Sie alles, was Sie als sehende Nutzer am Bildschirm erkennen. Relevant ist nur das, was im Quelltext der Seite steht - was wie programmiert wurde. Denn das analysieren Blindensysteme wie Suchmaschinen.
Bereits, wenn Sie selbst die Augen schließen, werden Sie die Nutzlosigkeit vieler optischer Spielereien auf der Startseite für Suchmaschinen erkennen.
Selbstredend ist es schön, wenn sich dort bildschirmfüllende Fotos im ständigen Wechsel drehen, oder andere optische Kunststücke vollbringen. Aber weder der Blinde noch die Suchmaschine sehen dies. Sie bewerten es nicht positiv. Aber, wenn jene Details unergonomisch gestaltet sind, oder gar fehlerhaft programmiert wurden, dann stolpern beide darüber und hängen sich daran auf. Fazit: Jene Systeme gelangen überhaupt nicht bis zum lesenswerten Text.
Damit man mich richtig versteht: Ich habe nichts gegen diese optischen Spielereien für die sehenden Kunden. Aber sie müssen ergonomisch und fehlerfrei programmiert sein, sowie an der richtigen Stelle im Quelltest platziert werden. Das macht den Unterschied zwischen Erfolg und Misserfolg bei Suchmaschinen und Sehbehinderten aus.

Was macht man nun, wenn man gerade keinen internet-affinen Blinden als Testperson zur Verfügung hat?

Fehlerfreies Programmieren

Um Erfolg bei Suchmaschinen zu haben, erstellt und verwendet man nur fehlerfreie Dateien und Programmteile.

Für alle Programmiersprachen existieren kostenlose Lehrprogramme und unendlich viel Lehrmaterial im Internet:

w3schools - Englisch, aber sehr verständlich erklärt für HTML, CSS, JavaScript und PHP mit eigener interner Suchmaschine zum Suchen der Einzelbefehle.
selfhtml - Deutsches Online-Lehrbuch zu HTML, CSS, JavaScript mit eigener interner Suchmaschine zum Suchen der Einzelbefehle.
CSS - Deutsche Einleitung in CSS.
Cascading Style Sheets articles and tutorials - Englisch.
The Modern JavaScript Tutorial - Englisch.
LEARN JS - Englisch.
JavaScript Kurs – JavaScript lernen für Anfänger - Deutsch.
PHP.net Nicht nur ein Handbuch, sondern ein deutsches Lehrbuch, eine Erklärung mit eigener interner Suchmaschine für fast alle Fragen und Einzelbefehle rund um PHP.
PHP programmieren lernen für Anfänger mit vielen Übungen und Videos - Deutsch, kostenlos.
PHP lernen leicht gemacht mit MySQL - Deutsch, kostenlos.
PHP lernen: Eine kompakte Einführung in die Programmiersprache - Deutsch, kostenlos, ganz knapp gehalten.

Keine Ausrede: Auch ich schlage dort immer wieder einmal nach. Im Zweifel nachschlagen ist ein wertvoller Sicherheitsaspekt. Überhebliche Arroganz führt ganz schnell zu schweren Fehlern. Und diese führen zur Herabstufung des eigenen Internet-Auftrittes bei Suchmaschinen.

Beispiele

Aus vertragsrechtlichen Gründen sowie aufgrund des Urheberrechtes und Datenschutzes darf ich keine Internet-Auftritte meiner Kunden oder fremder Personen verwenden - weder im positiven noch im negativen Fall. Deshalb habe ich ein Beispiel meines privaten Internet-Auftrittes zur Fotografie gewählt.

Beispiel einer ziemlich reinen Seite zum kaufbaren Kameramodell Nikon Z5 - Ansichtsversion, so wie Browser das wiedergeben. Vorsicht: Sie verlassen diesen Auftritt.
Trotz fast 9 Mio. Treffern bei Google etc. zu dem Suchbegriff Nikon z5 rangierte diese Seite über ein überall beworbenes kaufbares Produkt als Treffer wochenlang auf der ersten Ergebnisseite, teilweise sogar dem ersten Platz. Heute erscheint sie noch immer auf der zweiten Trefferseite. Das sehe ich als Erfolg an, für eine private Informationsseite, die sich gegen bezahlte Werbung und die mächtigen Verlage (Fachmagazine), die Kamerahersteller sowie die großen Händler um diese Plätze streiten muss.
Hier der farblich markierte Quellcode der übersichtlichen Datei als Word-PDF. - Bitte diese Datei aufrufen. - Je nach Browser-Einstellungen lädt es diese Datei sofort auf Ihren PC in den voreingestellten Download-Ordner herunter, statt sie im Browser anzuzeigen. (Bei Firefox können Sie die Anzeige von PDFs in neuen Browsern wieder erzwingen).
Erläuterungen der Farben im PDF:
- Ganz oben in der ersten Zeile finden Sie in gelber Farbe markiert die Sprachangabe für Deutschland und deutsche Zeichen, wobei ich das alte System der Sprachkodierung verwende, da ich sowieso nur Leser in der westlichen demokratischen Welt (inklusive Japans) besitze, die der deutschen Sprache mächtig sind. - Zwar erkennen viele Suchmaschinen die Sprache automatisch. Aber manche Test-Werkzeuge bemängeln inzwischen das Fehlen dieser Sprach-Angabe als Fehler.
- Ab Zeile zwei folgen 3 Zeilen Inhalt mit wichtigsten Meta-Informationen für die Suchmaschinen: Title, Keywords, Description mit hellvioletter Farbe markiert. Dort muss das Wichtigste in Stichworten des Textes für die Suchmaschinen stehen.
  - Der Titel sollte in der Regel maximal 150 Zeichen enthalten. Wer mehr verwenden will, was durchaus bei bestimmten Titeln z.B. von Kunstwerken erforderlich werden kann, wird bei manchen Testwerkzeugen mit einer Warnung oder sogar einem Fehler bestraft. Dies liegt jedoch an den WAI-Regeln, welche eher kurze Titel bevorzugen. Aber Suchmaschinen stören sich eher an zu kurzen Titeln und bemängeln oft Titellängen unter 50 Zeichen. Man muss somit hier abwägen, worauf es einem ankommt. Nicht jede Warnung oder jeder Fehler eines Testwerkzeugs muss somit ein KO-Kriterium für Suchmaschinen sein. Ganz im Gegenteil kommt es auf die Details an.
  - Bei mir folgt dann immer die Liste der Stichworte Keywords, weil diese für die Suchmaschinen extrem wichtig sind. Da schreibe ich alle wichtigen Stichworte hinein. Es kann sinnvoll sein, diese Worte Groß und klein, mit und ohne Bindestrich zu schreiben. Das hängt je nach Suchmaschine etwas von deren Detaileinstellungen ab. Vermeiden sollte man jedoch plumpe Wiederholungen identischer Schreibweisen. Das bestrafen manche Suchmaschinen inzwischen. Die Zeichenlänge ist nicht begrenzt. Aber übertreiben Sie es nicht.
  - Als Drittes folgt die Description. Sie enthält einen beschreibenden Satz, den man als Normalmensch lesen und verstehen sollte. Er sollte interessant sein und das Wichtigste des Artikels zusammenfassen. Dieser Satz wird - zumindest der Anfang davon - in Suchtreffern zahlreicher Suchmaschinen angegeben. Die Zeichenlänge ist nicht begrenzt. Aber übertreiben Sie es auch hier nicht.
  - Sie werden erkennen, dass sich der Dateiname (Nikon Z5) in allen drei Kategorien findet - und zwar ganz links vorne.
  - Obwohl es dutzende weitere erlaubter Meta-Tags gibt, benötigen Sie diese nicht, da die meisten Suchmaschinen davon keinen Nutzen für die Platzierung des Seiteninhaltes ziehen. - Bitte lesen diesen Satz genau. Ich behaupte nicht, dass manche weiteren Meta-Tags verboten sind. Aber sie helfen in der Regel nicht, halten die Suchmaschine auf und kosten wertvollen Platz vor dem wichtigen Text / Inhalt.
- Danach folgen mehrere Zeilen Links zu den Layout-Definitionen in CSS - also Style-Sheets, die hier mit hellblauer Farbe markiert wurden. Diese hier abgebildete HTML-Textdatei enthält keine manuellen Layout- oder Textauszeichnungen, die überflüssig sind und nur stören würden. - Klartext: Alle Layout-Angelegenheiten gehören in ausgelagerte CSS-Dateien. - Immer!
- Bereits in Zeile 11 befindet sich die extrem wichtige Überschrift der Kategorie H1, welche den Dateinamen beinhaltet: Nikon Z5. Suchmaschinen bewerten es hoch, wenn der Dateiname und die H1-Überschrift übereinstimmen. Ferner sollten auch bei Links zu der Seite der sichtbare Link-Text exakt so lauten wie der Dateiname. Bindestriche werden von den meisten Suchmaschinen ignoriert respektive als oder wie Leerzeichen gewertet.
- Also nochmals in Klartext: Der Dateiname sollte als H1-Überschrift und oben in den Meta-Tags vorkommen. Oder anders herum: Die Kernaussage Ihres Textes ist der Dateinamen = H1-Überschrift und steht zudem weit vorne in den 3 wichtigen Meta-Tags.
- Wichtig an meiner Farbauflistung ist die frühe Platzierung der ersten Überschrift H1 weit oben: D.h. ab Programmierzeile 11 befindet sich der für die Suchmaschinen wichtige Textinhalt hier mit hellgrüner Farbe markiert.
- Der prozentuale Anteil des relevanten Textes an der Datei ist sogar für diese kurze Produktseite hoch: Er betrug zur Erstellung dieses Artikels 54%.
- Noch viel wichtiger ist jedoch, dass der relevante Text weit am Anfang der Datei zu finden ist.
- Erst nach dem Textinhalt folgt die - aufgrund mehrerer hundert wissenschaftlicher Artikel auf jenem Auftritt - sehr umfangreiche mehrfach ausklappbare Navigation, die hier mit hellgrauer Farbe markiert wurde.
- Aber die Navigation ist doch mit der Titelzeile auf der Seite im Browser ganz oben zu sehen. Im HTML-Programm-Code steht alles dennoch am Ende. Das bewirkt CSS. Style-Sheets erlauben die Platzierung jedes Elementes an jeder beliebigen Stelle - völlig unabhängig von der Anordnung im Quellcode. Und für Suchmaschinen (und Blinde) ist es sinnvoller, den ganzen Kladderadatsch unten anzuordnen. Beide wollen aus ergonomischen Gründen sofort lesen und nicht erst hunderte von Links der Navigation überblättern.
- Ganz unten folgen mit dunkel-violetter Farbe markiert die verlinkten zahlreichen JavaScript-Dateien. Das Layout ist modern, komplex und lässt sich nur mittels aufwändiger JavaScript-Programmierung optimal darstellen. Aber es macht bei mir nur ganz wenige Zeilen aus, die zudem am Ende der Seite stehen, wo sie weder Suchmaschinen noch Sehbehinderte stören.
Dass der durch diese ganz einfachen Maßnahmen zu erzielende Erfolg kein Einzelfall ist, beweist z.B. meine ebenfalls private Seite zum Thema Objektive reinigen, die bei Google seit Jahren auf der ersten Trefferseite rangiert, obwohl es über 1,1 Mio. Treffer dazu gibt. Dort liegt der prozentuale Anteil des relevanten Textes an der Datei sogar bei 84%.
Oder meine ebenfalls private Seite zum Thema Foto-Wirtschaft, die bei Google sogar mit zusammen und klein geschriebenem Suchwort fotowirtschaft seit 2015 auf der ersten Trefferseite rangiert, obwohl es fast 50.000 Treffer dazu gibt. Dort liegt der prozentuale Anteil des relevanten Textes an der Datei sogar bei über 94%.
Damit ist auch das Gerücht widerlegt, dass nur kurze Textseiten bei Suchmaschinen nach oben kommen, weil dort die überall gelobte Suchwortdichte höher wäre. Löschen Sie diesen millionenfach wiederholten veralteten und verallgemeinerten Unsinn einfach als wertlosen Ballast aus Ihrem Gedächtnis.
Nachtrag, weil ich gefragt wurde: Warum betone ich so sehr, dass der (für Sie und die Kunden relevante) Text weit oben sein sollte und evtl. notwendige weitere Dateiinhalte (wie die Navigation etc.) unten aufgelistet werden sollen? Das liegt daran, dass Suchmaschinen die Bedeutung von oben nach unten bewerten. Was wichtig ist, steht für Suchmaschinen oben, wie in einem klassischen Zeitungsartikel - also die umgekehrte Informationspyramide. Je weiter der Leser nach unten kommt, umso unwichtiger wird der Inhalt.

Als Gegenbeispiel verwende ich eine gefundene Seite eines weit verbreiteten Redaktionssystems, die ich textlich aus rechtlichen Gründen etwas abgeändert habe. Aber der Quellcode ist ansonsten identisch.

Hier der farblich markierte Quellcode der unübersichtlichen Datei. - Bitte auch diese Datei aufrufen.
Es öffnet sich ein weiterer Reiter in Ihrem Browser, sodass Sie im Vergleich sehr schnell erkennen, warum die Suchmaschinen mit dieser zweiten Seite Probleme haben.
Erläuterungen der Farben:
- Erschrecken Sie nicht: Die Datei besitzt 6.527 Programmzeilen mit weit über 575.000 Zeichen Quellcode. Der reine lesbare Text hingegen beträgt nur (großzügig aufgerundet 2.700 Zeichen. Das Verhältnis sinnvoller lesbarer Text zur Dateigröße liegt bei unter 0,5%.
- Ganz oben in den ersten Zeilen finden Sie in gelber Farbe markiert die Sprachangabe für Deutschland und deutsche Zeichen, wobei das Redaktionssystem / der Autor UTF-8 wählte. Diese Angaben ziehen sich unnötiger Weise über 6 Zeilen hin.
- Ab Zeile sieben folgen bis Zeile 43 völlig wertlose Zeilen Inhalt mit für die Suchmaschinen unwichtigen Meta-Informationen. Diese Angaben sind auch für Browser und Menschen völlig irrelevant. Browser und Betriebssysteme suchen diese Dinge von selbst, sofern sie das überhaupt benötigen. Sie sind in roter Farbe markiert.
- Title und Description - hier in hellblauer Farbe - werden im JavaScript mehrfach wiederholt, was Suchmaschinen als Betrugsversuch werten.
- Die wichtigen Keywords sind leer. Das ist oft anzutreffen. Nur wenige Anwender und Redaktionssysteme verwenden alle 3 wichtigen Kategorien.
- Die Navigation - hier mit hellgrauer Farbe markiert - mit den hellblau hervorgehobenen Unterseiten ist komplett in JavaScript verschlüsselt und kann somit weder von Suchmaschinen noch von Sehbehinderten noch von Normalnutzern im Quelltext ausgelesen werden.
- Immer wieder wird die Domain-Adresse des ganzen Auftrittes hervorgehoben (hier in hellblauer Farbe gekennzeichnet). Aber sowohl der Leser als auch die Suchmaschine sind ja bereits da. Warum sollten sie sich dutzende Male für die Domain-Adresse interessieren. Sie ist bereits registriert.
- Zusätzlich zu dem bereits hunderte Kilobyte umfassenden JavaScript-Code direkt in der Textdatei - hier in dunkel-violetter Farbe markiert - werden nochmals mehrere Mega-Byte an externen JavaScripts dazugeladen. D.h. der Programmierer weiß, dass man JavaScript auslagern kann, wendet das Wissen jedoch absichtlich nicht konsequent an. Das ist typisch für Templates in Redaktionssystemen.
- Obwohl der Programmierer externe CSS-Dateien hinzulädt, füllt er die Textdatei dennoch mit manuellen Format-Anweisungen auf. Die Datei enthält fast 293.000 Zeichen Formatierungscode als vor den Text geschriebene Styles - hier mit olivgrüner Farbe markiert. D.h. der Programmierer weiß, dass man das Layout in CSS auslagern kann, wendet das Wissen jedoch absichtlich nicht konsequent an. Das ist typisch für Templates in Redaktionssystemen.
- Hier kommt noch hinzu, dass für rein deutschen Text auf einer rein deutschen Internet-Seite mit rein deutschen Kunden als Zielgruppe, völlig überflüssige Formate für alle denkbaren Sprachen der Welt angegeben werden. Dazu kommt, dass dieser Quellcode dann auch noch zwangsweise dutzende unbenötigte Schriftfonts zu allen Sprachen gewaltsam herunterlädt, was die Gesamtladezeit dieser Seite selbst mit DSL dramatisch ansteigen lässt. Jedes Mobilgerät oder Smartphone gibt da auf.
- Der eigentliche Textbereich - hier mit hellgrüner Farbe markiert - beginnt erst in der Zeile 5.701 mit der Überschrift H1, welche jedoch in JavaScript und in viel zu vielen überflüssigen Style-Sheets verschachtelt ist. Glauben Sie im Ernst, dass es eine Suchmaschine bis hierher fehlerfrei geschafft hat?

Hierbei handelt es sich um ein ganz durchschnittliches Ergebnis eines Redaktionssystems.

Ganz im Gegenteil habe ich bereits viel schlimmere Einzelseiten im Internet analysieren müssen. Da gibt es Einzelseiten mit weit über 1 Megabyte Programmcode. Dazu kommen mehrere Dutzend Mega-Byte Bilddateien, weil man vergessen hat, diese Fotos internet-gerecht zu verkleinern. Und dann gab es auf jenen Seiten überhaupt kein Wort Text, weil der Besitzer allen Text als Grafiken gesetzt hatte. Da kann beim besten Willen keine Suchmaschine etwas indizieren.

Fehlerkorrektur

Der erste und mindeste Schritt nach der Dateierstellung ist die Prüfung und Fehlerkorrektur. Alle Fehler müssen gefunden und durch fehlerfreien Quelltext ersetze werden.

HTML

Mindestanforderung: Trennung von Layout und Inhalt

Im Idealfall befindet sich in einer HTML-Seite / einer HTML-Datei fast nur der Text, den Sie als Nutzer mit guten Augen auch auf dem Monitor in der Standard-Anzeige des Browsers lesen können.
Alles, was in irgendeiner Weise mit der Layout-Gestaltung (was, wo, wie platziert ist), oder Farben, Schriftgrößen, Formen etc. - also dem gesamten Aussehen - zu tun hat, muss weg.
Aber auch jeder andere Programmcode (z.B. JavaScript) stört und ist hier fehl am Platz.
D.h. vor den jeweiligen Inhalten (meist Texten) befinden sich nur noch ganz wenige Klassifizierungs-Zeichen (Strukturierungsmerkmale). Damit sind z.B. ein <p> für Paragraf = Absatz oder ein <li> für einen Listenpunkt gemeint.

Test-Werkzeuge für HTML

Ein HTML-Validator überprüft die Einhaltung der DTD - der Dokument-Typ-Definition - des Regelwerkes für die HTML-Sprache.

Vorab: URI heißt Uniform Resource Identifier und meint die exakte Internet-Adresse der Datei / Seite - also z.B. https://www.controlling21.de/firma/artikel/suchmaschinengerechte-programmierung.htm

W3C Markup Validation Service Online. - Man muss nur die URL der Seite eintippen (Reiter eins: Validate bei URI), oder die HTML-Datei hochladen (Reiter zwei: Validate by File Uplad), oder kann den Quelltext der Seite dort einfügen (Reiter drei: Validate by Direct Input). Mit zahlreichen zusätzlichen Optionen.
HTML Validator / Linter Online. - Man kann die Datei im Internet per URI angeben oder manuell von der eigenen Festplatte hochladen.
validator.nu Online. Man kann die eigene Quell-Datei per Internet-Adresse abrufen lassen, oder hochladen oder in ein Feld eingeben (Links oben mit dem ersten Fenster Address auswählen). Mit vielen Optionen für fortgeschrittene Anwender.
Nu Html Checker Online. Man kann die URI angeben, oder eine Datei hochladen oder den Quelltext in ein Fenster kopieren. Basiert auf obigem Validator.Nu. Das Werkzeug ist im Grunde identisch.
W3C Link Checker Online. Überprüft alle Links in der Datei. Dazu muss die Quelldatei jedoch bereits im Internet erreichbar sein - also auf den eigenen Server hochgeladen werden. Allerdings werden dabei auch viele False-Positives gemeldet. Also angebliche Fehler, die im Grunde keine sind, weil der angefragte Server derartige Tests ablehnt. Auch ich habe meinen Server so konfiguriert, weil dieses Schlupfloch oft von Hackern missbraucht wird.
W3C Internationalization Checker Online. URI oder File-Upload. Überprüft auf internationale Sonderzeichen. Dies kann z.B. sinnvoll sein, wenn sie mehrsprachigen Text auf einer einzigen Seite verwenden, die wiederum verschiedene Sonderzeichen benutzen. - Aber generell gilt, dass man Sonderzeichen in allen Sprachen unbedingt in HTML-Code konvertieren muss. Verlassen Sie sich nicht darauf, dass der Server-Administrator das schon irgendwie regelt. Exakt dieses blinde Verlassen auf andere führt zu den überall auffindbaren unlesbaren Sonderzeichen, die auch Suchmaschinen stören.
W3C Check and Visualize your RDF documents XML-Test-Werkzeug. Online. URI oder File-Upload.
Unicorn - Der Einheitsvalidator des W3C Online: allgemeines Werkzeug zum Testen von HTML, CSS und JavaScript. Man muss nur die URL der Seite eintippen (Reiter eins: Durch URI), oder die HTML-Datei hochladen (Reiter zwei: Durch Hochladen einer Datei), oder kann den Quelltext der Seite dort einfügen (Reiter drei: Durch Direkteingabe). Die Software kann jedoch nicht verlinkte CSS vom PC hochladen. Das funktioniert nur per URI online.
Aborla HTML/XML Validator online - URI oder Datei hochladen. Extrem scharf: Er bemängelt Dinge, die kein anderes Testwerkzeug und keine Suchmaschine bemängelt als knallharten Fehler.
Dr. Watson online - URI eintippen. Mit zahlreichen wertvollen Optionen wie Link-Checker und Bilder-Checker. Leider erlaubt er nur ganz kurze Seiten zu testen.
Online-toolz HTML Validator Online: HTML-Quelltext in Fenster hineinkopieren. Aber er stürzt oft mit Fehlern ab, weil er z.B. mit Links zu Amazon etc. nicht klarkommt.
JSON formatter HTML Validator Online. - Man kann die eigene Quell-Datei in das linke Fenster kopieren, oder hochladen oder per Internet-Adresse abrufen lassen. - Leider kommt er mit vielen deutschen (korrekt kodierten) Sonderzeichen nicht klar. Auch sonst bemängelt er z.B. erlaubte Zeilenumbrüche mit <br>. Sofern man die Datei hochlädt, zählt er oft die Zeilen falsch, sodass man Fehler im Original-Quelltext nicht leicht finden kann. Überdies meldet er fast jeden zur Übersichtlichkeit und Strukturierung eingebauten Zeilenumbruch im Quellcode als Fehler.
FREEFORMATTER.COM - Liste mit zahlreichen Validierungs-Werkzeugen.
Liste mit Testwerkzeugen
Html Validator von Marc Gueury als Firefox Add-on. - Also eine Browser-Erweiterung.
Html Validator von Marc Gueury als Chrome Add-on. - Also eine Browser-Erweiterung.
CSE HTML Validator Lite: FREE HTML Editor and HTML / HTML5 / XHTML / CSS Checker Downloadbare kostenlose Software. Sie bemängelt auch &-Zeichen in Links, die heute üblich sind. Zwar kann man jene Links meist in & konvertieren. Aber das funktioniert nicht mit allen fremden Servern. Deshalb sollte man es vorher ausprobieren. - Wie bereits geschrieben, ist nicht jeder von Testwerkzeugen monierte Fehler auch wirklich ein Fehler, der Suchmaschinen etc. stört.
wespiva (Web Spider Validator) kostenloser Download. Die Software testet allerdings nur die Links.
Free Link Checker kostenloser Download. Die Software testet allerdings nur die Links.
Xenu's Link Sleuth kostenloser Download - Testet nicht nur normale Links, sondern auch Bilder, Frames, Hintergründe, Image-Maps, Java-Applets, Plug-ins, Skripte und Style Sheets.
HTML Link Validator kostenloser Download.
CSS HTML Validator kostenpflichtige Version. Downloadbare Software.
Total Validator. Eine eingeschränkte kostenpflichtige Basis und eine noch teurere Profi-Version als downloadbare Datei zum Installieren. Früher habe ich die kostenlose Version immer empfohlen. Aber heute ist sie (als Testversion) völlig wertlos. Nur die teuerste Version für aktuell 45 Euro kann hilfreich sein für Firmen, welche ständig viele HTML-Seiten kontrollieren müssen. Aber die Lizenz gilt nur für 1 Jahr. Danach werden derzeit Abonnementgebühren von 9 Euro erforderlich.
Rocket Validator nur wochenweise mietbar.

Keine Ausrede: Es existieren dutzende Werkzeuge zur Fehler-Suche und Fehler-Korrektur.

Mit diesen Werkzeugen kann man im Übrigen meine Seiten hier auf diesem Aufritt nicht online kontrollieren, da ich dies aus Sicherheitsgründen (wie viele Server-Betreiber) zum Schutz gegen Hackerangriffe unterbunden habe.

Wie bewerten Suchmaschinen HTML?

Hier muss man einiges sauber voneinander unterscheiden:

Fehlerfreies HTML, das zudem schlank programmiert wurde, also wenig Überflüssiges enthält, wird am höchsten bewertet und am höchsten gerankt - also weit oben in der Trefferliste ausgegeben.
Ohne Fehler und programmiertechnisch übersichtlich (schlank) bewirken, dass die Suchmaschine es einfach hat, die HTML-Datei zu analysieren, und auch schnell mit der Indizierung der Texte / Inhalte fertig ist. Das ist wie bei Menschen: Leichte und schnelle Arbeit wird lieber und öfter durchgeführt.
Vor allem kann sich die Suchmaschine nur bei fehlerfreiem HTML vollkommen auf die ihrerseits fehlerfreie Indizierung aller Inhalte konzentrieren. Also nur bei fehlerfreiem HTML besteht eine Garantie, dass auch alle (Text- etc.) Inhalte korrekt in die Suchdatenbank aufgenommen werden.
Grundsätzlich stören alle zusätzlichen Angaben im HTML - seien es Formatierungen oder Programmcode in JavaScript. Denken Sie immer daran: HTML ist eine reine Strukturierungssprache. Keiner der Verantwortlichen wollte früher noch will es heute, dass man da handgestrickte Zusatzangaben für das Layout etc. hineinbastelt. Das widerspricht der Grund-Idee des HTML. Suchmaschinen benötigen somit wesentlich mehr Zeit zur korrekten Indizierung derartig verschandelter Dateien.
Hinzu kommt der Längenfaktor respektive die Dateigröße oder das prozentuale Verhältnis des Programmcodes zum reinen Textinhalt. Je mehr reiner Text mit nur einfachen Strukturelementen in der HTML-Datei vorhanden ist, desto höher wird der Text und die Dateiqualität bewertet.
Oder anders herum: Je mehr zusätzlicher Programmcode vorhanden ist, desto niedriger wird die Datei und deren Inhalt gewertet.
Ja, die Techniker - auch bei den Suchmaschinen - sind diskriminierend: Sie begünstigen andere, welche sich an deren weltweite technische (HTML-) Standards halten.
Fehlerfreiheit und Konformität zum weltweiten Standard bei HTML stehen an oberster Stelle. Wer hiergegen verstößt, wird von den Suchmaschinen bestraft.

Links

Für mich gehören Links zum HTML, da sie von Anfang an (bereits bei HTML 1) dabei waren.
Manche Analytiker sehen dies jedoch als separaten Testbereich (außerhalb von HTML) an. Deshalb existieren dafür auch separate Link-Testwerkzeuge (siehe oben).
Interne Links innerhalb des eigenen Internet-Auftrittes (meist in der Navigation) müssen fehlerfrei funktionieren. Fehler basieren fast immer auf Tippfehlern oder dem Verschieben mancher Dateien in andere Ordner.
Es dürfte somit verständlich sein, dass interne Link-Fehler als ein Zeichen für einen ungepflegten und veralteten Internet-Auftritt angesehen werden und zur Abwertung der Seite sowie ihrer Inhalte führen.
Bei externen Links ist dies hingegen schon schwieriger. Selbstredend finden sich dort auch haufenweise vermeidbare Tippfehler.
Aber - vor allem in der Wirtschaftskrise oder aufgrund der sich ständig ändernden Rechtsnormen - fallen ganze Internet-Auftritte oder zumindest die verlinkten Unterseiten weg.
Auch hier werden Fehler von Suchmaschinen als negativ gewertet und führen zur Abwertung der eigenen Seite mit den in die Irre führenden Links. Allerdings ist meine Erfahrung, dass dies von dem prozentualen Umfang abhängt. So wird eine große Link-Liste mit über hundert Links zu wertvollen externen Quellen nicht gleich durch einen einzigen ausgefallenen Link bei nächsten Suchanfragen eine Trefferseite heruntergereicht.
Dennoch gilt hier der arbeitsaufwändige Hinweis: Prüfen Sie regelmäßig (mindestens einmal im Jahr) die externen Links. Arbeitsaufwändig ist dies deshalb, weil leider immer seltener korrekte 404-Fehler zurückgemeldet werden. Die oben aufgeführten automatisch arbeitenden Test-Werkzeuge liefern folglich zu wenige Treffer. D.h. im Zweifel hilft nur eine manuelle Überprüfung aller extern verlinkten Seiten.
Das Ganze wird sogar noch aufwändiger, weil inzwischen nicht nur die Domains (Internet-Adresse), sondern ganze Internet-Auftritte verkauft werden und auch sonst gerne Ersatzseiten für alte Inhalte installiert werden. D.h. man muss nach dem Link auch den Inhalt der verlinkten Seite nochmals prüfen. Letzteres kann auch rechtlich erforderlich sein, falls sich plötzlich unter der Zieladresse etwas Illegales befinden sollte.

CSS

Layout

Die Trennung von Inhalten und Layout erfolgt durch eine separate Datei - die CSS.
CSS steht für Cascading Style Sheets - kaskadierende Format-Vorlagen.
Kaskadierend meint, dass sie abgestuft wirken. D.h. ein einmal definierter Absatz (Paragraf) behält diese Formatangaben (wie Schriftgröße und Anfangs- sowie Ende-Abstände) bei, auch wenn er in einem Detail (z.B. Farbe für z.B. <p class=rot>) verändert oder ergänzt wird.
Die völlig selbständige Datei oder mehrere Dateien #.css beinhalten das gesamte Layout.
So kann man eine CSS oder ein Layout für breite Monitore und eine für schmale Smartphones herstellen. Geladen wird immer nur die passende CSS für die jeweilige Anzeige des Endgerätes.
Dadurch, dass diese Dateien getrennt vom Inhalt (Text) sind, können Sie jederzeit in einer einzigen Datei das gesamte Layout aller Seiten ändern, die Navigation von links nach rechts, von oben nach unten etc. umstellen.

Test-Werkzeuge für CSS

W3C CSS Validation Service Online. - Man muss nur die URL der Seite eintippen (Reiter eins: per URI), oder die HTML-Datei hochladen (Reiter zwei: per File Uplad), oder kann den Quelltext der Seite dort einfügen (Reiter drei: per Direct Input). Mit zahlreichen zusätzlichen Optionen.
Free CSS Toolbox kostenloser Download. Vorsicht: Sie müssen die Datei direkt von Heise herunterladen V1.2. Der Hersteller-Link führt zu einem kostenpflichtigen neuen Programm. Allerdings ist die Software veraltet. Ferner zeigt sie manchmal Fehler, wo keine sind.

Keine Ausrede: Es existieren Werkzeuge zur Fehler-Suche und Fehler-Korrektur.

Unsinniges bei Formatierungen mit Stylesheets

Auch wenn es erlaubt ist, so sind viele Programmiercodes bei CSS nicht sinnvoll.

<div id=comp-k971n30einlineContent-gridWrapper data-mesh-internal=true><div id=comp-k9asdf71n30einlineContent-gridContainer data-mesh-internal=true><div data-packed=true data-vertical-text=false style=top:;bottom:;left:;right:;width:475px;height:auto;position:;pointer-events:none class=txtNew id=comp-k8u1ookk><h1 class=font_0><span class=color_15>Titel</span></h1></div>
Es reicht ein einfaches <h1>Text</h1>. Den gesamten Rest kann man einfacher, kürzer und Platzsparender in der CSS definieren. - Eine separate CSS-Datei ist sinnvoller, als CSS per Einzelanweisung in die HTML-Datei zu schreiben.
CSS wurde erfunden, weil man den Text leicht lesbar und frei von weiteren Formatangaben machen wollte. Das Ziel war niemals, ihn nun mit dutzenden Einzel-Format-Angaben aufzublasen.
Auch die folgende Verschachtelung ist völlig unsinnig:
<span style=font-size:17px;><span style=letter-spacing:0.05em;><span style=font-family:times new roman,times,serif;><p>Text</p></span></span></span>
Erstens kann man dies alles auf <p>Text</p> reduzieren und das P in der CSS entsprechend programmieren.
Zweitens lassen sich Spans - wie alle anderen CSS-Elemente - gruppieren: also z.B. <span class=a1 b2 c3 d4 e5>Text</span>. Es reicht eine Leerstelle zwischen den Angaben.
Bis heute lassen sich - vor allem bei Redaktionssystemen, aber auch manchen angeblich für Laien vereinfachten HTML-Werkzeugen - folgende Vervielfachungsfehler finden:
<strong></strong><strong>Text</strong><strong></strong>
Man kann dies alles auf <strong>Text</strong> reduzieren.
Der Fehler liegt bei der obigen roten Zeile darin, dass der Anwender zuerst den Text fett wollte, sich dann umentschied zu Normalschrift und dann den Text doch wieder fett markierte. Das Redaktionssystem löscht dann jedoch oft nicht korrekt das Überflüssige Weg, sondern neutralisiert es nur. Auch wenn derartige leere Verschachtelungen funktionieren, ist das so ein Fehler, den manche Testwerkzeuge auch monieren.

Wie bewerten Suchmaschinen CSS?

Hier muss man einiges sauber voneinander unterscheiden:

In separate CSS-Dateien ausgelagerte Formatvorlagen (Styles) werden meines Wissens von keiner Suchmaschine geprüft. Somit findet keine Höherbewertung für fehlerfreies CSS statt. Aber bei Fehlern im CSS haben Sie mit jedem Browser evtl. unterschiedliche Probleme in der Darstellung. Kurzum: Etwas Sorgfalt zahlt sich aus.
Ferner werden natürlich immer die Links zu den aus der HTML-Datei ausgelagerten CSS-Dateien auf Korrektheit überprüft. Erhält die Suchmaschine dabei eine 404-Fehlermeldung, weil die CSS-Datei fehlt oder an einem anderen Ort liegt, dann wird der Zählindex der Linkfehler erhöht, was zur Abwertung führt, weil die Seite als ungepflegt respektive veraltet gilt.
In der reinen HTML-Datei integrierte Blöcke von Styles (meist am Anfang der HTML-Datei zu finden) oder vor jedem Text-Element ausgewiesene Formatierungen wirken sich auf zwei Wegen negativ aus und können zu teils heftigen Abwertungen respektive Problemen führen:
- Suchmaschinen versuchen, Styles und auch Handformatierungen in einer HTML-Seite zu erkennen sowie dann zu überspringen. Das gelingt jedoch nur, sofern diese fehlerfrei sind. Kann eine Suchmaschine den Anfang eines Formatierungsanweisung nicht erkennen (eher selten), dann stolpert sie bereits hier. Kann sie hingegen das Ende einer Formatierung vor dem so formatierten Text nicht erkennen (relativ oft der Fall), dann kann dies dazu führen, dass sie diesen Text auch noch als Formatanweisung interpretiert. Dadurch wird er nicht in die Suchdatenbank aufgenommen. Das mag nur ein Wort betreffen, kann sich aber auch auf ganze Paragrafen beziehen. Das hängt im Einzelfall davon ab, wo die Suchmaschine das logische Ende einer Formatangabe vermutet.
- Hinzu kommt, dass Styles (und natürlich noch mehr die Handformatierungen) nicht in die reine Struktur der HTML-Datei hineingehören, die Dateigröße sinnlos erhöhen und somit den Anteil des verwertbaren reinen Inhaltes reduzieren. Das führt zur Abwertung.
- Vor allem bei Mobilgeräten wird überflüssige Dateigröße inzwischen von allen großen Suchmaschinen bestraft. Deshalb ist es sinnvoll, generell das Layout als CSS komplett auszulagern in eine nur einmal zu ladende CSS-Datei, statt es jedes Mal bei jeder Einzelseite erneut innerhalb der HTML-Seite zu übertragen. - Und nochmals: Indiziert wird nur die HTML-Datei. Je kleiner sie ist respektive je größer deren reiner Textanteil / Inhaltsanteil ist, desto höher wird sie gewertet.

JavaScript

Die komplette Programmiersprache, die eher für das moderne Layout verwendet wird

Bei JavaScript (JavaScript Englisch ausführlicher) handelt es ich um eine alte Programmiersprache, welche speziell als Zusatz für dynamische Inhalte für HTML entwickelt wurde. Sie wurde seit 2012 fester Bestandteil von HTML5. Sie darf nicht mit der anderen Programmiersprache Java verwechselt werden.
Bei JavaScript handelt es sich um eine client-seitige Programmiersprache. D.h. der Code wird im Browser beim Anwender ausgeführt.
Zwar handelt es sich sicherheitstechnisch um eine höchst gefährliche Angelegenheit, da man mit JavaScript als kompletter Programmiersprache im Grunde alles machen kann. Aber alle Verantwortlichen wollen dies so. Die meisten Hacker-Angriffe auf Normalnutzer im Internet werden heute mittels JavaScript durchgeführt.
Faktisch wird JavaScript heute jedoch überwiegend nur noch zu (allerdings hochkomplizierten) Layout-(Ver-)Änderungen verwendet. Man verändert damit das Aussehen der Seite entweder in Abhängigkeit von Endgeräten oder Nutzereingaben.
Auch von einem Internet-Betreiber (also Ihnen) selbst verwendetes JavaScript gehört immer in (mindestens) eine separate Datei und nie in die HTML-Textdatei. Von der HTML-Datei wird das ausgelagerte JavaScript nur aufgerufen.
Die sicherste Methode, einen Sehbehinderten oder eine Suchmaschine ins Straucheln zu bringen, ist, an den Seitenanfang oder zumindest vor den Text mehrere jeweils viele Kilobyte schwere JavaScript-Programm-Codes zu schreiben. Als vor den Text völlig unverständliche Programmanweisungen können sie nicht gelesen und oft auch nicht übersprungen werden.
Bevor Sie nun lachen, ich habe schon über 100 Kilo-Byte JavaScript-Code am Seitenanfang von Startseiten gefunden. Da sind dann diejenigen Seiten mit den bewegtesten Bildfolgen etc. Erst danach folgte die erste Zeile sinnvoller Text.

Test-Werkzeuge für JavaScript

Esprima Syntax Validator Online
Beautiful Tools Javascript Validator Online
Code Beautify JavaScript Validator Online
Pili App Javascript-Validator Online
jshint Online
Validate.js Online
ExtendsClass JavaScript validator Online
ValidateJavaScript Online
JSLint Online
Browserling Validate JavaScript Online
HTMLSTRIP Online JavaScript Validator Online
JavaScript Debugger kostenloser Download

Keine Ausrede: Es existieren viele Werkzeuge zur Fehler-Suche und Fehler-Korrektur.

Wie bewerten Suchmaschinen JavaScript?

Auch hier muss man einiges sauber voneinander unterscheiden:

Generell werden die Links zu den aus der HTML-Datei ausgelagerten JavaScript-Dateien auf Korrektheit überprüft. Erhält die Suchmaschine dabei eine 404-Fehlermeldung, weil die JS-Datei fehlt oder an einem anderen Ort liegt, dann wird der Zählindex der Linkfehler erhöht, was zur Abwertung führt, weil die Seite als ungepflegt beziehungsweise veraltet gilt.
In eigene Dateien auf dem eigenen Server ausgelagertes JavaScript wird inzwischen von zahlreichen Suchmaschinen auf Schadsoftware überprüft. Finden sich dort Programmzeilen, die auf Viren oder andere Schädlinge hinweisen, kann dies nicht nur zur Abwertung der einzelnen Seite und des gesamten Auftrittes führen, sondern auch zur kompletten Sperre.
Überprüfen Sie deshalb regelmäßig (aber mindestens einmal im Jahr) den eigenen Auftritt, ob die richtigen JavaScript-Dateien (und nur diese) sich in den entsprechenden Ordnern befinden. Eine der beliebtesten Hackermethoden ist es, eigene JS-Dateien bei Ihnen zu installieren und diese in Ihren HTML-Seiten zu verlinken.
Laden Sie die oft riesigen JavaScript-Dateien hingegen von externen Stellen, welche das perfekt programmieren, so führt die Suchmaschine meist nur einen einmaligen Test durch, wobei der dortige Betreiber geprüft wird. Wenn Sie also auf einen derartigen syndizierten Server mit JavaScript verlinken, wird dies bei Ihnen nicht mehr geprüft. Man denke hierbei nur an die großen JavaScript-Dateien von JQuery, welche über sogenannte CDNJS (Content Delivery / Distribution Network) verteilt werden.

PHP

Der Alleskönner unter den Programmiersprachen für das Internet

Bei PHP (PHP Englisch ausführlicher). Früher stand es für Personal Home Page. Es ist eine komplette, server-seitige Programmiersprache, die ursprünglich für die Erstellung von HTML-Seiten gedacht war. Mit ihr kann man alles vom interaktiven Kontaktformular bis hin zum Onlineshop oder sogar dem eigenen Redaktionssystem programmieren.
Bei PHP ist es zwingend erforderlich, den eigentlichen Programmcode auf absolute Fehlerfreiheit zu prüfen. Ansonsten kann man sich ein scheunentorgroßes Sicherheitsloch in den eigenen Auftritt einbauen.
Da der Programm-Code jedoch immer auf dem Server ausgeführt wird, sieht der normale Nutzer nur die Ergebnisse, die in der Regel als HTML ausgegeben werden. D.h. man muss zusätzlich auch diese Ausgaben (im Zweifel wirklich alle denkbaren Einzelfälle) auf fehlerfreies korrektes HTML überprüfen.
Ob nun PHP-Dateien wiederum separate HTML-Dateien aufrufen, in die sie die eigenen Ausgaben einblenden, oder diese ganzen Dateien im Programmcode enthalten, ist umstritten. Persönlich neige ich bei größeren Dateien immer zum Auslagern und einbinden mit dem Befehl require. Aber einzelne kurze Zeilen mit Meldungen kann man auch in die reine PHP-Datei einbauen. Dennoch sollte auch dies immer ganzheitlich und generell festgelegt sowie protokolliert werden. Vor allem schlampig gewachsene Strukturen können mit der Zeit sehr fehleranfällig werden.

Test-Werkzeuge für PHP

PHP syntax checker von ExtendsClass - kostenlos, Englisch, Online.
PHP-Code Syntaxprüfung kostenlos, Deutsch, Online.
PHP Code Checker kostenlos, Englisch, Online.
PHPTester kostenlos, Englisch, Online.
PHP Sandbox kostenlos, Englisch, Online.
PHP Code Syntax Checker kostenlos, Deutsch, Online.
Phan kostenlos, Download.
PHP_CodeSniffer kostenlos, Download.
Selbstredend ist bei allen kostenpflichtigen PHP-Programmiertools, wie Zend / Laminas Project ein Code-Checker integriert.
Aber sogar der kostenlose PHP-Editor bietet einen eingebauten Code-Checker an. - Allerdings ist das Programm aus dem Jahre 2005 trotz der Angabe Deutsch in Teilen Spanisch.
Die vielgelobten, kostenlos herunterladbaren Atom, Brackets und Scriptly sind hingegen eher für sehr fortgeschrittene Anwender.
PHP Code Analyzers for Error Reporting - Englisch, 5 Testprogramme vorgestellt.

Keine Ausrede: Es existieren Werkzeuge zur Fehler-Suche und Fehler-Korrektur.

Allerdings wäre ich vorsichtig mit der Übermittlung von Passwörtern (für z.B. MySQL-Datenbanken) in PHP-Quellcodes durch einfache Online-Formulare. Für die Sicherheit der obigen Online-Services leiste ich keine Garantie.

Wie bewerten Suchmaschinen PHP?

Auch hier muss man einiges sauber voneinander unterscheiden:

Per Definition kann ausgeführtes PHP nicht von außen überprüft werden. D.h. der Quellcode ist nicht einsehbar - auch nicht für Suchmaschinen.
Aber die Ausgaben von PHP, welche meist HTML sind, werden von den Suchmaschinen untersucht und bewertet. Extreme Abwertungen bei der Suchmaschinenbewertung können angezeigte Fehlermeldungen des PHP-Codes produzieren.
Wer somit seine Inhalte als / in einer PHP-Datei publiziert (seitenname.php), muss diese Ausgabe wiederum in einem HTML-Testwerkzeug auf Fehlerfreiheit bezüglich der HTML-Regeln prüfen.

Fehler und Warnungen

Um es nochmals festzuhalten: Alle eindeutigen Fehler sind vollumfänglich zu beheben.
Das ist mühsam und kann sehr lange dauern. Aber einmal gemacht, ist es dann auch erledigt. Und es lohnt sich. - Gleichgültig ob handprogrammiert oder als Template im Redaktionssystem ist dies dann die saubere Vorlage für alle weiteren Inhalts-Seiten.
Etwas anderes liegt bei Warnungen und Hinweisen vor: Hier muss man situationsbedingt den Einzelfall genau prüfen.
So finden sich in manchen Testwerkzeugen sehr scharfe Einstellungen, die man nicht erfüllen kann - und für eine gute Platzierung bei Suchmaschinen auch nicht erfüllen muss. So besitze ich einen Internet-Auftritt, bei dem immer als Warnung moniert wird, dass man meine Navigation, welche optisch mittels eines CSS-Tricks am Anfang der Seite sichtbar ist, faktisch jedoch programmiertechnisch am Ende des Quelltextes liegt, nicht überspringen kann. Das ist logisch. Da sie am Ende platziert ist, kann man nicht dahinter springen. Sinn der Warnung ist es, dass Sehbehinderte eine Navigation am Anfang vor dem eigentlichen Text überspringen können, um schnell zum Kerntext zu gelangen. Aber dieser Text steht bei mit bereits am Anfang des Quelltextes. Also ist hier kein Sprung erforderlich. Aber das Testprogramm ist dafür zu dumm. Daraus folgt, dass man manche Warnungen übergehen / ignorieren darf. Aber man muss sie prüfen. - Testwerkzeuge ersetzen nicht das eigene Denken.
Da die Ergonomie im Internet (WAI Web Accessability Initiative) laufend weiterentwickelt wird, ist meine Erfahrung, das momentane Warnungen bald als Fehler gewertet werden. D.h. es lohnt sich bereits heute, möglichst viele Warnungen zu beheben. Für viele Dinge existieren auch Lösungen.
Inwiefern Warnungen die Suchmaschinen stören, bleibt unklar. Manche Fehler werden definitiv auffallen, andere momentan noch nicht. D.h. manche Warnungen können zu einer schlechteren Platzierung führen, andere stören momentan noch nicht.
Vorsicht gilt auch bei manchen internationalen / englischen Werkzeugen, welche generell die z.B. deutsche Sprache als Fehler ansehen. Einige erwarten zwangsweise UTF-8 als Codierung, obwohl sowohl Browser als auch Suchmaschinen problemlos mit der Standardeinstellung iso-8859-1 klarkommen. Selbstredend dürfen Sie alle Inhalte auf UTF-8 umstellen. Aber die andere Sprachangabe ist auch zulässig und hat gemäß meinen Tests keine nachteiligen Einflüsse auf alle mir bekannten und relevanten westlichen Suchmaschinen. Etwas anderes betrifft selbstredend die Publikation in nichteuropäischen Sprachen. Derartige Internetseiten benötigen UTF-8, damit sie weltweit korrekt verzeichnet werden.

Redaktionssystem oder Handprogrammierung

Redaktionssysteme

Redaktionssysteme zeigen Vorteile:

Wer täglich mehr als 5 Seiten von mindestens 5 verschiedenen Autoren erstellen oder bearbeiten lassen muss, der wird die Vorteile standardisierter Abläufe und strikt reglementierter Prozesse bald effizient nutzen können.
Das Layout der Seite lässt sich von Anwendern (auch aus Versehen) nicht ändern. Das können nur Administratoren mit speziellen Rechten. D.h. die Corporate Identity bleibt nach außen gewahrt.
Nach einer Schulung kann jeder Autor oder Redakteur ohne HTML-Kenntnisse Seiten verändern, erstellen, löschen.
Zudem erlauben zahlreiche Redaktionssystem die Zeitschaltung. D.h. man schreibt heute einen Artikel, weil man jetzt Zeit hat, aber setzt das Freischaltdatum auf einen bestimmten Tag und Uhrzeit in der Zukunft, weil der Artikel z.B. nicht vorher publiziert werden darf. Dies erfolgt dann auch an Feiertagen, am Wochenende und in der Nacht korrekt, sofern man die Zeitschalteinrichtung sauber konfiguriert hat.

Redaktionssysteme weisen allerdings auch Nachteile auf:

Redaktionssysteme bestehen aus Software, sind damit fehleranfällig und das Hauptziel von Hackerangriffen. Verschlimmert wird das Problem durch die vielen Zusatzkomponenten zu jedem Redaktionssystem, die oft von anderen Herstellern / Programmierern stammen. Um die Gefahr zu minimieren, muss man laufend Updates der Fehlerkorrekturen dieser Programmierer einspielen. Vergisst man dies, wird man von den routinemäßigen Hackerprogrammen ganz schnell gehackt.
Wer wenig Autoren besitzt oder wenig täglich ändert, spürt nur die Nachteile der Redaktionssysteme:
- Erhebliche Einlernzeit in die spezielle Anwendung (es ist schließlich eine komplizierte Software).
- Hohe Kosten, weil man die Sicherheits-Updates von Dritten einspielen lassen muss.
- Hohe Kosten, weil man wirklich jede Änderung am Aussehen des Layouts oder auch nur neuer Teil-Layouts für neue Seiten meist extern beauftragen muss.
Selbstredend kann man mit erheblicher IT-Erfahrung so ein Redaktions-System auch selbst betreuen. Aber dann fallen statt den finanziellen Kosten eben die regelmäßigen Zeitaufwände an.
Hinzu kommt der Umstand, dass nicht alle Account-Provider (Anbieter von Speicherplatz für Ihren Auftritt im Internet) Ihnen kostenlos alle Redaktionssysteme zur Verfügung stellen, jene betreuen, oder auch nur deren Betrieb erlauben. Fragen Sie deshalb vorher genau nach. Meist erlauben nur die teureren Provider so etwas, oder gegen ein monatliches Aufgeld.
Aber da gibt es doch auch die kostenlosen Angebote. Korrekt, aber die sind auch nicht umsonst. Sie bezahlen dafür entweder mit eingeblendeter Werbung und / oder dem Verkauf Ihrer eigenen Daten.
Falls so ein Anbieter des Redaktionssystemes oder des Gesamtservices plötzlich Geld oder mehr Geld verlangt, dann sind Sie erpressbar. Im schlimmsten Fall wird der Service eingestellt. Dann ist Ihr Auftritt dort / mit diesem System unsicher oder wird sofort respektive bald komplett gelöscht.
Das aus Sicht der Suchmaschinen jedoch nachteiligste Argument ist der Umstand der unsauber programmierten Layout-Templates, welche für jede Inhaltsseite verwendet werden. Ich habe als Analytiker und Gutachter fast wöchentlich damit zu tun und muss leider festhalten, dass es keine Standard-Templates gibt, welche fehlerfreien HTML-, CSS-, JavaScript- und PHP-Code liefern. Kurzum: Die meisten dieser Vorlagen produzieren auf jeder Inhaltsseite unzählige Fehler, welche die Suchmaschinen behindern.
Bevor nun wieder die Kritik einsetzt: Ich behaupte nicht, dass man diese Templates nicht fehlerfrei gestalten kann. Das ist (nach der Fehleranalyse) oft meine Aufgabe. Aber in der Realität dauert es meist nur wenige Wochen, dann hat wieder ein Administrator neue Fehler eingebaut.
Ferner sind diese Templates eben Standardvorgaben, welche oft sinnlos Platz mit Einträgen im Head-Bereich verschwenden und geradezu vorsintflutlich programmiert sind, wobei jede Neuerung seit HTML5 nicht nur ignoriert, sondern sogar konterkariert wird. Dies bläst selbst im fehlerfreien Fall jede Seite unnötig auf und reduziert den für Text-Suchmaschinen einzig relevanten Textanteil prozentual weiter.

Handprogrammiertes HTML

Von Ihnen selbst von Hand programmiertes HTML zeigt Vorteile:

Kostenlos und völlig unabhängig von jedem Anbieter.
Flexibel: Sie können jede Seite anders gestalten. Nichts hindert Sie daran.
Absolut sicher, da HTML nicht gehackt werden kann.

Selbst von Hand programmiertes HTML weist allerdings auch Nachteile auf:

Disziplin ist erforderlich, dass ein Layout auch durchgehalten wird.
Manuell können immer und vor allem unterschiedliche Programmierfehler (meist durch Tippfehler) entstehen, die man in jeder Einzeldatei erneut prüfen und korrigieren muss.
Statt in die Bedienung eines Redaktionssystem muss man sich in die (allerdings einfache Programmiersprache) HTML einlernen.

HTML-Editoren

phase 5, kostenlos für Privatanwender und Schulen, Download. Die Weiterentwicklung wurde angeblich 2018 eingestellt.
Viusual Studio Code, kostenlos, Download. Das derzeit am schnellsten (monatlich) weiterentwickelte Werkzeug für drei Betriebssysteme. Aber nur für HTML-Dateien halte ich es für ziemlich kompliziert.
Sublime Text 3, darf derzeit noch unbegrenzt getestet werden, ist aber nicht kostenfrei.
Android Studio, kostenlos, mit Darstellung auf Mobilgeräten.
Google Web Designer, kostenlos, Download.
Bluefish, kostenlos, Download.
Notepad++, kostenlos, Download.
PSPad, kostenlos, Download.
Editra, kostenlos, Download.
Komodo Edit, kostenlos, Download. Für fortgeschrittene Anwender.
Atom, kostenlos, Download, für fortgeschrittene Anwender.
Brackets, eigentlich kostenlos, aber nur mit der kostenpflichtigen Adobe Cloud sowie deren Programmen sinnvoll nutzbar. Download, für fortgeschrittene Anwender.
Scriptly, kostenlos, Download, für fortgeschrittene Anwender.
Codelobster, kostenlos, Download. Für fortgeschrittene Anwender.
KompoZer, kostenlos, Download.
WYSIWYG-Editor: CoffeeCup Free - CoffeeCup Site Designer, abgespeckte Version, kostenlos (nach einer Registrierung mit einer E-Mail-Adresse), nur Englisch, Download. Vorsicht: Die Vollversion kostet viel Geld. Ferner gefällt mir die gesamte Aufpreispolitik dieses überall gelobten Herstellers für jedes überall sonst kostenlose Detail nicht. Lassen Sie sich da nicht von der Sammelwut überwältigen. Die angeblich erforderliche Gesamtliste der Programme zur Web-Seiten-Erstellung kostet völlig abstruse hunderte von Euros. Ferner halte ich es für zu kompliziert, um einmal schnell eine bereits existierende HTML-Seite zu verändern, da es komplizierte proprietäre Projekte wünscht, um die Kunden an sich zu binden. Es ist sogar Dreamweaver unterlegen - und das bei höherem Preis.
Bei zahlreichen Editoren muss allerdings festgehalten werden, dass sie mit deutschen Umlauten und Sonderzeichen nicht klar kommen, nicht abstellbare ungewünschte Umformatierungen beim Speichern durchführen und auch sonst so ihre Eigenheiten haben, an die man sich erst gewöhnen muss.
Ganz ehrlich reicht für HTML, CSS und JavaScript sowie PHP auch jeder einfache Texteditor. Es muss nicht der kostenpflichtige UltraEdit sein
Die 13 besten HTML Editoren für Webentwickler 2020, Deutsch.
Da ich schon lange HTML programmiere, besitze ich auch noch eine alte, gekaufte Version von Macromedia Homesite. Das Programm konnte bereits im Jahr 2000 mehr als Dreamweaver heute. Aber Adobe hat die Firma aufgekauft, nur um deren Kunden zu erhalten, zahlreiche Programmierer zu entlassen und deren Software schließlich für eigene schlechtere Produkte aufzugeben.
Selbstredend finden sich auch zahlreiche WYSIWYG-Editoren für HTML bis hin zu Dreamweaver, bei denen man angeblich keine Programmierkenntnisse für HTML besitzen muss. Aber für sie gelten oft dieselben Nachteile wie für Redaktionssysteme: Nicht selten werden ziemlich viele Fehler im Quelltext produziert.

Fazit

Im Grunde genommen ist es ganz einfach, bei Suchmaschinen auch ohne Geld und Tricks oder geheimes Insider-Wissen nach oben zu kommen.

Halten Sie sich an die Regeln. D.h. programmieren Sie fehlerfrei, übersichtlich und einfach sowie schlank.
Machen Sie es (sehbehinderten) Menschen - Ihren Lesern und potentiellen Kunden - einfach. Dann haben es auch Suchmaschinen einfach, Ihre Inhalte zu finden, zu indizieren und hoch zu bewerten.
Wer sowohl den Lesern als auch den Suchmaschinen den Zugang zu den (Text-) Inhalten erschwert, wird von beiden bestraft.
Und prüfen Sie bitte regelmäßig auch die Rechtschreibung der eigenen Texte.

Oder anders herum:

Bevor Sie nicht fehlerfreies sowie schlankes HTML mit zusätzlich möglichst fehlerfreiem Text bieten, lohnt es sich nicht, Geld für Suchmaschinenoptimierung oder SEO-Spezialisten auszugeben.

Hilfe / Feedback

Liebe Leserinnen und Leser,

damit diese umfangreichen, kostenlosen, wissenschaftlich fundierten Informationen schnell weiter ausgebaut werden können, bin ich für jeden Hinweis von Ihnen dankbar.

Deshalb freue ich mich über jede schriftliche Rückmeldung Ihrerseits per E-Mail oder Kontakt-Formular.

Da ich bewusst von niemandem irgendwelche Zuwendungen jeglicher Art für das Verfassen der absolut unabhängigen Artikel annehme, um meine völlige Neutralität zumindest auf dem hier beschriebenen Feld wahren zu können, verdiene ich mit diesen Artikeln kein Geld. Auch von Zeitschriften oder Magazinen aus dem IT-Bereich erhalte ich keinerlei Zuwendungen.

Deshalb freue ich mich, wenn Sie mein unabhängiges Engagement für Sie durch einen gelegentlichen Kauf bei Amazon über die hier angegebenen Links unterstützen. Es ist gleichgültig, welches Produkt Sie über diesen Link kaufen. - Es kann auch jede andere Ware außerhalb des Fotobereiches sein. Alle Preise sind und bleiben für Sie gleich niedrig, wie wenn Sie direkt zu Amazon gehen. Aber durch Ihren Klick auf meinen Link erhalte ich evtl. Monate später eine sehr kleine prozentuale Prämie (Cents je Kauf), welche mir hilft, die hohen Kosten bei der Erstellung der Artikel zumindest teilweise zu decken. - Bitte starten Sie Ihre Einkäufe bei mir.

Herzlichen Dank an alle für Ihre bisherige Unterstützung.

Ja, ich möchte die Unabhängigkeit dieser Seite unterstützen und kaufe über diesen Link bei Amazon

Pflichtangabe: Als Amazon-Partner verdiene ich an qualifizierten Verkäufen.

Zum Seitenanfang