webdesign-bamberg.net - der blog für guten geschmack by Webtwist

Google Maps mit mehr Style

admin — Tue, 13 Dec 2011 08:40:57 +0000

Voraussetzung für das Styling der Karten ist die Verwendung der aktuellen Version des Google Maps Api (v3). Wir erstellen zunächst ein Div mit einer eindeutigen Id „map_canvas“, in dem die Google Map später platziert wird. Über CSS lassen sich Breite und Höhe der Karte bequem festlegen.

Einbinden von Google Maps

Für alle, die noch nicht mit der aktuellen Version des Apis gearbeitet haben, möchte ich zunächst einen kurzen Überblick geben, wie ihr die Karte in ein HTML Dokument einbindet.

1. Hinzufügen der Google Maps Bibliothek im Header der Seite.

Beachtet hierbei bitte, dass der Parameter „sensor“, der für das Übertragen der eigenen Position gedacht ist, am Ende der URL zwingend gesetzt werden muss. Da wir in unserem Beispiel den Standort nicht übermitteln möchten ist der Parameter auf „false“, andernfalls auf „true“ zu setzen.

2. Anlegen einer Javascript – Funktion initialize() zum Aufbau der Karte

In einem weiteren Skriptbereich im Header legen wir eine Funktion an, die den Aufbau und das Verhalten der Karte bestimmt. Wir erzeugen hierzu zunächst ein neues google.maps.LatLng Objekt, das spätere das Zentrum unserer Karte sein wird.

var latlng = new google.maps.LatLng(49.89354237185578, 10.884897708892822);

Um an die Koordinaten eines Standortes zu gelangen, gibt es im Web zahlreiche Tools, sog. Geocoder. (z.B. http://www.cantamen.de/geocoder.php?lang=de)

Im nächsten Schritt gilt es nun, die Optionen der Karte näher zu bestimmen. Hierzu definieren wir ein Optionen-Array myOptions, in dem der Kartenzoom, die Centerposition und der Kartentyp festgelegt werden. Letzteren belassen wir für Testzwecke zunächst bei google.maps.MapTypeId.ROADMAP. Abschließend erzeugen wir ein Kartenobjekt und weißen diesem das Container-Div, sowie das Array mit den Optionen zu.

3. Aufruf der Initialisierungsfunktion beim Laden der Seite

Damit die Funktion beim Laden der Seite auch ausgeführt wird, muss diese mit einem onload Event verknüpft werden. In das body-Tag der Seite schreiben wir deshalb:

Habt ihr alle Code-Anweisung in das HTML-Dokument eingefügt, sollte die Karte nun korrekt angezeigt werden.

Styling von Google Maps

Kommen wir nun zum eigentlichen Styling der Google Map. Seit Version 3 des Api stehen Entwicklern hierzu zwei Möglichkeiten zur Verfügung:

Variante 1: Bearbeiten der Default-Einstellungen
Möchte man die Styles der Basiskartentypen TERRAIN, ROADMAP, SATELLITE, HYPRID verändern, ohne einen zusätzlichen Kartentyp in der Karte mit aufzunehmen, so ist diese Variante die richtig.

Variante 2: Hinzufügen eines neuen Kartentyps, StyledMapType
Soll es im Unterschied dazu bei der Karte möglich sein, zwischen den einzelnen Kartentypen ( TERRAIN, ROADMAP, SATELLITE, HYPRID) sowie den eigenen Typen zu wechseln, so ist Variante 2 das Mittel der Wahl.

Variante 1: Styling der Karte durch Bearbeiten der Default-Einstellungen

Werfen wir zunächst einen Blick auf die erste Variante. Hierfür benötigen wir zwei Dinge. Zum einen ein Style Array, das die Farben von Kartenbestandteilen (Straßen, Plätzen, Parks etc.) festlegt und zum anderen einen Befehl, um dieses Style Array der Karte zuzuordnen.

a, Festlegen der neuen Kartenstyles durch Style Array
Das Array besitzt im Allgemeinen folgenden Aufbau:

var dasStyleArray = [

{

featureType: '',

elementType: '',

stylers: [

{hue: ''},

{saturation: ''},

{lightness: ''},

// etc...

]

},

{

featureType: '',

elementType: '',

stylers: [

{hue: ''},

{saturation: ''},

{lightness: ''},

// etc...

]

},

... usw...

];

Es besteht aus einer Aneinanderreihung von Blöcken, die für die Farbgebung der einzelnen Kartenbestandteile, also Straßen, Landschaften, Wasser, öffentliche Einrichtungen etc., zuständig sind.
Jeder dieser Blöcke besteht wiederum aus drei Abschnitten:

featureType:
Der featureType bestimmt, auf welches Kartenelement sich die späteren Styling-Regeln beziehen sollen. Mögliche Werte sind etwa „administrative“, „landscape“, „water“, „road.highway“. Die komplette Auflistung findet ihr in der Api-Referenz.

elementType:
Der Element Typ gibt an, ob die späteren Styling-Regeln auf die Karte selbst (geometry), die Beschriftungen (labels) oder alles (all) angewendet werden sollen.

Styler:
Bei Farbedefinitionen wird immer auf das HSL-Modell zurückgegriffen. Durch Angabe von Farbton (Hue), Sättigung (Saturation) und Helligkeit (Lightness) oder durch gesonderte Funktionen, beispielsweise Umkehrung der Helligkeit, bekommt das Kartenelement im Styler somit den eigentlichen Anstrich verpasst. Einen Überblick über alle gültigen Anweisungen findet ihr im Api-Manual.

Tip: Wer auf lästiges Ausprobieren verzichten möchte, findet auf der folgenden Seite einen Styling-Wizard mit komfortabler Benutzeroberfläche, der den fertigen Code für das Style-Array liefert.

b, Zuordnen des neuerstellten Kartenstyles
Damit die definierten Kartenstile auch angezeigt werden, müssen sie der Karte noch zugeordnet werden. Hierfür kann man auf die Funktion setOptions() des erstellten Kartenobjektes wie folgt zurückgreifen:

map.setOptions({styles: dasStyleArray });

c, Beispiel
Ein erstes einfaches Beispiel soll das Styling der Karte Schritt für Schritt veranschaulichen:

Der komplette Code lautet somit:

 function initialize() {

/*Standard Setup der Google Map*/
	 var latlng = new google.maps.LatLng(49.89354237185578, 10.884897708892822);

	 var myOptions = {
      zoom: 13,
      center: latlng,
	 mapTypeId: google.maps.MapTypeId.ROADMAP
    };

	var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

	var blueMoon= [
  {
    featureType: "all",
    stylers: [
      { hue: '#0000b0'},
      {invert_lightness: 'true'},
    ]
  },

  {
    featureType: "landscape.man_made",
    stylers: [
	  { hue: '#fcff05'}
    ]
  }

];

 map.setOptions({styles: blueMoon});
}

Variante 2: Hinzufügen eines neuen Kartentyps

Das Festlegen des Stylings mit Hilfe des Style-Arrays ist gegenüber der ersten Variante absolut identisch. Um einen neuen, umschaltbaren Kartentyp hinzuzufügen, bedarf es allerdings ein paar zusätzlicher Anweisungen:

a, Hinzufügen der Kartentyp-Schaltflächen

var myOptions = {
      zoom: 13,
      center: latlng,
      mapTypeControlOptions: {
      mapTypeIds: [
        google.maps.MapTypeId.ROADMAP,
        google.maps.MapTypeId.SATELLITE,
        'schalt_flaeche']

     }
 };

Zunächst fügen wir der Karte mit Hilfe des Options-Arrays die gewünschten Schaltflächen für die Standardtypen bzw. für unseren eigenen Kartentyp hinzu.

b, Anlegen eines neuen Kartentyps

var newMapType = new google.maps.StyledMapType(
blueMoon, {name: "Blue Moon"});

Im zweiten Schritt erstellen wir einen neuen Kartentyp. Der erste Parameter des Konstruktors erwartet dabei ein Style Array, das für das Erscheinungsbild der Karte zuständig ist. Der zweite Parameter „name“ legt den Namen des Kartentyps fest.

c, Zuordnung Schaltfläche Kartentyp

map.mapTypes.set('schalt_flaeche', newMapType);
map.setMapTypeId('schalt_flaeche');

Abschließend stellen wir die Beziehung zwischen der Schaltfläche und dem Kartentyp her und aktivieren den Kartentyp direkt nach dem Laden der Karte.

Das komplette Beispiel sieht dann wie folgt aus:

Beispiele, Code Snippets

1. Night hawk

2. Ohne Straßen

3. Graustufen

4. Modern

5. Gewerbe

6. Silent


/*1. Night hawk*/
var nighthawkStyle= [
   {
     featureType: 'all',
     stylers: [
         {invert_lightness: 'true'}
     ]
   },
];

/*2. Ohne Straßen */
var ohneStrassenStyle= [
   {
     featureType: 'road',
     stylers: [
       {visibility: 'off'}
     ]
   },
];

/*3. Graustufen*/
var graustufenStyle= [
   {
     featureType: 'all',
     stylers: [
       {saturation: -100},
       {gamma: 0.90}
      ]
   },
];

/*4. Modern */
var modernStyle= [
   {
     featureType: "water",
     stylers: [
      { hue: "#0066ff" },
      { lightness: -29 },
      { saturation: 7 }
    ]
  },

  {
    featureType: "landscape.natural",
    stylers: [
      { visibility: "on" },
      { saturation: 22 },
      { hue: "#00ff44" },
      { lightness: -42 }
    ]
  },

  {
    featureType: "road.highway",
    stylers: [
      { visibility: "simplified" },
      { hue: "#ff0000"},
      { saturation: -57 }
    ]
  },

  {
    featureType: "road.arterial",
    stylers: [
      { hue: "#ff0000"},
      { visibility: "simplified" },
      { saturation: -56 }
    ]
  },

  {
    featureType: "poi",
    stylers: [
      { visibility: "off" }
    ]
  },

  {
    featureType: "road.local",
    elementType: "geometry",
    stylers: [
      { visibility: "on" },
      { saturation: -59 },
      { hue: "#00ffdd" },
      { lightness: -18 }
    ]
  }
];

/*5. Gewerbe */
var gewerbeStyle= [
   {
     featureType: "road",
     stylers: [
      { visibility: "off"; }
     ]
   },

   { featureType: "poi.business",
     elementType: "geometry",
     stylers: [
       { hue: "#ff2b00" },
       { saturation: 63 },
       { lightness: -22 }
     ]
   }
];

/*6. Silent */
var silentStyle= [
   {
     featureType: 'road',
     elementType: 'geometry',
     stylers: [
       {'visibility': 'simplified'}
     ]
   },

   {
     featureType: 'road.arterial',
     stylers: [
       {hue: '#005eff'},
       {saturation: -78},
       {lightness: 0}
      ]
    },

    {
      featureType: 'road.highway',
      stylers: [
        {hue: '#ff0000'},
        {saturation: -40},
        {lightness: 2.8}
       ]
     },

     {
       featureType: 'water',
       stylers: [
         {hue: '#0077ff'},
	 {lightness: -22},
	 {saturation: -11},
        ]
      }, 

      {
        featureType: 'landscape',
        stylers: [
          {hue: '#0008ff'},
          {saturation: -26},
          {lightness: -1.1}
         ]
       },

       {
         featureType: 'poi',
         elementType: 'label',
          stylers: [
            {'visibility': 'off'}
          ]
        },

        {
          featureType: 'transit',
          stylers: [
            {'visibility': 'off'}
          ]
        },
];

Inhalt – der Schlüssel zum Erfolg einer Webseite

admin — Thu, 15 Sep 2011 06:23:46 +0000

1. Inhalt oder Layout? Henne oder Ei?

Vielen Webdesignern und Agenturen wird folgende Aussage des Kunden bekannt vorkommen: „Machen Sie erst einmal das Layout fertig, und wir liefern dann die Texte nach und nach". Je nach Skalierbarkeit des entworfenen Layouts und Umfang des finalen Inhalts wird dieser Workflow auch mehr oder weniger gut funktionieren. Doch was passiert, wenn das schönste Screendesign, das Sie je entworfen haben, durch eine Maße an eingehenden Bildern, Videos, Texten und sonstigen Inhalten überladen wird?

Zum einen verändert sich gegenüber dem Entwurf mit Platzhaltertexten die optische Wahrnehmung des Layouts. Zum anderen geht die Übersicht und somit auch die Benutzerfreundlichkeit der Webseite Schritt für Schritt verloren. Spätestens wenn durch eine Vielzahl an neu hinzugefügten Unterseiten die Navigationsstruktur und Menüs über den Haufen geworfen werden müssen wird einem als Screendesigner bewusst, dass diese nicht der richtige Weg gewesen sein kann.

Qualitativ hochwertiges Webdesign zeichnet sich dadurch aus, Informationen den Besuchern übersichtlich, in kürzest möglicher Zeit (mit wenigen Klicks) und optisch ansprechend zu vermitteln.

Besprecht also zunächst mit den Kunden die inhaltlichen Aspekte so detailliert wie nur irgendwie möglich und klärt u.a. folgende Fragen:

Welchen Seitenumfang soll die Webpräsenz später besitzen und wie soll die Seitenstruktur des Webauftritts gegliedert sein? (Kategorisierung)
Welchen Umfang werden die Inhalte der einzelnen Seiten besitzen?
Welche Inhaltstypen werden verwendet? Sollen 10 DinA4 Seiten Text untergebracht werden oder doch nur wenige Absätze mit Bildern?
Sollen die Inhalt auch auf mobilen Endgeräten vollständig darstellbar sein? Flash-Präsentationen, aufwendige Videos und Inhalte, die auf mobilen Endgeräten nicht darstellbar sind, sind dann entweder zu vermeiden oder zu ersetzen.

Je mehr Informationen über den Inhalt in diesem wichtigen Konzeptionsgespräch bekannt werden, desto präziser kann der Webdesigner das Layout, Navigationsstruktur und den Seitenaufbau auf die Inhalte abstimmen.

2. Warum ist die Qualität der Inhalte so wichtig?

Präsentation der Marke, Informationsvermittlung

Die Webseite ist ein zentrales Marketinginstrument und aus dem modernen Marketingmix nicht mehr wegzudenken. Sie ist die virtuelle Visitenkarte des Unternehmens, Person oder einer Marke und somit für Besucher (oder deutlicher ausgedrückt, für potentielle Kunden) die erste Anlaufstelle, um Informationen über das Angebot einzuholen.

Werden aus Sicht der Interessenten möglichst viele der ev. auftretenden Fragen beantwortet, so ist schon einmal ein erstes Ziel erreicht: den Besucher ausreichend mit Informationen zu versorgen.

Welche Inhaltsart in welchem Umfang allerdings für eine ausreichende Informationsvermittlung geeignet ist, hängt maßgeblich von den gesetzten Zielen sowie Art, Umfang und Thematik der Webseite ab. Hierauf werde ich späterer noch gesondert eingehen

Suchmaschinenranking

Dass das Suchmaschinenranking einer Internetpräsenz eng verknüpft mit der Qualität der Webseiteninhalte ist, klingt zunächst vielleicht ein wenig verwunderlich. Wie soll eine Suchmaschine schon entscheiden können, ob Webcontent hochwertig oder nichtssagend ist?

In der Tat können Google und Co. derzeit nur in sehr begrenztem Maß durch direkte Codeanalyse feststellen, ob es sich beim Content einer Webseite um hochwertigen oder gar sinnvollen Inhalt handelt. Zwar verfügt Google bereits heute über einige einfache Algorithmen zur semantischen Analyse (z.B. Messung und Bewertung der Keyword-Dichte, Wiederholung von Texten und Passagen, gefährdendes Material usw.), doch um die genaue Qualität zu bestimmen, benutzen Suchmaschinen einen ganz anderen Ansatz.

Unter der Annahme, dass andere Webauftritte nur auf die eigene Seite verlinken, wenn auch der Inhalt qualitativ hochwertig ist, werden Backlinks als entscheidendes Kriterium zur Bewertung herangezogen. Je mehr (themenrelevante) Seiten also einen Link zu Eurer Website einbauen und somit eine Art Empfehlung aussprechen, desto sicherer ist es für Suchmaschinen, dass die angebotenen Inhalte qualitativ hochwertig sind, wodurch sich das Ranking verbessert.

Auf indirektem Weg trägt somit die Qualität des Inhalts entscheidend zur Verbesserung des Suchmaschinenergebnisses bei.

Suchmaschinenoptimierung

Wie bereits angedeutet sind Inhalte die Basis jeglicher Suchmaschinenoptimierung. Sowohl On- als auch Off-Page Optimierung kann nur dann funktionieren, wenn Inhalte in ausreichender Qualität (und Umfang) vorhanden sind.

Während Flashanimationen, Bilder und Videos kaum positive Auswirkungen auf das Ranking von Suchmaschinen besitzen, basiert die Indizierung fast ausschließlich auf den textuellen Angeboten.

Das bekannte Sprichwort „content ist king“ hat sich im Laufe der Zeit dabei immer mehr in Richtung „Klasse statt Masse“ gewandelt. Im Vordergrund stehen nun nicht mehr Ansammlungen an wertlosen (ev. kopierten) Inhaltselementen, sondern echter Content, von dem sich Besucher der Webseite einen gewissen Mehrwert versprechen können.

Für die Suchmaschinenoptimierung bedeutet das vereinfacht ausgedrückt, Texte weniger auf die Suchmaschinen- Bots zuzuschneiden, sondern originellen, einzigartigen Content zu konzipieren, der von Besuchern als Bereicherung empfunden wird und sich von Inhalten konkurrierender Webseiten abhebt.

User binding

Ähnlich wie im realen Geschäftsleben, in dem es neben der Akquise von Neukunden insbesondere auf die Pflege der Bestandskunden ankommt, muss es auch für Betreiber von Webseiten ein Anliegen sein, User dazu zu bewegen, in regelmäßigen Abständen die Webseite zu besuchen. Qualitativ hochwertiger Content hilft dabei einerseits, die Verweildauer auf der Webseite zu erhöhen und andererseits im Gedächtnis der Besucher zu bleiben.

3. Was zeichnet „gute“ Inhalte aus?

Welche Inhalte gut oder schlecht sind, hängt zugegeben auch ein Stück weit vom subjektiven Empfinden des Besuchers ab. Ich möchte Euch im folgenden Abschnitt einige Merkmale vorstellen, anhand derer Ihr die Qualität von Inhalten etwas genauer und neutraler bewerten könnt.

Vermeiden von Plagiaten und Wiederholungen

Was bereits Karl-Theodor zu Guttenberg zum Verhängnis wurde, gilt auch für Webseitenbetreiber: Nicht nur, dass das Kopieren von Inhalten ohne Genehmigung des Urhebers untersagt ist, Google verfügt über einen ausgefeilten Mechanismus, der „duplicate content“ sofort entdeckt und negativ bewertet.

Doch nicht nur aus diesem Grund sollte auch auf das Kopieren von einzelnen Textpassagen verzichtet werden: Bekommen Besucher der Webseite immer wieder identische Information vermittelt, so werden diese kaum bereit sein, längere Zeit auf der Page zu verweilen.

Thematisch einzigartig

Zugegeben ist es, abhängig von Thematik und Art der Seite oft nicht gerade einfach, vollkommen neuartige Themen zu finden. Insbesondere um sich von Konkurrenten abzuheben und aus der Masse herauszustechen bedarf es hierbei Einiges an Kreativität.

Gerade bei sehr allgemeinen und aktuellen Themen ist es nicht immer möglich, das Rad neu zu erfinden. Existieren im Web bereits vergleichbare Ausführungen, so sollte der Anbieter zunächst überlegen, ob und wie der Inhalt sinnvoll ergänzt werden kann. Als Stütze könnten Euch folgende Fragen hilfreich sein:

Welche Informationen fehlen in bereits existierenden Inhalten? (Ergänzungen)
Welche Angaben sind überflüssig oder falsch? (Richtigstellungen)
Werden alle Konsequenzen, Ergebnisse oder Zusammenfassungen angesprochen? (Auswirkungen)
Lassen sich die Ausführungen auch auf andere Situationen oder Sachverhalte ausweiten? (Übertragung)
Werden in den Darstellungen alle Details und Sachverhalte ausführlich und verständlich erklärt? (Vertiefung, Veranschaulichung)
Werden alle wichtigen Zielgruppen angesprochen? (Optimierung, Anpassung an Zielgruppe)

Mit eigenen Worten wiedergegeben und mit verschiedensten Details ergänzt entsteht so authentischer „unique content“, der den Besuchern der Webseite gegenüber der Konkurrenz einen echten Mehrwert verspricht.

Service und Mehrwert

Bei der Konzeption von Inhalten vergessen Webseitenbetreiber oft, sich auch in die Lage der Besucher hinein zu versetzen und zu hinterfragen, welche Aspekte aus deren Sicht von zusätzlichem Interesse sein könnten. Einige Inhalte, die häufig als ergänzender Service für Benutzer angeboten werden, sind beispielsweise:

Glossare, Lexika, Wikis
Nachschlagewerke eignen sich einerseits hervorragend, den Usern die wichtigsten Fachbegriffe verständlich zu machen. Zum anderen bieten sie aus Sicht der Suchmaschinenoptimierung die Möglichkeit, themenrelevante Keywords im Text zu integrieren.

Top 10- / Bestenlisten
Top 10 – und Bestenlisten sind ein ideales Mittel, um aus einer Fülle von Angeboten die wichtigsten oder besten, je nach Auswahlkriterium, zu kennzeichnen. Für einen Onlineshop könnten das etwa die durch Besucher am besten bewerteten Produkte, für einen Blog die am meisten kommentierten Artikel und für eine Infosite die wichtigsten Informationen sein.

Linksammlung
Verlinkungen zu themenverwandte Seiten sind insbesondere dann sinnvoll, wenn deren Inhalte für die Besucher eine echte (kostenlose) Ergänzung zum eigenen Angebot darstellen. Bei der Aufnahme von Links sollte man jedoch stets die Gefahr im Hinterkopf behalten, dass Besucher auf die verlinkten Sites abwandern könnten.

Tip 1:
Ich empfehle daher, nur auf Kooperationspartner oder themenrelevante Seiten zu verweisen, die einen Backlink auf die eigene Seite setzen.

Tip 2:
Um tote Links („dead links“) zu vermeiden, sollte man die Erreichbarkeit aller ausgehenden Verlinkungen von Zeit zu Zeit überprüfen.

Blogs / Tagebücher
Auch Blogs bieten dem Webseitenbetreiber einen vielfachen Nutzen. Einerseits demonstrieren branchenspezifische Fachartikel ein hohes Maß an Fachkompetenz und Seriosität. Andererseits können wichtige Suchbegriffe im Text untergebracht und der Umfang einer Website vergrößert werden.

Darüber hinaus lassen sich mit Blogeinträgen bestimmte Themengebiete / Sachverhalte aus dem Angebot der Webseite explizit herausheben und subjektiv bewerten. Last but no least bietet ein Blog die Möglichkeit, zeitnah auf aktuelle Entwicklungen, Ereignisse und Neuigkeiten zu reagieren und kann so für mehr Aktualität sorgen.

Interaktion: Quiz, Wissenstest, Umfragen, Gewinnspiele
Vorbei sind die Zeiten, als das Web noch aus leblosen Texten und einzelnen Bildern bestand. Statt passiver Informationsaufnahme steht mehr denn je das aktive Eingreifen des Besuchers im Vordergrund.
Interaktive Elemente, beispielsweise ein kurzes Quiz, Wissenstest, Gewinnspiel oder Umfrage, sind unteraltsame Möglichkeiten, User zur Interaktion aufzufordern, für mehr Abwechslung zu sorgen und zugleich Anreize zu schaffen.

FAQ
Für die Beantwortung von immer wieder auftauchenden Fragen erweist sich eine FAQ Liste als äußerst hilfreich. So kann schnell und benutzerfreundlich auf die offenen Fragen der Besucher eingegangen und der Aufwand für die Bearbeitung einzeln eingehender Supportanfragen reduziert werden.

Zielgerichtet und strategisch

Wie bereits angedeutet gibt es für „guten“ Inhalt kein Patentrezept. Ob Infosite für Hobbyimker, Reiseportal, Selbstporträt oder ein Blog über Briefmarken, eines haben aber alle Seitentypen gemeinsam: Sie verfolgen ein (oder auch mehrere) Ziele. Gute Inhalte sind stets die entscheidenden Puzzleteile, um die gesetzten Zielvorgaben zu erfüllen.

Allerdings sollte man als Webseitenbetreiber Zielvorgaben nicht immer allzu eng sehen. Inhalte können beispielsweise informativ, humorvoll, attackierend, authentisch / transparent, wertend, aktuell, werbend etc. ausfallen. Es spricht nichts dagegen, diese Eigenschaften auch miteinander zu kombinieren und so für mehr Abwechslung auf der Seite zu sorgen.

Eine Infosite für Hobbyimker verträgt sicherlich auch den ein oder anderen humorvollen Beitrag, nur sollte dabei eben das übergeordnete Ziel, die Besucher über die Imkerei zu informieren, nicht gänzlich aus den Augen verloren werden.

Linkbaiting / geeignet Aufbau von Backlinks

Im Hinblick auf den Erfolg einer Internetpräsenz sind Backlinks auf die eigene Webseite ein entscheidendes Hab und Gut. Warum sollten andere Seiten allerdings ausgerechnet auf meine Seite verlinken? Genau um diese Frage dreht es sich beim Linkbaiting (engl. to bait: ködern). Nicht jeder Inhalt eignet sich für erfolgreiches Linkbaiting. Hochwertiger Content sollte in Bezug auf Linkbaiting in der Regel mindestens zwei der folgenden Attribute aufweisen können: beeindruckend, nützlich/ hilfreich, einzigartig, dauerhaft

Je mehr dieser Eigenschaften erfüllt sind, desto eher werden andere Seitenbetreiber bereit sein, einen Backlink auf deren Seite zu veröffentlichen. In der Praxis haben sich insbesondere folgende Inhaltstypen als bewährt: Nützliche Tools/ give aways, eBooks, whitepapers, Gewinnspiele, Quiz, Listen, Auszeichnungen uvm.

Grammatikalische und orthografische Korrektheit

Nicht jeder von uns, der textuelle Inhalte im Web veröffentlicht, muss ein zweiter Goethe oder Schiller sein und es bedarf auch keines Romans, um einfachste Sachverhalte darzustellen.

Wichtig ist, Informationen in einem flüssigen, für die Zielgruppe verständlichen Stil darzustellen und bei seinen Ausführungen insbesondere auf Grammatik, korrekte Rechtschreibung und Sinn zu achten. Gerade in Zusammenhang mit der On-Page Suchmaschinenoptimierung entstehen oftmals haarsträubende Textkonstrukte. Einige reale Beispiele gefällig? Bitte schön:

„Dienstleistung XYZ Bamberg nach Maß“
„Kostenlose Lieferung der XYZ – Waren frei haus“
„Onlineshop für XYZ – XYZ bestellen und kostenlos rund um die Uhr“

Bei allem (teils blinden) Optimierungs-Aktionismus sollte man die Verständlichkeit der Inhalte zu keinem Zeitpunkt aus den Augen verlieren. Die Kunst ist es, die Keywords in nicht übertriebener Anzahl und auf natürliche Art und Weise im Text so zu platzieren, dass die Lesbarkeit stets erhalten bleibt.

Zielgruppenorientiert

Guter Content orientiert sich stets an die Zielgruppe der Webseite. Kein Kind der Welt möchte eine dreiseitige Abhandlung zum Thema Auftrieb lesen, wenn es lediglich wissen möchte, wie man ein Papierschiff bastelt. Ebenso sollte man überlegen, ob und wie sehr die Zielgruppe Kaninchenzüchter wirklich an einer Bilderserie “Designgrundlagen nach Maß“ interessiert ist.

Sprache von Texten, Bilder, Präsentationen und Videos sollten also genauestens der Zielgruppe angepasst sein und eine gewisse Themenrelevanz aufweisen. Nur so können Interessenten gezielt angesprochen werden und ein reibungsloser Kommunikationsfluss stattfinden.

Barrierefreiheit (Accessbility)

Der Begriff Barrierefreiheit beschreibt die Eigenschaft von Webinhalten, von allen Anwendern, unabhängig von ihren körperlichen und technischen Möglichkeiten, genutzt werden zu können.

Körperliche Einschränkungen sind dabei nicht ausschließlich als Behinderung, wie etwa Sehschwäche, zu verstehen. So besitzen beispielsweise auch Kinder bis zu einem gewissen Alter eine körperliche Barriere, da sie nicht lesen und die textuelle Informationen einer Webseite nicht aufnehmen können.

Technische Einschränkungen beziehen sich dagegen meist auf Hard- und Software des Users. Eine häufig auftretende Barriere ist in diesem Zusammenhang etwa die Notwendigkeit, einen bestimmten Browsertyp bzw. eine bestimmte Browser‐Version verwenden zu müssen, um Inhalte erfassbar darstellen zu können.

Ein in der Praxis immer wieder auftretendes Problem sind Flashinhalte und Videotypen, die insbesondere von mobilen Endgeräten oft nicht unterstützt werden. Um es klar zu formulieren: Barrierefreiheit bedeutet nicht, dass man auf solchen Content zwangsweise verzichten muss. Werden in diesen Flashinhalten allerdings Informationen dargestellt, die für das Verständnis von essentieller Bedeutung sind, so sollte man über alternative Varianten nachdenken, beispielsweise eine für mobile Endgeräte optimierte Version einer Webseite.

4. Weiterführende Links, Material

Workaround: Backend-Login bei Typo3 (vers. 4.5.x) nicht möglich

admin — Sun, 07 Aug 2011 09:29:39 +0000

Das Problem

Nach reibungsloser Installation von Typo3 (4.5.4) auf einem Windows Server (2003) mit PHP 5.2.6 wollte ich mich ins Backend von Typo3 als Standard-User (admin / password) einloggen. Doch zu meiner Verwunderung bekam ich im Login Fenster stets folgende Meldung angezeigt:

Ihr Anmeldeversuch war nicht erfolgreich

Bitte stellen Sie sicher, dass Ihr Benutzername und Passwort korrekt sind. Groß-/Kleinschreibung wird unterschieden.

Erfolglose Versuche

Mehrmaliges Anlegen eines neuen Administrators über das Backend
Bereinigen der Installationsverzeichnisse / Datenbanktabellen und Neuinstallation (vers. 4.5.0, 4.5.2, 4.5.4)
Löschen aller Dateien im Temp-Verzeichnis und Temp-Dateien in typo3conf
Testen in verschiedenen Standard-Browsern (Cache/Cookie- Problematik)
Anlegen einer neuen Domain in Plesk
Löschen des Administratorpasswortes (Hashwert) in der be_user Tabelle der MySQL Datenbank
Verzicht auf den UTF-8 Zeichensatz

Die (vorrübergehende) Lösung

Nach unzähligen erfolglosen Versuchen stieß ich im Typo3 Install-Tool unter All Configuration auf folgende Einstellungsmöglichkeit:

loginSecurityLevel ($TYPO3_CONF_VARS['BE']['loginSecurityLevel'])

Mit dieser Option kann festgelegt werden, welche Authentifizierungsmethode Typo3 beim Login im Backend verwenden soll. Standardmäßig ist hier nichts eingetragen, wodurch das Passwort als MD5- Hashsumme in die Tabelle be_user eingetragen wird. Mit zwei einfachen Schritten lässt sich Backend-Bereich von Typo3 wie gewohnt erreichen:

1. Trägt man bei ['BE']['loginSecurityLevel'] den Wert ‚normal‘ ein, so wird auf die Bildung des Hashwertes bei der Authentifizierung verzichtet.

2. Als logische Folge daraus muss nun in der Datenbanktabelle „be_user“ für das Passwort statt der Hashsumme der eigentliche Wert eingetragen werden (für den Standarduser „admin“ somit „password“). Das funktioniert am einfachsten über das PhpMyAdmin Tool.

Nun Sollte der der Login wie gewohnt funktionieren.

Folgerungen und Sicherheitsproblematik

Das beschriebene Workaround ist im Hinblick auf entstehende Sicherheitsrisiken nicht die Premiumlösung, da das Passwort nun „unverschlüsselt“ in der Datenbank zu finden ist.

Allerdings muss man solche Risiken auch immer ein wenig realtivieren:

Typo3 selbst schreibt im Manual:

Passwortübertragung und Speicherung (Backend) sind MD5 verschlüsselt.

Zum einen handelt es sich bei der standardmäßig verwendeten Authentifizierung (MD5) nicht um eine Verschlüsselung im eigenen Sinne. Wer zur Pseudo-Verschlüsselung MD5 mehr wissen möchte, dem empfehle ich diesen Link. Somit wird weder das im Browser eingegebene Passwort auf dem Weg zum Server standardmäßig verschlüsselt noch wird es verschlüsselt in der Datenbank abgelegt.

Hat ein Hacker es zum anderen wirklich auf die das Typo3 System und somit die Datenbank abgesehen, so benötigt er zunächst in irgendeiner Form Zugang zu dieser, unabhängig, in welcher Form das Passwort des Backend- Administrators hinterlegt ist. Hat sich der Unbefugte diesen Zugang erst einmal erschlichen, wird er sich wohl kaum die Mühe machen, das der Hashsumme zu Grunde liegende Passwort des Administrators zu ermitteln, wenn er auch die Möglichkeit besitze, innerhalb von einer halben Minute einen eigenständigen Admin-User anzulegen.

Für alle, die ebenfalls auf das Problem mit dem fehlerhaften Login gestoßen sind und nicht gewillt sind, das Passwort im Klartext einzutragen, könnte, ohne es probiert und getestet zu haben, auch die von Typo3 mitgelieferte Erweiterung rsaauth/ saltedpasswords eine Alternative sein. Hierzu muss im Install-Tool für ['BE']['loginSecurityLevel'] der Wert ‚rsa‘ eingetragen werden.

Ursache

Da auf dem selben Server ein weiteres Typo3 (4.5.0) im Einsatz ist, bei dem die Standardauthentifizierung problemlos funktioniert, erschließt sich mir die eigentliche Ursache für das Problem derzeit noch gar nicht. Eine meiner ersten Vermutungen, eine veraltete PHP Version / Bibliothek, kann somit eigentlich nahezu ausgeschlossen werden.

Für Feedback, Anregungen und Neuigkeiten hierzu bin ich Euch sehr dankbar.

Update: Möglicher Lösungsansatz

Ich hatte es eigentlich fast schon aufgegeben, nach einer Lösung für das Problem zu suchen. Bei einem neuen Projekt (Windows Server 2008) trat der selbe Fehler allerdings erneut auf. Doch diesmal wurde ich dank dem folgenden Boardeintrag fündig: Schuld waren fehlende Schreibberechtigungen für den Ordner, den PHP zum Anlegen von Sessions und error logs verwendet. Nachdem der entsprechende IUSR die Rechte erhalten hatte, funktionierte nun auch der BE Login.

Die schönen (Web-)Seiten Bambergs und der Region – Teil 2

admin — Wed, 25 May 2011 07:27:46 +0000

Gasthof Schiller / Wernsdorf

Branche: Gastronomie

Docufy / Bamberg

Branche: Softwareentwicklung

Zeck GmbH / Scheßlitz

Branche: Industrie, Antennenbau

Live Club / Bamberg

Branche: Gastronomie

Pose Down / Bamberg

Branche: Fitness

Creo Druck / Bamberg

Branche: Druck

Schlafen in Bamberg

Branche: Hotel, Gastronomie

Der Bademeister / Bamberg

Branche: Baddesign

Salino / Bamberg

Branche: Gastronomie

IGZ / Bamberg

Branche: Dienstleistungen, Existenzgründung

St. Georgen Bräu / Buttenheim

Branche: Gastronomie

Blüte & Ambiente / Bamberg

Branche: Messe, Veranstaltung

modernhouses / Schlüsselfeld

Branche: Wohnungsbau

Fässla / Bamberg

Branche: Gastronomie

Bamberger Symphoniker

Branche: Kultur, Musik

spicystyles / Pettstadt

Branche: Bekleidung, Onlineshop

Rolands Alpin Laden / Bamberg

Branche: Alpinsport, Freizeit

Upjers / Bamberg

Branche: Spieleentwicklung, Onlinegames

Dorfrocker / Oberaurach

Branche: Musik

Weinfachhandel Scharfenberg / Bamberg

Branche: Gastronomie, Wein

Showcase: 40 kreative Facebook Landing-Pages

admin — Sat, 09 Apr 2011 07:49:20 +0000

Das Erstellen von individuellen Landing-Pages für Facebook Unternehmensseiten ist für den Betreiber von enormer strategischer Bedeutung. Mit Hilfe einer optimierten Landing-Page können "Nicht Fans" begrüßt und diesen die wichtigensten Informationen schnell und übersichtlich vermittelt werden. Durch orginelle Ideen und ein kreative Layouts können so Anreize für Besucher geschaffen werden, den "gefällt mir" Button zu betätigen. Wir haben in diesem Artikel für Euch 40 deutschsprachige Facebook-Pages zusammengetragen, deren Landing-Pages als echte Eyecatcher das Interesse der User wecken und als Inspiration für Eure nächste Facebook Page dienen können.

Aperol Spritz Deutschland

Branche: Lebensmittel/Getränke | Fans: 94.161 | Adresse: www.facebook.com/aperol.de

Assassin´s Creed

Branche: Computergames | Fans: 115.899 | Adresse: http://www.facebook.com/AssassinsCreedDE

Audi Deutschland

Branche: Automobile | Fans: 134.108 | Adresse: http://www.facebook.com/AudiDE

Baileys

Branche: Lebensmittel/Getränke | Fans: 87.308 | Adresse: www.facebook.com/BaileysDeutschland

DailyDeal

Branche: Coupons | Fans: 24.916 | Adresse: http://www.facebook.com/DailyDeal.Deutschland

Deichmann

Branche: Schuhe | Fans: 25.531 | Adresse: http://www.facebook.com/Deichmann

Deutschland findet euch

Aktion: Suche von vermissten Kindern | Fans: 106.481 | Adresse: http://www.facebook.com/deutschlandfindeteuch

Duracell

Branche: Batterien/Energie | Fans: 591 | Adresse: http://www.facebook.com/DuracellDeutsch

easyJet

Branche: Flüge/Reisen | Fans: 5.797 | Adresse: http://www.facebook.com/easyJet.Deutschland

Fa

Branche: Hygiene/Pflegemittel | Fans: 6.441 | Adresse: http://www.facebook.com/fadeutschland

Ford in Deutschland

Branche: Automobile | Fans: 8.403 | Adresse: http://www.facebook.com/fordindeutschland

Gillette

Branche: Rasur/Pflegemittel | Fans: 19.300 | Adresse: http://www.facebook.com/Gillette.Deutschland

Haribo

Branche: Lebensmittel | Fans: 60.394 | Adresse: http://www.facebook.com/haribo

hohes C

Branche: Lebensmittel/Getränke | Fans: 10.121 | Adresse: http://www.facebook.com/hohesC

HP Deutschland

Branche: Hardware | Fans: 7.951 | Adresse: http://www.facebook.com/HPDeutschland

Jack Daniels

Branche:Lebensmittel/Getränke | Fans: 58.102 | Adresse: http://www.facebook.com/jacklivesheredeutschland

Joop

Branche: Bekleidung/Mode | Fans: 33.138 | Adresse: http://www.facebook.com/joop

Jugendherbergen in Deutschland

Branche: Jugendherbergen | Fans: 4.082 | Adresse: http://www.facebook.com/Jugendherberge

KLM

Branche: Fluggesellschaft | Fans: 4.417 | Adresse: http://www.facebook.com/KLM.Deutschland

Labello

Branche: Pflegemittel | Fans: 73.692 | Adresse: http://www.facebook.com/LabelloDeutschland

Neutrogena

Branche: Gesundheit/Pflegemittel | Fans: 9.110 | Adresse: http://www.facebook.com/NeutrogenaDeutschland

Nokia Deutschland

Branche: Handys/Mobilfunk | Fans: 21.138 | Adresse: http://www.facebook.com/nokiadeutschland

Nordsee

Branche: Fisch Restaurant | Fans: 5.235 | Adresse: http://www.facebook.com/Nordsee.Deutschland

Nutella

Branche: Lebensmittel | Fans: 156.806 | Adresse: http://www.facebook.com/nutelladeutschland

Opel

Branche: Automobile | Fans: 44.120 | Adresse: http://www.facebook.com/OpelDE

Otto

Branche: Versandhandel | Fans: 177.852 | Adresse: http://www.facebook.com/Otto

Panasonic Deutschland

Branche:Elektronikhersteller | Fans: 8.605 | Adresse: http://www.facebook.com/Panasonic.Deutschland

Pantene Pro-V

Branche: Shampoo/Pflegemittel | Fans: 8.303 | Adresse: http://www.facebook.com/PanteneDeutschland

Paramount Pictures

Branche: Filmproduktion | Fans: 41.043 | Adresse: http://www.facebook.com/Paramount.Pictures.Germany.Kino

Persil

Branche: Waschmittel | Fans: 48.757 | Adresse: http://www.facebook.com/persil

Peter Fox

Branche: Musiker | Fans: 350.333 | Adresse: http://www.facebook.com/pages/Peter-Fox/42592738173

Pixmania

Branche: Onlineshop/Elektroartikel | Fans: 1.051 | Adresse: http://www.facebook.com/Pixmania.de

Playboy Deutschland

Branche: Magazin | Fans: 29.882 | Adresse:http://www.facebook.com/PlayboyGermany

Pringles

Branche: Lebensmittel/Chips | Fans: 14.476 | Adresse: http://www.facebook.com/PringlesDeutschland

Prinzenrolle

Branche: Lebensmittel/Süßwaren | Fans:10.121 | Adresse: http://www.facebook.com/prinzenrolle.germany

Red Bull

Branche: Lebensmittel/Getränke | Fans: 16.839.508 | Adresse: http://www.facebook.com/redbull

REWE

Branche: Lebensmittelhandel | Fans: 11.141 | Adresse: http://www.facebook.com/REWE

Starbucks Deutschland

Branche: Kaffeehäuser | Fans: 263.819 | Adresse: http://www.facebook.com/StarbucksDeutschland

TUI

Branche: Reisen/Freizeit | Fans: 10.788 | Adresse: http://www.facebook.com/TUI.com

Weleda

Branche: Schönheit/Beauty | Fans: 7.359 | Adresse: http://www.facebook.com/Weleda.Deutschland

Weltpremiere – Sprachsteuerung für Webseiten

admin — Thu, 09 Dec 2010 11:46:33 +0000

Ich freue, Euch heute ein weltweit einzigartiges und innovatives Projekt vorstellen zu dürfen.

Unter http://www.speech.webdesign-bamberg.net findet Ihr die ersten beiden Seiten im World Wide Web, die sich mit Hilfe von Spracheingaben bedienen lassen, ohne dabei zusätzliche Spracherkennungssoftware installieren zu müssen.

Alles was Ihr für die Sprachsteuerung benötigt sind ein funktionstüchtiges Headset, eine aktuelle Version des Flash Players und ein bisschen Mut zur Innovation. Alle weiteren Informationen zu den Einstellungen und zum Handling findet Ihr direkt auf der Seite. Feeback ist natürlich wie immer ausdrücklich erwünscht.

Social Media Trends 2011

admin — Tue, 30 Nov 2010 08:05:28 +0000

Ein ereignisreiches Jahr 2010 neigt sich so langsam dem Ende entgegen. Im Web waren Facebook, Twitter, Xing, StudiVZ usw. zweifelsohne das allgegenwärtige Thema. Ein Ende der Sozialen Netzwerke ist derzeit überhaupt noch nicht absehbar. Im Gegenteil: Experten erwarten den Höhepunkt der Social Media Welle erst im Jahr 2012. Grund genug also einen Blick in die Glaskugel zu wagen. In diesem Artikel möchte ich Euch drei Themen vorstellen, die sich 2011 zu einem echten Trend entwickeln könnten.

1. Location Based Services – Quo vadis?!

Einen wahren Boom erlebten in diesem Jahr Location Based Services – Tools, mit deren Hilfe sich der aktuelle Standort veröffentlichen, die Umgebung nach Freunden absuchen und ortsbezogene Angaben posten lassen… eine Thematik mit gewissem (Spaß-)Potential.

Die Problematik

Doch der „Big Brother Gedanke“, jederzeit jeden und alles verfolgen zu können, scheint alleine nicht auszureichen, um Benutzer langfristig zu binden. Nach einer Webstudie nutzt derzeit lediglich 1% aller Internetuser regelmäßig derartige Services.
Der Hauptgrund ist in erster Linie darauf zurückzuführen, dass die Popularität von Gowalla und Co. bis dato ausschließlich auf dem Spaß der User an der Sache und Mundpropaganda basiert, was nach einer gewissen Phase des Testens und des Ausprobierens auf kurz oder lang das sinkende Interesse der User zur Folge hat.
Genau diese Problematik wird die Ausrichtung und Funktionalität von Location Based Services im nächsten Jahr in hohem Maße beeinflussen und sich zu einer echten Chance für Anwender und Anbieter gleichermaßen entwickeln.

Foursquare´s mayoring – Modell

Bei einem Blick über den großen Teich trifft man auf das in Deutschland noch weitgehend unbekannte Foursquare, das ein Modell mit Zukunftsperspektiven verfolgt. Foursquare verfügt neben den aus anderen Services bekannten Funktionen über ein aktives Belohnungs- und Bonussystem, das den Usern zusätzliche Anreize bieten soll: Wer am häufigsten an einer Location (min. 2x) eincheckt, der wird zum Bürgermeister (“mayor“) dieser Einrichtung. Der Clou: dem Betreiber/ Ersteller einer Location steht es frei, für den Bürgermeister ein Sonderangebot (“special offer“ ) auszurufen. Beliebte Formen sind hierbei jegliche Arten von Preisnachlässen, gratis Getränke, Flatrates etc., was das Foursquare-Prinzip besonders für die Gastronomie und den Einzelhandel interessant macht.
Mit ein wenig Kreativität und etwas Gespür für Marketing lassen sich auf effiziente Art und Weise Anreize für Besucher schaffen und neue Kunden akquirieren. Zwar sieht die Praxis in Deutschland in Bezug auf Foursquare noch recht trostlos aus (gerade einmal 0,3% aller Orte bieten „special offers“), die Kombination aus Tracking, Interaktion und Anreiz für User ist jedoch so erfolgsversprechend, dass sie auch von anderen Services bereits aufgegriffen wurde.

Facebook Places / Facebook Deals

Wie sollte es auch anders sein ist der Social Media Gigant Facebook mit Einführung von Facebook Places auf diesen Zug aufgesprungen. Allein mit der Zahl der potentiellen Nutzer liefert Facebook schlagkräftige Argumente für einen Erfolg: Von 500 Millionen Usern weltweit verwenden 150 Millionen User Facebook von mobilen Endgeräten aus.
Das Angebot steckt in Deutschland allerdings noch in den Kinderschuhen. So können derzeit ausschließlich von mobilen Geräten aus zwar Orte erstellt, dort eingecheckt und die Aktivitäten an einem Ort verfolgt werden, doch die für Unternehmensseiten interessanten Funktionen wie beispielsweise die Verknüpfung eines Ortes mit Unternehmerseite, die Beanspruchung eines Ortes durch ein Unternehmen und v.a. die Facebook-Deals, das Pendant zu den „special offers“ von Foursquare, sind noch nicht in vollem Umfang nutzbar.
Aktionen, wie der „Destroyer Burrito“ von Nike in den USA, lassen aber schon jetzt die zukünftigen Möglichkeiten und die marketingtechnische Tragweite erahnen:

Facebook Deals – Belohnungssystem im Überblick

Die folgende Auflistung gibt einen Überblick über die verschiedenen Arten von Facebook-Deals und zeigt, wie diese in der Praxis Anwendung finden könnten:

Individual Deals (Einmalige Angebote)
Hierbei handelt es sich um einmalige Check-In Angebote, die sich sowohl an die bestehenden als auch an Neukunden richten und besonders für die Einführung von neuen Produkten geeignet sind.

Beispiele für Individual Deals:

Bei der Einführung eines neuen Produkts/ Kollektion erhalten die Kunden bei Check-In X Prozent Rabatt.
Der Kunde erhält bei Check-In ein kostenloses Geschenk zu seinem Einkauf.
Saisonale oder Tageszeitabhängige Specials für Check-Ins
wechselnde Specials des Tages
Die ersten 5 Check-Ins erhalten 20% Preisnachlass auf bestimmte Artikel.
Buy one, get one free für die ersten X Check-Ins
Bei einem Check-In innerhalb der nächsten X Minuten, Stunden oder Tage bekommen die Facebook-User 20% Preisnachlass auf den Einkauf.
Checkt ein User an seinem Geburtstag ein, so erhält er kostenlos X…
10€ Rabatt für Einkäufe ab 50€
Die ersten 10 Check-Ins erhalten kostenlosen Eintritt für das Event X…
die nächsten 25 Nutzer, die einchecken, erhalten X …
Die ersten X User, denen ein Event/Artikel/Gruppe etc. in Facebook gefällt, erhalten beim Check-In Y
Checkt ein User bei 2 befreundeten Unternehmen ein, erhält er X
Besonders geeignet für Restaurants, Hotels, Gaststätten usw.: Der User erhält bei Check-In einen kostenlosen Cocktail zum Abendessen /Aperitif
Eine Tasse Café gratis bei Check-In

Loyalty Deals (Treueangebote)
Die Treu des Kundesn wird belohnt. Checkt ein Kunde an einem Ort X mal ein, so erhält er als Treuebonus spezielle Sonderangebote, Preisnachlässe etc..

Beispiele für Loyalty Deals:

Eine Tasse Café gratis nach X Check-Ins
Ein kostenloser Kinobesuch nach X Check-Ins
Flatrate nach X Check-Ins
Mit X Check-Ins erhält der Besucher einen Treuegutschein im Wert von Y Euro
Bei zweimaligem Check-In an einem Tag erhält der User einen Rabatt von Y Prozent

Friend Deals (Gruppenangebote)
Friend Deals können nur dann eingelöst werden, wenn eine Gruppe von Leuten (maximal 8 Personen) zusammen an einer Location eincheckt. Dies hat zur Folge, dass sich für eine erfolgreiche Abwicklung des Deals mehrere Nutzer auf Facebook zwingend untereinander über das Angebot austauschen müssen, was gegenüber einmaligen Angeboten wiederum zu verstärkter Mundpropaganda und mehr Aufmerksamkeit führt.

Beispiele für Friend Deals:

Bei Check-In mit X Freunden erhält jeder Teilnehmer einen Gutschein über Y€ für den nächsten Einkauf
Checkt eine Gruppe bestehend aus 5 der mehr Leuten bei einer Bar, Diskothek Gaststätte etc. ein, so erhält jeder der Gruppe einen Verzehrgutschein in Höhe von X
Geeignet für Kino/Sportevents: Bei Check-In mit 3 Freunde erhält man ein kostenloses Popcorn
Checkt die erste Gruppe bestehend 8 Leuten bei einem Event ein, so erhalte alle freien Eintritt
Bei Check-In mit mind. 5 Leuten erhalten die Teilnehmer einen Preisnachlass X (weitere Möglichkeit: 3 Freunde erhalten 10%, 4 Freunde 20% Rabatt usw.)
Checkt ein Freund an einer Location mit ein, so erhält man kostenlos X
Die ersten 5 Leute, die zusammen mit 3 oder mehr Freunden einchecken, erhalten X
Neukundenwerbung: Checkt ein Neukunde zusammen mit einem Bestandskunden ein, so erhält der Neukunde X, der Bestandskunde Y

Charity Deals (Wohltätigkeit Deals)
Charity Deals richten sich an Unternehmen, die soziale Verantwortung übernehmen möchten. Für jeden Check-In eines Facebook Users spendet der Anbieter einen festgelegten Geldbetrag, Artikel etc. an gemeinnützige Einrichtungen. Facebook stellt dabei lediglich die Oberfläche, nicht aber die gesamte Infrastruktur für die Abwicklung des Spenden-Prozesses (PayPal, Zahlungsmethoden, Kontodaten etc.) zur Verfügung.

Beispiele für Charity Deals:

Spende pro Check-In 1€ für einen wohltätigen Zweck an einem bestimmten Tag X
Spende für jeden Check-In eine warme Mahlzeit für Obdachlose
Spende für jeden Check-In einen Gegenstand X
Für jeden Kauf von Handschuhen, Schals, Spielzeug etc. bei Check-In wird der gleiche Artikel an X gespendet
Jeder eingecheckte Nutzer erhält X Prozent Preisnachlass für den nächsten Einkauf, wenn er selbst einen Artikel für die Spende an Y vorbeibringt

2. Social Gaming

Begib dich sofort zur nächsten Kasse, erwerbe ein McMenü (besser zwei oder drei), gehe nicht über Los, und ziehe keinen Hauptgewinn ein… beim Burger Riesen Mc Donalds wird also wieder Monopoly gespielt.

Reale Welt meets social networks

Mit Beginn der Kampagne steigt zeitgleich auf Ebay und ähnlichen Plattformen die Zahl an Auktionen, in denen Sticker zu horrenden Preisen, geöffnet oder verschlossen, erworben werden können, um die fehlenden Straßen doch noch zu ergattern. Auf Facebook Pages wird gehandelt, gefeilscht, Diskussionen zu den Tauschobjekten geführt und via Twitter Statusmeldungen über die neusten Errungenschaften gepostet.

Die Anbieter selbst werden in Zukunft versuchen, sich dieses Verhalten der User weiter zu Nutze zu machen. Ergänzen sich die Sozialen Netzwerke doch hervorragend mit der Philosophie, die hinter den spielerischen Aktionen steckt: Je länger sich ein Kunde mit einer Marke beschäftigt, desto vertrauter wird er mit dieser und gleichzeitig steigt in einem bestimmten Zeitraum der Umsatz.
Doch nicht nur zum Gedankenaustausch allein sind die Social Media Plattformen bestens geeignet. Eine Steigerungsform dieses Ansatzes ist die Kombination aus einem realen Spiel und Verbreitung von Informationen über die sozialen Netzwerke, die das Spiel unmittelbar beeinflussen oder gar erst spielbar machen.
An diesem Punkt schließt sich letztendlich auch wieder der Kreis zu den Location Based Services. Geocaching wurde lange Zeit belächelt und als Hobby für einen Haufen Freaks abgestempelt, die nichts Besseres zu tun haben, als ihre Zeit mit der Suche nach Müll zu verschwenden. Schnitzeljagd, Echtzeit-Schatzsuche im Indiana Jones Stil, „Catch me if you can“, Scotland Yard, Georätsel, ortsbasierte Gruppenspiele… , all diese Spielevarianten könnten durch die Integration von Sozialen Netzwerken in Zukunft neuen Auftrieb erhalten und diese sich sowohl für die Teilnehmer als auch für werbetreibende Unternehmen (Adgames) zu einem, im wahrsten Sinne des Wortes, grenzenlosen Spielfeld entwickeln.

Social Gaming und virtuelle Güter

Lange Zeit stand Managern in der Spieleindustrie der Angstschweiß auf der Stirn, als man sie auf das Thema Social Gaming ansprach. Eine nicht ganz unbegründete Reaktion wie sich im Laufe der Zeit herausstellen sollte. Denn in der Tat waren Social Games maßgeblich für die markanten Umsatzeinbrüche am Spielemarkt verantwortlich.
Allein das Unternehmen Zynga, das mit der Entwicklung von Farmville 80 Millionen Hobbybauern auf den Plan rief, peilt für 2011 einen Umsatz von 2 Milliarde US Dollar an. Die Einnahmen stammen überwiegend aus dem Verkauf von virtuellen Gütern, wie etwa Traktoren und Bauernhäusern, die dem Spieler helfen, sich gegenüber seinen Konkurrenten einen unmittelbaren Vorteil zu verschaffen.
Den umwerfenden Erfolg des Unternehmens Zynga aus San Francisco, das erst im Jahr 2007 von 6 Personen gegründet wurde, konnten die großen Spieleschmieden unmöglich auf sich sitzen lassen. 2011 wird das Jahr, in dem auch Blizzard, Take Two (Civilization Network), Ubisoft und Co. versuchen werden, sich auf dem Markt zu positionieren. Die Spieleindustrie stuft Social Games mittlerweile mehr als Chance als eine Gefahr ein und setzt darauf, dass die Spieler auch über das Online-Angebot hinaus an den Produkten des jeweiligen Anbieters Gefallen finden.
Ralf Wirsing, Sprecher des Unternehmens Ubisoft, das mit „Die Siedler online“ bereits im Herbst die Bea-Version des beliebten Spiele-Klassiker mit beeindruckender Grafik ins Netz gebracht hat, sieht das ähnlich: „Social Gaming hat die Neugier vieler Leute geweckt, die bis dato keinerlei Erfahrungen mit Videospielen hatten.“
Social Gamer dürfen sich im Jahr 2011 also auf viele Stunden, Tage und Wochen Online-Spielspaß freuen.

3. Group Buying

Ein Thema, das 2011 zu einem echten Renner avancieren könnte, ist eine Variante des Social Commerce: Group Buying. Vorreiter auf dem Gebiet in Deutschland ist das Unternehmen Groupon (City-Deals), dessen Angebot sich heute schon großer Beliebtheit erfreut und eine ständig wachsende Zahl an teilnehmenden Kunden und Unternehmen verzeichnen kann. Dabei ist die Philosophie dahinter eigentlich eine alt bekannte: Je mehr Käufer sich für ein Produkt finden lassen, desto weiter sinkt der Preis – Einkaufsverbände in virtueller Form.

Während Groupon derzeit noch die eigene Plattform nutzt und der Facebook Seite lediglich die Multiplikatorenrolle mit einigen zusätzlichen Specials zukommen lässt, beginnen die ersten namhaften Firmen bereits mit Erfolg, Group Buying Aktionen direkt in Facebook zu integrieren. So findet man auf der Facebook Page von Walmart eine eigene Rubrik “CrowdSafer“, unter der jede Woche ein besonderes Angebot zum Vorzugspreis veröffentlicht wird. Bevor die Kunden allerdings in den Genuss dieses Preisnachlasses kommen, muss die vorgegebene Zahl an „Likes“ erreicht werden.

Die Vorteile der Verankerung in Facebook liegen auf der Hand: Zum einen kann die vollständige Palette der Facebook-Funktionalitäten verwendet werden, zum anderen stehen 500 Millionen Facebook Nutzer als potentielle Kunden zur Verfügung. Hinzu kommt für die Anbieter noch das Argument des gläsernen Facebook Users. Sie sind jederzeit in der Lage, die Angaben in öffentlichen Benutzerprofilen zu analysieren, neue Trends zu erkennen und Interessensbezogene Angebote zu erstellen.

Im Bereich des Social Commerce / Group Buying sind der Kreativität und den Anwendungsmöglichkeiten also nahezu keine Grenzen gesetzt. Die Folgende Auflistung zeigt eine kleine Auswahl an Ideen und Strategien, denen man in Zukunft häufiger bei Facebook begegnen könnte:

Die ersten X Benutzer, denen ein Angebot gefällt, bekommen das Produkt zum Preis von X, die zweiten Y Benutzer zum Preis von Y, usw.
Der erste, dem ein Artikel gefällt, bekommt ihn mit X-Prozent Rabatt
“Facebook Happy Hour“: Zwischen Y.00Uhr und Y.00 Uhr bekommen alle Fans einen Artikel zum Preis von Z
Geschlechtsspezifische Angebote: Alle Frauen/Männer, denen ein Angebot gefällt, bekommen den Artikel zum Preis von X
Ortsspezifische Angebote: Alle Kunden aus dem Ort X, denen ein Angebot gefällt, bekommen das Produkt zum Preis von Y
Kleingruppen Angebote: Gefällt dir und X deiner Facebook-Freunde das Angebot, so erhält die Gruppe es zum Preis von Y
Alle Personen, die in ihrem Profil unter Interessen X angegeben haben, erhalten einen Artikel zum Preis von Y.

Fotoserie: Bamberg in HDR-Bildern

admin — Thu, 07 Oct 2010 10:57:05 +0000

Das Kürzel HDR steht in Bezug auf die digitale Photographie für „High Dynamic Range“, was so viel bedeutet wie erhöhter Kontrastumfang. Ein HDR-Bild zeichnet sich gegenüber herkömmlichen Aufnahmen dadurch aus, dass innerhalb des Bildes feinste Strukturen und Details sowohl in den Schatten- als auch in den Lichtbereichen erhalten bleiben.

Fotoserie – Bamberg in HDR-Bildern

Vorgehensweise

HDR-Bilder bestechen meist durch eindrucksvolle Farben und Kontraste. Doch wie erreicht man eine derartige Vielfalt? Das Prinzip ist so einfach wie genial: Ein „echtes“ HDR-Bild wird nicht aus einer einzigen Aufnahme, sondern aus einer Serie von mindestens drei Bildern erzeugt. Jedes dieser Bilder wird dabei mit einer unterschiedlichen Belichtungszeit aufgenommen und enthält exakt den gleichen Bildausschnitt.

Mit Hilfe von geeigneter Bildbearbeitungssoftware werden die einzelnen Aufnahmen dann zu einer HDR-Datei zusammengeführt. In diesem entscheidenden Schritt wird der Farbtiefe eines Bildes, die bei herkömmlichen Spiegelreflexkameras im RAW-Datenformat maximal 14bit pro RGB-Farbkanal beträgt (16384 Farben pro Kanal), auf 32bit erweitert.

Wer anschließend das Ergebnis dieser Konvertierung betrachtet wird zunächst ziemlich enttäuscht sein und sich zu Recht fragen: wo ist denn nun dieser versprochene HDR-Look geblieben? Die verblüffende Antwort: Er ist eigentlich da, man sieht Ihn nur nicht. Standardmonitore und Drucker können derzeit leider nur 8bit (max. 16bit) darstellen. Bei „HDR-Bildern“, wie sie im Netz und in der obigen Galerie zu sehen sind, handelt es sich somit nicht um „echte HDR-Bilder“ , sondern der HDR-Effekt wird lediglich durch das anschließende Tone Mapping der jeweiligen Software simuliert. Dabei wird die Farbtiefe von 32bit wieder auf die eines normalen Bildes (8bit) reduziert.

Ausrüstung / Fotoserie

Für die Erstellung einer Fotoserie ist eine digitale (Spiegelreflex-) Kamera mit einstellbaren Belichtungszeiten notwendig. Zudem ist die Verwendung eines Stativs bei den Aufnahmen dringend anzuraten, da kleinste Bewegungen eine Veränderung des Bildausschnittes zur Folge haben. Diese Abweichungen führen bei der Zusammenführung in das HDR Format zu Unschärfe und unschönen Schlieren. Um die Kameraschwankungen so gering wie möglich ist zudem ein Selbst- bzw. Fernauslöser ist zu empfehlen.

Auch bei der Auswahl der Szenerie selbst ist darauf zu achten, dass das Motiv sich möglichst bewegungslos verhält. Personen, Tiere, Straßen etc. sind für eine Fotoserie daher nur bedingt als Motiv geeignet, aber auch der Wind kann bei Außenaufnahmen ein großes Hindernis darstellen.

Welche Belichtungszeiten bzw. wie viele Einzelaufnahmen für eine Serie notwendig sind, hängt stark von den gegebenen Lichtverhältnissen ab. In der Regel sind zwei unter-, zwei über- und ein normalbelichtetes Bild ausreichend. Der Abstand zwischen den einzelnen Belichtungszeiten sollte etwa 2 Stufen betragen.

Weitere Einstellungen, um Veränderungen im Bild zu vermeiden:

feste Blendenzahl
fester Weißabgleich
manueller Fokus

Software

Weiterführende Links und Tutorials

10 Minuten… tt_news um neue Marker erweitern

admin — Wed, 11 Aug 2010 06:41:02 +0000

Was man in 10 Minuten alles erreichen kann, das hat schon Ede Stoiber in seiner legendären Transrapid-Rede verweifelt versucht, dem Zuhörer verständlich zu machen. In 10 Minuten kann man im Gegensatz dazu aber auch etwas sehr produktives anstellen…

Das Problem

Vielleicht kommt Euch die folgende Situation, zumindest in ähnlicher Form, bekannt vor: Ihr sitzt gerade an einem Typo3-Projekt, habt die Nachrichtenerweiterung tt_news installiert und konfiguriert und bei der Erstellung des Templates fällt Euch auf, dass nicht ausreichend Marker zur Verfügung stehen bzw. die vorhanden Funktionen einfach nicht genügen, um die Vorlage nach Euren individuellen Vorstellungen anzupassen.

Dieser Artikel soll demonstrieren, wie Ihr in rund 10 min einen zusätzlichen Marker (in diesem Fall für einen Ansprechpartner einer Nachricht) inkl. des passenden Eingabefeldes im Typo3 Backend erstellen und somit für mehr Flexibilität in der Arbeit mit tt_news sorgen könnt. Wer Typo3, mit seinen auf den ersten Blick verworrenen Strukturen, als programmiertechnisches Hexenwerk betrachtet, dem sei gesagt: Neue Marker für tt_news anzulegen ist halb so wild.

An dieser Stelle sei noch erwähnt, dass es auch mit Hilfe von hooks und einer eigenen Erweiterung für tt_news möglich ist, neue Marker anzulegen. Viele Wege führen eben nach Rom… diese Beschreibung soll jedoch ein möglichst effizientes Vorgehen aufzeigen und richtet sich v.a. an Typo3- Anwender und User, die sich nicht täglich mit der Programmierung rund um Typo3 befassen.

Die Lösung

0. Sicherung der Quelldateien

Bevor Ihr Euch voller Tatendrang in die Erweiterung stürzt, sichert Euch zunächst bitte die folgenden Orginaldateien, die sich in der Verzeichnisstruktur von tt_news (typo3conf/ext/tt_news/…) befinden:

tca.php
pi/class.tx_ttnews.php
res/tt_news_v3_template.php
falls benötigt locallang_tca.xml

1. Datenbanktabelle erweitern

Um die im Backend eingegebenen Ansprechpartner zu speichern, benötigen wir zunächst ein zusätzliches Feld in der Datenbanktabelle tt_news. Mit Hilfe des Datenbankadministrationstool phpMyAdmin fügen wir an das Ende der Tabelle ein neues Feld mit dem Namen 'Ansprechpartner'.

Wichtig ist bei diesem Schritt die korrekte Deklaration des Feldes. Da es sich bei einem Ansprechpartners zweifelsohne um Wörter, also eine Zeichenkette, handeln wird, wählen wir für das Feld den Datentypen VARCHAR aus. MySQL setzt dabei die Angabe der maximalen Länge des Strings voraus. 128 Zeichen sollten für den Vor- und Zunamen hierbei ausreichen.

Falls Ihr mehr Infos zu den MySQL-Datentypen benötigt oder nicht schlüssig seid, welcher für Euer Feld der Passende ist, dem empfehle ich einen Blick ins übersichtliche Manual von MySQL.

2. Anpassung des Backends (ext/tt_news/tca.php)

Nachdem wir mit dem Anlegen des Datenbankfeldes die notwendige Infrastruktur geschaffen haben, geht es in diesem Schritt nun darum, das Eingabefeld im Backend von Typo3 zu erzeugen und dafür zu sorgen, dass die Daten auch im dafür vorgesehenen Feld der Datenbank gespeichert werden.

Die Datei tca.php (Table Configuration Array) ist für die Anzeige der Formularelemente im Backend sowie für das korrekte Ablegen der Eingaben in der Datenbanktabelle verantwortlich. Drei kleine Ergänzungen im Code sind hier nötig:

PHP-Code (Zeile 25):

$TCA['tt_news'] = Array (
	'ctrl' => $TCA['tt_news']['ctrl'],
	'interface' => Array (
		'showRecordFieldList' => 'title,hidden,datetime,starttime,
                archivedate,category,author,author_email,short,image,
                imagecaption,links,related,news_files,Ansprechpartner'
	),

Das Array $TCA['tt_news'], das für die komplette Konfiguration der Backendanzeige verantwortlich ist, beinhaltet eine Reihe von weiteren Unterarrays. Eines davon ('interface' => Array…) hält für Typo3 die Informationen bereit, welche Eingabefelder auf der Oberfläche geladen werden. In der Liste ('showRecordFieldList' => '…') fügen wir das Feld Ansprechpartner hinzu, welches wir im folgenden Schritt genauer spezifizieren:

PHP-Code (Zeile 150):

               'no_auto_pb' => Array (
			'l10n_mode' => 'mergeIfNotBlank',
			'exclude' => 1,
			'label' => 'LLL:EXT:tt_news/locallang_tca.xml:tt_news.no_auto_pb',
			'config' => Array (
				'type' => 'check'
			)
		),
		'short' => Array (
			'exclude' => 1,
			'label' => 'LLL:EXT:lang/locallang_general.php:LGL.subheader',
			'l10n_mode' => $l10n_mode,
			'config' => Array (
				'type' => 'text',
				'cols' => '40',
				'rows' => '3'
			)
		),
               'Ansprechpartner' => Array (
 			'label' => 'Wer ist der Ansprechpartner?',
 			'config' => Array (
 				'type' => 'input',
 				'size' => '50',
 				'max' => '128'
 			)
 		),

Wie die anderen Eingabefelder benötigt auch unser neues Formularelement ein eigenes Konfigurationsarray, in dem der Typ, das zugehörige Label etc. festgelegt werden. Zwar ist die Reihenfolge dieser Konfigurationsarrays innerhalb des $tca Arrays unabhängig von der späteren Ausgabe im Backend, der Übersicht halber habe ich es jedoch direkt nach der Kurzbeschreibung eingefügt, also an der Stelle, an der es später auch im Backend angezeigt werden sein soll.

Um sicherzustellen, dass die Eingabe im richtigen Datenbankfeld gespeichert wird, ist für den Namen des Arrays die exakt gleiche Schreibweise, wie der Name des Feldes in der Datenbank ('Ansprechpartner'),erforderlich. Mit Hilfe des 'label'-Attributs könnt Ihr die Überschrift im Backend entsprechend festlegen. Hier habt Ihr die Möglichkeit entweder direkt einen Wert einzugeben ('Wer ist der Ansprechpartner?') oder einen Wert aus der locallang_tca.xml-Datei, in der die Labels in unterschiedlichen Sprachen festgelegt sind, automatisch einfügen zu lassen ('LLL:EXT:tt_news/locallang_tca.xml:tt_news.LABELNAME'). Die letztere Variante ist besonders dann zu empfehlen, wenn Ihr die Mehrsprachigkeit des Backends nutzt, da das Label dann in der jeweiligen Landessprache ausgegeben wird.

Das 'config' -Array ist schließlich für die eigentliche Konfiguration des Formularelements zuständig. Der 'type' gibt dabei an, welcher Typ von Formularelement erzeugt werden soll (Texteingabe, mehrzeilige Textarea, Checkboxen, Radiobuttons etc.). In unserem Beispiel wird für den Ansprechpartner ein einfaches Texteingabefeld angelegt. Die Parameter 'size' und 'max' bestimmen die Breite des Textfeldes bzw. die maximale Anzahl an zulässigen Zeichen. Wer hier tiefer einsteigen möchte und mehr Informationen zu den einzelnen Parameteren und Datentypen benötigt, findet in der Dokumentation von Typo3 eine Auflistung aller Typen3 sowie deren zulässige Attribute.

PHP-Code (Zeile 423):

'types' => Array (
		'0' => Array('showitem' =>
			'hidden, type;;;;1-1-1,title;;;;2-2-2,short,Ansprechpartner,bodytext;;2;richtext:rte_transform[flag=rte_enabled|mode=ts];4-4-4,
			--div--;LLL:EXT:tt_news/locallang_tca.xml:tt_news.tabs.special, datetime;;;;2-2-2,archivedate,author;;3;; ;;;;2-2-2,
				keywords;;;;2-2-2,sys_language_uid;;1;;3-3-3,
			--div--;LLL:EXT:tt_news/locallang_tca.xml:tt_news.tabs.media, image;;;;1-1-1,imagecaption;;5;;,links;;;;2-2-2,news_files;;;;4-4-4,
			--div--;LLL:EXT:tt_news/locallang_tca.xml:tt_news.tabs.catAndRels, category;;;;3-3-3,related;;;;3-3-3,
			--div--;LLL:EXT:tt_news/locallang_tca.xml:tt_news.tabs.access, starttime,endtime,fe_group,editlock,
			--div--;LLL:EXT:tt_news/locallang_tca.xml:tt_news.tabs.extended,
			'),

Die letzte Änderung in der tca.php bezieht sich auf die Position, an der unser Eingabefeld im Backendformular ausgegeben werden soll. Mit Komma getrennt fügen wir es in der Liste ( 'showitem' -Array) auf der 1. Seite ('0'=>) hinter der Kurzbeschreibung (short) ein. Das wars auch schon.

3. Erstellen des Markers (ext/tt_news/pi/class.tx_ttnews.php)

In der Basisklasse class.tx_ttnews.php der Erweiterung, genauer gesagt in der Funktion function getItemMarkerArray( $row, $lConf, $textRenderObj) werden nun die Marker und die Codefragmente erzeugt, die an der jeweiligen Position des Markers in den HTML Code integriert werden sollen. Alle Marker der tt_news Extension werden in einem assoziativen Markerarray $markerArray[] zwischengespeichert und mit dem jeweiligen Wert versehen.

Mit $markerArray['###ANSPRECHPARTNER###']=$row['Ansprechpartner'] erstellen wir einen neuen Marker ###ANSPRECHPARTNER### und weisen diesem den Wert aus der Datenbank zu:

PHP-Code:

function getItemMarkerArray($row,...){
...
$markerArray['###ANSPRECHPARTNER###'] = $row['Ansprechpartner'];
...
}

Bei dem an die Funktion getItemMarkerArray() übergeben $row-Array handelt es sich um einen kompletten Datensatz aus der Tabelle tt_news der Datenbank. Um an den gespeicherten Wert des Ansprechpartners zu gelangen, verwenden wir die assoziative Schreibweise $row['Ansprechpartner'].

4. Verwendung des Markers im Template (ext/tt_news/res/tt_news_v3_template.html)

Wie auch die Standardmarker von tt_news können auch die Hinzugefügten mit der entsprechenden Schreibweise (###MARKER###) direkt im Template verwendet werden. Unser Ansprechpartner für eine Nachricht lässt sich somit über ###ANSPRECHPARTNER### ins Template einfügen.

5. Unbedingt beachten !!!

Bei einem Update von tt_news werden Eure modfizierten Dateien mit den Codeänderungen automatisch überschrieben und müssen somit nach dem Updatevorgang erneut hinzugefügt werden. Es ist daher dringend zu empfehlen, die angepassten Dateien zu sichern und diese mit einem kurzen Kommentar über die vorgenommenen Änderungen zu versehen. Die Datenbankstrukturen (die hinzugefügten Felder und die bestehenden Einträge) bleiben bei einem Update von tt_news in der Regel erhalten.

Showcase: 50 Sportler/-innen Webseiten

admin — Wed, 19 May 2010 11:00:34 +0000

Design und Analyse

Beim Design von Sportler/-innen Webseiten können im Allgemeinen zwei unterschiedliche Strategien beobachtet werden: Zum einen steht die Sportart im Vordergrund, die die Profisportler ausüben. Oft werden charakteristische Farben, Elemente, Fotos, populäre Assoziationen und nicht zuletzt die Eigenschaften einer Sportart gewählt, um den Besucher auf den ersten Blick zu verdeutlichen, welchen Sport ein Athlet ausübt.

Hervorragend lässt sich ist dies am Webauftritt von Julius Brink und Jonas Reckermann nachvollziehen: Denkt man beispielsweise an Beachvolleyball, so kommt einem natürlich zuerst Sonne, ein Strand mit Palmen, ein strahlend blauer Himmel und ein türkisfarbenes Meer in den Sinn. Zwar werden viele Beachvolleyballturniere heutzutage gar nicht mehr an derartigen Bilderbuchstränden ausgetragen, aber genau diese vorurteilsbehafteten Vorstellungen werden vom Designer der Webseite aufgegriffen: Dem Besucher, der die beiden Sportler ev. vom Namen oder vom Aussehen her nicht kennt, wird dadurch auf den ersten Blick und unmissverständlich vermittelt, dass es hier um zwei Beachvolleyballer handelt.

Interessant sind auf dieser Webseite auch die konsequent eingestreuten Grunge Elemente (Farbkleckse, Schrift, Anordnung). Grunge, was übersetzt so viel wie Schmutz bedeutet, ist ein Webdesigntrend, der auf gerade Kanten, klare Formen und Strukturen verzichtet und auf diese Art versucht, dem Mainstream entgegenzuwirken. Genau diese Eigenschaften treffen im übertragenen Sinn auch auf die Sportart Beachvolleyball zu: Sie ist als Trendsportart einzuordnen, die sich v.a. bei Jugendlichen größter Beliebtheit erfreut. Gespielt wird sie, im Gegensatz zum fast schon bieder wirkenden Hallenvolleyball, von der breiten Masse meist in Schwimmbädern, an Seen oder am Strand, auf unebenem Sand, ohne klare oder nur mit selbst bestimmten Spielfeldbegrenzungen und Regeln, oft mit lauter Musik usw.. Von diesem Standpunkt aus betrachtet ist die Verwendung von Grunge Elementen nachvollziehbar und eine logische Wahl.

Ein zweiter Ansatz beim Design von Sportler/-innen Webseiten konzentriert sich auf die reine Außendarstellung der Person. Bestes Beispiel hierfür sind die Webauftritte von David Beckham oder Serena Williams, bei denen auf der Einstiegsseite kaum Elemente aus den Bereichen Fußball bzw. Tennis zu finden sind. Vielmehr steht die Person im Vordergrund und es dominiert ein elegant-lässiger Charakter. Da beide als zweites, manche meinen als erstes, Standbein auch in der Modebranche bzw. als Model Fuß gefasst haben, ist dies auch nicht allzu verwunderlich.

Aus technischer Sicht stehen Flashinhalte bei den Webauftritten der Athleten immer noch hoch im Kurs. Zum einen lassen sich persönliche Videos, die Einblicke in das Privatleben des Stars liefern sollen und so die Distanz zum Fan verringern sollen, und Erfolgsvideos einbinden. Andererseits bietet Flash die Möglichkeit, die Dynamik des jeweiligen Sports in den Animationen widerzuspiegeln.

Zielgruppe

Zwar hängt die Hauptzielgruppe von Sportler/-innen Webseiten stark von der jeweiligen Sportart bzw. dem Athleten selbst ab, allgemein betrachtet bewegt sie sich aber in etwa im Bereich zwischen 12-35 Jahren. Dies liegt einerseits darin begründet, dass viele Athleten gerade von Jugendlichen als Idol angesehen werden. Daher werden auf vielen Seiten diverse Möglichkeiten angeboten, um mit dem Sportler in Kontakt zu treten: Sei es durch einen Gästebucheintrag, eine persönliche Email oder durch Autogramm- und Fanpostanschriften. Auch das Tagebuch des Athleten ist ein sehr beliebtes und häufig verwendetes Mittel, um den Kontakt mit den Fans von Seiten des Sportlers aus zu festigen.

Für Fans im jungen Erwachsenenalter hingegen, für die der Sportler nicht mehr die Rolle des Idols oder Vorbilds einnimmt, werden auf vielen Webseiten Onlineshops angeboten, über die auf die Zielgruppe zugeschnittene Fanartikel, Collectionen oder Accessoires erworben werden können, wodurch sich die Popularität des Sportlers aus wirtschaftlicher Sicht weiter steigern lässt.

Nun aber genug der Worte, hier kommen 50, teilweise beeindruckende, Webseiten: