Tags Archiv für 'Add-On'

Screenshots von Webseiten mit Chrome erstellen

Ich habe schon eine Weile keine Erweiterung für Chrome mehr vorgestellt. Das muss ich mal wieder des Öfteren machen, denn mittlerweile gibt es wirklich viele sehr gute Erweiterungen für Google Chrome.

Awesome-Screenshot Menü in Google ChromeHeute fange ich mal mit der Erweiterung Awesome Screenshot: Capture & Annotate an, mit der man in Google Chrome auf Knopfdruck Screenshots von Webseiten erstellen kann.

Anders als zum Beispiel mit der Druck-Taste kann mit Awesome Screenshot auch der Bereich der Webseite erfasst werden, der nicht auf dem Bildschirm zu sehen ist. Dabei wird die Webseite in mehreren Abschnitten erfasst und am Ende zu einem nahtlosen Bild zusammengefügt.

awesome-screenshot-chromeDas ist aber noch nicht alles. Nach dem Erstellen des Screenshots stehen noch einige Grundfunktionen zur Bearbeitung des Bildes direkt im Browser zur Verfügung. Unter anderem kann man Bereiche mit Kreisen oder Pfeilen markieren, einen Text hinzufügen, bestimmte Bereiche unkenntlich  machen oder das Bild beschneiden. Eigentlich alles, was man benötigt. :-)

Anstatt das Bild auf dem eigenen Rechner zu speichern, hat man auch die Möglichkeit, den Screenshot direkt bei einem Imagehoster hochzuladen. Den Link kann man anschließend über Twitter, Facebook und Google Buzz sharen. Die Option, das Bild per Email zu versenden, wird ebenfalls angeboten.

Alternativen? Gibt’s auch, zuvor habe ich Webpage Screenshot getestet. Macht auch Screenshots, allerdings ohne Nachbearbeitung oder Social Sharing-Funktionen.

Shareaholic für Google Chrome

openshareicon-64x64Trotz der vielen Artikel über Google Chrome habe ich heute mit Erschrecken festgestellt, dass ich noch kein Wort über meine Lieblingserweiterung geschrieben habe: Shareaholic. Ein Umstand, den ich hiermit korrigieren will. :-)

Was ist Shareaholic? Shareaholic vereint viele Erweiterungen in einer Einzigen. Grundsätzlich kann man sagen, Shareaholic dient dazu, eine interessante Webseite auf verschiedenen Arten mit anderen zu teilen.

Ein paar Beispiele:

  • Um einen Link über Twitter zu teilen, kann man TweetMeme verwenden, oder Shareaholic
  • Um einen Link über Facebook zu teilen, kann man Facebook Share verwenden, oder Shareaholic
  • Um einen Link per Email zu versenden, kann man Email this page verwenden, oder Shareaholic
  • Um einen Link mit bit.ly zu kürzen, kann man bit.ly verwenden, oder Shareaholic
  • Um eine Webseite bei Read it later zu speichern, kann man Postponer Adder verwenden, oder Shareaholic
  • Um eine Notiz zu einer Webseite zu verfassen, kann man Evernote verwenden, oder – ihr wisst schon ;-)

shareaholicDiese Liste könnte ich noch um einiges erweitern, aber ich denke, man erkennt das unglaubliche Potential von Shareaholic. Also statt für jeden Social Bookmarking oder Social Sharing Dienst eine eigene Erweiterung zu installieren, nimmt man Shareaholic und hat einen zentralen Zugriff. Von der besseren Übersicht mal ganz zu schweigen. Insgesamt funktioniert Shareaholic grob überschlagen mit über 120 Diensten. Keine Panik, natürlich kann die Liste der benötigten Dienste individuell und komfortabel konfigurieren werden.

Die Erweiterung Shareaholic gibt es auch für die Browser Firefox, Opera, Safari und den Internet Explorer. Ruft einfach die Shareaholic Homepage auf, dann wird euch schon die richtige Erweiterung passend zum Browser vorgeschlagen.

Viel Spaß beim sharen! :-)

Google Suchergebnisse in mehreren Spalten anzeigen

Die Suchergebnisse von Google sind immer schön untereinander in einer Spalte angeordnet. Mit dem Greasemonkey User-Script Multi-Column View of Google Search Results kann man das Layout von Google ändern und die Suchergebnisse werden in bis zu drei Spalten nebeneinander angezeigt. Damit nutzt man den Bildschirm viel besser aus und man hat ohne scrollen zu müssen mehr Suchergebnisse im Blickfeld. Eine ideale Erweiterung, wenn man an großen Bildschirmen arbeitet.

Mit dem Tastatur-Shortcut ALT+1/2/3 kann die Anzahl der Spalten festlegt werden. Das Greasemonkey-Script funktioniert in Google Chrome und in Firefox (mit Greasmonkey-Addon).

(via)

Gekürzte Feeds in Full-Feed umwandeln mit Read More! für Google Reader

read-more-logoNatürlich habe ich die kürzlich wieder mal aufgekommene Diskussion über den Sinn und Unsinn von gekürzten Feeds mitbekommen. Jeder Webmaster sollte seine Leser mit dem Feed versorgen, den er für richtig hält. Und jeder Leser sollte die Feeds lesen, die er für wichtig hält. Wir leben in einem freien Gesellschaft. So einfach sehe ich die Sache. Über das Thema wurde auch genug in diversen Blogs geschrieben und kontrovers diskutiert. Diese Erweiterung könnte aber zur Achillesferse derjenigen werden, die ausschließlich einen gekürzten Feed anbieten.

Denn mit der Erweiterung Read More! für Google Reader ist man als Feed-Abonnement in der Lage, einen gekürzten Feed in voller Länge im Google Reader lesen zu können. Zur Zeit zumindest als Benutzer von Google Chrome. Aber die Erweiterung basiert auf einem Greasmonkey-Script und da Greasemonkey-Scripte grundsätzlich auch in Firefox funktionieren, könnt ihr es gerne mal versuchen. Das Original-Script nennt sich Google Reader full feed changer. [UPDATE: siehe Zusatz am Ende des Artikels!]

Ich habe die Erweiterung mit dem gekürzten Feed von heise.de und BasicThinking getestet – und es funktioniert!

Man muss die Erweiterung nur mit zwei notwendigen Informationen füttern: die URL des Feeds und der CSS-Selektor des Contents. Die Erweiterung erkennt dann innerhalb des Google Readers den gekürzten Feed und lädt automatisch den “fehlenden” Content direkt von der Webseite, von der der Feed ausgeht.

Die Konfiguration ist aber nicht so easy, wie sich das vielleicht anhört. Die URL und die CSS-Angabe muss als regulärer Ausdruck angegeben werden. Copy & Paste ist also Fehlanzeige. Um mal ein Beispiel zu zeigen, wie ihr das Add-On konfiguriert (nehmen wir mal den Feed von heise.de):

Alle Artikel von heise.de erscheinen unter der URL http://www.heise.de/newsticker/meldung/Artikeltitel

Die URL als regulärer Ausdruck lautet http://www\.heise\.de\/newsticker\/meldung

Schaut man in den Quelltext, sieht man, dass der Content nach dem CSS-Selektor <div class=”meldung_wrapper”> folgt.

Für das Add-On verständlich übersetzt lautet der Ausdruck div[class="meldung_wrapper"]. (Statt CSS kann man auch einen XPATH definieren).

Klick auf Apply – OK und ladet dann den Google Reader neu. Voilà, die Meldungen von heise.de werden komplett angezeigt.

Pics or it didn’t happen! Ok, hier zwei Screenshots von heise.de und BasicThinking:

read-more-chrome-heiseread-more-chrome-basic-thinking

Noch ein Hinweis: Das soll jetzt nicht überheblich klingen, aber ich werde hier keine Anfragen beantworten à la “Wie funktioniert das ganze mit dem Feed von Seite XY”. Wenn ihr schon daran scheitert, im Quelltext nach dem richtigen CSS-Selektor zu suchen, dann ist dieses Add-On nichts für euch. Möglicherweise wird das Add-On zu einem späteren Zeitpunkt einfacher zu konfigurieren sein. Also, hier gibt es keinen Support für Read More! Schaut euch die Beispiele an und versucht das Prinzip zu erkennen. Und außerdem ist Google euer Freund. :-)

[Update 22.03.10: Mit dem Greasemonkey-Script funktioniert es auch in Mozilla Firefox. Ihr benötigt dazu das Firefox Add-On Greasemonkey und das Script Google Reader full feed changer. Viel Spaß!]

