Dienstag, 18. Februar 2014

Tag 11 Online Marketing Kurs - SEO Onpage - HTML-Exkurs (2)

Mitschrift 19.02.2014

Youtube-Tipp La Red Film
(Agentur: super Film - schlechtes Social Media Marketing)

weiter HTML Exkurs mit Onpage-Optimierungs-Tipps!

Buchtipp: HTML selbst lernen - Von Kopf bis Fuß Reihe

HTML - Grundstruktur

<html>
    <head>
        <title> Keyword - auf jeden Fall am Anfang in den Titel </title>

    </head>
    <body>

<!-- Dies ist ein Kommentar //-->
        <h1> Keyword - Meine erste Überschrift </h1>

        <h4> Meine erste Überschrift </h4>

    </body>
</html>



Optimierung der Seite - Onpage-Oprimierung



Keywordnutzung im Quelltext: am Besten immer einbauen, aber:
Maximal 3 gleiche Keywords pro Seite!
-> Keyword Density Tool, zeigt sonst, dass man es übertrieben hat.

  • Keyword möglichst in Toplevel-Domain! Schlagkräftiges Argument für Suchmaschine!
    (Achtung: Subdomains, wie bei blogspot vermeiden - hier erkennt die Suchmaschine nur die Hauptdomain!)
  • Keyword auch im Absatz <p> 
  • Suchmaschine kann Bilder auslesen & in Universal Search anzeigen!  Wann ist eine Bild optimal (keywordoptimiert)?: Breite von 500 & max 2000 px (was mach ich? Blog? Slider?...)(ist schon sehr groß - doppelt so breit wie Bildschirm - haben Studien belegt - Untersuchung der besten Suchergebnisbilder)
    -
    nicht größer, sonst ist das Bild zu groß für Website - zu lange Ladezeit - schlecht für SEO! Siehe Woorank - misst auch Ladezeit!
  • SEO-relevant: alt-Attribut: alt="Keyword statt Bild" - falls das Bild nicht geladen werden kann! Dann liest er das alt-Attribut aus. -> Weil es Text ist, kann die Suchmaschine es lesen!
  • title="Titel mit Keyword" - wird angezeigt, wenn man mit Maus über das Bild geht. 
  • Ankertext mit Keyword und Erklärung des Linkziels! 
  •  
Regelkonfomität:
  • White-Hat - halte mich an Nutzungsrichtlinien der Suchmaschine (Nachteil:  andere überholen mich, weil sie Grey-Hats nutzen)
  • Grey-Hat - Dinge, die abseits der Regel sind, bei denen die Suchmaschine aber Probleme hat diese auszulesen
    Bsp.: CSS: Kann Dinge Programmieren /Texte einfügen, die der Leser nicht sehen kann, aber für den Roboter da sind. - außerhalb der Bildbreite/Sichtweite einen durchsichtigen Container setzen
  • Black-Hat - Bitte unterlassen! Sonst wird man aus der Suchmaschine entfernt. Cloaking - Suchmaschinenroboter veräppeln. (Führt zu verbrannten Domains) -
    Bsp: BMW - nur Bilder keine Texte und Roboter veräppelt.
    Bsp: Seite durch Backlinks extrem pushen (wenn Backlinks extrem steigen - außerhalb des natürlichen Linkwachstums, dann schlägt der Roboter an) - technische Ausnutzung des Suchalgorithmus - Konkurrentenschädigen = Regelverstoß


Unnatürliches Linkwachstum durch Black-Hat Backlink-Pushs
HTML 5 & CSS3 = Standardmäßig verwendet Kombi derzeit

 
Netter Link dazu - Wikipedia:
White-Hats („Weiß-Hüte“):
Verwenden ihr Wissen sowohl innerhalb der Gesetze als auch innerhalb der Hackerethik, beispielsweise indem sie professionelle Penetrationstests ausführen.
Black-Hats („Schwarz-Hüte“):
Handeln mit krimineller Energie und beabsichtigen beispielsweise, das Zielsystem zu beschädigen oder Daten zu stehlen.
Grey-Hats („Grau-Hüte“):
Verstoßen möglicherweise gegen Gesetze oder restriktive Auslegungen der Hackerethik, allerdings zum Erreichen eines höheren Ziels. Beispielsweise durch die Veröffentlichung von Sicherheitslücken, um ein Leugnen unmöglich zu machen und die Verantwortlichen dazu zu zwingen, diese zu beheben. Grey-Hats zeichnen sich dadurch aus, dass sie nicht eindeutig als „gut“ oder „böse“ einzustufen sind.
 
Strukturierungswerkzeuge
  • Kommentar:  <!--  //--> Wird im Browser nicht angezeigt, aber strukturiert den Code, damit ich weiß, an welcher Stelle ich was gemacht habe. 
  • Absatz / Paragraph: <p>:
  • Zeilenumbruch: <br> </br> oder nur <br/> (da in einem Zeilenumbruch nichts stehen kann, wird er in der gleichen Klammer noch geschlossen)
  • Liste: 
    • <ol> (Orderlist - Nummerierung), <li> Listenpunkt / 
    • <ul> (unsorted list - nur Aufzählungszeichen) 
  • TAbelle: <table>, <tr>=Table Raw = 1.Zeile, <td> Table Data (Spalte) (Linien sind Design - nicht im html verankert, deshalb sieht man keine Tabellenlinien - man kann auch Linie in html einfügen - macht man aber an sich nicht: <table border="1"> je höher Zahl, desto dicker der Rahmen) 
  • Bild: <img Informationen über Quelle - wo liegt das Bild?/>- direkt dahinter das Bild eingeben, wie bei Zeilenumbruch, gleich wieder schließen)
    src = Source = "Bildname.jpg"
    Größe verändern: width="300"
    - entweder Breite oder Höhe angeben - es wird automatisch angepasst.
    ! Achtung! Das Bild ist trotzdem groß im Hintergrund gespeichert und muss auch geladen werden, es wird nur kleiner dargestellt! Darum nochmal: Unbedingt auf Originalbildgröße achten und nicht zu groß wählen! 
    • Bild einbauen in HTML: 
      • Bild einfügen im CMS normalerweise durch hochladen. In HTML durch <> - dazu Bild auf Desktop legen - neben die Test-datei. 
      • Unbedingt umbenennen! keyword.jpg (die wenigstens Leute auchten auf Dateiname) - Größe prüfen: bei mir jetzt: 1024x768 
      • Tipp: paint.net für Bilderbearbeitung
    • SEO-relevant: alt-Attribut: alt="Keyword statt Bild" - falls das Bild nicht geladen werden kann! Dann liest er das alt-Attribut aus. -> Weil es Text ist, kann die Suchmaschine es lesen!
    • title="Titel mit Keyword" - wird angezeigt, wenn man mit Maus über das Bild geht.
  • Hyperlink: <a href="http://fraukalke.blogspot.de" >Ankertext </a> hr= Hyper refference
    • Ankertext: Hier geht's zu Frau Kalke mit Keyword! Achtung - nicht nur ein einzelnes Wort, wie "hier" verwenden, sondenr relevante Worte für die Inhalte, die ich hinter dem Link finde! - Danach wählt Suchmaschine auch aus!
    • auch hier ist ein Titel möglich, wenn man mit der Maus drüberfährt: title="Titel mit Keyword" (= Tool tip = Infofenster) 
    • Extra Fenster aufmachen = Target, target="_blank" = neue Seite öffnen! 
-> zum Hyperlink später mehr: Follow- & No-Follow-Link in Offpage-Optimierung (je mehr Links andere Leute von ihrer Site zu uns machen, desto besser für uns!)

 

