CSS: Textoverlay bei Bildern

CSS Design Spielerein

Beim Besuch im Adwords Account bin ich eben auf einen Eye-Catcher in Sachen Hintergrundbild mit Text-Overlay gestoßen. Im Prinzip eine simple Zweier-DIV Konstruktion gepaart mit Google Fonts ergeben doch ein ansehnliches Ergebnis.

Um das Ganze als Post-It für einen eventuellen späteren Einsatz zu verwenden, im Folgenden eine experimentelle DIV-IMG-Bastelei. Ich werde mir dafür circa 10 Minuten zum Nachbau des Webdesign-Konstrukts vornehmen. Los geht’s – hier ein Screenshot zum Objekt. „CSS: Textoverlay bei Bildern“ weiterlesen

Sidebar in Twenty Eleven

Sidebar Twenty Eleven Wordpress

WordPress geht nach vorn und mit der 3.2er Version ist wieder mal ein großer Wurf gelungen. Das Backend finde ich absolut gelungen, da es noch mehr Freiraum bietet und in Sachen Usablity auch endlich übersichtlicher geworden ist. Will man nun die neusten Features in Sachen Template-Gestaltung nutzen und nicht gerade ein Premium kaufen, dann empfiehlt sich durchaus das Twenty Eleven Theme.

Es besticht aus meiner Sicht vor allem durch den ‚Trend‘ Big is beautiful – sowohl in Sachen Font Size, als auch in Sachen Header Image (Titelbild). Dazu, bevor ich zum eigentlichen Thema komme, noch kurz ein paar Worte. „Sidebar in Twenty Eleven“ weiterlesen

Firefox 5 und Add-On Kompatibilität

Firefox 5

Irgendwie war es an mir vorbeigegangen, und ist mir jetzt aufgefallen, als ich das Page Speed Add-On im Firebug verwenden wollte und dieses nicht angezeigt wurde. Der Firefox 5 ist da. Klammheimlich aktualisiert sich der Firefox, obwohl ich meine, dass erst kürzlich die 4er Version erschienen war.

Ich nutze den Firefox eigentlich sehr gern, weil es eine ganze Reihe nützlicher Add-Ons wie etwa den Firebug, Quirk SearchStatus, Page Speed oder die Web Developer Toolbar gibt, die echten Mehrwert bieten. Dass aber durch den Update Zyklus doch öfters mal die Kompatibilität zu installierten Add-Ons flöten geht finde ich schon etwas nervig. Eine Art Abwärtskompatibilität wäre hier wirklich wünschenswert. Ich weiß, der Firefox (5) ist kostenlos, Open Source etc. pp. – aber technisch sollte diese doch machbar sein…

Eine zweite Sache, wo ich allerdings noch nicht so recht weiß, ob es mit Firefox 5 zusammenhängt ist, dass WordPress und die Admin-Bar zum Teil Fehler bringen, sprich dass die Admin-Leiste mal angezeigt wird und mal nicht. Dass es nicht am WordPress Code liegt, habe ich im Chrome getestet, hier funktioniert alles soweit. Kann natürlich auch mit den Cookies zusammenhängen, muss ich dann mal testen. Fakt ist aber, dass nach der automatischen Installation eine Firefox-Updates immer kleine Fehler mit WordPress oder GoogleMail auftauchen, dass sich Beiträge nicht korrekt speichern  lassen, oder nur Teile geladen werden, was erst nach dem Reboot vom Firefox wieder funktioniert.

Nun ja, ich denke, dass die Aktualisierung  noch relativ frisch ist, und die Addon Kompatibilitätsproblematik (hoffentlich) in Kürze bereinigt ist. Der neue Firefox 5 soll allerlei Verbesserungen mit sich bringen, hier noch ein paar Quellen mit Details zur 5er Version.

Firefox Sprache der Benutzeroberfläche ändern

Weiterführende Informationen zum Firefox:
Offizielle Firefox Seite Mozilla.com
Bericht beim Golem zum Firefox 5

Likes, Tweets und andere Arten von Social Sharing

Social Sharing

Die obligatorische Social-Leiste im Footer eines Beitrags setzt nun ja fast jeder Blog ein. Bieten die ganzen Social Buttons aber wirklich Mehrwert für die Masse der Blogs? Im Webmaster Friday ging es genau um diese Frage, über den Einsatz der Likes, Tweets und anderen Social Werkzeugen – „Social-Media Buttons im Blog“.  Hier ein paar Gedanken zum Thema.

1. Welche Social Media Buttons sind wichtig?

Die Definition von ‚wichtig‘ ist sicherlich ziemlich ambivalent, was bedeutet wichtig im Kontext eines Blogs? Deshalb vielleicht zuerst die Frage nach dem Warum?

Social Media Buttons setzt man ein, um seine Beiträge mit anderen zu teilen, bzw. von anderen teilen zu lassen. Soweit die Theorie. In der Regel werden die meisten Buttons aber nur von Internet affinen Nutzern genutzt. Als Ausnahme würde ich hier den Facebook Like Button sehen, der mittlerweile auch aufgrund der schier unendlichen Nutzern auch gesellschaftsfähig geworden ist. Ein Like ist mal viel schneller gedrückt als ein Tweet oder ein Sharen via Mister Wong und Konsorten.

Was ist nun wichtig? Also den Like Button kann man aus meiner Sicht im Blog immer einsetzen, weil die Schwelle zum Drücken relativ gering ist, wenn der Beitrag denn wirklich gut ist.

Einen Tweet absetzen ist schon mit einer höheren Schwelle verbunden, und wird zumeist von denjenigen genutzt, die wirklich im jeweiligen Thema drinstecken und natürlich einen Twitter Account haben.

Weitere Sharing-Optionen, wie etwa Mister Wong, Webnews, Delicious und Konsorten werden definitiv weniger verwendet, weil es zum einen Mehraufwand bedeutet, um entsprechend noch Tags und Kurzbeschreibungen hinzuzufügen und der Großteil der Leserschaft etwaige Dienst schlichtweg nicht nutzt.

Welche Kanäle lohnen sich?

Auch hier kann man wieder sagen: „Depends“. Um es vielleicht etwas konkreter zu machen, will ich es anhand einen Blogs zum Thema Web und Online-Welt, wie goeo eben, festmachen. Zuerst natürlich wieder das Like – durch die bereits benannte niedrige Schwelle ein Like zu drücken, kommt man schnell in allerlei Statusmeldung-Ströme auf Facebook und bekommt dadurch den ein oder anderen  Besucher, der, wenn ihm denn das Thema interessiert, dann natürlich auch zum wiederkehrenden Leser mutieren kann.

Twitter mit seinen Tweets ist für Technik-Blogs auch durchaus ‚lohnenswert‘. Ich persönlich tweete beispielsweise besonders häufig irgendwelche Netzfundstücke in Sachen Coding, Webdesign und Design Inspirationen. Mit einer entsprechenden Anzahl an Re-Tweets steigt damit natürlich die Popularität des Postings und er etabliert sich im Google Index.

Weitere Services wie Bookmark-Dienste nutze ich ebenfalls, um bspw. eigene Artikel zu speichern und besonders gelungene Beiträge und Web-Apps zu sharen. Die Masse der Nutzer, bin ich der Meinung, nutzt entsprechende Dienst aber weitestgehend gar wenig bis gar nicht, weil ihnen der Mehrwert fehlt und man sich fragt  – Was bringt es mir einen Beitrag via Bookmark-Dienst zu teilen?

Was sich ‚lohnt‘

  • Facebook Like – niedrige Klick-Schwelle
  • Tweets – für aktive Twitter-Nutzer sind gute Beiträge einen Tweet wert
  • Mister Wong & andere – bei privaten Projekten zum Support der eigenen Beiträge geeignet
  • ##nachgereicht## Google Plus – Gib +1 und zeig Google was dir gefällt…

Warum ‚lohnt‘ es sich

  • Links zum eigenen Post
  • Potentielle neue Leserschaft
  • Traffic-Generierung
  • ein möglicher Marketing-Kanal im Mix

Plugins

Ein wie ich finde ganz gelungenes Plugin ist Sociable. Man kann sich die Services seiner Wahl auswählen und als Leiste unter den Blog-Post einblenden lassen. Funktioniert ganz einfach und ist im Gegensatz zu manchen Plugins aus meiner Erfahrung ressourcenschonend.

Facebook und Twitter Buttons füge ich manuell in den Code ein. Hier ein Beitrag bei Perun, wie man allerlei Buttons im Code ohne Plugin richtig einfügen kann.

Abschließende Gedanken zu Likes & Co

Über den Mehrwert der Einbindung von diversen Buttons kann man sicherlich streiten. Als größten Nachteil sehe ich die Performance der Website, die bei zu vielen Buttons schlichtweg leidet. Zum anderen ist die Menge der verfügbaren Buttons schlichtweg unübersichtlich und schreckt ggf. so manchen Nutzer auch ab.

Ich persönlich finde den Facebook Like Button und den Twitter Tweet Button am ‚effektivsten‘. Facebook für die breite Masse der Besucher und Tweet für den spezialisierten Geek unter den Surfern.

Was ich beim Facebook Like / Share allerdings etwas zweischneidig finde, ist die Tatsache, dass man klickt und nichts weiter bestätigen muss, ein Klick und der Link erscheint in seinem Profil. Aus Sicht der Einfachheit super, aber ob sich das ein andere Dienst erlauben könnte, ohne eine Art zweite Bestätigung zu posten, weiß ich nicht. Nun ja, ich merke beim Schreiben, dass es ein ziemlich vielschichtiges Thema ist, worüber man selbst eine riesen Liste an Pros und Contras aufführen könnte. Soweit so gut.

Brillenfinder

Brillenfinder

Als eben eine Werbung für Sonnenbrillen im TV lief, habe ich mich gefragt, ob es nicht eine Art Brillenfinder im Netz gibt. Da ich nach einer kurzen Suche via Google keine brauchbaren Ergebnisse finden konnten, vielleicht auch aufgrund der falschen Stichwörter, die ich verwendet habe, und ich die Idee eines Brillenfinders dennoch ziemlich genial finde, hier ein paar Gedanken, was ein Brillenfinder können müssten und warum er durchaus Mehrwert für potentielle Käufer von Brillen oder Sonnenbrillen bieten könnte. „Brillenfinder“ weiterlesen

Animierte Bilder mit Farbeffekt

animierter Farbeffekt mit CSS und jQuery

Im Smashing Magazine gab es gestern einen Beitrag zu interaktiven CSS / jQuery Techniken, darin war ein Beispiel zu animierten Hintergrundgrafiken / Bildern enthalten, welches ich ziemlich faszinierend fand und direkt ausprobieren – nachbauen musste. Wie ich finde ein sehr gelungener Effekt, mit dem allerhand anstellen kann. Hier ein kurz Review mit Anleitung auf Deutsch und Beispielen. „Animierte Bilder mit Farbeffekt“ weiterlesen

Retargeting bei Google Adsense

Adsense & das Retargeting

Über das Retargeting hatte ich vor einiger Zeit bereits geschrieben, damals noch hauptsächlich im Kontext neuer  Anbieter wie Criteo. In den letzten Wochen/Monaten jedoch fällt es mir verstärkt auf, dass Google Adsense die Personalisierung von Werbeeinblendungen immer mehr hoch schraubt. Um so mehr bestätigt sich auch meine persönliche Meinung zum Retargeting als eher Fail als Mehrwert. „Retargeting bei Google Adsense“ weiterlesen

Blog Entwicklung – Der Weg ist das Ziel

Blog Entwicklung

Den Webmaster Friday verfolge ich seit längerem eher am Rande, finde das Konzept aber durchaus ganz spannend – ein Thema wird in den Raum gestellt und Blogs / Blogger beteiligen sich daran und schreiben Ihre Erfahrungen zum jeweiligen Thema. Aktuelles Thema ist ‚Blog: Phase 2‚ – die Weiterentwicklung des eigenen Blogs. Da ich mich mit diesem Projekt quasi in dieser Phase aktuell befinde hier ein paar Gedanken zur Blog (Weiter-) Entwicklung.

Phasen-Gedanken

Sicherlich ist eine strikte Einteilung in Entwicklungsphasen keine Absolute. Dennoch kann ich die Erfahrung bestätigen, dass man die ersten 3-6 Monate quasi für sich alleine bloggt – man schreibt über sein Interessengebiet und weiß ggf. an manchen Stellen gar nicht mehr warum – zumindest mein subjektiver Eindruck. Ein Motivationsschub entsteht für mich durch steigende Besucherzahlen. Besonders die manchmal gar nicht dafür intendierten Beiträge erreichen dann ungeahnten Traffic. Gerade das ist es, was mich dann anspornt weiterzumachen. Um das Ganze mal an einem konkreten Beispiel festzumachen, hier meine Erfahrung aus meinen ersten Blog-Tagen: Tikoim.de hatte ich irgendwann 2008 begonnen und querbeet, ohne ein wirklich spezifisches Thema zu haben, beackert. Ich schrieb über alles mögliche, hauptsächlich aus dem Bereich Web 2.0 Entwicklung. Dabei war es mehr oder minder ein Zeitvertreib zum Austesten was hinter dem Bloggen steht. Mit einem Artikel aus dem Bereich Musik hatte ich dann einen Nerv getroffen, den ich so nicht erwartet hatte. Ich schrieb über einen Song, nämlich Sky and Sand, der mir nicht mehr aus dem Kopf ging. Zu diesem Zeitpunkt wollte ich unbedingt den Songtext / die Lyrics zum Song haben, die aber noch nirgends auftauchten, also hatte ich mir die Arbeit gemacht, das Ganze abzutippen. Um auf den Punkt zu kommen, der eine Beitrag erreichte binnen kurzer Zeit über 1000 Besucher im Monat und was ich bis heute spannend finde, nach wie vor suchen sehr viele eben nach diesen Lyrics, die ich 2008 ohne großartig nachzudenken gebloggt hatte. Ergo, die Motivation weiterzumachen entstand durch die Besucher. Auch wenn ich nicht der Community-Mensch bin und von einer Stammleserschaft sprechen würde, ist die Phase, wo Bloggen aus meiner Sicht einen Motivationsschub erhalten kann, die in dem man feststellt, dass man ‚etwas geschaffen hat‚  was andere interessiert und quasi an den eigenen Gedanken teilhaben lässt.

Blog-Planung

Ich persönlich nehme mir zwar vor zu planen – das gelingt mir aber nicht wirklich. Am Ende des Tages schreibe ich nicht weiter über die ‚Erfolgsartikel‘, bzw. möchte es vielleicht schon, aber sobald man sich zwingen muss über etwas zu schreiben, wird es zum einen nicht wirklich gut und zum anderen fehlt die Authentizität. Ich ergänze mit der Zeit neue Elemente, wie etwa die ‚Über uns‘ Sektion, die ich mir zu Beginn gar nicht hätte überlegen können, weil ich noch gar nicht wusste um was es im Blog eigentlich gehen sollte. Da bewundere ich so manche Nischen-Blogs die das eine eine Thema verfolgen und auch am Ball bleiben.

Um vielleicht mal konkrete Tipps / Erfahrungen zu geben, hier ein paar Beispiele was ich auf goeo.de ‚weiterentwickelt‚ habe. Zu Beginn hatte ich allerhand Kategorien in der Navigation, die allesamt leer waren, bzw. eigentlich nur auf Netzwelt ausgerichtet waren. Mittlerweile habe ich es auf 3 Bereiche eingegrenzt. Ich denke, dass sich hier auch noch etwas ändern wird, sobald mehr Artikel aufschlagen. Zweitens die Verwendung von Bildern / Artikelbildern. Zu Beginn hatte ich diese eher marginal eingesetzt, auch dadurch dass es Zeit kostet ein paar vernünftige und aussagekräftige Bilder zusammenzustellen- mittlerweile habe ich einen gewissen Workflow und setze Bilder viel häufiger ein, um dem Blog mehr Persönlichkeit zu verleihen. Drittens, Optimierung / Usability. Ab einer bestimmten Artikelzahl passt bspw. eine Paginierung gut ins Erscheinungsbild des Blogs – er vermittelt aus meiner Sicht, dass schon Einiges geschaffen und geschafft wurde. Oder auch eine Schlagwort-/Tag-Wolke, die mit nur wenigen Beiträgen kaum Sinn macht, ab 40-50 Artikel aber durchaus interessant für Nutzer werden kann. Und, was mir gerade einfällt – Social Buttons kamen noch hinzu, die zu Beginn nicht vorhanden waren. Auch wenn diese (noch) recht selten genutzt werden, ggf. können sie in der weiteren Blog-Entwicklung von Nutzen sein.

Der Weg ist das Ziel

Für mich hat Bloggen viel mit der Persönlichkeit zu tun. Du schreibst was du bist oder ein anderer abgedroschener Spruch trifft es schon ganz gut ;). Wer mit dem Bloggen beginnt verfolgt sicherlich auch immer ein gewisses Ziel, wenngleich auch manchmal eher unterbewusst. Fakt ist, dass man während des ersten Jahres auch Vieles dazu lernt – seien es technische Aspekte, um die kleinen WordPress-Alltagsproblemchen zu lösen oder auch über steigende Leserzahlen und Herkunft der Besucher etwas über die Mechanismen des Web zu lernen. Somit kann man also schon von Phasen sprechen, die eher fließend ineinander übergehen. In erster Linie sollte aber die Motivation linear zum Blog-Erfolg steigen, was durchaus kritisch sein kann, wenn der ‚Erfolg‘ ausbleibt. Wer lediglich monetäre Ziele verfolgt wird’s nicht einfach haben, denn Authentizität, wenngleich das Wort ein wenig vielsagend klingt, trifft es ganz gut – nur diese ermöglicht es einem selbst am Ball zu bleiben und weiterzumachen. Demzufolge würde ich das Bloggen als Lernprozess sehen, der unter anderem durch steigende Besucherzahlen und ggf. langfristig den einen oder anderen Euro, den man damit verdienen kann, zur steigenden Motivation verhilft. Soweit so gut.

Webmasterfriday Blog: Phase 2

Einzelne Tags in WordPress ausblenden

Einzelne Tags in Wordpress ausblenden

Folgende Problemstellung: In so manchen WordPress Themes gibt es den sogenannten „Featured“ Tag mit dessen Hilfe man bestimmte Beiträge ’nach vorn‘ stellen kann. Wie hier auf Goeo auf der Startseite eben zu sehen, werden die 6 letzten Artikel die mit eben diesem Schlagwort versehen wurden, oben angezeigt.

Mittlerweile ließe sich dies zwar auch  mit den Sticky Posts (DE – „Diesen Artikel auf der Startseite halten“) realsieren, wenn man aber eben nicht großartig in sein Theme eingreifen möchte, dann belässt man es beim Default. Nun will man beispielsweise eine Tag-Cloud / Schlagwort-Wolke einbinden und findet in fetten Buchstaben „featured“ in der Übersicht. Wie lassen sich also nun bestimmte Tags ausschließen / excluden?

Die Tag Cloud

Ich habe eine ganze Weile mit Recherchen und Testen von einigen Plugins verbracht, keines hat mich wirklich überzeugt, bzw. funktionierte es am Ende nicht direkt. Also habe ich beim WordPress Codex die Funktion wp_tag_cloud nachgeschlagen. Genau hier gibt es die kleine Funktion, die das Problem beheben könnte, indem man mittels Exclude die gewünschten Tags aussortiert.

Nun könnte man in das WordPress Verzeichnis /wp-includes/category-template.php gehen und dort im Code ändern. Erfahrungsgemäß sind solche Änderungen nach einem Update ggf. verschwunden, so dass man nach einer anderen Lösung suchen muss.

Die Lösung letztendlich fand ich im Forum auf WordPress.org unter dem Thread  – ‚wp_tag_cloud() Werte ändern‚ . Da ich kein WP-Experte bin, sondern mehr Code-Bastler habe ich den Code so übernommen und in die functions.php eingefügt. Danach einfach noch die entsprechenden IDs der Tags ausfindig machen – dies funktioniert so: Im Backend auf Artikel > Schlagwörter gehen, den Mauszeiger über das Schlagwort halten und die ID des jeweiligen Tags erscheint dann in der URL – siehe Abbildung:

Wordpress Schlagwort ID
Wordpress Schlagwort ID

Nun lässt sich mittels ‚exclude‘ => ’34‘, beispielsweise der Tag ‚Wordpress‘ ausschließen. Sicherlich nicht gerade die einfachste Lösung, aber sie funktioniert.

Wer sich also bspw. über das ‚featured‘ Tag in so manchen Themes ärgert und trotzdem eine Tag Cloud einrichten möchte, der kann diese Variante einfach mal testen.

Golem.de mit neuem Design

Golem Redesign 2011

Und der Trend setzt sich fort. Wie bereits unter anderem Zanox, Twitter und weitere Webseiten in diesem Jahr, hat sich auch das IT News Portal Golem für ein neues Design entschieden. Mein erster Eindruck war: Wow, WordPress mit TwentyTen.

Dem ist aber natürlich nicht so, also Golem läuft nicht mit WordPress. Allerdings ist der Trend „Big Font is Beautiful“ unübersehbar. Es werden Freiräume geschaffen und die Schriftgröße auf 14 px hochgeschraubt. Auch gern verwendet, die Google Fonts – hier hat man sich doch glatt für Droid Serif entschieden. „Golem.de mit neuem Design“ weiterlesen

Produktvergleich mit Ajax & Co

Produktvergleich mit Ajax & Co

Man kann sich durchaus in Sachen festbeißen, wenn nicht zwingend unbedingt im bildlichen Sinne, aber u.a. in Web-Projekten. Auf der Suche nach einer simplen Lösung für einen Produktvergleich mittels Datenbank, Ajax und Checkboxes – okay, simple sieht anders aus – musste ich feststellen, dass man mit den Basics in den drei genannten Punkten schnell an seine Grenzen kommt, bzw. auf eine Recherche-Reise gehen kann, die schier endlos erscheint.

Im Folgenden ein Review dieser Such-Reise nach einer möglichst simplen Lösung für einen Produktvergleich mittels PHP & HTML, und einem gar durchaus interessanten ersten Ergebnis.

Wie im allgemeinen Online-Marketing & Co Umfeld Gang und Gäbe, hält man sich oftmals mit seinen Projekten mehr oder minder bedeckt. Ab und zu gibt es aber doch interessante Einblicke in eben diese, und man findet ein paar nette Quellen für Coding-Inspirationen. Um das Ganze evt. mal etwas zu konkretisieren hier ein paar Real-Life Samples. Es wird konkret. „Produktvergleich mit Ajax & Co“ weiterlesen