Google Chrome: SmoothScroll lässt Webseiten schöner scrollen

smoothscroll-chromeEin Traum, diese Erweiterung: SmoothScroll für Google Chrome lässt Webseiten beim Scrollen nicht zeilenweise springen, sondern lässt sie sanft dahingleiten. :-)

Die Geschwindigkeit kann ganz auf den persönlichen Geschmack angepasst werden und funktioniert sowohl mit dem Scrollrad als auch bei Steuerung mit der Tastatur.

Schon für Firefox eine Pflichterweiterung.

AdBlock für Google Chrome: Filter optimieren

adblock-logoIch habe in den vergangenen Tagen einige Werbeblocker für Google Chrome getestet und bin zum gleichen Ergebnis gekommen wie Jeffrey und Nils:

Der zur Zeit beste Werbeblocker für Google Chrome ist AdBlock.

AdBlock bietet wie sein Pendant bei Firefox abonnierbare Filterlisten, selbst definierbare Filter und eine Whitelist.

Die fertigen Filterlisten hauen schon einiges raus, hinterlassen aber teilweise einfach nur leere Stellen im Textfluß, dort wo die Werbung blockiert wurde. Das sieht nicht schön aus und wurde auch zurecht von Nils bemängelt.

Aber man kann mit einem eigenen Filter die Leistung von AdBlock optimieren und sogar solche leeren Stellen verschwinden lassen, so dass der normale Content nicht davon unterbrochen wird.

Bleiben wir der Einfachheit halber doch bei der Seite, die auch Nils als “Testkaninchen” ausgesucht hat.

Ohne AdBlock sieht die Webseite so aus:

adblock-test-1

Mit aktiviertem AdBlock und den Standard-Filtern Chrome AdBlock custom filters, EeayList und dem zusätzlichen deutschen Filter sieht sie so aus:

adblock-test-2

Der Anzeigenblock von Adsense ist verschwunden, an seiner Stelle erscheint ein großes, weißes Nichts.

Mit einem selbst definierten Filter sieht die Seite so aus:

adblock-test-3

Wie ihr seht, ist der leere Bereich, an dem sich ursprünglich der AdSense-Block befand, nun auch verschwunden und der Text beginnt unmittelbar unter der Überschrift. (Diese “100% Free”-Anzeige habe ich nicht berücksichtigt, weil es mir darum nicht ging. Grundsätzlich kann man diese Anzeige aber auch problemlos manuell filtern.)

adblock-wizard-1Was habe ich gemacht? Mit dem Tastaturbefehl SHIFT-ALT-K könnt ihr einen Assistenten starten, der beim Optimieren behilflich ist.

Klickt dann auf den Bereich oder die Werbung, die der normale Filter nicht berücksichtigt hat und den ihr ausblenden wollt.

adblock-wizard-2Ihr könnt nun mit einem Schieberegler quasi CSS-Selektor nach CSS-Selektor erfassen und ausblenden. Wenn ihr den Regler ganz nach rechts bewegt, wird zum Beispiel die komplette Seite blockiert. Also bewegt den Regler nur soweit nach rechts, bis der gewünschte Block verschwindet. Bestätigt und speichert den Filter anschließend. Beim nächsten Seitenaufruf wird dieser Bereich dann automatisch ausgeblendet.

adblock-wizard-3Sollte etwas schief gelaufen sein und zu viel ausgeblendet oder die Webseite falsch dargestellt werden, keine Panik. Öffnet die Optionen von AdBlock und löscht den entsprechenden Filter. Jeder Filter ist nur einer Domain zugeordnet, der falsche Filter ist also leicht zu finden.

Eins möchte ich euch noch mit auf den Weg geben: Wenn ihr euch für den Einsatz eines Werbeblockers entscheidet, dann denkt immer daran, dass viele Webseiten auf Werbung angewiesen sind und sich von den Einnahmen finanzieren. Im Gegenzug erhaltet ihr dafür in der Regel kostenlosen Content geliefert.

Also das Pflegen und Optimieren eines Werbeblockers sollte sich nicht nur auf die Filterliste beschränken, sondern sollte auch für die Whitelist gelten. Am schnellsten geht das übrigens mit SHIFT-ALT-L. :-)