Zurück in den Kopfteil <head>:
Wichtige Infos, die nicht für den Leser, sondern die Suchmaschine gedacht sind!


  • !!!Meta-Angaben = Dokument übergreifend - Wissen die Wenigsten einzurichten, daher wirksames Mittel!-> soll Dokument in Gänze beschreiben können - Suchmaschine will wissen: was finde ich hier, wenn ich darauf laufe.
    (Es gibt viele Angaben, wir brauchen aber erstmal nur die folgenden 3:)
    • <meta name="description" content="Keyword hier auch in der Suchmaschine ersichtlich. /> - Hier auch Keywords verankern! Neben Titel und URL mit das wichtigste Argument für die Suchmaschine!
    • <meta name="keywords" content="Keyword, HTML, Online Marketing, Marketing, SEO, SEA" />   
    • <meta name="robots" content="ALL"> (all = Alle Seiten werden ausgelesen & Indiziert - unnötige Angabe - brauchen wir nur, wenn wir was ausschließen wollen) kann hier bestimmen:
      Soll meine Index-Seite bei Google mit in den Index oder nicht -
      Frage: Warum sollte man Seiten in der Suchmaschine nicht berücksichtigt werden?
      Antwort: Will meine Besucher durch meine Seite leiten - Ziel: Verkauf
      Dankeseite, Folgeseiten, die der Besucher erst sehen soll, wenn er seine Emailadresse eingegeben hat werden für Suchmaschine unsichtbar gemacht; Impressum, Kontaktformular
      Bei Angabe "no Index" - soll der Suchmaschinenroboter bzw. Crawler diese Seite nicht in der Suchmaschine anzeigen/ in den Index aufnehmen.

     
    einfach skizzierter Traffic-Fluss - wohin möchte ich meine Besucher lenken?
      • <meta name="robots" content="index, follow" />
        (no follow - bsp.: indexiere das Impressum aber lass die Links raus - no follow)
        Baue ein No follow nur dahin, wo ein Link tatsächlich nicht zu deiner Seite passt!
        rel="nofollow"
        Lasst die Seiten Indexieren, es sei denn man hat Anmeldung zum CMS drin)
 Tipps zu Metaangaben am Rande
  • Weil der Text in der Suchmaschine ersichtlich ist, kann ich hier auch mit einer Aufforderung arbeiten!
  • <meta name="keywords"  noch nutzen, und hier alle Keywords reinnehmen - Google beachtet es nicht mehr, aber die anderen Suchmaschinen! - Also immer mit eingeben!
  • Nur die ersten 15 oder 20 Worter werden in der Metaangabe Keywords von anderen Suchmaschinen ausgelesen. 
  • später werden wir noch robots.txt behandeln - hier mit kann ich die verschiedenen Crawler (Suchmaschinenrobots) ansprechen, aber Achtung - hiermit kann man viel kaputt machen - Finger weg:

    Anweisungen für Webcrawler

    <meta name="robots" content="index,follow" />
    Alternativ kann auch:
    <meta name="robots" content="all" />
    verwendet bzw. auf den Code ganz verzichtet werden.
    Der Webcrawler (Suchroboter) soll die Webseite ausdrücklich in den Suchmaschinen-Index aufnehmen, damit sie auffindbar ist, und den Hyperlinks auf der Seite folgen. Diese Angabe ist im Allgemeinen unnötig, da sie dem normalen Verhalten der meisten Webcrawler entspricht.
    <meta name="robots" content="noindex" />
    Der Suchroboter soll die Webseite nicht in den Index aufnehmen. Die Webseite soll also nicht über Suchmaschinen auffindbar sein. Siehe auch: Robots Exclusion Standard.
    <meta name="robots" content="nofollow" />
    Der Suchroboter darf die Webseite zwar aufnehmen, aber soll den Hyperlinks auf der Seite nicht folgen. Die Wirkung ist so, als wären die Links auf der betreffenden Seite gar nicht vorhanden. Derselbe Effekt lässt sich auch für einzelne Links erreichen, indem diese um das Attribut rel="nofollow" ergänzt werden. (siehe nofollow)
    <meta name="robots" content="noodp" />
    Die Suchmaschine soll auf der Ergebnisseite nicht die Beschreibungstexte des Open Directory Projects verwenden – sofern die Seite dort eingetragen ist  –, sondern wie bei nicht eingetragenen URLs einen Ausschnitt der Seite selbst (sog. „Snippet“) anzeigen. Diese Anweisung wird von Google und MSN Search unterstützt.
    <meta name="robots" content="noydir" />
    Die Suchmaschine soll auf der Ergebnisseite nicht die Beschreibungstexte aus dem Yahoo-Verzeichnis verwenden – sofern die Seite dort eingetragen ist  –, sondern wie bei nicht eingetragenen URLs einen Ausschnitt der Seite selbst. Diese Anweisung wird nur von Yahoo (Robot: Slurp) unterstützt.
Klausur! Was sollten Sie bei der Onpageoptimierung berücksichtigen - bei Google auf jeden Fall/ Extra für Google die Metaangabe Keyword benutzen - falsch, weil Google sie nicht mehr ausliest.  

Beispiel für Metaangaben:
Coach für Unternehmer bei Google eingeben:
Stefan Merath und Jörg Mann - er nutzt es mit Aufforderung:
Unternehmercoach Jörg Mann - Aus den eigenen Expertise ein erfolgreiches Unternehmen aufbauen. So geht es wirklich. Hier informieren und mehr erfahren!
Exkurs: Dublin-Core (ist ein im Bibliothekswesen verwendetes Datenformat.
Genauer handelt es sich um eine Sammlung einfacher und standardisierter Konventionen zur Beschreibung von Dokumenten und anderen Objekten im Internet, um diese mit Hilfe von Metadaten einfacher auffindbar zu machen.) 

Auf Seite - rechte Maustaste - Seitenquelltext anzeige, um Quelltext anderer Seiten anzuschauen - was haben die im Head drin - Metaangaben?

Tipps: 
  • Klausur! Suchmaschine möchte eine optimale Leserfreundliche Struktur vorfinden - Daher immer H1, Listen, Tabellen, Absätze - aber immer für den eigentlichen Zweck verwenden!
  • Alles was Design ist, ist CSS - aber die Suchmaschine interessiert nur Text, also HTML 
  • Barrierefreie Programmierung (behindertengerecht) - ohne Sinne wahrnehmen: Augen zu machen - Vorlese-Tool, oder Blindtastaturen
  • es kommt beim Kampf um die beste Position nachher auf kleine Nouncen an - also gute Ankertexte kreieren! 
  • HTML-Kenntnisse sind in der Onlinebranche sehr wichtig !
  • Bau dir keine eigene Seite von 0 auf, kauf dir ein Template - es gibt gute und günstige Templates mit schönen Design.
    (Anbietertipps: Themeforrest/ Elegantthemes)
  • Bei w3schools gibt es ne Suchfunktion, bei der man alles einzelns nachlesen kann, bsp.: Metaangaben, robots
  • Tipp dafür - Wikipedia für SEO zu nutzen: englischen Text nehmen, übersetzen und mit eigenem Link auf Wikipedia hochladen ;) - Ist aber auch ein Grund dafür, dass Wikipedia immer schlechter wird - deshalb setzten sie jeden Link auf nofollow!
Klausur! Für Onpage-Optimierung: Nur eine einzige H1 auf jeder Unterseite!!! Die anderen Unterschriften dürfen häufiger verwendet werden.

Klausur! Ankertext muss immer keyword relevant sein! er beschreibt den Weg des Links!

Klausur! Man versucht bei der Onpage Optimierung möglichst jedem Tag (eben da wo es möglich ist) auch die Keywords mitzugeben! Listen, Links, Titel, Tabellen etc.! -> Title, Alt-Attribut, Label


Klausur! Angabe "no Index" - soll der Suchmaschinenroboter diese Seite nicht in der Suchmaschine zu finden sein/ in den Index aufgenommen werden


Klausur! Wenn es darum geht eine Seite onpage suchmaschinen zu optimieren:
Ich verwende immer die Robotsangabe: no index, no follow - nicht ankreuzen, da wir es nur in speziellen Fällen benutzen - sonst kann ich SEO gleich seinlassen.


HTML - Struktur nach unserem Exkurs

<html>
    <head>
        <title> Keyword - auf jeden Fall am Anfang in den Titel </title>

        <meta name="description" content="Keyword hier auch in der Suchmaschine ersichtlich." />
        <meta name="keywords" content="Keyword, HTML, Online Marketing, Marketing, SEO, SEA" />   
        <meta name="robots" content="index, follow" />
    </head>
    <body>
        <!-- Dies ist ein Kommentar //-->

        <h1> Keyword - Meine erste Überschrift </h1>

        <p> Dies ist ein Absatz, in dem natürlich auch unser Keyword vorkommt </p>

        <h4> Meine zweite Überschrift evtl auch mit Keyword </h4>

        <p>
            <ol>
                <li> Erster Listenpunkt (wenn möglich auch hier mit Keyword) </li>
                <li> Zweiter Listenpunkt (wenn möglich auch hier mit Keyword) </li>
                <li> Dritter Listenpunkt (wenn möglich auch hier mit Keyword) </li>
            </ol>
        </p>

        <p>
            <ul>
                <li> Erster Listenpunkt (wenn möglich auch hier mit Keyword) </li>
                <li> Zweiter Listenpunkt (wenn möglich auch hier mit Keyword) </li>
                <li> Dritter Listenpunkt (wenn möglich auch hier mit Keyword) </li>
            </ul>
        </p>

        <p>
            <table border="1">
                <tr>
                    <td> Hier steht ein Datensatz1 mit Keyword </td>
                    <td> Hier steht ein Datensatz2 mit Keyword </td>
                </tr>
                <tr>
                    <td> Hier steht ein Datensatz3 mit Keyword </td>
                    <td> Hier steht ein Datensatz4 mit Keyword </td>
                </tr>
                <tr>
                    <td> Hier steht ein Datensatz5 mit Keyword </td>
                    <td> Hier steht ein Datensatz6 mit Keyword </td>
                </tr>
            </table>
        </p>
           
        <p>
            <!--großes Bild//-->
            <img src="keyword.jpg" />
        </p>
        <p>
            <img src="keyword.jpg" width="300" alt="Keyword statt Bild" title="Titel mit Keyword"/>
        </p>

        <p>
            <a href="http://fraukalke.blogspot.de" title="Titel mit Keyword" target ="_blank" rel="nofollow"> Hier geht's zu Frau Kalke mit Keyword </a>


    </body>
</html>




Google Webmaster Tools

Man kann mit Hilfe von Webmaster Tools die Suchergebnisse beeinflussen!
Link zu Webmastertools


Eigenes Blog in das Webmaster Tool eingeben. - Bestätigen, dass es unsere Seite ist.- Alternative Methoden - html Tag unserer Startseite hinzufügen.
Kopieren
Backend - Vorlage - HTML bearbeiten - in <head> einfügen - Bestätigt - FERTIG!

Ebook-Tipp:
Webmaster Tools ebook von trustagents


 



-> wenn möglich, bitte lesen, sonst morgen mehr.  
Dieses Tool ist auch super für die Arbeit mit dem Kunden!




Tipp:
Wenn man sich über domain gedanken macht: 

bei Google Trennstriche zwischen Wörter, wenn manoptimieren möchte, die werden als Leerzeichen verwendet.
bsp. meineneuedomain.de -> besser: meine-neue-domain.de

Achtung - bei WP.com kann man nicht in den Quelltext gehen - besser eigener Server und eigenes WP draufladan.

Wortursprung Computer:
Der englische Begriff computer, abgeleitet vom Verb (to) compute (aus Lateinisch: computare = ‚zusammenrechnen‘),[1] bezeichnete ursprünglich Menschen, die zumeist langwierige Berechnungen vornahmen, zum Beispiel für Astronomen im Mittelalter. Der früheste bekannte Text, in dem das Wort verwendet wird, stammt von 1613.[2] In der New York Times tauchte das Wort erstmals am 2. Mai 1892 in einer Kleinanzeige der US-Marine[3] mit dem Titel „A Computer Wanted“ (Ein Rechenspezialist gesucht) auf, wobei Kenntnisse in Algebra, Geometrie, Trigonometrie und Astronomie vorausgesetzt wurden. 1938 stellte Konrad Zuse den ersten frei programmierbaren mechanischen Rechner her (Z1), der im heutigen Sinne bereits dem Begriff entsprach. In der Namensgebung des 1946 der Öffentlichkeit vorgestellten Electronic Numerical Integrator and Computer (ENIAC) taucht erstmals das Wort als Namensbestandteil auf. In der Folge etablierte sich Computer als Gattungsbegriff für diese neuartigen Maschinen.


Buchtipps Social Media
Social Media Manager von Vivien Pein (Berufsbild des Managers), Wir machen Social Media (Praxisbeispiele und Konzepte von Malina Kruse-Wiegand & Annika Busse) statt PR im Social Web (Grundbegriffe)  


Link-Tipps:
Videozusammenfassung zu Google SEO
WordofMouth Marketing und Ausblick auf Social Media Themen

Hier noch mal etwas zur Robots.txt 
- See more at: http://www.om-blog-2013.blogspot.de/search?updated-max=2013-03-05T07:56:00%2B01:00&max-results=7#.UwSZjIXGA0k
Video-Zusammenfassung SEO
Die robots Textdatei
Mehr zu robots.txt

Videozusammenfassung zu Google SEO
WordofMouth Marketing und Ausblick auf Social Media Themen

Hier noch mal etwas zur Robots.txt 
- See more at: http://www.om-blog-2013.blogspot.de/search?updated-max=2013-03-05T07:56:00%2B01:00&max-results=7#.UwSZjIXGA0k
Videozusammenfassung zu Google SEO
WordofMouth Marketing und Ausblick auf Social Media Themen

Hier noch mal etwas zur Robots.txt 
- See more at: http://www.om-blog-2013.blogspot.de/search?updated-max=2013-03-05T07:56:00%2B01:00&max-results=7#.UwSZjIXGA0k
Videozusammenfassung zu Google SEO
WordofMouth Marketing und Ausblick auf Social Media Themen

Hier noch mal etwas zur Robots.txt 
- See more at: http://www.om-blog-2013.blogspot.de/search?updated-max=2013-03-05T07:56:00%2B01:00&max-results=7#.UwSZjIXGA0k

Keine Kommentare:

Kommentar veröffentlichen