Telagon Sichelputzer

Twitter mit CSS-Script gehackt!

Erst war es eine schöne, bunte Farbenwelt, mit der ein Account bei Twitter darstellte, dass mit einer kleinen Manipulation einzelne Tweets von CSS gestaltet werden konnten.

Das spontane Ergebnis waren euphorische Freude und gepaart mit Unverständnis in der Netzgemeinde, doch der Schein war bekanntlich wieder trügerisch.

Ich ahnte bereits, dass dies nicht mit rechten Dingen zugehen konnte. Schließlich erkannte man bei dem regenbogenfarbigen Account, dass einzelne Tweets mit CSS-Kommandos behaftet waren. Nach fast zwei Stunden schaute ich bei Twitter nach einigen aktuellen Themen und bemerkte, dass ein “lebensgroßer” Buchstabensalat in meiner Timeline hing. Zeitgleich erfolgten automatische Postings über meinen Twitter-Account.

Als ich versuchte, die Seite zu aktualisieren und einen Hinweis auf die nicht-betroffene mobile Variante von Twitter zu geben, wurde mein Twitter-Account direkt das Opfer einer Attacke bzw. einen Hijack per CSS-Script. Prompt griff ein Bekannter von einer Münchner Agentur zum Telefon und beschwerte sich, leicht schadenfroh, bei mir, warum ich seine Timeline jetzt auch mit “Müll” zudonnern würde. Immerhin konnte ich dem Problem durch die Apps und mobile Version nach nur wenigen Minuten Herr werden. Ich rate zudem, dass jeder, der sich von diesem Wirrwarr nicht von allein befreien kann, sein Passwort bei Twitter schnellstmöglich ändert. Solange von offizieller Stelle kein Feedback folgt, sollte man davon absehen, das Webinterface von Twitter zu verwenden.

Update:
Mehr zu dem Thema steht bei Sophos und Techcrunch. Auch die dpa hat eine passende Meldung zu dem Twitter-Hack verbreitet - hier in Version bei der Süddeutschen.

Der Fehler soll scheinbar durch einen Bug bei “t.co”, einem eigenen Dienst von Twitters zur Kürzung von URLs, verursacht worden sein, über den ein Javascript-Code mit einem “onmouseover”-Kommando clientseitig ausgeführt wurde. Dabei besticht ein fadenscheiniger Geschmack, dass genau dieser “URL-Shortener” zur weiteren Sicherheit für die Twitter-Nutzer einen weiteren Beitrag leisten sollte.

Kategorien: Microblogging, Social Media
4 Kommentare

HowTo: Druckfunktion in Weblogs

Weblogs sind meiner Meinung nach eine bedeutsame Größe unserer Medienwelt. Auch wenn manche Journalisten und Blogger es nicht für möglich halten möchten, ist der Einfluss von Blogs nicht mehr weg zu denken. Insbesondere in der PR-Arbeit nimmt nutzergenerierte Berichterstattung einen hohen Stellenwert ein. Doch in unserer schönen Welt zwischen Meinungsmachern und Public Relations fällt nahezu immer ein Qualitätsanspruch unter den Tisch: Eine saubere Druckfunktion der Blogs (und einiger Onlineausgaben mancher Zeitungen und Zeitschriften) wird vernachlässigt!

Manche Blogger ignorieren schlichtweg das Bedürfnis, aus ihren digitalen Artikeln ein sauberes Dokument zu erstellen. Deshalb habe ich den Entschluss gefasst, eine Druckfunktion für dieses Blog anzubieten. Dabei ist es gar nicht so schwer, den richtigen Stylesheet im Blog zu hinterlegen - auch ich habe mich 15 Minuten hingesetzt und den originalen Stylesheet des Blogs in die Print-Variante abgespeckt. Die Integration im Header des Weblogs ist dabei kinderleicht:

<link rel="stylesheet" type="text/css" media="screen" href="http://www.sichelputzer.de/wp-content/themes/ts2009/style.css" />

<link rel="stylesheet" type="text/css" media="print" href="http://www.sichelputzer.de/wp-content/themes/ts2009/print.css" />

Warum ist dies ein Qualitätsanspruch?
PRler betreiben Medienbeobachtung in Form von Clippings. Der ausgedruckte Medieninhalt steht zwar in direktem Kontrast zum Schutze des Regenwalds, jedoch ist heutzutage das Konvertieren von digitalen Inhalten in ein PDF-Dokument allgemeiner Usus. Man sichert den Inhalt für die Ewigkeit. Auch im Privatleben gibt man einen guten Artikel trotz Social Bookmarking Services an bestimmte Bekannte und Verwandte in Form eines PDFs ab. Lustig wird es erst recht, wenn manche Studenten mit sehr hässlichen PDF-Dateien (über 10 Seiten lang) eine einzige Quelle für ihre Abschlussarbeiten auf CD gebannt einreichen. Selbst ein Professor kommt an den Rand der Frustration. Schließlich werden Weblogs immer öfter als Expertenquellen genutzt.

DOs - ausgedruckte Blogeinträge sollten nur die relevanten Informationen darstellen:

  • Logo bzw. Titel des Blogs
  • Titel des Artikels
  • Autoren und Zeitstempel
  • Vollständiger Inhalt des Blog-Artikels
  • Hinweis auf Copyright oder CC-Lizenz
  • Schrift: Kräftige Farben und gängige Systemfonts auf weißem Hintergrund
  • Optional: Kategorien des Artikels
  • Optional: Tags des Artikels
  • Optional: Kommentare des Artikels

DON’Ts - verzichten sollte man in jedem Fall in der Druckvariante des Blogeintrags auf diese Kernbestandteile von typischen Layouts:

  • Blogrolle
  • Tagcloud
  • Sidebar
  • Footer (Ausnahme: Copyright/CC-Lizenz/Verfasser)
  • Letzte Artikel
  • Aktuelle Kommentare
  • Verwandte oder Populäre Artikel
  • Kommentarformular
  • Navigationselemente
  • Statistiken, Metainformationen, Loginmasken
  • Werbung, Banner und Buttons
  • Bildergalerien

Wenn man diese kleinen Tipps beachtet, kann eigentlich nicht viel schief gehen. Hier ein direkter Vergleich - links das Layout des Blogs und rechts die mit CSS veränderte Druckfunktion (zum Vergrößern klicken):

Wird die Druckfunktion ein Teil der neuen Blogkultur?
Eine schwierige Frage. Zum Spaß habe ich mir die aktuellen Top 20 der Deutschen Blogcharts genauer betrachtet. Es fällt ganz eindeutig auf, dass nahezu kein Blog mit einer sauberen Druckfunktion ausgestattet ist. Der schnelle Test mit der integrierten Druckfunktion des Browsers ergab folgendes Bild: Basic Thinking, Nerdcore, Spreeblick, netzpolitik, Stefan Niggemeier, lawblog, re:publica08, Software Guide, GoogleWatchBlog, Werbeblogger, fscklog, WordPress Deutschland, Indiskretion Ehrensache, medienlese, Blogbar, 1x umrühren bitte, Dr. Web Weblog - keines dieser Blogs hat eine saubere Druckfunktion. Ausschließlich das Bildblog und bueltge.de gehen mit gutem Beispiel voran und haben ein sauberes Ergebnis geliefert. Deutsche-Startups nutzt eine zusätzliche Seite, um das Ausdrucken von Artikeln zu ermöglichen.

Fazit
Drucken ist out? Nein, drucken ist in - nur nicht immer auf Papier. Ich hoffe, dass dieser etwas längere Artikel viele andere Blogger zum Nachdenken und zum Handeln anregt. Auch wenn wir das Web 2.0 bis zum “Geht-Nicht-Mehr” zelebrieren, sind viele Nutzer dort draußen immer noch so abgekühlt und drucken die Inhalte aus - auf Papier oder als PDF. Wie schaut es bei euch aus? Nutzt ihr eine Print-Version von eurem CSS oder bietet ihr eine entsprechende Druckseite an? :)

Kategorien: Blogkultur, Public Relations
16 Kommentare

Warum Calibri nur für Windowskisten gut ist…

Ich gebe es zu - ich habe mich in die Cleatype-Variante von Calibri ein wenig verschossen. Die Schrift sieht einfach auf Windows-Oberflächen wunderbar aus. Besser als Arial, besser als Verdana, besser als sonstige bisherigen Erzeugnisse der Micosoft-Betriebssysteme und Office-Pakete. Ich bitte meinen leichten Anflug von Blasphemie zu entschuldigen, aber trotz einiger Kritik zum Relaunch von Telagon Sichelputzer bleibt die Schriftart als Schriftstandard im CSS-Stylesheet von diesem Blog bestehen.

Wer sich Sorgen wegen Augenkrebs macht, darf gerne in dem kleinen Eintrag herausfinden, wie man Cleartype im Windows-System aktiviert und die kantigen Darstellungen der Schriften auf in lesbare Passagen verwandelt. Ein wenig Spaß muss es schon geben - daher kann ich kurzerhand nicht auf Mac bzw. Linux&Co. Rücksicht nehmen - da hat Calibri ja auch nichts verloren, oder?

Kategorien: Blogkultur, Design
4 Kommentare

Blog Relaunch: Endlich der erste Schritt

Feedleser aufgepasst - jetzt sollte man hier klicken! Das ist es - das neue Layout nach einer grundlegenden Bereinigung des Quellcodes vom WordPress-Theme. Gleich eine Frage an meine Leser: Wie findet ihr das neue Theme in der live-geschalteten Variante?

Ich brauchte sehr dringend etwas Veränderung. Nein, dies ist keine Veränderung im Sinne eines Abschieds der zwischenmenschlichen Kommunikation. Die Umgebung des täglichen (ahem…) Schreibens als Selbstreflektion des berüchtigten Seelenstriptease mit Coming-Out - also dem täglichen Bloggen - musste verändert werden. Daher entschied ich mich alles neu zu gestalten. Die alten Inhalte bleiben bestehen und ich verspreche auch ein wenig mehr Schreibaktivität. Das bin ich mir selbst und meinen Lesern schuldig. So sei es - ihr seht das neue Blog Layout mit viel Schweiß und Einsatz über die vergangenen Tage in kleiner mühevoller Fleißarbeit nach dem Arbeitsalltag und dem Familienleben erstellt.

Natürlich werden einige Dinge noch nachträglich ergänzt - hier ein kleiner Vorgeschmack:

  • Ich muss die Magazin-Funktion implementieren - leider habe ich es nicht geschafft, das die Magazin-Funktion reibungslos umzusetzen. Als sich die Fehler- und Logikprobleme häuften, habe ich es kurzerhand abgestellt. Dann lieber mit dem Layout in der altbewährten Form starten, als dass man sich quälen muss.
  • Finetuning im CSS muss noch erfolgen, da auf dem MS IE 5 ein weißer Querbalken zwischen den Header und Content Boxen liegt. Eine ganz üble Sache, aber wer außer mir hat den MS IE 5 eigentlich noch - mit Ausnahme zu Testzwecken?
  • Für ein wenig Abwechslung im Header sorgt noch ein regelmäßig aktualisiertes Foto. Die dafür erforderliche Funktion habe ich schlichtweg weggelassen. Den Rest im Sinne einer Aktualisierung im Header erledigt die selbstgebastelte Twitter-Integration - sogar mit Cache und Timeout.
  • Eventuell wird in der Sidebar etwas mehr auf Farben gesetzt, anstatt monotone Inhalte in Weiß bzw. Dunkelgrau anzubieten.
  • Eine “Print”-Funktion wird mit einem eigenen CSS-Stylesheet ebenfalls nachgelegt. Mich hat es immer wieder gestört, dass Blogs eine “unter aller Sau” Druckfunktion bzw. Druckfähigkeit besitzen. Es geht dabei eher weniger um die Konvertierung der digitalen Daten auf old-school Papier, sondern das Erstellen von PDFs über die Druckfunktion.
  • Das Theme soll in einer abgespeckten Variante zum Download angeboten werden - insbesondere wird hier nicht die Werbung von mir als Platzhalter gegen die Langeweile eingeblendet, sondern auf Widgets für die Sidebar gesetzt - wer Widgets mag, soll damit seinen Spaß haben - ich persönlich bin Hardcoder und verzichte auf vorgefertigte Widget-Lösungen, aber dahin geht ja bekanntlich der Trend.
  • Optional werde ich das Blog mit einer Flickr-Integration erweitern. Vor knapp zwei bis drei Jahren hatte ich meinen Flickr-Account mit einem Gallerieplugin für WordPress eingebunden, jedoch hatte ich mit dem damaligen “freien” Benutzerkonto nie richtig Spaß gehabt. Jetzt habe ich mir einen Pro-Account geholt und diesen mit alten Fotos bestückt… weiteres folgt.
  • Für informationsgeile Zeitgenossen kommt auch ein lustiger Pressebereich - über mich, über mich, über mich - eine sehr spezielle Informationsseite rund um das, was man nicht bereits vom hauseigenen XING-Profil kennt.
  • Die Kategorien müssen noch bereinigt werden. Alte, irrelevante, überflüssige, redundante, absolut hinfällige Bezeichnungen sind die Überbleibsel aus knapp fünf Jahren bloggen! Oben sieht man bereits, dass ich auf “Blogkultur, Marketing, Medien, Public Relations, Web 2.0″ setze. Einige kleine Kategorien wie das “Familienleben” werde ich immer wieder einsetzen, aber “E Commerce” oder “Gametime”? Das ist hier überhaupt nicht das Thema mehr!

So das war’s. Ab in die Heia und viel Schlafen. Ich freue mich auf euer Feedback! Ich hoffe, dass das Blog mit allen Funktionen nahezu einwandfrei dargestellt wird. Ich muss nur bei Twitter darauf achten, nicht zu lange Wortkonstruktionen zu schreiben, die das Layout hier im Blog sprengen können… :)

Kategorien: Blogkultur, Design, Microblogging, Social Media
13 Kommentare

SafariTest

Aufgrund der jüngsten Probleme mit der Darstellung unserer Webseite mussten wir reagieren. Einige unserer Leser nutzen den Safari Browser auf dem Apple Macintosh, und das ist ein weiterer Grund für uns, auch ein wenig kompatibler zu sein.

Mit dem online verfügbaren Tool von Snugtech kann jeder PC Nutzer es auf recht unkomplizierte Art ausprobieren, wie das Layout einer Seite im Safari ausschaut: Bei SafariTest gibt man einfach die URL ein, wählt aus den vorgegebenen Maßen die maximale Breite für den Test aus, sucht sich noch aus, in welchem Format der Screenshot geliefert werden soll und bestätigt den Prozess mit einem weiteren Klick.

Meiner Meinung nach ist es sehr hilfreich und wird wohl für die Zukunft ein kleiner Bestandteil meiner Webdesigner-Tätigkeit sein, sofern ich keinen Mac in die Hände bekommen kann! ;)

Kategorien: Design, Web
Kommentare geschlossen.

Kurzfristige Wartungsarbeiten (Nachtrag)

Im Moment könnte es zu drastischen Störungen bei der Darstellung unseres Blogs kommen. Ich bastel gerade am Layout, da irgendwas mit Safari nicht richtig angezeigt wird. Blöde CSS Sachen… ganz blöde!

Nachtrag: An alle Safari Nutzer: Ist es jetzt besser als vorher?

Kategorien: Sammelsurium
3 Kommentare

CSS Reboot

Am ersten Mai ist es wieder soweit: Deutschland hat frei, und vielleicht auch ein wenig Zeit für ein neues Layout! Der CSS Reboot für das Frühjahr 2006 steht an, und so manche Webseiten und Weblogs könnten auch den Frühling in ihr Layout reinlassen. Für uns beim Telagon Sichelputzer ist das Thema natürlich recht uninteressant, denn wir selbst waren ja schon Ende März früh dabei, als wir vom alten Layout in das jetzige wechselten. Doch vielleicht bietet das längere Wochenende für so einige liebe Webmaster die Gelegenheit schlechthin, endlich den CSS Code und natürlich das ganze Layout ein wenig aufzufrischen, anzupassen… aufzumotzen! Und wer weiß - wenn man sich in die tolle lange Liste einträgt, gibt es vielleicht auch netten Traffic von neugierigen Besuchern?

Kategorien: Blogkultur, Design
Kommentare geschlossen.