SteviesWebsite Webmaster Blog

Facebook Browser im kommen?

Stefan Wienströer — Sun, 27 May 2012 09:27:14 +0000

Opera der neue Facebook Browser?

Was hab ich da heute morgen gelesen? Facebook möchte Opera kaufen und sich somit einen eigenen Browser zu legen. Meine Meinung dazu: Bitte, bitte lasst mir meinen Browser!!!

Ich bin jahrelanger Opera-Nutzer und wer mit mir schon mal gearbeitet hat, wird dass sicher wissen. Hier sind mal einige Gründe, warum ich diesen Browser nutze:

Technologisch ist Opera schon immer ein Vorreiter gewesen
Opera ist immer schön schlicht geblieben, keine nervigen Plugins oder Stundardsuchen die sich installieren
Opera Dragonfly ist meiner Meinung nach das beste Entwicklertool
Durch die kleine Nutzergemeinde, gibt es auch weniger Sicherheitsprobleme – Es lohnt sich bisher einfach nicht.

Und des weiteren sind Opera-Nutzer laut einer Statistik auch die schlausten

Und im Vergleich dazu Facebook:

Nervende Spieleanfragen
Oftmals spammige Beiträge
Keine Rücksicht auf Entwickler (Logins, Apps usw. gehen durch Änderungen von Facebook einfach mal kaputt)

Sollte es also tatsächlich zu einem Kauf kommen, befürchte ich dass Opera schon bald sehr überladen sein wird. In so einem Fall werde ich meinen Lieblingsbrowser leider verlassen und zum Chrome wechseln.

EDIT: Ich bin mit meiner Meinung scheinbaar nicht alleine: http://www.computerbase.de/forum/showthread.php?t=1065620

Google Webprotokoll als Longtail Hilfe

Stefan Wienströer — Sat, 19 May 2012 10:13:40 +0000

Ich habe heute längerer Zeit mal wieder in das Google Webprotokoll geschaut. Dort kann man seine Suchen bei Google noch einmal Revue passieren lassen. Es zeigt an, welche Begriffe man gesucht hat, wann man das tat und welche Seiten man angeklickt hat. Zum Anschauen gibt es auch ein schickes Diagramm:

Google Webprotokoll Trends

Nun zum eigentlichen Thema: Wenn man sich durchs Webprotokoll blättert, fallen Suchanfragen auf, die öfters mal umgeschrieben wurden. Dafür scheint es noch keine passenden Ergebnisse zu geben.

Auffällige Keywords im Suchverlauf

Hier sieht man zum Beispiel, dass ich nach einer Möglichkeit gesucht habe, die Ergebnisse des Suchprotokolls zu exportieren (wollte erst ein Tool für euch basteln ).

Wenn man dazu im Nachhinein eine Lösung entdeckt hat, kann man dann mal einen Blick in die Insights for Search werfen. Dort lässt sich feststellen, ob es für das Keyword / die Keywords auch eine gewisse Nachfrage gibt.

In dem Fall, kann man einen Artikel darüber schreiben. Es reicht, wenn dieser relativ kurz ist, da es ja scheinbar noch nicht so viele andere Ergebnisse gibt. Da lieber mehrere Keywords “beantworten” anstatt sich lange an eins aufzuhalten. Das Keyword und vielleicht auch die nach der vergeblichen Suche abgeänderten Keywords sollten natürlich vorkommen.

Da diese Artikel für einen Blog oder Ähnliches meistens nicht interessant sind, kann man diese einfach auf einem separaten Teil der Seite ablagern. So kann man vielleicht einfach im Footer oder irgendwo in der Sitebar auf die neusten Artikel verweisen. Im Prinzip kommt es nur darauf an, diese schnell in den Index zu bekommen. Viel Konkurrenz für solche Keywords scheint es ja nicht zu geben.

Werbebanner als Easter Eggs – Mit Canvas

Stefan Wienströer — Sun, 13 May 2012 17:40:49 +0000

