Webdesign und Webentwicklung im Webstandard-Blog

Creative Image-Galleries by jQuery

webstandard — Thu, 16 Jul 2009 03:46:33 PDT

Die Phase in der sich Besucher von Webseiten entscheiden, auch nach der ersten Wahrnehmung der Webseite weiterhin auf dieser zu verweilen oder bspw. den Kauf eines Produktes erwägt, spielt die Emotion die beim Besucher geweckt wird den entscheidenden Faktor. Daraus resultierende Fragen beziehen sich dann darauf, ob diese Seite dem Besucher einen Mehrwert bietet. Das könnten gesuchte Informationen oder aber eben auch Produkte sein, die er oder sie möglicherwiese bereit sind zu kaufen. Um nun diese Emotionen zu wecken, gibt es in der Online-Welt des WWW kaum ein effektiveres Gestaltungselement als Bilder. Die Art und weise der Präsentation von Bildern und Bilder-Galerien kann auf verschiedenste Arten angegangen werden. Das JavaScript-Framework jQuery bietet f�r die Präsentation von Bildern zahlreiche Möglichkeiten. Ob sliding, switchen oder scrollen, der Galerie-Vielfalt sind kaum Grenzen gesetzt, aber seht selbst.

FullScreen Image-Gallery

SupersizedGallery

ImageRotator

Galleria

Content-Gallery

Galleriffic

EasySlider

ImageScroller

Slider

ImagesSwitch

Eine weitere Anwendungsmöglichkeit zur Präsentation von Bildmaterial ist der Panaramo-Blick. Auch wenn das folgende jQuery-Plugin nicht der Kategorie "Bilder-Galerie" entspricht, ist es trotzdem allemal einen (Panorama-)Blick wert.

PanoramaView

Wer auch diesmal weitere interessante jQuery-Anwendungsbeispiele für Bilder-Galerien kennt und sie mit anderen teilen möchte, ist hiermit dazu aufgerufen den entsprechenden Link im Kommentarbereich zu kommunizieren.

Bing und Twitter werden zu BingTweets

webstandard — Wed, 15 Jul 2009 01:35:11 PDT

Mit bingtweets.com verbindet die mittlerweile recht erfolgreiche Suchmaschine Bing, die Suchergebnisse der normalen Websuche mit realtime Tweets von Twitter. Diese im Beta-Stadium befindliche Anwendung wurde von Federated Media in Kooperation mit den Redmondern ins Leben gerufen, in der Hoffnung damit eine weitere Anwendung zu besitzen die dem Marktführer Google Marktanteile abnimmt. Neben den üblichen Suchergebnissen, erhält der User auch aktuelle Tweets zu dem jeweiligen Suchbegriff. Bei Suche nach dem Begriff Webstandard überrascht demnach auch nicht, dass mein Twitter-Account "Webstandard", dass erste Suchergebniss in der normalen Websuche bildet.

... Many people share their thoughts on Twitter, and search engines don't currently do a great job of capturing that real-time content....

Nach dem Neuerscheinen eines neuen Tweets wird auch nicht die gesamte Seite neugeladen, sondern lediglich die bisherigen Tweets durch den neuen Tweet via jQuery mittels Slide-Effekt neu ausgerichtet. Im oberen Bereich der Webseite von bingtweets.com gibt es Suchanfragen zu populären Themen wie dem All Star Game oder Harry Potter, sowie zu Personen oder aber auch Produkten. Natürlich hat man auch und das verwundert sicherlich kaum jemanden der Twitter kennt, die Möglichkeit die vorgenommen Suchanfrage über Twitter mit einem Tweet weiter verbreiten zu können.

Alles in allem ist bingtweets.com durchaus interessant, aber ob sich diese kombinierte Art des Suchens nach Web- bzw. Twitterinhalten auch durchsetzen wird, wird die Zukunft zeigen.

BingTweets als Traffic-Lieferanten nutzen!

Aufgrund der steigenden Reichweite der Bing-Anwendungen und den weiterhin ansteigenden Twitter-Accounts, besitzt BingTweets durchaus die Möglichkeit ein Traffic-Lieferant werden zu können. Vorausgesetzt es handelt sich bei den Suchbegriffen um populäre Themen, denn deren Suchanfragen sind logischerweise wesentlich größer und somit zumindest für einen Moment im Fokus der Suchenden.

