kulturbanause blog » Google

Google+ Profilbild in die Google-Suchergebnisse integrieren

Jonas Hellwig — Mon, 15 Aug 2011 06:25:10 +0000

Seit Google+ ins Leben gerufen wurde, integriert Google das Projekt nach und nach in alle bestehenden Dienste. Eine der neuen Integrationsmöglichkeiten ist die Verknüpfung eines Blogs (oder einer Website) sowie eines oder mehrerer Google+ Profile mit der Ergebnisliste von Google. Wenn alles richtig eingestellt wurde, erscheint in der Google-Suche das Profilbild des Autors neben dem entsprechenden Treffer in den Suchergebnissen. Das sieht dann so aus.

Google setzt auf Parameter zur Identifikation

Das Prinzip ist im Grunde genommen sehr einfach. Zunächst müsst ihr von eurer Website oder eurem Blog einen Link auf euer Google+ Profil setzen. Dieser Link wird dann einem Parameter (?rel=author) angereichert um die Beziehung zwischen Website und Google+ zu übertragen. Der entsprechende Link ist dann wie folgt aufgebaut:

Google+

Ein funktionierendes Beispiel für mein Profil sieht so aus:

Google+

Wichtig! Der Link-Text muss unbedingt mit + beginnen oder aufhören! Ein praktisches Tool zur Erzeugung eines Links inkl. G+-Logo bietet Google natürlich auch: google.com/webmasters/profilebutton

Inhalte testen und verifizieren

Sobald ihr die Verlinkung hinzugefügt und hochgeladen habt, solltet ihr einmal testen ob auch alles korrekt eingestellt wurde. Zu diesem Zweck hat Google eine entsprechendes Rich-Snippet-Testing-Tool ins Leben gerufen:

Rich-Snippet-Testing-Tool

Rich Snippet Testing Tool von Google

Wenn das Tool keine Fehler angezeigt, müsst ihr nun eine Verlinkungen von eurem Google+ Profil zu eurer Website bzw. zu einzelnen Beiträgen setzen. Das funktioniert innerhalb von Google+ über "Profil bearbeiten → Links". Damit verifiziert ihr den Content und euer Profil gegenüber Google.

Achtet zudem darauf, dass euer Profilbild ein Foto eurer Person zeigt. Ansonsten wird Google die Integration womöglich verweigern.

Your profile picture must be a photograph of yourself and of high quality in order to be eligible for be shown as a thumbnail in search results.

Als letztes müsst ihr dieses Formular ausfüllen und somit den entsprechenden Antrag bei Google stellen:

Authorship request

Das war's auch schon. Jetzt heißt es abwarten und hoffen, dass Google die Seite in die Suchergebnisse integriert. Ich hatte bisher keinen Erfolg - was aber auch an der Wahl meines Profilbildes oder am Standort Deutschland liegen kann. Wie gewohnt wird Google die Funktion vorerst nur in den USA testen und anschließend ausweiten. Ich werde die Sache auf jeden Fall im Auge behalten.

WordPress-Theme erweitern

Wenn ihr WordPress benutzt und vielleicht sogar mit mehreren Autoren an der Seite arbeitet, müsst ihr das Theme -bzw. die Benutzterprofile innerhalb des WordPress-Backends entsprechend modifizieren.
Es sollte jeder Autor die Möglichkeit haben innerhalb des eigenen Profils den Link zum Google-Profil anzugeben. Dafür muss das Profil erweitert werden. Wie das funktioniert habe ich bereits in einem anderen Artikel ausführlich erklärt:

WordPress-Benutzerprofil um Google+, Facebook, Twitter und andere Felder erweitern

Alternative Methode mit Microformaten

Die oben gezeigte Variante ist die neuere Möglichkeit Google+ in die Suchergebnisse zu integrieren. Eine alternative - jedoch überholte - Methode ist die Integration des rel="author"-Attributs in den Link. Wenn ihr diese Struktur bereits verwendet habt, so braucht ihr euch keine Sorgen zu machen. Laut Google wird auch dieses Format nach wie vor unterstützt.
Mehr Infos dazu findet ihr hier: google.com/support/webmasters/bin/answer.py?answer=1229920

Video

Google hat auch ein ausführliches Video zu diesem Thema veröffentlicht. Besonders schnell zur Sache kommen die Herren allerdings nicht.

Ausführliche Informationen zu diesem Thema findet ihr auch hier:

google.com/support/webmasters/bin/answer.py?answer=1408986

Jetzt bist Du gefragt

Gefällt Dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.

Google +1-Button lädt jetzt auch asynchron (= schneller)

Jonas Hellwig — Sat, 30 Jul 2011 22:47:16 +0000

Google hat ein Update des +1-Buttons bereitgestellt. In den erweiterten Optionen kann nun festgelegt werden, dass die Scripte des Buttons asynchron geladen werden. Diese Option führt dazu, dass der Google-Button schneller geladen wird und nicht wie bisher den Seitenaufbau spürbar ausbremst.

Ich habe meinen früheren Artikel zur Integration des Buttons entsprechend angepasst. Solltet ihr das Snippet verwenden, so prüft bitte euren Code.

Google veröffentlicht “+1 Buttons” (PlusOne) für Websites

Jetzt bist Du gefragt

Gefällt Dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.

Datenschutz-Hinweis beim Einsatz des Google+ Buttons

Jonas Hellwig — Wed, 06 Jul 2011 21:56:35 +0000

Vor Kurzem habe ich über die Einführung des Google+ Buttons geschrieben, mit welchem - ähnlich dem Facebook Like-Button - Website-Inhalte bewertet und empfohlen werden können. In den Kommentaren kam damals die Frage nach einer Datenschutzerweiterung des Impressums auf. Immerhin wird für den Facebook-Button auch ein Datenschutz-Hinweis benötigt. Auf spreerecht.de wurde nun eine Vorlage veröffentlicht.

Der Artikel behandelt das generelle Problem und stellt auch einen Vergleich zur Rechtslage des Like-Buttons her. Sobald Änderungen am Datenschutz-Hinweis vorgenommen werden, wird der Artikel natürlich angepasst. Ihr findet den Muster-Datenschutz-Hinweis unter:

Das rechtliche Risiko bei Googles +1 Button inkl. Muster für die Datenschutzerklärung

Jetzt bist Du gefragt

Gefällt Dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.

Google+ Vanity-URLs und Trends

Jonas Hellwig — Wed, 06 Jul 2011 07:45:03 +0000

Facebook bietet die Möglichkeit für eine Fanpage oder ein privates Profil eine so genannte Vanity-URL einzurichten. Aus einer unübersichtlichen und für Suchmaschinen nicht sonderlich wertvollen URL wie facebook.com/profile.php?id=123456789101112 wird dadurch eine brauchbarere Adresse wie facebook.com/kulturbanause.de.
Bei Google+ existiert diese Möglichkeit im Moment leider noch nicht. Wollt ihr einen Link zu eurem Google+ Profil veröffentlichen, so müsst ihr die komplette Benutzer-ID ausschreiben: https://plus.google.com/u/0/106537592401126010838.

Auch wenn Google+ erst ein paar Tage alt ist, so zeichnen sich bereits zwei Trends ab, die dieses Problem lösen.

Vanity-URL über einen externen URL-Shortener (Drittanbieter)

Ein erster Trend der sich bereits abzeichnet, ist die Nutzung eines URL-Shorteners. Natürlich könnte man dafür Googles hauseigenen Dienst goo.gl nutzen, aber auch hier entstehen optisch unschöne Adressen. Ein Drittanbieter hat dieses Problem schnell erkannt und ist mit dem Dienst gplus.to an den Start gegangen. Hier kann ein Benutzername festgelegt werden, der anschließend nach folgendem System in die Adresse integriert wird: gplus.to/nickname

Die neue URL für mein Profil sieht demnach so aus: gplus.to/kulturbanause

gplus.to

Google+ Profile über ../+ verlinken

Ein weiterer Trend ist die Verlinkung des Google+ Profils über die eigene Webadresse. Hierbei wird der Standard-URL ein /+ angehängt und diese Adresse anschließend über einen 301-Redirect auf das Google+ Profil umgeleitet. Ihr findet mein Google-Profil also über kulturbanause.de/+.

Wenn ihr ein Profil auf diese Art verlinken möchtet, so genügt es folgenden Code in die .htaccess-Datei eurer Website einzufügen. Denkt daran die ID des Beispiels durch eure eigene Benutzer-ID zu ersetzen.

redirect 301 /+ https://plus.google.com/u/0/106537592401126010838

Der Große Vorteil dieser Vorgehensweise ist, dass man nicht den Nickname des Benutzers kennen muss. Man tipp einfach /+ hinter die Adresse einer Website oder eines Blogs und kann so erfahren wer hinter der Seite steht.
Eine umfangreiche Liste an Websites die dieses System bereits einsetzen findet ihr auf eisy.eu/trend-google-plus-profile-als-verlinken.

Jetzt bist Du gefragt

Gefällt Dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.

Feed-Inhalte automatisch an Twitter, Facebook, Tumblr & Co. senden – Dlvr.it

Jonas Hellwig — Thu, 23 Jun 2011 05:45:11 +0000

Die Arbeit im Social Web frisst eine Menge Zeit. Blog-Beiträge schreiben, Facebook-Fans verwalten, Tweets veröffentlichen, Artikel weiterempfehlen, auf Kommentare, Likes, Retweets sowie direkte Nachrichten reagieren und alles bitte zügig, aber regelmäßig.
Wer nicht auf eine Social Media Abteilung zurück greifen kann und sich parallel um sein Hauptgeschäft kümmern muss, läuft Gefahr früher oder später die Anforderungen nicht mehr leisten zu können.
Zum Glück lassen sich viele Arbeitsabläufe automatisieren. Mit Chancen und Risiken.

Was ist Dlvr.it?

Der Online-Dienst Dlvr.it nutzt die Inhalte eines oder mehrerer RSS-Feeds und füttert mit diesen Information weitere Portale wie Facebook, Twitter, Google Buzz oder Tumblr. Wenn ihr also beispielsweise einen WordPress-Blog führt, so könnt ihr den dort angebotenen Feed nutzen, um sowohl auf Facebook, als auch auf Twitter Statusnachrichten zu euren neusten Blog-Posts zu veröffentlichen. Das spart auf der einen Seite zwar massig Zeit, kann sich allerdings negativ auf die Qualität und vor allem die Individualität der Social Media Inhalte auswirken.

Ihr könnt unzählige Feed-Quellen an unzählige Dienste senden und somit einen Großteil eurer Arbeit automatisieren. Da auch die Inhalte einer Facebook-Fanpage als RSS-Feed angeboten werden, eröffnen sich hier sehr interessante Möglichkeiten der Verknüpfung. Man sollte bei all den zur Verfügung stehenden Optionen nur darauf achten, keinen Loop zu konstruieren, in welchem die Beiträge immer im Kreis geschickt werden.

Extrem detaillierte Einstellungsmöglichkeiten

Das interessante an Dlvr.it sind die sehr umfangreichen Einstellungsmöglichkeiten. Die Inhalte lassen sich mit eine Pre- oder Postfix versehen, können Hashtags enthalten oder bestimmte Wörter werden automatisch durch andere Wörter ersetzt.
Bei der Aufbereitung der Inhalte lässt Dlvr.it ebenfalls wenige Wünsche offen. Es kann sehr detailliert eingestellt werden, welche Feed-Informationen für Statusmitteilungen zur Verfügung stehen. Schlagworte können beispielsweise innerhalb des Tweets in Hashtags umgewandelt werden.

Auch bei der Facebook-Integration bietet Dlvr.it tolle Möglichkeiten. Welches Profil soll benutzt werden? Welches Bild? Soll der Beitrag als Notiz, Link-Tipp oder als Statusnachricht veröffentlicht werden? Oder möchtet ihr die Informationen lieber gleich in einer bestimmten Gruppe veröffentlichen?

Goo.gl als URL-Shortener nutzen

Dlvr.it bietet einen hauseigenen URL-Verkürzer an und veröffentlicht die Inhalte auch unter diesen URLs. Wenn ihr lieber einen anderen Dienst verwenden möchte, beispielsweise Goo.gl, so schaut euch mal folgenden Blog-Post von Dlvr.it an. Ich persönlich finde Goo.gl oder Bit.ly einfach etwas seriöser.

dlvr.it now serving goo.gl short links

Fazit

Ich muss zugeben, dass mich Dlvr.it auf ganzer Linie überzeugt hat. Die Anwendung funktioniert, ist übersichtlich und bietet umfangreiche Einstellungsmöglichkeiten.
Der größte Nachteil ist der fehlende individuelle Charakter der Statusmitteilungen. In wiefern Facebook-Fans und Follower so etwas abstrafen, kann wohl nur durch Ausprobieren herausgefunden werden. Am effektivsten könnte die gesunde Mischung aus individuellen und automatisch generierten Inhalten sein.

Dlvr.it

Jetzt bist Du gefragt

Gefällt Dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.

Google veröffentlicht “+1 Buttons” (PlusOne) für Websites

Jonas Hellwig — Thu, 02 Jun 2011 15:19:51 +0000

Vor einiger Zeit kündigte Google an, ein soziale Komponente in die Suchergebnisse einfließen zu lassen und so dem Like-Button von Facebook Konkurrenz zu machen. In der Trefferliste der Suchmaschine wird seitdem ein kleiner Zähler neben den Suchergebnissen angezeigt, der darüber Aufschluss gibt, wie viele Menschen die Website positiv bewertet haben. Um die Bewertungen zu sehen und auch selbst abgeben zu können, muss man über einen Google-Account verfügen. Darüber hinaus sei erwähnt, dass das Feature bislang nur in der englischen Version von Google zu sehen ist.

Nun macht das System wenig Sinn, wenn die Besucher nur in der Ergebnisliste von Google bewerten können. Wer sucht schon bei Google nach einem Thema, findet anschließend eine hilfreiche Seite und kehrt daraufhin noch einmal zur Ergebnisliste zurück um dort die Website zu bewerten?
Aus diesem Grund hat Google nun den "+1 Button" für Websites veröffentlicht. Per Code-Snippet lässt sich der Button problemlos in die eigene Website integrieren. Anschließend können Besucher die Inhalte auch dort empfehlen, wo sie gelesen werden.

Google bietet vier verschiedene "+1 Buttons"

Google stellt vier verschiedene Versionen, bzw. Größen des +1 Buttons zur Verfügung. Im nicht-geklickten Zustand sind die Buttons weiß. Nach der Bewertung blau.

Einfache Einbindung

Um den Button in der eigenen Website verwenden zu können, muss zunächst die JavaScript API von Google eingebunden werden. Bindet dazu folgenden Code entweder im head der Website, oder direkt vor dem schließenden /body-Tag ein. Das folgende Snippet bindet die deutsche Sprachversion ein.

Um den Button in der Website anzuzeigen, fügt ihr folgenden Code ein. Ich habe den Code für alle Größen untereinander geschrieben.

Live-Demo / Fazit

Wenn ihr sehen wollt, wie der Button im Live-Einsatz aussieht oder testen möchtet, wie er funktioniert, so findet ihr ihn ab sofort am Ende aller meiner Artikel. Ich bin noch nicht sicher, wie sich "+1" im Internet verbreiten wird. Ich selbst werde es auf jeden Fall effektiv nutzen, da ich über jede Facebook-Konkurrenz froh bin. Wie seht ihr das?

Offizielle Ressourcen

Google hat die Funktionen des Plus One (+1) Buttons bereits in einem Video ausführlich erklärt.

Die offiziellen Google-Quellen zu diesem Thema findet ihr hier:

Update: Google +1-Button für WordPress

Wenn ihr den +1-Button innerhalb von WordPress mithilfe eines Plugins einbinden möchtet, so schaut euch am besten folgendes Plugin an. Es funktioniert einwandfrei mit anderen "Share"-Plugins wie Twitter oder Facebook.

wordpress.org/extend/plugins/google-plus-one-google1

Update 2: Asynchrones Laden

Google hat eine Update des Buttons bereit gestellt. Der Button hat einige zusätzliche Optionen spendiert bekommen und lädt nun u.A. auf Wusch asynchron. Ein asynchrones Loading behindert den Seitenaufbau nicht und führt zu einem schnelleren sichtbaren Website-Aufbau. Da ich die Option für sinnvoll halte, habe ich das Code-Snippet entsprechend angepasst. Die Standard-Version des Buttons kann nach wie vor auf code.google.com/apis/+1button generiert werden.

Jetzt bist Du gefragt

Gefällt Dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.

WebP-Grafiken mit Photoshop-Plugin erstellen

Jonas Hellwig — Mon, 30 May 2011 04:30:07 +0000

"Let's make the web faster". Unter diesem Leitspruch entwickelt Google unzählige Tools, Programme und Techniken um sowohl für Entwickler als auch für Anwender die Arbeit mit dem Internet so angenehm wie möglich zu gestalten. Angefangen beim hauseigenen Browser Chrome, über die Relevanz der Website-Ladezeiten für die Suchmaschinen-Platzierung, bis hin zu Webfont-Bibliotheken: die Performance einer Website wird immer wichtiger. Vor einiger Zeit wurden die Entwickler von Google beauftragt, eine neue Dateikompression für Grafiken zu erarbeiten. Die neue Bilddatei sollte mindestens der Qualität von JPG entsprechen, jedoch deutlich kleinere Dateien erzeugen. Das Ergebnis dieser Entwicklung ist das neue Grafikformat WebP (gesprochen "Weppy"). Doch leider kennt Photoshop das Format noch nicht.

Vor- und Nachteile von WebP

Das WebP-Dateiformat erzeugt bei JPG-ähnlicher Qualität knapp 40% kleinere Dateien. Das ist natürlich einiges und könnte so manche Website deutlich beschleunigen bzw. den Server entlasten. Google demonstriert und vergleicht das neue Dateiformat in einer kleinen Galerie.

WebP-Gallery

Der größte Nachteil an WebP ist der spärliche Browser-Support. Aktuell unterstützen nur Google Chrome und Opera das Dateiformat. Um WebP effektiv in Websites einsetzen zu können, müssten jedoch alle großen Browserhersteller das Dateiformat unterstützen. Auch Photoshop unterstützt in der neusten Version nach wie vor kein WebP. Das ist mir persönlich unerklärlich, da vor kurzem erst Updates erschienen sind. Glücklicherweise kann die Funktion per Plugin nachinstalliert werden.

WebP für Photoshop nachrüsten

Zunächst müsst ihr das Download-Paket von telegraphics.com.au/sw/product/WebPFormat herunterladen. Das Plugin steht für die Photoshop-Versionen CS2, CS3, CS4 und CS5 zur Verfügung.

Öffnet die Photoshop-Installation auf eurer Festplatte und sucht dort den Ordner "Plug-ins". Innerhalb dieses Ordners erstellt ihr einen neuen Ordner namens "WebP" und kopiert die Plugin-Datei WebPFormat.plugin in diesen Ordner. Anschließend startet ihr Photoshop einmal neu.

WebP in Photoshop nutzen

Innerhalb von Photoshop steht euch nun unter "Speichern" WebP als zusätzliches Dateiformat zur Verfügung. Das Dateiformat wurde jedoch nicht in den "Für Web und Geräte speichern"-Dialog integriert.

Wenn ihr WebP als Dateiformat ausgewählt habt, so habt ihr im darauffolgenden Dialog die Möglichkeit einige Qualitäts-Einstellungen vorzunehmen. Ähnlich wie bei JPG könnt ihr hier die Qualität in Prozent festlegen. Darüber hinaus lässt sich eine Rauschreduzierung und Bildschärfung einstellen.

Jetzt bist Du gefragt

Gefällt Dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.

Google Search Globe

Jonas Hellwig — Mon, 09 May 2011 04:00:14 +0000

Das "Google Data Arts Team" hat ein neues Experiment online gestellt: den Google Search Globe. Dieses, sehr schön anzuschauende, Experiment stellt anhand eines interaktiven Globus, die weltweiten Google-Suchanfragen grafisch dar. Jede Sprache wird hierbei durch eine eigene Farbe repräsentiert.

Der Code für dieses tolle Produkt darf und soll übrigens gerne heruntergeladen und genutzt werden.

Wie der Search Globe funktioniert, könnt ihr hier live ausprobieren. Die besten visuellen Eindrücke bietet angeblich Chrome aber in einem anderen modernen Browser, wie Safari oder Firefox, wird es wohl auch funktionieren.

chromeexperiments.com

Jetzt bist Du gefragt

Gefällt Dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.

Chrome 11: neues Logo und angepasstes CSS3-Rendering

Jonas Hellwig — Thu, 28 Apr 2011 07:22:22 +0000

Google Chrome 11 ist erschienen. Neben einigen gefixten Bugs wurde auch die Hardware-Beschleunigung aktiviert. Somit kann der Browser u.a. direkt auf die Grafikkarte zugreifen, was die Performance moderner, komplexer Web-Anwendungen spürbar verbessert. Neben den technischen Änderungen wurde bei Chrome 11 auch das bereits angekündigte, neue Logo eingeführt. Das neue Programm-Icon ist eine reduzierte Version des bisherigen Chrome-Logos, was mir persönlich sehr gut gefällt.

Eine weitere Neuerung von Chrome 11 ist mir heute morgen beim Besuch meiner eigenen Seite aufgefallen: Offenbar hat Google einige CSS3-Rendering-Darstellungen verändert. Insbesondere die Eigenschaft box-shadow erzeugt jetzt deutlich dunklere Schatten. Zwar werden die Schatten jetzt in Chrome und Firefox gleich dargestellt - Safari zeigt jedoch andere Schatten. Das ist ärgerlich, da beide Browser auf die gleiche Weise angesprochen werden müssen. Ich hoffe sehr, dass Apple hier bald nachzieht.

Jetzt bist Du gefragt

Gefällt Dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.

Einführung in die Suchmaschinenoptimierung – Offizielles PDF von Google

Jonas Hellwig — Sun, 03 Apr 2011 23:01:34 +0000

Google hat die bereits seit einiger Zeit auf Englisch verfügbare "erweiterte Einführung in SEO" nun in zehn weitere Sprachen übersetzt. Unter anderem ist der circa 30 Seiten starke PDF-Leitfaden mit den wichtigsten Infos zum Thema SEO jetzt auch auf Deutsch verfügbar.
Das Dokument beschreibt sehr einfach verständlich alle Kernbereiche der Suchmaschinenoptimierung. Besonders interessant ist der nun neu hinzugefügte Teil zum Thema Mobiles SEO.

Behandelt werden folgende Themen: SEO-Grundlagen, Website-Struktur verbessern, Content optimieren, Umgang mit Crawlern, SEO für Mobilgeräte, Promotion und Analyse.

Suchmaschinenoptimierung (SEO)

GoogleBot-Grafik von Google

Jetzt bist Du gefragt

Gefällt Dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.

Google Page Speed Online

Jonas Hellwig — Fri, 01 Apr 2011 10:58:27 +0000

Google hat das hauseigene Tool "Page Speed" kräftig ausgebaut. Bisher war das Hilfmittel zur Bewertung der Website-Performance lediglich als Firefox-Extention verfügbar und konnte über die Google Webmaster Tools eingesehen werden. Jetzt steht das Plugin auch für Google Chrome zur Verfügung und - was ich persönlich noch viel besser finde - als Online-Version! Google Page Speed …

Diesen Beitrag zu Ende lesen

Jetzt bist Du gefragt

Gefällt Dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.

WebM-Videos im Internet Explorer 9 abspielen

Jonas Hellwig — Mon, 21 Mar 2011 10:45:58 +0000

Bei WebM handelt es sich um einen recht neuen Video-Standard der unter anderem von Google entwickelt wurde aber auch seitens Mozilla und Opera gestützt wird. Der Vorteil liegt laut Google in einer besseren Performance und einem angenehmeren Lizenzmodell. In den drei entsprechenden Browsern Chrome, Firefox und Opera können WebM Videos nativ abgespielt werden. Microsoft und Apple hingegen benötigen in den aktuellen Browserversionen (noch?) ein entsprechendes Plugin um WebM-Videos abspielen zu können. Für den erst kürzlich veröffentlichten Internet Explorer 9 hat Google nun das entsprechende Plugin veröffentlicht.

Jetzt bist Du gefragt

Gefällt Dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.

WordPress Shortlink über goo.gl im Artikel anzeigen

Jonas Hellwig — Mon, 07 Feb 2011 19:20:30 +0000

Innerhalb von WordPress gibt es die Möglichkeit einen sogenannten Shortlink auszugeben. Der Shortlink ist eine kurze URL zum Artikel und soll das Senden von Trackbacks und Links (z.B. über Twitter) erleichtern. Über eine Funktion kann der Shortlink im Theme angezeigt werden um Besuchern das Weiterempfehlen eines Artikels zu erleichtern. Normalerweise generiert der Shortcode innerhalb von WordPress allerdings nur die normale URL sowie die ID des aktuellen Beitrags. Praktischer ist es wenn man Googles URL-Kürzungs-Dienst goo.gl verwendet.

Shortlink anzeigen

Zunächst müssen wir den normalen Shortlink von WordPress in unseren Artikel integrieren. Öffnet die single.php (alternativ auch index.php oder ein anderes Template) und fügt an beliebiger Stelle folgendes Code-Snippet ein.


 Shortlink:

Es wird ein Input-Feld erstellt in welchem der Shortlink angezeigt wird. Per Klick wird der Inhalt markiert, so dass der Besucher den Link schneller kopieren kann.

Google URL-Shortener verwenden

Um nun Googles URL-Shortener goo.gl anstelle von WordPress zu verwenden fügt einfach folgenden Code in Eure functions.php ein.

// WordPress Shortlinks mit Goo.gl ersetzen

function googl_shortlink($url, $post_id) {
	global $post;
	if (!$post_id && $post) $post_id = $post->ID;

	if ($post->post_status != 'publish')
		return "";

	$shortlink = get_post_meta($post_id, '_googl_shortlink', true);
	if ($shortlink)
		return $shortlink;

	$permalink = get_permalink($post_id);

	$http = new WP_Http();
	$headers = array('Content-Type' => 'application/json');
	$result = $http->request('https://www.googleapis.com/urlshortener/v1/url', array( 'method' => 'POST', 'body' => '{"longUrl": "' . $permalink . '"}', 'headers' => $headers));
	$result = json_decode($result['body']);
	$shortlink = $result->id;

	if ($shortlink) {
		add_post_meta($post_id, '_googl_shortlink', $shortlink, true);
		return $shortlink;
	}
	else {
		return $url;
	}
}

add_filter('get_shortlink', 'googl_shortlink', 9, 2);

Der Shortlink von WordPress wird nun ersetzt und ab sofort wird innerhalb des Input-Feldes der Google-Link angezeigt.

Das Shortlink-Snippet stammt von Otto on WordPress; die goo.gl Umsetzung von Konstantin

Jetzt bist Du gefragt

Gefällt Dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.

Goo.gl – URL Shortener von Google

Jonas Hellwig — Fri, 01 Oct 2010 07:43:36 +0000

Mit goo.gl hat Google (endlich) den hauseigenen URL-Shortener veröffentlicht. Im Gegensatz zu vielen anderen Diensten bildet Google zu jeder URL auch recht umfangreiche Statistiken und Meta-Informationen ab. Über den Link "Details" können Zugriffszahlen etc. betrachtet werden.

goo.gl besuchen

Jetzt bist Du gefragt

Gefällt Dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.

Google Instant Search

Jonas Hellwig — Thu, 09 Sep 2010 06:57:26 +0000

Google hat ein neues Feature veröffentlicht - die Google Instant Suche. Für Nutzer mit einem Google-Konto werden die Suchergebnisse nun bereits live - also während des Eintippens der Keywords - ausgegeben. Anfangs ist die Funktion ein wenig gewöhnungsbedürftig, entpuppt sich aber schnell zu einem echten Must-have! Wer das neue Feature nicht mag kann die Funktion deaktivieren.

Im Zuge dieses Updates wurden soweit ich das beurteilen kann auch die Google Suggests (Keywordrelevante Vorschläge seitens Google) angepasst. Eine detaillierte Erforschung des neuen Features konnte ich bisher nicht vornehmen, allerdings beschäftigen sich erwartungsgemäß die üblichen Verdächtigen mit dem Thema.

Neben dem Google Watch Blog informiert natürlich auch der offizielle Google Blog und die eigens eingerichtete Produktseite von Google.

Was haltet Ihr von der neuen Suche? Seit Ihr begeistert vom neuen Feature oder habt Ihr das Tool sofort deaktiviert? Wie beurteilt Ihr die neuen Suggest und habt Ihr überhaupt ein Google-Konto?

Jetzt bist Du gefragt

Gefällt Dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.

Google Maps API – Strecken berechnen

Jonas Hellwig — Thu, 01 Jul 2010 08:03:02 +0000

Vor einiger Zeit habe ich in einem kleinen Tutorial erklärt wie man mehrere Standorte in einer Google Karte anzeigen lässt. Auf 1stWebdesigner findet sich nun ein sehr lesenswerter Artikel der beschreibt wie Ihr die Google Maps API nutzen könnt um die Strecke zwischen zwei zuvor festgelegten Punkten zu berechnen. Wer keine Lust hat alles zu lesen kann auch einfach direkt das Beispiel laden.

Google Maps API: Strecke zwischen zwei Punkten berechnen

Jetzt bist Du gefragt

Gefällt Dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.

Web-Fonts mit Google Font Directory API

Jonas Hellwig — Thu, 20 May 2010 16:03:54 +0000

Google hat einen neuen Online-Dienst namens Font-Directory Beta gestartet. Dieser Service ermöglicht es Webdesignern individuelle Schriftarten in Websites zu verwenden auch wenn diese nicht zu den wenigen systemübergreifenden Schriftarten gehören.
Schriften stellen im Internet leider nach wie vor ein echtes Problem in der Gestaltung dar. Der Grund liegt darin, dass eine Schriftart nur dann korrekt angezeigt wird sofern der Besucher den Font auch installiert hat. Ist dies nicht der Fall so wird eine alternative Schriftart geladen was zwangsläufig zu Fehldarstellungen führt.
Zwar bieten JavaScript- und Flash-basierte Lösungen wie Cufón oder sIFR eine passable Alternative aber Googles neue API verspricht über kurz oder lang ein echter Hit zu werden.
Ich habe das neue Tool einmal ausprobiert.

Google nutzt doch nur @font-face

Im Grude genommen funktioniert das Ganz so: Google bedient sich der CSS-Eigenschaft @font-face und bindet die Schriften auf die gleiche Weise ein wie man es bisher immer schon selbst im Stylesheet erledigen konnte.

@font-face {
  font-family: 'Reenie Beanie';
  font-style: normal;
  font-weight: normal;
  src: local('Reenie Beanie'), url('http://themes.googleusercontent.com/font?kit=ljpKc6CdXusL1cnGUSamX_cCQibwlboQP4eCflnqtq0') format('truetype');
}

Der Vorteil der Google Font Directory besteht darin, dass Google die Schrift zur Verfügung stellt und Ihr somit Bandbreite auf der eigenen Seite einspart. Darüber hinaus sind die Google Systeme natürlich rasend schnell und quasi immer erreichbar.
Als letztes sollte erwähnt werden, dass eine geringe Wahrscheinlichkeit besteht, dass die aufgerufene Schriftart bereits beim User im Cache vorhanden ist. Ist dies der Fall wirkt es sich natürlich ebenfalls positiv auf die Ladezeiten aus. Im Gegenzug wird allerdings ein HTTP-Request mehr verursacht.

Wie funktioniert es?

Eine Schriftart mittels der neuen Google Font API in die eigene Seite einzubinden geht kinderleicht. Zunächst fügt im head der Seite die entsprechende API ein. Die mit XXXXX markierte Passage muss später durch den Namen der Schriftart ersetzt werden.

Anschließend erweitert Ihr Eure CSS-Datei lediglich um einige Zeilen Code um die soeben per API eingebettete Schrift einem Selektor zuzuweisen.

body {
  font-family: "XXXXX", serif;
  font-size: 28pt;
  font-style: normal;
  font-weight: 400;
  text-shadow: none;
  text-decoration: none;
  text-transform: none;
  letter-spacing: 0;
  word-spacing: 0;
  line-height: 1;
}

Beispiel

Das folgende Beispiel soll einmal zeigen wie einfach alles funtktioniert. Kopiert lediglich den nachfolgenden Code in ein leeres HTML-Dokument oder schaut Euch das Beispiel an.

Beispiel anschauen








kulturbanause blog | Google Font Directory API




Willkommen auf kulturbanause.de!

Browsersupport

Aktuell funktioniert das System laut Google in folgenden Browsern:

Google Chrome: version 4.249.4+
Mozilla Firefox: version: 3.5+
Apple Safari: version 3.1+
Microsoft Internet Explorer: version 6+

Es funktioniert nicht auf folgenden Systemen:

iPhone
iPad
iPod
Android

Online-Tools und Fazit

Google bietet einige Hilfestellungen im Umgang mit der Google Font Directory API. Nachteilig ist allerdings dass bisher nur sehr (!) wenige Schriftarten angeboten werden. Wenn das Format angenommen wird - und davon gehe ich im Moment einfach mal aus - dann wird sich die Directory allerdings sicher schnell mit diversen Schriftarten füllen.

Was haltet Ihr von dieser Möglichkeit Schriften einzubinden? Habt Ihr bisher weitestgehend auf "Sonderschriften" verzichtet oder habt Ihr mit Cufón oder sIFR gearbeitet?

Jetzt bist Du gefragt

Gefällt Dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.

Mehrere Standorte in Google Maps anzeigen

Jonas Hellwig — Sun, 09 May 2010 21:17:59 +0000

Google Maps lässt sich bekanntlich kinderleicht in die eigene Website integrieren. Insbesondere auf der Kontaktseite eines Unternehmens oder auch einer Privatperson macht es durchaus Sinn Maps zu verwenden um den Besucher zu zeigen wo sich der Autor bzw. das Unternehmen befindet. Der Vorteil von Google Maps liegt dabei auf der Hand: Zum einen muss nicht mühsam eine Karte gezeichnet werden, zum anderen bietet Google stets aktuelle Informationen, verschiedene Ansichten, Zoomstufen und Kartenausschnitte.
Doch angenommen es sollen mehrere Standorte auf der Karte angezeigt werden; zum Beispiel weil das Unternehmen mehr als eine Filiale hat oder weil der Blogger zeigen möchte wo er im letzten Urlaub war. Wie Ihr mittels der Google Maps API mehr als einen Standort in die Karte eintragt und darüber hinaus auch noch Startposition, Zoomstufe, Kartenlayout und den Inhalt der Infoboxen anpasst erfahrt Ihr in diesem Tutorial.

Demo anschauen

Google Maps API Key

Um Google Maps auf einer Website verwenden zu können braucht Ihr zunächst ein Google Konto. Sobald Ihr erfolgreich in Euer Konto eingeloggt seid muss ein so genannter API-Key generiert werden mit dem sich die Website später bei Google authentifiziert.
Den API-Key könnt Ihr unter folgender Adresse generieren lassen. Gebt dazu einfach die URL in die Eingabemaske ein und bestätigt die Nutzungsbedingungen. ...

Google Maps API

Elemente im head einbinden

Nun geht es daran die eigentliche Karte im Code einzubinden. Zunächst widmen wir uns dem head unserer Seite. Bindet zunächst nachfolgendes JavaScript ein und ersetzt im Code die Stelle XXX mit Eurem zuvor generierten API-Key.

Elemente im body einbinden

Um Google Maps verwenden zu können benötigen wir ein OnLoad-Ereignis. Ersetzt Euer bereits bestehendes öffnende body-Element durch folgenden Code:

Nun folgt der eigentliche Code zur Einbindung der Karte. Mittels Kommentaren habe ich die wichtigen Punkte erklärt möchte sie aber dennoch im Detail erläutern. Wir beginnen damit die Karte im Code zu aktivieren und einige globale Eigenschaften festzulegen. Die Karte wird innerhalb eines div-Containers erstellt dessen Bezeichnug wir am Anfang einmalig festlegen. In diesem Beispiel habe ich den div "map-container" genannt. Mittels Inline-CSS-Style legen wir die Abmessungen fest. Innerhalb des noscript-Bereichs wird ein alternativer Content eingebunden für den Fall, dass der Seitenbesucher kein JavaScript aktiviert hat.

Vollständiges Code-Beispiel

Falls Euch die obige Erklärung zu detailliert oder auch zu oberflächlich war könnt Ihr Euch hier das gesamte Beispiel noch einmal am Stück anschauen. In diesem Beispiel habe ich mehrere unterschiedliche Standorte angegeben.





Untitled Document

Demo anschauen

Jetzt bist Du gefragt

Gefällt Dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.

Google Chrome 4.0 released. Beta für Linux

Jonas Hellwig — Tue, 26 Jan 2010 08:07:32 +0000

Die vierte Version von Googles Browser Chrome steht ab sofort nicht nur für Windows- sonder auch für Linux-User (als Beta) zum Download bereit. Die neue Version soll mehr als 1500 Neuerungen enthalten, darunter die erweitere Möglichkeit Extension und Plugins zu installieren oder Bookmarks zu synchronisieren. Natürlich ist Chrome 4 Beta auch stabiler und schneller als alle seine Vorgängerversionen.
Die neue Beta lädt sich nicht selbst über ein automatisches Update herunter und muss manuell geladen werden. Mac-User müssen - wie bei Chome üblich - noch warten.

Google Chrome

Jetzt bist Du gefragt

Gefällt Dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.

Google Browser Size

Jonas Hellwig — Thu, 17 Dec 2009 18:03:17 +0000

Google hat in den GoogleLabs einen neuen Dienst namens "Browser Size" veröffentlicht. Hier lässt sich ablesen wieviel Prozent der User welchen Teil einer Website sehen können (Viewport). Die Werte variieren bekanntermaßen aufgrund verschiedener Auflösungen und Monitorgrößen und individuellen Einstellungen stark. Die Statistik wird als semitransparenter Overlay über der aufgerufenen Website angezeigt und kann minimal angepasst werden. Eine Überraschung bietet der Dienst erstmal nicht, da die Werte soweit bekannt sind. Ärgerlich hingegen ist, dass eine verwertbare Ansicht nur auf linksbündige Seiten zutrifft. Hier wird in Zukunft sicherlich noch einiges zu tun sein.

Google Browzer Size

Jetzt bist Du gefragt

Gefällt Dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.

Google Chrome Beta: Jetzt auch für Mac!

Jonas Hellwig — Tue, 08 Dec 2009 19:10:44 +0000

Ich gebe es ja zu: als Chrome vor einiger Zeit für Windows auf den Markt kam war ich nicht gerade begeistert. Dies lag sowohl an den mangelhaften Datenschutzbestimmungen, die gerade bei einem Unternehmen wie Google ein gewisses Risiko bieten, als auch am Interface. Jaa, ich bin mir durchaus bewusst, dass für einige Zeitgenossen die Funktionalität schwerer wiegt als das Aussehen einer Anwendung - für mich ist das nicht so. Google Chrome für Windows ist (wie eigentlich alle Google-Anwendungen) schrecklich-hässlich und billig gestaltet.
Nun ist Google Chrome auch für den Mac verfügbar und - ohoo - er sieht gar nicht mal so schlecht aus! Wenigstens ist er grau. Die Geschwindigkeit ist Chrome-typisch sauschnell, ein Vorteil den ich in den vergangenen Monaten am PC bereits zu schätzen gelernt habe. Was den Funktionsumfang zwischen Windows und Mac angeht, so kann ich hier (noch) keine Aussage treffen da ich beide Browser zu selten nutze. Vllt. wisst Ihr ja mehr.

Google Chrome

Jetzt bist Du gefragt

Gefällt Dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.

Google erlaubt den Einblick in gespeicherte Daten

Jonas Hellwig — Mon, 09 Nov 2009 21:37:28 +0000

Googles Datenhunger ist ebenso bekannt wie umstritten. Nun gewährt Google seinen gläsernen Usern Einblick in die gespeicherten Daten. Ob hier alles vollständig aufgelistet wird darf diskutiert werden; Einsicht erhält man über sein Google Konto oder mittels folgendem Link. Google Dashboard Jetzt bist Du gefragtGefällt Dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, …

Diesen Beitrag zu Ende lesen

Jetzt bist Du gefragt

Gefällt Dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.

Google Chrome 4.0 Beta

Jonas Hellwig — Tue, 03 Nov 2009 18:34:05 +0000

Google hat die den Browser Chrome nun in Version 4 als Beta zum Download bereitgestellt. Natürlich nach wie vor ausschließlich für Windows. Eine der neuen Funktionen ist das synchronisieren von Lesezeichen zwischen verschiedenen Google Diensten und Browsern. Sonst soll natürlich die Performance weiter verbessert worden sein. Google Chrome Jetzt bist Du gefragtGefällt Dir dieser Beitrag …

Diesen Beitrag zu Ende lesen

Jetzt bist Du gefragt

Gefällt Dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.

Die Google-Story in 2 Minuten

Jonas Hellwig — Tue, 27 Oct 2009 10:25:33 +0000

Dieses Video kursiert heute durch die Blogsphäre und zeigt in nur zwei Minuten die wichtigsten Punkte zur Google-Geschichte. Sehr interessant.

via webmarketingblog.at

Jetzt bist Du gefragt

Gefällt Dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.

Wie wichtig ist eigentlich SEO?

Jonas Hellwig — Mon, 05 Oct 2009 15:00:25 +0000

Der Tag SEO Blog hat heute einen interessanten Artikel mit vielen hintergründlichen Basics zum Thema SEO (Search Engine Optimization engl. für Suchmaschinenoptimierung) veröffentlicht. In erster Linie wird geklärt welche Voraussetzungen eine Website erreichen muss und ab wann echte SEO überhaupt notwendig wird. Was ist SEO? Wie wichtig ist SEO? Jetzt bist Du gefragtGefällt Dir dieser …

Diesen Beitrag zu Ende lesen

Jetzt bist Du gefragt

Gefällt Dir dieser Beitrag oder bist du anderer Meinung? Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.