Einen Werbebanner möchte man als Webmaster immer prominent Platzieren. Doch leider bringt das manchmal nicht das gewünschte Ergebnis. Der User ist irgendwann genervt von den Bannern und nimmt sie auch gar nicht mehr richtig wahr (Bannerblindheit).

Warum also nicht mal die Werbung verstecken und wenn ein User diese findet zum Beispiel einen Coupon oder Ähnliches anzubieten? Dann sehen die Werbung zwar viele nicht, die die sie sehen, wundern sich aber und werden vielleicht schneller darauf klicken.

Als kleinen Einstieg, möchte ich heute mal einen Werbebanner erstellen, der erst mal gar nicht zu sehen ist. Fährt der User aber zufällig über die Stelle, wird der Banner nach und nach gemalt.

Als Basis hierzu dient ein Canvas-Element, welches als Hintergrundbild einen Werbebanner bekommt:


<html>
  <body>
    <canvas id="canvas" width="300" height="250" 
      style="cursor:pointer;background-image:url('banner.gif')">
    canvas>
  body>
html>

Mittels JavaScript übermalen wir nun den Hintergrund und fügen ein onclick ein, um den Banner auch anklickbar zu machen


<html>
  <body>
    <canvas id="canvas" width="300" height="250" 
      style="cursor:pointer;background-image:url('banner.gif')">
    canvas>
    <script>
      var canvas = document.getElementById('canvas');
      if (canvas.getContext){
        var ctx = canvas.getContext('2d');
        ctx.fillStyle = "#fff"
        ctx.fillRect(0,0,canvas.width,canvas.height);
      }
      canvas.onclick = function(){
        window.location.href = "http://www.contentlion.de";
      }
    script>
  body>
html>

Das einzige, was jetzt noch fehlt, ist das Übermalen. Dies geht einfach über mousemove. Wir löschen dabei den Bereich, über dem die Maus gerade fährt:


<html>
  <body>
    <canvas id="canvas" width="300" height="250" 
      style="cursor:pointer;background-image:url('banner.gif')">
    canvas>
    <script>
      var canvas = document.getElementById('canvas');
      if (canvas.getContext){
        var ctx = canvas.getContext('2d');
        ctx.fillStyle = "#fff"
        ctx.fillRect(0,0,canvas.width,canvas.height);
      }
      canvas.onmousemove = function(e){
        ctx.clearRect(e.x - 5,e.y - 5,10,10);
      }
      canvas.onclick = function(){
        window.location.href = "http://www.contentlion.de";
      }
    script>
  body>
html>

Und fertig ist unser Werbebanner! Diesen kann man dann zum Beispiel innerhalb eines Textes verstecken, damit die User auch darüberfahren. Mein Ergebnis ~~findet~~ sucht ihr hier

Social Media mit Google Analytics analysieren

Stefan Wienströer — Mon, 07 May 2012 18:05:57 +0000

Google Analytics bietet unter Besucherquellen Neuerdings “Soziale Netzwerke”. Hiermit ist es noch leichter möglich, seine Social Media Aktivitäten zu tracken.

Soziale Interaktion

Man kann die sozialen Netzwerke nun leicht miteinander und mit der Gesamtzahl der Besucher vergleichen. Bei mir wurden zurzeit folgende “soziale Netzwerke” erkannt:

Facebook
Twitter (in älteren Daten auch Hootsuite)
YouTube
Facebook Apps
Google+
Stack Overflow
Blogger
Delicious
paper.li
Bloglines
Diigo
Instantpaper
Netvibes
Read It Later
LinkedIn

Die Anzahl der Zugriffe könnte man auch durch seine bisherigen Zugriffsquellen leicht erfassen. Doch hier kann man innerhalb mancher Netzwerke auch noch ins Detail gehen. So kann ich zum Beispiel sehen, wie sich meine Google+ Besucher zusammensetzen:

Google+ Statistiken

Natürlich kann man auch die geteilten Urls analysieren.

In Sachen Social Media habe ich meistens eine hohe Absprungsrate. Um dies zu optimieren, gibt es auch eine Grafik für den Benutzerfluss. Dabei sieht man, wo die sozialen Besucher überall hergewandert sind:

Besucherfluss

Ein sehr starker Fokus scheinen mir aber die Conversions zu sein, hier scheinen die Daten aber noch nicht ganz vollständig zu sein. Trotz Conversions habe ist keine Conversion-Rate zu sehen:

Conversions (contentlion.de)

Ihr solltet euch die neuen Berichte auf jeden Fall einmal ansehen, die Daten sind sehr interessant. Ich denke diese Statistiken sind ein erster Schritt in Richtung Monetisierung von Google+. Wenn man hier erst mal die ersten Schrauben gezogen hat, wird man sich später vielleicht auf einen Versuch mit Google+ Werbung einlassen.

Ich möchte mir die Datensätze mal etwas genauer für euch ansehen, also schön liken, twittern und was es sonst noch so gibt

Siehe auch

Googles Coding-Guidlines für HTML & CSS

Stefan Wienströer — Sat, 05 May 2012 13:54:34 +0000

Google hat vor kurzen eigene Guidlines für HTML & CSS vorgestellt. Solche Coding-Guidlines sind gut, damit der Quellcode z.B. in einem Projekt immer gleich aussieht. So ist der Code geordneter und man weiß bei einigen Sachen so ungefähr wo man suchen kann. Coding-Guidlines können auch dafür sorgen, dass performant programmiert wird. So können strukturbasierende Performanceengpässe vermieden werden.

Coding-Guidlines für HTML & CSS habe ich bisher nur im kleinen Umfang gesehen. Google hat da schon einiges aufgestellt. Eine Einhaltung der Guidlines wird die Crawlbarkeit erleichtern, die Performance steigern, sowie auch die Vermeidung von browserspezifischen Fehlern.

Im Endeffekt habe ich dort viele Sachen gefunden, die ein guter Entwickler eigentlich schon kennen sollte. Aber neben den “normalen” Sachen habe ich auch ein paar Regeln gefunden, die ich bisher so nicht angewendet habe, die aber trotzdem Sinn ergeben.

Protokoll

Google schlägt vor das http: und https: bei Scripten, Stylsheets wegzulassen, damit die Seite ohne Probleme mit und ohne https läuft.
Beispiel: //blog.stevieswebsite.de statt http://blog.stevieswebsite.de.

Todo

Aufgaben sollen als Kommentar mit gekennzeichnet werden. Hier ist es aber von Vorteil, wenn man PHP-Kommentare oder Ähnliches benutzt, damit diese nicht an den Browser übergeben werden.

Umlaute sollen Umlaute bleiben

Google lehnt das Kennzeichnen von Umlauten, wie zum Beispiel dem ü mit ü ab. Dies sollte stattdessen durch die UTF8-Kodierung geschehen.

Kein kein

Seit HTML5 ist es möglich, den Head- bzw. den Body-Tag auszulassen. Und dies möchte Google auch, um den HTML-Quelltext schmaler zu machen.

type Attribute auslassen

Beim Script- oder Style-Tag, gibt man ja häufiger mal den type (z.B. mit text/css) an. Seit HTML5 ist auch dies nicht mehr erforderlich und sollte auch nicht mehr gemacht werden.

CSS IDs und Klassen so kurz wie möglich

IDs und Klassen sollten so kurz wie möglich aber so lang wie nötig sein. Als Beispiel wird aus navigation nav gemacht, aus atr aber author.

Keine CSS-Selection aus Kombination mit id/classe und typ

Statt input.color sollte man dann nur noch .color benutzten. Für verschiedene Typen kann man sich dann mit neuen Klassen aushelfen. Dies soll sich positiv auf die Performance auswirken.

Namen, ids und Klassen durch Bindestrich trennen

Ich persönlich nutze entweder CamelCasing, oder Unterstriche um Wörter in Namen usw. zu trennen. Besser wäre laut Google aber Bindestriche zu nutzen.

Mehr Regeln

Das waren nur die Regeln, die ich bisher noch so gar nicht angewand habe. Ein Blick in die Guidlines lohnt sich auf jeden Fall! Wenn ihr noch eine Regel findet, die dort noch nicht ist, bzw. eine, der ihr so gar nicht zustimmen könnte, könnt ihr euch gerne in den Kommentaren auslassen

Deine E-Mail Adresse verrät mir dein Alter!

Stefan Wienströer — Sun, 22 Apr 2012 12:23:21 +0000

Wer diese Woche mal meine Facebook-Timeline gecheckt hat, der wird vielleicht ein Bild von face.com entdeckt haben. Das ist ein Dienst, der Gesichter auf Bildern erkennt und analysiert. Bei mir sah dies zum Beispiel so aus:

Das mit dem Alter hat bei mir zwar nicht so gut geklappt, aber ich habe auch schon Bilder gesehen, dessen Ergebnis zutraf.

Das Besondere ist, man kann den Dienst über die API selbst benutzten. Man gibt einfach ein Bild an und bekommt die im Bild gezeigten Daten zurück. Diese können dann zum Beispiel für personalisierte Werbung genutzt werden. Frauen bekommen dann zum Beispiel Cola Light Werbung und Männer Coke Zero

Verknüpfung mit Gravatar

Man muss also nur noch an ein Bild des Users kommen. Das geht über den Dienst Gravatar. Dort können User ein Bild hochladen, dass dann auf sehr vielen Websites neben den Kommentaren angezeigt wird. Dies geschieht über eine Verknüpfung der E-Mail Adresse.

Also kann man über eine Verknüpfung von Gravatar und face.com an die sozialen Daten eines Nutzer kommen – Nur mit der E-Mail Adresse!

Prinzip für fremde Websites

Man kann sogar noch einen Schritt weiter gehen. Man liest einfach alle Gravatar-Bilder einer Website aus und bestimmt damit die Zielgruppe der Website. Suchmaschinen können sich dies zur Nutze machen und die Personalisierung der Suche auch an Hand sozialer Daten ganz leicht ausbauen.

Vorsicht bei Fotos

Wer solch eine Personalisierung nicht möchte, sollte sich bei Diensten wie Gravatar gar nicht erst anmelden, oder aber kein echtes Foto zur Verfügung stellen. Nur seien wir mal ehrlich: Wer von uns ist nicht bei Facebook? Durch die Nutzung dessen Logins und ähnlichen Technologien sind die Daten so oder so schon im Umlauf.

Letztendlich sollte man darauf achten, was man im Internet preisgibt und was nicht. Mir persönlich ist es egal, ob ich personalisierte Werbung angezeigt bekomme. Denn dadurch wird auch weniger Werbung gezeigt, weil die Anzeigen schon so wirken.

Auswertung: Nutzung sozialer Netzwerke

Stefan Wienströer — Thu, 12 Apr 2012 18:20:59 +0000

Auf Alexa kann man die Nutzungsstatistiken von Websites untersuchen. Neben den Zugriffsquellen ist es bei großen Seiten auch möglich zu sehen, was für eine Art von Menschen diese Website besuchen. Ich habe mal die Statistiken als Infografiken zusammengefasst.

Leider konnte ich Google+ nicht aufnehmen, da es nur das komplette google.com gibt.

Altersverteilung

Geschlechter

Schulbildung

Kinder

Ort der Nutzung

Ist gilt natürlich zu beachten, dass die Werte nich unbedingt genau sein müssen

ContentLion Beta veröffentlicht!

Stefan Wienströer — Sat, 07 Apr 2012 11:58:41 +0000

ContentLion Dashboard

Vor knapp über drei Jahren hat in diesem Blog alles angefangen: Ein CMS musste erstellt werden. Es wurde in über 250 Beiträgen zusammen mit den Usern erstellt und hat somit einen ganz besonderen Open Source Stil an sich.

Nach und nach hat sich das Ganze entwickelt und heute steht die Beta-Version zum Download bereit. Diese Version soll erstmals auf eine breitere Masse an Usern ausgeliefert werden. Zuvor gab es bereits eine längere Testphase. Die Entwicklung hat echt lange gedauert (wenn auch nicht täglich daran entwickelt wurde) und ich hoffe, einige von euch als Tester gewinnen zu können.

Grundprinzip

ContentLion ist ein CMS, welches auf einem Ordnersystem basiert. Man kann innerhalb des Ordners unter anderem Menüs und Artikel erstellen, sowie Bilder hochladen. Aber man kann auch die kompletten Einstellungen ändern. So ist es zum Beispiel möglich für einen Unterordner ein komplett anderes Design anzuzeigen oder auch eine andere Sprache zu nutzen. Und es geht sogar noch weiter: Dies geht auch mit verschiedenen Benutzergruppen. So ist das Backend mit denselben Komponenten gemacht, wie das Frontend.

Suchmaschinenoptimiert

Da ich mich selbst mit dem Thema Suchmaschinenoptimierung auseinander setze, habe ich dies natürlich nicht zu kurz kommen lassen. Dazu gehören zum Beispiel folgende Funktionen:

Generierung der Sitemap, inkl. Priorisierung und Änderungsfrequenz
Automatische Canonical-Tags, die man aber auf Wunsch von Hand ändern kann
Integrierte Weiterleitungen, die wahlweise als 301 oder 302 fungieren.
Suchmaschinenfreundliche Urls (eigentlich Standard, oder?)
Meta Description, Keywords & Robots können direkt angepasst werden. Wenn das nicht reicht, kann man auch den HTML-Head erweitern.

Erweiterbarkeit

Wenn ich ein CMS nutze, möchte ich es nach meinen Wünschen anpassen können – Das ist auch ein Grund, warum ich mich entschieden hab ein CMS zu gründen. In ContentLion kann man verschiedene Seitentypen nutzen. Diese kann man durch ein Plugin erweitern, und somit eine komplett dynamische Seite erstellen.

Es gibt so genannte Datentypen. Diese Stellen beliebige Objekte, wie zum Beispiel Seiten oder auch Benutzer da. Wenn man einen solchen Typ per Plugin erstellt, kann man im CMS ganz leicht ein Formular zur Erfassung basteln, oder aber auch erfasste Datentypen über die API nach außen freigeben.

Es ist auch möglich, eine Liste zu erstellen, die mit einem SQL-Query befüllt wird.

Mobil nutzbar!

Das mobile Web hat sich mittlerweile etabliert. Viele Seiten haben bereits eine mobile Version im Angebot. ContentLion erkennt Smartphones automatisch und zeigt für diese ein eigenes Design an. Dies kann natürlich auch frei gewählt werden.

Tester gesucht

Wie ihr vielleicht am Anfang schon gemerkt habt, ist ContentLion ein CMS, was durch die Community lebt. Na klar hat nicht jeder Zeit mitzuentwickeln, aber ein wenig testen wäre schon schön Wir werden euer Feedback auswerten und so viel wie möglich davon auch verwirklichen.

Also: Jetzt herunterladen!

Erster Screenshot der Facebook Suchmaschine

Stefan Wienströer — Sat, 31 Mar 2012 12:22:39 +0000

Vor ein paar Tagen wurde bekannt, dass Facebook möglicherweise an einer eigenen Suchmaschine arbeitet. Ich habe mir mal die Mühe gemacht, und einen Entwurf der Oberfläche gebastelt, wie ich mir die Suche vorstellen könnte.

Facebook Suchmaschine

(Einfach auf das Bild klicken, um mehr zu sehen)

Meiner Meinung nach wird Facebook versuchen, so viele eigene Inhalte wie möglich einzubinden. Aus diesem Grund werden vermutlich Gruppen und Seiten an prominenter Position auftauchen. Ich habe sie mal nach ganz oben gesetzt.

Es wird natürlich auch normale Webergebnisse geben. Da Facebook ja schon eine eigene Kommentar-Funktion zum Einbinden in externe Seiten hat, könnte ich mir vorstellen, dass diese auch in der Suche auftaucht. So könnte man jedes Ergebnis kommentieren, ob es der Webmaster will oder nicht. Die Anzahl der Kommentare und Likes wird dann vermutlich auch ein Rankingkriterium sein.

Facebook und Bing?

Bei der Suche selbst könnte ich mir vorstellen, dass sich Facebook hierbei mit Bing zusammentut. Das hätte Vorteile für beide Seiten. Bing bietet bereits einiges an Technologie für die Websuche. Sie indexieren bereits fleißig und haben auch Lösungen, um die Ergebnisse so passend wie möglich zu machen. So etwas komplett neu wäre für Facebook ein harter Weg. Aber auch Bing hätte etwas davon. Es kann vom Traffic her noch lange nicht mit Google mithalten. Durch die Integration von Facebook könnten sie ein großes Publikum erreichen. Nicht zuletzt arbeiten Facebook und Microsoft schon seit längeren zusammen, was meine Theorie noch unterstützt.

Suche mit Fragen

Ich könnte mir vorstellen, dass auch die Fragen auf Facebook eine große Rolle spielen könnten. Tippt jemand eine Frage ein, werden bereits erstellte Fragen durchsucht und dessen Ergebnis angezeigt. Ist noch keine Frage vorhanden, könnte der User diese auf seiner Pinnwand posten. Auch hier hätte Facebook eine Möglichkeit um eine gigantische Menge an Content zu kommen – Content, an den Google und Co nicht rankommen.

Stefan Wienströer sucht “test”

Wenn Facebook den Datenschützern einen kleinen Streich spielen möchte, könnten sie ein Widget machen, in dem die aktuellen Suchanfragen der Freunde angezeigt werden. So könnte man sich gegenseitig Ergebnisse vorschlagen. Sowas gibt es glaub ich auch noch nicht.

Fazit

Es wird auf jeden Fall spannend, wenn Facebook mit einer Suchmaschine ankommt. Durch das große Publikum könnte es Google, zumindest ein wenig, vom großen Kuchen der Websuche klauen. Ich bin mal gespannt, ob die Suche ein paar meiner Ideen wirklich eingebaut hat. Vielleicht lassen die sich ja auch von dem Artikel inspirieren

Infografik deiner Facebook Nutzung

Stefan Wienströer — Sun, 25 Mar 2012 11:58:11 +0000

Inforgrafiken gibt es letzter Zeit in großer Masse. Aber jetzt gibt es einen Dienst, der eine Infografik an Hand deiner Facebook Nutzung: GetAboutMe. Einen Teil der Statistik gibt es so, für einen anderen muss man einen Like ausführen (kann man ja nach der Nutzung wieder rausnehmen )

Analyse der letzten Posts

Das besondere an der Grafik ist, dass die das “ö” in meinem Nachnamen vergessen haben Ich habe im Schnitt jeden Tag einen Post geschrieben. Dafür gab es 180 Likes und 134 Kommentare. Am meisten schreibe ich meistens am Freitag und allgemein so um 19 Uhr. Die Uhrzeit kann passen, da ich um die Zeit meistens abends meinen Rechner anschalte Gegen 12 hab ich Mittagspause, wo dann vielleicht auch mal ein Post geschrieben wird. Aber so 100%tig genau, sind die andern Uhrzeiten nicht.

Über mich

Von mir gibt’s nicht viele Fotos auf Facebook, dass zeigt auch die Statistik. Die meisten meiner Facebook Freunde sind männlich, was wohl an meinen eher technischen Posts liegt.

Mehr über mich

Da ich nirgends einchecke, habe ich auch noch keine KM zurückgelegt. Auch Gruppenmitgliedschaften hab ich nicht viele. Meine Freunde sind ungefähr so alt wie ich (21).

Insgesamt ist es ein interessantes Tool. Mich würd mal interessieren, was bei euch so rausgekommen ist.

Gefunden auf TheNextWeb.