Alles in allem würde ich diese Anwendung aber eher im Bereich Spielerei einordnen, denn für die übliche Suche im Web verwende ich Google und um Tweets zu verfolgen, verwendet ich Twitter. Ein wirklicher Mehrwert dieser Anwendung hat sich mir, im Vergleich zu xRank dem Bing Pendant zu Google-Trends, daher nicht erschlossen. Was wäre euer Fazit zu BingTweets?

Vintage, HDR, Blur und Co. - Tutorials zur Bildbearbeitung mit Adobe Photoshop

webstandard — Mon, 13 Jul 2009 01:30:23 PDT

Im Gewinnspiel für "Das Photoshop-Buch für digitale Fotografie" wurden über 30 interessante Links zu Tutorials zur Bildbearbeitung digitaler Fotografien von den Lesern zusammengestellt. Da man im alltäglichen Umgang mit Fotografien nicht selten die ein oder andere Anpassungen einer solchigen vornehmen muss, habe ich von den zur Verfügung stehenden Tutorials, die 7 interessantesten Photoshop-Tutorials zusammengestellt. Ob dem Erzielen eines höheren Kontrastes, dem Erzeugen eines Bildes mit HDR-, Vintage- oder Film-Effekt, in wenigen Schritten gelangt man vom Ausgangsmotiv zu einem sehr ansehnlichen Endprodukt. Verdeutlicht werden die Möglichkeiten der Bildbearbeitung, durch einen "Vorher - Nachher - Vergleich".

High Dynamic Range - HDR Style-Effekt

Enhance Background Blur - Unschärfe für den Hintergrund

Movie-Effect - Filmeffekt

Colorize - Schwarz-Weiß Fotos kolorieren

Lab mode - Schärfere Bilder mit dem LAB-Modus

Vintage - Vintage-Effekt

Contrast - Erzeugen von mehr Kontrast

In dem folgenden Showcase ( 5:09min ) von Martin Melcher wird eine "normal aussehende" junge Frau, in nur wenigen Minuten in eine natürliche Schönheit verwandelt. Auch die übrigen Artikel seiner Kategorie "Photoshop" kann ich euch von der fachlichen Seite her, wirklich nur ans Herz legen.

Natural Beauty Retouching with Photoshop

Wer weitere interessante Photoshop-Tutorials zur Optimierung von Fotografien kennt, kann diese hier gern kommunizieren. Sie werden der Tutorialliste, inklusive des Backlinks des Kommentatoren, hinzugefügt. Vielen Dank noch einmal an alle Leser die diese interessante Linksammlung erstellt haben.

Das Adobe Photoshop CS4 Praxisbuch - Gewinnspiel

webstandard — Tue, 07 Jul 2009 23:36:58 PDT

Geballtes Photoshop-Wissen - aktuell zu CS4! Dieses Buch aus dem Galileo-Verlag vermittelt umfassend, praxisnah, aber trotzdem leicht, wozu Photoshop CS4 in der Lage ist. Vom "schnellen Einstieg", der die Arbeitsoberfläche, Werkzeuge und Fachwissen zur "Bildbearbeitung" vermittelt, über die Art und Weise Bilder korrigieren zu können, zum Kapitel "Reparatur & Retusche", bis hin zu Profi-Know-How in dem Wissen über Ebenenmasken, Füllmethoden, Smartfilter und Smart-Objekte vermittelt wird. Dieses Buch bietet vom Einsteiger bis Profis lesens- und lernenswertes! Aus diesem Grund gibt es hier im Webstandardblog ab heute die Möglichkeit dieses 1120 Seiten starke Buch "Adobe Photoshop CS4 - Das Praxisbuch zum Lernen und Nachschlagen" von Sibylle Mühlke im Wert von 49,90 Euro, inklusive DVD und Referenzkarte gewinnen zu können.

Was muss man tun, um am Gewinnspiel teilnehmen zu können?

Ihr müsst hier bis zum 16.07.2009 lediglich einen Kommentar veröffentlichen mit dem ihr verdeutlicht, dass ihr dieses Buch gewinnen wollt. Aber bitte es mehr Kreativität zeigen, als lediglich "hier" zu schreien bzw. schreiben ;o) Zudem sollte der/die Kommentator(in) eine gültige E-Mail-Adresse zwecks Gewinnmitteilung angeben! Ihr seht es ist diesmal wirklich denkbar einfach, um an dieses 2,9 Kilogramm (!) schwere Lern- und Nachschlagewerk zu gelangen.

Adobe Photoshop CS4 - Das Praxisbuch zum Lernen und Nachschlagen

Die Autorin Sibylle Mühlke, vermittelt in ihrem gut strukturierten Buch mit übersichtlichen Workshops in über 1100 Seiten unter anderem wie man mittels Photoshop-CS4 Bilder bearbeiten und optimieren kann und somit den Weg zum perfekten Bild "selbst finden" kann. Aber auch Grundlagen zu Farben und Farbkompositionen finden sich in diesem Buch wieder. Neben den gängigen Bearbeitungs- und Retuscheproblemen, bietet die Autorin aber auch eine Menge lesenswertes für Fortgeschrittene zu den Themen Auswählen, Freistellen und Maskieren, der Tonwertkorrektur, Gradationskurven ( siehe große Abbildung ), dem Arbeiten mit RAW-Dateien, Filtern u.v.a.m.

Auf der beiliegenden DVD findet man sämtliche Beispielbilder aus den Workshops, eine 30-Tage-Testversion von Photoshop CS4 (Mac und Windows), kostenlose Plug-ins, Share- und Freeware, sowie anschauliche Video-Lektionen von über 2 Stunden Länge, zu Photoshop-Techniken und professioneller Bildbearbeitung. Zudem enthält das Buch auch noch eine Referenzkarte, auf der die Tastenkürzel für den Umgang mit der Software abgebildet sind.

Erhöht Eure Gewinnchance!!! Da ich hier versuche immer im Sinne der Leser zu agieren, noch ein Tipp der eure Chancen auf den Gewinn dieses Buches erhöht: Bei Steffen auf www.lens-flare.de habt ihr die Möglichkeit eines von 3 weiteren Exemplaren dieses Buches gewinnen zu künnen.

Der Gewinner oder die Gewinnerin des 3.Buches der "Photoshop-Gewinnspielserie" hier im Webstandardblog wird im übrigen wie üblich, via Zufallsgenerator ermittelt. Allen Teilnehmern, viel Glück!

Mit Ziffern in �berschriften zu mehr Traffic - Sprecht Emotionen an!

webstandard — Mon, 06 Jul 2009 23:39:26 PDT

Die wohl durchdachte Strukturierung des Textes einer Webseite ist das "A & O". Denn sie wird nicht, wie die Seite eines Buches gelesen, sondern in den meisten Fällen lediglich "gescannt". Der Grund ist denkbar einfach - das Lesen am Bildschirm ( egal welcher Größe ) ist wesentlich anstrengender. Daher ist es umso wichtiger mit wenigen Worten die Emotionen beim Betrachter zu wecken, die dazu führen das dieser die entsprechenden Texte auch liesst. Neben grafischen Elementen die einen Webseitenbesucher auf der Webseite "halten", spielen vor allem Überschriften die zentrale Figur. Sie sollten kurz und knapp sein, trotzdem aber auch genügend Informationen ( Stichwort: Keywords ) vermitteln um über sie Reize anzusprechen und Emotionen zu wecken, die dann wiederum in einem Klick und am Ende in mehr Traffic enden. Ein sehr hilfreiches Hilfsmittel diesbezüglich sind Ziffern.

... Überschriften wie "Top-5 ..." oder "Best 10 ..." erfüllen lediglich den Tatbestand des "Schw...vergleiches".

Versteht der Besucher die überschrift nicht oder weckt sie bei ihm keine Emotionen und erreicht damit nicht das Interesse des Besuchers, besteht die Gefahr, dass dieser den Rest des Artikels gar nicht mehr wahrnimmt. Eine vertane Chance, deren Aufwand sich in jeglicher Hinsicht in Grenzen hält. Das Ziffern hierbei eine entscheidende Rolle spielen, zeigen die folgenden 2 Varianten je einer Überschrift.

"Die besten zehn JavaScript-Frameworks"

"Top 10 aller JavaScript-Frameworks"

Welche Überschrift hättet ihr angeklickt?

