CSS in HTML auf Blogger einbinden

    CSS kann auf Blogspot in HTML unterschiedlich eingebunden werden. Hier beschreibe ich kurz 3 Methoden, die ich kenne.

     

    Methode 1: Zwischen <head> und </head>

    <!DOCTYPE html>
    <html>
    <head>

     

    <style>
    body {color: #444;}
    </style>

     

    </head>
    <body>
    ...
    </body>
    </html>

    Inhaltsverzeichnis mit HTML erstellen (Code)

    In den größeren Beiträgen macht es Sinn, ein Inhaltsverzeichnis zu erstellen, damit die Besucher der Webseite zwischen unterschiedlichen Lese-Bereichen innerhalb einer Seite “switchen” können.
    Das lässt sich mit Hilfe von “Anchor Links” realisieren. Klicken Sie auf einen Anchor Link, springen Sie z.B. zu einer bestimmten Überschrift.

    Vorschau der Webseite mit Tablets, Handys, TVs und Desktops.

    Nach dem Erstellen oder Anpassen von Webseiten-Design ist heutzutage wichtig zu wissen, wie die Webseite auf Handys und Tablets angezeigt wird.

    Man könnte die Webseite mit eigenem Handy anzeigen lassen, das reicht aber nicht aus. Man möchte ja in der Regel das Ziel erreichen, dass die Webseite auf allen Geräten und Bildschirmauflösungen korrekt angezeigt wird.

    Dazu gibt es im Netz eine Menge von Simulation-Tools zur Vorschau der Webseite auf Handy (Android, iPhone, etc.), Tablet oder auf diversen Bildschirmauflösungen.


    Mit der online Tool Screenfly von quirktools.com kann man anschauen, wie eine Webseite auf diversen Bildschirmgrößen, TVs, Tablets und Handys angezeigt wird.

    Im Moment (06/2013) bietet Screenfly die Vorschau der Webseiten mit folgenden Tablets und Handys an:

    Kindle Fire HD
    Kindle Fire
    Google Nexus 7
    Apple iPad 1-3/Mini
    Motorola RAZR V3m
    Motorola RAZR V8
    BlackBerry 8300
    Apple iPhone 3, 4 und 5
    LG Optimus S
    Samsung Galaxy S2 und S3
    Asus Galaxy 7

    Custom Size Screen: Vorschau der Webseite mit einer beliebigen Bildschirmgröße.

    Kostenlose Tools für Webmaster

    Folgende kostenlose Tools und Google Chrome Apps können die Arbeit von Webmaster stark erleichtern.
     
    cssviewer CSSViewer App für Google Chrome: CSS Tags und Eigenschaften vom bestimmten Element anschauen.


    CSSViewer für Google Chrome herunterladen:
    Download
         


    Tilt3d Tilt 3D ADD-ON für Mozilla Firefox:
    CSS Tags und Eigenschaften von einer Webseite im “3D Modus” anschauen. 


    Tilt 3D für Mozilla Firefox herunterladen:
    https://addons.mozilla.org/de/firefox/addon/tilt/


    Quirktools.com
    Funktion: Vorschau der Webseite mit Tablets, Handys, TVs und Desktops.

    Mehr Details....

    Html-Color-Codes.info
    Funktion: HTML Farbencodes, HTML Farben, Farbe vom Bild auslesen.


    Weitere Google Chrome Apps für Webmaster


    Aus meiner Sicht sind folgende Chrome Apps sehr praktisch für Webmaster und SEOs :

    NoFollow NoFollow Links anzeigen. Das Tool könnte für SEO nützlich sein. (Link)

    CSSViewer Mit dem Tool kann man CSS Tags und Eigenschaften vom bestimmten Element auf der Webseite anschauen. (Link)

    ZenMate Das VPN App ermöglicht das anonymes Surfen im Internet (Link) (Mehr Infos)

    Edge: The Web Ruler Virtuelles Lineal (Link)

    Alexa Traffic Rank Der offizielle Alexa Traffic Rank Toolbar  (Link)

    Open SEO Stats Das Tool zeigt Google PageRank und weitere wichtige SEO Daten zu einer Domain. (Link)

    ColorZilla Farbe vom einem bestimmten Punkt vom Bildschirm auslesen (Link)

    Ich halte diese Liste nicht auf dem aktuellsten Stand, deswegen können Sie gerne neue nützliche Apps über Kommentare vorschlagen.