Auf der Suche nach Inspiration für ein neues Blog-Design? Oder soll es gleich ein kostenloses neues Design sein? Bitte sehr:
Noch viel mehr zum Thema CSS gibts aber in der (fast) unendlichen Liste von Dr. Web: CSS Quellensammlung CSS.
Immer öfter werde ich gefragt, wie ich auf der Startseite meines Blogs die AdSense-Anzeigen einbaue, damit diese nur nach dem ersten und nach dem dritten Post angezeigt werden.
Die Lösung ist ziemlich simpel: Man fügt in der Datei index.php nach
< ?php the_content(); ?>
den folgenden Code ein:
< ?php
if(!is_single() && ($post==$posts[0] OR $post==$posts[2])) { ?>
// Hier den AdSense-Code einfügen
< ?php } ?>
…und schon wird AdSense nach dem ersten ($posts[0]) und dritten ($posts[2]) Post angezeigt.

Wer schon einmal mit FrontPage, NetObjects Fusion oder wie sie alle hiessen, versuchte, eine Homepage zu basteln, wird Freude am Page Creator von Google haben. Einmal mehr präsentiert Google ein für Otto Normalverbraucher, der damit kinderleicht eine Homepage erstellen kann. Tatsächlich ist es mehr als einfach, für meine Demoseite brauchte ich lediglich knappe 5 Minuten…
Doch nicht nur das Erstellen von Seiten ermöglicht Google mit dem neuen Dienst, die Seiten werden auch direkt auf den Servern von Google abgelegt, so dass noch nicht einmal mehr ein Hosting-Account für die Webseiten benötigt wird. Google spendiert dazu 100 MB Speicherplatz was ja wohl auch reichen dürfte…
[Update]
Scheinbar hat Google derzeit noch etwas Probleme mit der Erreichbarkeit der erstellten Seiten. Derzeit führt der Aufruf meiner Demoseite nur zu einem 404 Error. Aber die Seite ist da… Kann sich also nur um Stunden handeln 😉
Anleitungen zu CSS gibt gibt es einige, zum Beispiel ziemlich ausführlich von SelfHTML, „Grundlagen für Spaltenlayout mit CSS„. Wer jedoch „live“ sehen will, wie sich das Layout aufgrund einer CSS-Anweisung verändert, muss entweder die Beispielanwendung selbst ausprobieren, oder wirft einen Blick auf „Live Design“ von Albino Blacksheep. In 18 Schritten wird dort das Entstehen einer zweispaltigen Webseite erklärt und Schritt für Schritt der Fortschritt anzeigt.
(via digg.com)
Ein gutes Tutorial für ein 3-spaltiges Layout, umgesetzt mit CSS… Sehr hübsch. Damit sollten dann so langsam auch die Letzten eine CSS-basierte Site hinkriegen…
(via vowe)
Die Teia AG bietet bis Ende Jahr kostenlose Online-Kurse zu den Themen MS-Office (Word, Excel, Access, PowerPoint, Outlook) und Web (Internet, HTML, XML, Adobe Photoshop und GoLive) im Internet an.
Das wär doch was, um sich während den kommenden Festtagen etwas die Zeit zu vertreiben…
Der Touring Club der Schweiz (TCS) hat eine neue Webseite. Aber leider entspricht die nicht dem, was man eigentlich erwarten dürfte. Mit dem Internet Explorer sieht zwar alles noch sehr angenehm aus:

Blöd nur, dass ich eigentlich meist mit Firefox in der Gegend rumsurfe, dann sieht die Seite nämlich ganz anders aus:

Der Webdesigner scheint hier keinen Cross-Browser Test gemacht zu haben, denn sonst würde die ganze rechte (Werbe-) Leiste im Firefox ja wohl nicht einfach hinter die Navigation rutschen. Aber nachdem ich den W3C-Validator mal zum Quelltext als auch zum Stylesheet befragt habe, wundert es mich eigentlich nicht mehr.
Nicht nur, dass der Programmierer den DOCTYPE völlig am falschen Ort plaziert hat, nein, auch sonst spuckt der Validator ganze 264 Fehler im Quelltext aus. Die Validierung des CSS-Stylesheets schneidet da nicht besser ab. Da zählt der Validator zwar die Anzahl der Fehler nicht, aber er kann trotzdem seitenlange Mängel erkennen.
Wehe dem, der nun auch noch ein Lesezeichen setzen will. „Home“ heisst das dann nichtssagend. Morgen wüsste ich sicher nicht mehr, wer denn nun „Home“ ist. Auch die Unterseiten schneiden da nicht besser ab, denn die Seitentitel wurden einfach nach den Navigationspunkten benannt. „Mitgliedervorteile“ also, oder „Kurse“.
Robert Stark, dessen Artikel „TCS auf dem Pannenstreifen“ mich zu diesem Post inspiriert hat, hat noch mehr Zückerchen zum Thema „Don’t do that“ gefunden.
Schade, ein klein bisschen mehr Sorgfalt hätte ich vom TCS schon erwartet…
Gerade bei Webseiten im Blocksatz sind lange Worte immer wieder ein Problem, da sie die Darstellung unnötig „auseinanderreissen“. Im templaterie blog bin ich nun auf gestossen, das einen bedingten Bindestrich setzt. Eben bedingt, nämlich nur dann, wenn das Wort darstellungsbedingt auch tatsächlich getrennt werden muss.
Kleiner Wehrmutstropfen: Die Mozilla-Browserfamilie ignoriert leider, aber vielleicht ändert sich das in späteren Releases einmal. Der Internet Explorer verhält sich hier für einmal sehr mustergültig und setzt ohne Probleme um, genauso wie Opera.
Hat man also ein langes Wort wie: ichwollteschonimmerwissenwieicheinenbedingtenBindestricheinfügenkann, fügt man ganz einfach an den möglichen „Bruchstellen“ ein und schon wird der Blocksatz formschön umgebrochen (ausser eben, wie angesprochen, in Browsern der Mozilla–Familie).
Weitere Infos auch hier: Das Problem mit dem Zeilenumbruch im HTML
(via templaterie blog)

Beim Durchstöbern meiner Bookmark-Liste bin ich auf Website iCapture gestossen, welche ich offenbar vor langer Zeit mal für „gut“ befunden habe, dann aber in der Bookmark-Menge schlicht untergegangen ist.
Daniel Vine bietet mit iCapture einen kostenlosen Screenshot-Service an, so dass man sich selbst ein Bild machen kann, wie das eigene Blog (oder jede andere Website) im Safari-Browser unter Mac OS angezeigt wird. Dazu muss man das kurze Anmeldeprozedere durchlaufen und kann danach die gewünschten URL’s eingeben. Bereits wenige Sekunden danach sind die Screenshots online abrufbar…
Praktisch um rudimentär zu prüfen, ob die eigenen Seiten auch unter Safari richtig angezeigt werden oder ob noch am CSS geschraubt werden muss. Auch die Ladezeit der Seite wird angezeigt, bei mir soll das ganze 34 Sekunden dauern…
Das scheint mir dann doch etwas lang, da muss ich noch ein wenig rumschrauben 😉