Mit hoher Wahrscheinlichkeit die zweite Überschrift. Und das hat seine Gründe! Denn der sehr prägnante Begriff "Top" ist eindeutig und weckt beim Betrachter eher die Emotionen, als die Bezeichnung "Die Besten", auch wenn beide ( mehr oder weniger ) die selbe Bedeutung besitzen. Außerdem wird die Wahrnehmung der zweiten Überschrift durch die Ziffer "10" verstärkt, weil sie sich in direkter Nähe zum Wort "Top"befindet, wodurch der Betrachter hier eher zum klicken animiert wird, als bei der Variante mit dem ausgeschrieben Wort "zehn".

Genauso wie Kaufentscheidungen offline und online, nicht auf der rationalen, sondern auf der emotionalen Ebene stattfinden, genauso ist es zu großen Teilen auch mit Text. Wenn ihr als Blogger diese emotionale Ebene mit den entsprechenden Keywords beim Besucher ansprechen könnt, steigen mit hoher Wahrscheinlichkeit die Chancen auf mehr Traffic. Selbst wenn glaubt, eine sachliche Entscheidung aufgrund der Wörter einer Überschrift getroffen zu haben, wird man feststellen müssen, das ein Teil dieser Entscheidung der zum Klick auf diese geführt hat, durch die mittels der Überschrift geschaffenen Emotionen "geleitet" wurde.

"Die besten fünf CSS-Seiten"

"Die besten 5 CSS-Seiten"

Beim zweiten Beispiel wird durch die direkte Nachbarschaft der "5" zum Akronym CSS eine besondere Nähe hergestellt. Wie ihr seht, ist neben dem eigentlichen Einsatz von entsprechend "emotionsauslösenden Keywords und Ziffern", auch die Position derer zueinander nicht ganz unwichtig. Umso dichter sie bei einander stehen, um so schneller kann der Betrachter einen Bezug zwischen den Beiden herstellen. Außerdem bildet eine Zahl am Anfang einer Überschrift einen größeren Blickfang als am Ende, denn der vielleicht emotionsauslösende Moment wird hierdurch unnötig hinausgezögert. Daher sollten Überschriften auch immer kurz, aber trotzdem aussagekräftig sein.

Wer diese Art der Kennzeichnung von Überschriften einsetzt, wird allerdings nicht selten mit dem Vorwurf konfrontiert, Überschriften wie "Top-5 ..." oder "Best 10 ..." erfüllen lediglich den Tatbestand des "Sch...vergleiches". Man wolle damit nur "besser oder größer" wirken als die Überschriften anderer Blogbeiträge. Wer diesen Artikel gelesen hat und die hier beschriebenen Auswirkungen kennt, dürfte es nun ( vielleicht ) besser wissen.

Die Verwendung von Ziffern in Überschriften eines Blogartikels helfen auch dabei, sich bei der großen Anzahl an Blogs mit einer entsprechend hohen Anzahl an Artikeln "abzusetzen" und führen in Kombination mit den richtigen Keywords, beim Leser eher dazu Emotionen anzusprechen, die wiederum dazu ühren, dass der durch die Überschrift repräsentierten Artikel auch gelesen wird. Denn eine Überschrift muss beim Leser "hängen bleiben" und dafür sind Ziffern einfach prädestiniert.

Webdesign und Webentwicklung im Webstandard-Blog

Creative Image-Galleries by jQuery

Ähnliche Artikel zu diesem Thema:

Bing und Twitter werden zu BingTweets

BingTweets als Traffic-Lieferanten nutzen!

Ähnliche Artikel zu diesem Thema:

Vintage, HDR, Blur und Co. - Tutorials zur Bildbearbeitung mit Adobe Photoshop

Ähnliche Artikel zu diesem Thema:

Das Adobe Photoshop CS4 Praxisbuch - Gewinnspiel

Was muss man tun, um am Gewinnspiel teilnehmen zu können?

Adobe Photoshop CS4 - Das Praxisbuch zum Lernen und Nachschlagen

Ähnliche Artikel zu diesem Thema:

Mit Ziffern in �berschriften zu mehr Traffic - Sprecht Emotionen an!

"Die besten zehn JavaScript-Frameworks"

"Top 10 aller JavaScript-Frameworks"

"Die besten fünf CSS-Seiten"

"Die besten 5 CSS-Seiten"

Ähnliche Artikel zu diesem Thema: