RSS | Impressum | Sitemap |
Profi-Ranking Suchmaschinenoptimierung

SEO Marketing Blog

.... googeln bis der Arzt kommt

Mit Typo3 suchmaschinenfreundlichen, optimierten Quelltext erzeugen und dabei auf Accessibility achten – benötigt wird Typo3 und das Plugin sourceopt sowie ein wenig Verständnis im Bezug auf HTML und CSS

SEO-Quellcodeoptimierung mit TYPO3

Ich möchte in meinem Einstandsartikel auf die Optimierung des von TYPO3 erzeugten Quellcodes eingehen – dies betrifft die zwei Untergebiete Quellcode-Minimierung und Optimierung der Seiten-Struktur.

Vorgestellt hat mich Frank ja schon grob, wesentlich weiter möchte ich das hier auch vorerst nicht treiben, es ist mir lieber Ihr bildet euch selbst eine Meinung anhand meiner Artikel zum Thema TYPO3, TYPO3-Extensions, Templates und T3-Anfänger-Tips.

Eines jedoch vorneweg: Ich bin kein SEO, ich beschäftige mich aber zwangsläufig mit dem Thema und versuche hier auch ein paar SEO-Tips im Bezug auf TYPO3 und Templates (also dem zugrunde liegenden Markup) zu geben – mein eigener Bezug dazu ist aber mehr die Umsetzung als die Theorie, wieso was wie gemacht werden sollte. Ich gehe darauf soweit ein, wie ich es kann und bitte hier schon mal um Verständnis, wenn dieser Teil von mir nur angeschnitten oder je nach Thema größtenteils vernachlässigt wird.

So genug Vorgeplänkel, zurück zum Thema:

Seiten-Struktur:
Die Struktur des Markups spielt nicht nur semantisch und für Screenreader eine Rolle sondern auch für Suchmaschinen – aus diesem Grund sollte man darauf achten, in welcher Reihenfolge die auf der Seite dargestellten Informationen im HTML-Dokument stehen sollten. Für moderne Browser ist sie hingegen eher irrelevant da über CSS die Anzeige völlig anders sein kann, als es das Markup vorgibt.

Da Suchmaschinen sich für die Inhalte interessieren und die Anfänge des Dokumentes wohl als wichtiger werten, als das Ende des Dokuments, ist es durchaus sinnvoll die Navigationselemente erst weiter unten im HTML-Gerüst unterzubringen.

In den meisten Fällen ist es aber grundsätzlich so, dass die Navigation links oder oben dargestellt werden soll und daher logisch betrachtet an den Anfang der HTML-Seite gehört. Das ist aber bei Einsatz von CSS und DIV-Containern anstelle von Tabellen nicht notwendig.

Um Screenreadern und anderen nicht oder nur beschränkt CSS fähigen Ausgabemedien und ihren Nutzern entgegen zu kommen macht es dann Sinn ein Accessibility-Menü zu verwenden, mit dem der Nutzer zum Inhalt oder zum Menü springen kann ohne Scrollen zu müssen.

Der Quellcode einer nach diesem Modell aufgebauten Seite könnte ungefähr so aussehen:

<body>
<div id="accessibility">
<ul>
<li><a href="#menu" title="Zum Menue">Menü</a></li>
<li><a href="#content" title="Zum Inhalt">Inhalt</a></li>
</ul>
</div>
<a name="content"> </a>
<div id="content">Der Inhalt</div>
<a name="menu"> </a>
<div id="menu">Das Menü</div>
</body>

Dann werden mittels CSS das Menü und der Content nach da verschoben, wo man ihn in modernen Browsern sehen möchte, während accessibility dann mit display:none oder visibility:hidden aus dem DOM (Document Object Modell) wieder rausgenommen wird, sofern der Browser ausreichend CSS kann. Dabei muss man natürlich auf das Ausgabemedium achten und ggf. ein zweites angepasstes Stylesheet für Screenreader etc. bereitstellen – denn auch Screenreader lesen CSS Dateien und könnten das Menü dann einfach „verschlucken“.

Das Ergebnis ist, dass Suchmaschinen den Inhalt besser indizieren und den Inhalt als wichtiger erachten.

Quellcode Minimierung
Mit Sicherheit bringt es Vorteile, wenn die Menge an Inhalten im Vergleich zum Markup groß ist. Ob es dabei einen großen Nutzen bringt, sämtliche Zeilenumbrüche aus dem Dokument zu entfernen – ich weiß es nicht, es nutzt aber auch nichts, wenn sie vorhanden sind. Kommentare haben meiner Meinung nach in Programmcode durchaus ihre Berechtigung, in der Ausgabe eines Programms haben sie diese Berechtigung aber meiner Meinung nach nicht.

Wer Markup mit der Hand schreibt und Kommentare benötigt (an manchen Stellen macht das ja durchaus Sinn) muss diese Kommentare ja auch nicht unbedingt jedem Besucher seiner Webseite zeigen – deshalb werden Kommentare ja normalerweise auch nicht angezeigt.

Wer mit einem CMS arbeitet – insbesondere mit TYPO3 – muss nicht bei jeder Seite Hand anlegen, wenn er ein Plugin zur Aufbereitung des Quellcodes verwendet. In vielen (aber nicht allen) Fällen kann man über ein derartiges Optimieren alle Kommentare und unnötigen Zusatzinformationen einfach entfernen, bevor die Seite an den Benutzer oder den Crawler ausgeliefert wird. Je nach Optimierungs- bzw. Komprimierungsstärke hat man zusätzlich einen geringeren Datentransfer bei gleichem Besucheraufkommen, das spielt natürlich erst bei wirklich vielen Websitebesuchern eine Rolle.

Um dies in TYPO3 umzusetzen verwende ich das Plugin »sourceopt«, welches über sehr viele Einstellungen verfügt, man sollte es aber nicht übertreiben. Es kann passieren, dass bestimmte Erweiterungen nicht richtig funktionieren, wenn man bestimmte Optionen nutzt.
Hier empfiehlt es sich (das tut es eigentlich sowieso) während der Entwicklungszeit das Optimierungstool aus zu lassen und danach dann zu prüfen welche Optionen genutzt werden können und bei welchen es Probleme mit anderen Erweiterungen gibt. Um keine Komponente beim letzten Check zu übersehen und dann im Echtbetrieb Probleme zu bekommen, mache ich das meisten so, dass ich während ich etwas umbaue das Plugin ausschalte und wenn eine Erweiterung läuft wieder aktiviere und diese Erweiterung dann teste.

Dieses Plugin kann sehr angenehm über den Constant Editor bearbeitet werden. Meine Einstellungen:

Remove <LINK REL=”schema.dc” HREF=”http://purl.org/metadata/dublin_core_elements”>
Default: An
Remove alt-attributes of images if they are empty
Default: An – ist zwar nicht unbedingt das richtige, da ein leeres Alt-Attribut eine gewisse Bedeutung hat, ich kann aber gut und gerne darauf verzichten.
Remove all attributes from the body-tag linke bgcolor=”#FFFFFF”.
Aus – macht für mich keinen Sinn, da mein Bodytag sowieso leer ist. Wenn er das aus irgendeinem Grund nicht währe, hätte das seinen Grund.
Enable XHTML/HTML Beautifier (Beta)
Default: Off
Schon allein wegen des Beta Status (die Extension selbst ist schon Beta, ein Beta-Beta möchte ich mir nicht antun!
Remove generator
Default: On
Der Generator Meta Tag ist schlichtweg als Nutzlos einzustufen. Eventuell hilft er Script-Kiddies, die herausfinden möchten, ob die Sicherheitslücken für die sie Tools haben auf dieser Seite vorhanden sind – aber das ist ja kaum im Interesse des Sitebetreibers.
Entferne leere Zeilen
Klar – was bringen mir leere Zeilen, schmeiß die weg. Und wo? Naja erstmal überall, das dürfte keine Probleme machen, daher kann man das problemlos auch im Head tun.
Entferne HTML-Kommentare
Auch wenn der TYPO3 Kommentar in gewisser Weise fair währe, ist er für den Seitenbetreiber nutzlos und kann mit rausgeschmissen werden – wer ihn drin lassen möchte kann sich auch darauf beschränken nur Kommentare im Body zu löschen. Dazu muss man aber sagen, dass diese Einstellung bei JS und eingebundenem PHP-Code auch zu Problemen führen kann. Also nur dann auf On, wenn man sich sicher ist, dass es keine Probleme gibt.
Remove blur-script
Default: On
Macht gerne mal Probleme mit JS und das Vorhandensein stört auch nicht wirklich – wenn es Probleme gibt kann man das also auch ohne Probleme ausschalten.
Leerzeichen entfernen
Diese Einstellung entfernt alle Leerräume vor und hinter den Zeilen. Probleme können entstehen, ich hatte bisher keine, deshalb On – Überall
Entferne neue Zeilen
Habe ich auf On – Überall, laut Beschreibung wurde das unter Linux nicht getestet – ich hatte bisher keine Probleme mit dieser Einstellung. Allerdings wurden nicht alle New-Lines, ich hatte danach immer noch 3 Zeilen – aber eben nicht mehr so und so viele.
Alternate the language in the html
ist bei mir auf On – und “de” Vorraussetzung ist hierbei im Template Setup folgende Zeile:
page.config.doctype = xhtml_trans
Replace DocType
Steht bei mir auf On und <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
Replace clear.gif
ist bei mir auf Off – der Sinn hinter einer Verwendung erschließt sich mir nicht, man könnte es durch ein Keyword ersetzen, das würde ich aber als Spam bezeichnen, weshalb ich es nicht mache.

Das waren die Einstellungen im großen und ganzen – danach noch den FrontEnd Cache leeren und voila, der SEOptimierte Quellcode wird ausgeliefert, nun muss man nur noch testen, ob auch wirklich alles noch funktioniert. Grundsätzlich sollte es nur unter folgenden Umständen zu Problemen kommen:

  • Javascript wird verwendet
  • Ein anderes Plugin verwendet Platzhalter in Form von Kommentaren
  • Der Bodytag enthällt Formatierungen und diese wurden entfernt

Andere Probleme sind mir aktuell nicht bekannt, währen aber denkbar.

Damit lasse ich meinen Erstpost mal auf euch los und freue mich auf eure Anmerkungen, Fragen und Erweiterungsvorschläge, TYPO3-Themenwünsche sowie alle sonstigen Kommentare und wünsche Euch ein schönes, entspanntes Wochenende.


Andere Beiträge mit ähnlichen Inhalten, die Dich evtl. auch interessieren könnten:


Der Artikel " SEO-Quellcodeoptimierung mit TYPO3 " enthält 1232 Wörter.

Artikel mit verwandten Tags (Keywords, Suchbegriffe)
Tags: , , , , , , ,


Am 06.07.07, 13:13 in Typo3
von Xel veröffentlicht. RSS Feed für Kommentare.
Du kannst hier kommentieren oder hier per Trackback
von Deinem Blog aus "verewigen".
· Gelesen: 24126 · heute: 3


29 Kommentare zu "SEO-Quellcodeoptimierung mit TYPO3"

  • Na, da bin ich ja auf weitere Artikel von Dir gespannt – Xel…

  • Abo vergessen…

  • Schön, freut mich! Ich werd hier sicherlich auch reinschauen und meinen Senf dazugeben :-)

  • 4. Xel

    freut mich, Thomas – ich hab jetzt jedenfalls einen neuen Blog auf meiner Leseliste ;-)

    Gruß
    Alex

  • Hi Alex,
    schön dass du hier mehr auf TYPO3 eingehst, freut mich. Die Extension sourceopt kannte ich bislang auch garnicht. Eventuell solltest du noch die Extension im Text direkt ins TER verlinken ( http://typo3.org/extensions/repository/view/sourceopt/0.3.6/ )

    Ansonsten freue ich mich auf weitere Typo3 Einträge hier ;)

  • 6. Xel

    Hi Eugen,
    Recht haste – hab das mal schnell nachgeholt, mit dem Verlinken.

    Ansonsten freue ich mich auf weitere Typo3 Einträge hier

    Und ich freue mich, dass das so gut ankommt.

    Nächstes Mal wirds vermutlich in Richtung Templating gehen, aber mehr verrate ich noch nicht ;-)

  • @Xel: Guter Artikel! Gib uns mehr davon :)

    @Goatix: Gutes Händchen bei der Personalauswahl :)

    Gruß
    Fabian

  • 8. Xel

    @ Fabian
    Danke für die Blumen – mehr ist gerade in Arbeit – ich hoffe es heute nacht noch fertig zu bekommen, aber besser ein Artikel dauert nen Tag länger, als das er nachher nicht gut ist ;-)

    @ Frank
    Danke für die verbesserte Codeansicht, die du mit dem Designchange eingebaut hast, da machen Codelistings gleich mehr Spass ;-)

    Gruß
    Alex

  • […] Andy hat mich auf einen interessanten Post vom SEO Marketing Blog aufmerksam gemacht. In diesem detaillierten Artikel geht es um die Funktionsweise der Extension “sourceopt”. Step by Step wird beschrieben welche Funktionen man benutzen kann/sollte oder lieber meiden sollte. […]

  • 10. Frank

    @ Fabian

    … gellele – wobei mit ein bißchen Geduld & Glück die “Optimalbesetzungen” früher oder später quasi von selbst auftauchen – aber das kennste ja ;-)

    @ Xel
    … freut mich, daß es Dich freut – bei Deinem Typo3 Thema mit Snippets & Quellcode-Ausschnitten wurde das jetzt einfach mal relevanter als bisher ;-)

  • […] Im SEO Marketing Blog habe ich einen sehr interessanten Artikel über die SEO Quellcodeoptimierung für TYPO 3 gefunden. […]

  • Remove alt-attributes of images if they are empty — schlagt mich, wenn ich falsch liege, aber das geht doch gar nicht, weil nach XHTML 1.0 strict und den Barrierefreiheitsgrundlagen das alt-Attribut zwingend vorgeschrieben ist?! Oder möchte hier noch jemand zur Erzeugung nichtvalidierenden Codes aufrufen? :-O

  • 13. Xel

    Oder möchte hier noch jemand zur Erzeugung nichtvalidierenden Codes aufrufen?

    Ich möchte hier zu nichts aufrufen – schon garnicht dazu sich nicht an Standards zu halten. Aber es muss jeder für sich entscheiden, wie weit er das treiben will.

    Wie ich schon im Artikel schrieb:

    ist zwar nicht unbedingt das richtige, da ein leeres Alt-Attribut eine gewisse Bedeutung hat, ich kann aber gut und gerne darauf verzichten.

    Du hast also völlig recht – es gehört eigentlich rein, aber ob es wichtig ist – ich bezweifle es, wer den Standards nachlaufen will wie ein Hund seinem Herrn, darf das tun, wer einen Grund sieht, um es drin zu lassen kann es auch tun – das es richtiger währe habe ich nicht verschwiegen – und wer Standards nicht als Selbstzweck begreift und keinen Grund sieht, so wie ich, der lässt sie eben weg, die leeren Alt-Attribute…

  • schön geschrieben … hatte auch mal per hand meinen typo3 quelltext gesäubert und siehe da, schon gingen meinen sprungmarken nicht mehr :)

    was ich mir da innerhalb von 10 minuten alles zerbastelt hatte :)

    werd aber mal die extension testen :)

    mfg

  • 15. Xel

    @uweselbst
    halt mich auf dem laufenden, ob dir dabei was kaputt geht oder ob alles klappt – mit meinen Sprungmarken hab ich keinerlei Probleme…

  • @Xel … mach doch, was Du willst, aber ich habe dazu eine fundamentalistische Einstellung. Mag daran liegen, daß ich Informatiker bin, und in jeder normalen Programmiersprache wird einem Code, der syntaktisch nicht korrekt ist, gnadenlos um die Ohren gehauen. Nur in [X]HTML kommt man — mehr oder weniger — auch mit syntaktischen Fehlern durch. Es ist zwar reiner Zufall, wie die Browser der Seitenbesucher die Seite dann rendern, aber das spielt offenbar nur eine untergeordnete Rolle … bestimmte Kombinationen werden getestet, und was denn Rest angeht … nach uns die Sintflut.

    Du kannst jetzt völlig berechtigter Weise anführen, ich würde aus einer Mücke (streichen leerer alt-Attribute) einen Elephanten machen. Stimmt, tue ich. Mir fehlt einfach das Verständnis, wie Leute, die beruflich Websites bauen (so wie Ihr), meinen, mit handwerklich minderwertiger Arbeit (!) durchzukommen. [X]HTML schreiben heißt wenigstens die W3C-Recommendations einzuhalten. Basta. Wer beim Autofahren die StVO nicht einhält, leistet auch minderwertige Arbeit.

    Und ich weiß wenigstens ein bißchen, wovon ich rede. Ich habe mich auch professionell (frag den Boss :) ) in dieser Sphäre bewegt, gestalte auch immer noch gerne Websites und sehe immer wieder, das meine Designs, die vielleicht nicht flashy und hip sind (denn wenn ich etwas nicht kann, ist es Graphikdesign), eigentlich immer wenigstens okay aussehen, egal mit welchem Browser und in welcher Auflösung ich sie ansehe.

    Und deshalb geht mir bei der Nonchalance, mit der Du sagst “leere alt-Tags kann man auch weglassen” sagst, einfach der Hut hoch.

    So. Ende des Ausbruchs. :) Aber das mußte mal raus. Weitere Diskussion gerne auch per E-Mail (martin@buntklicker.de).

  • […] TYPO3 SEO | TYPO3 Blogger SEO Quellcode-Optimierung mit TYPO3 » SEO Marketing Blog Typo3 SEO Blog – Suchmaschinenoptimierung mit Typo3 » Sinnvoll Traffic auf die Seite bringen __________________ […]

  • 18. Daniel

    Ich finde eure Kommentare sehr gut, da SEO heutzutage immer mehr von bedeutung umringt wird.
    Ich habe da eine Seite gefunden die darüber auskunft gibt ob typo3 als cms versagt und ob da wordpress nicht besser für cms geeignet wäre. Ihr könnt euch ja mal die Seite anschauen und selbst ein Auge auf die Debate richten.

    MFG Daniel

  • Aus SEO-Sicht ein wirklich schöner lohnenswerter Artikel.

  • […] SEO Quellcodeoptimierung mit TYPO3 […]

  • Wenn ich die Funktion “Enable UTF-8 support” aktiviert habe, generiert er mir die Navigation nicht mehr richtig, d.h. es fehlt genau ein Link in der Navigation. Wenn ich diese Funktion deaktiviere geht es. Ansonsten wirklich ein Super Plugin.

  • Achso … es geht aber wahrscheinlich nicht mit jedem Layout, dass der Inhalt im Quellcode vor der Navigation ist, oder? Vielleicht mit absoluter Positionierung?

  • Mit jeden Layout glaube ich kaum … Weniger ist mehr … damit könnte man es schaffen.

  • 24. SEO

    Mit jedem Layout geht es wohl nicht, zumindestens nicht wenn man mit DIVs arbeitet. Aber in HTML5 wurden ganz neue TAGS eingeführt, wo man die einzelnen Bereiche einer Seite logisch auszeichnen kann. Aber verstehen das alle Browser? Ich glaube die IEs haben damit Probleme.

  • Man kann ja eine Browserweiche einbauen, wo geprüft wird, ob der aktuelle User-Agent einer der IE´s ist und wenn ja, wird alternativ ein anderes Template geladen. Die Suchmaschinen bekommen dann auch das HTML5-Template präsentiert und das könnte sich doch positiv bemerkbar machen.

  • 26. ro.be69

    Hi ,
    ich denke der Anbieter : domain-hosting.de wird für Domain Hosting persönlich am besten helfen können. Bei solchen Sachen kommt es sehr auf die Kommunikation und den Service an. Einfach mal nachfragen. Grüße bo

  • 27. SEO

    Für TYPO3 gibt es derweil so viele Extensions, die sind alle in Bezug auf SEO bestens ausgelegt. Eine Davon heisst sourceopt und die säubert sogar den ganzen HTML-Quellcode und macht daraus einen sauberen und übersichtlichen Code.

  • Ich habe vor kurzem irgendwo mal gelesen, dass einige SEOs probleme haben, Seiten in den SERPS weiter nach oben zu bringen, wenn es eine HTML5 Seite ist. Ist daran vielleicht was war? Ich meine, dass selbst Google schon auf HTML5 setzt.

  • 29. Andre

    Den Doc-Type selber stellen wir immer auf XHTML-Transitional und sind immer gut gefahren damit.


Deine Ideen zum Artikel: SEO-Quellcodeoptimierung mit TYPO3

Kommerzielle Werbung in Kommentaren ist diesem SEO Blog nicht erwünscht!


Entspannen Sie ... wir kümmern uns darum!
Profitieren auch Sie von unserem Google Ranking Know-How!
» Profi Ranking - Suchmaschinenoptimierung «