C#: Wie man eine Grafik in eine Resource hinzufügt

In Windows-Form Anwendungen kommt man öfters in die Verlegenheit, irgendwelche Bilder, Icons oder Logos anzuzeigen. Auch in Tabellen oder in einem DataGridView können kleinen Grafiken die Lesbarkeit stark erhöhen. Die Grafiken der eigentlichen Exe beizulegen mag seine Vorteile haben, doch oftmals ist es besser, diese in der ausführbaren Datei zu inkludieren und aus dem Speicher abzurufen. Wie man eine Datei als Resource in Visual Studio bereitstellt, beschreibe ich hier.

Zuerst muss man zum Resourcen-Fenster navigieren. Ein Weg, dorthin zu gelangen, ist ein Rechtsklick im Projektmappen-Explorer auf die Applikation, dann „Eigenschaften“ wählen. Im sich öffnenden Fenster sieht man nun einige Tab-Reiter. Man wählt hier den Tab Reiter „Ressourcen“. Die Schaltfläche „Ressource hinzufügen“ ist eigentlich selbsterklärend. Man wählt die passende Eigenschaft (oder wählt „vorhandene Datei hinzufügen“), vergibt dem Bild bzw. der Ressource einen eindeutigen Namen. Wenn man eine Datei direkt hinzufügt, sollte man je nach Namenskonvention diesen noch anpassen.

Die Grafik Resource in C# ansprechen
Nun haben wir also eine Grafik als Resource hinzugefügt. Nun möchten wir diese auch im Programmcode verwenden. Dies ist in C# nun sehr einfach, denn wir verwenden die statische Klasse „Properties.Resources“. Diese Klasse gewährt uns Zugriff auf die eingebettete Resource.
Im nachfolgenden Beispiel verwenden wir eine PictureBox um eine Grafik anzuzeigen. Eine Grafik „link.jpg“ habe ich als Resource mit dem Namen „link“ hinzugefügt. Der Zugriff auf die Grafik ist nun per „Properties.Resources.link“ möglich:

/// <summary>
/// Wir zeigen eine Grafik in einer PictureBox an
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
private void Form1_Load(object sender, EventArgs e)
{
            //Eingebette Resource: link.jpg. Resourcen-Name: link
            pictureBox1.Image = Properties.Resources.link;
}
grafik in datagrid

Einbettung eines Image

In Anlehnung an mein Beispiel im Artikel „C# Images in DataGridView anzeigen” greife ich im untenstehenden Beispiel direkt auf die Resource hinzu und spare mir dem Umweg, das Image erst noch explizit zuzuweisen. Wer nicht den direkten Weg über die Properies.Resource gehen möchte, kann den von Microsoft hier beschriebenen Weg über einen Stream gehen.

DataGridViewImageColumn dgv_pic = new DataGridViewImageColumn(false);
DataGridViewColumn dgv_text = new DataGridViewTextBoxColumn();

//Füge die Colums hinzu
dataGridView1.Columns.Add(dgv_pic);
dataGridView1.Columns.Add(dgv_text);

//Hier werden manuell zwei Rows hinzugefügt
dataGridView1.Rows.Add(2);

dataGridView1[0, 0].Value = Properties.Resources.lampe_rot; // (Image)lampe_rot;
dataGridView1[0, 1].Value = Properties.Resources.lampe_gruen; //(Image)lampe_gruen;
dataGridView1[1, 0].Value = "Server A";
dataGridView1[1, 1].Value = "Server B";

Vorteil einer eingebettenen Resource
Der größte Vorteil ist natürlich, dass die Ressource, beispielsweise eine Grafik oder ein Icon nach dem Release in der Exe enthalten ist. Man muss sich keine weitere Gedanken mehr über die Grafik machen und man kann sicher sein, dass die Anwendung auch auf das Bild zugreifen kann. Aber auch der Nachteil liegt klar auf der Hand: Jedes so integrierte Bild vergößert die Exe. Es dürfte also wenig Sinn machen, große Images so zu integrieren. Kleine Status-Bilder oder Icon-Sets können aber so elegant integriert werden.

GD Star Rating
loading...

Moot: Kommentar-Funktion auf sirmark.de

Ich habe es auf die lange Bank geschoben: Nun möchte ich eine Kommentarfunktion auch auf sirmark.de anbieten. Der Bedarf für eine solche Funktion liegt auf der Hand: Es erreichen mich immer wieder Fragen per Mail zu den einzelnen Artikeln. Diese könnten – für alle nachvollziehbar – auch in den Kommentaren abwickeln lassen. Aber auch aus SEO-Sicht bietet die Kommentarfunktion Vorteile: Der Seiten-Content wird mit jedem Kommentar erweitert und mit weiteren – hoffentlich – suchmaschinenrelevanten Stichwörtern angereichert.
Nachteil: Es ist Arbeit, die Kommentare zu sichten, zu beantworten und vor allem auch den Spam auszumisten.

Übersicht behalten: Wie den Kommentar-Spam bekämpfen
Dieser Blog läuft unter WordPress, dem Platzhirsch der CMS. Seine Kommentarfunktion ist per se gut. Doch wer nur ein paar Tage einen Blog mit offener Kommentarfunktion online hatte weiß, was sich da so alles ansammelt: Von PPC-Kommentaren („Porn, Pills, Casino“) über anderweitigen Schrott. Diesen auszufiltern ist nicht schwer. Schon beim groben Sichten können diese Kommentare zuverlässig entfernt werden. Bei manchen Kommentaren fragt man sich, warum hier einer (eine Maschine) diesen Kommentar gepostet hat, denn der Kommentar verfügt über keinen Backlink. Wer mal die Scrapebox-Anleitung gelesen hat, weiß warum. Schritt 1 des automatisierten Comment-Spammers ist ein sinnloser Kommentar ohne Bezug zum eigentlichen Projekt, für das gespammt werden soll. Wenn dieser Kommentar bei einer Prüfung in den folgenden Tagen online erscheint, wird der eigentliche Spam-Kommentar in Schritt 2 gepostet. So wird die eigentliche Seite nicht „verbrannt“.

Schon eine gute Lösung: Captcha
Prinzipiell ist ein Captcha, also ein in eine Grafik eingebundene Textnachricht keine Hürde. Diverse Dienste, über die ich auch schon berichtet habe (Bookmark richtig setzen), knacken den Captcha-Code binnen Sekunden für einen lächerlich niedrigen Preis. So gesehen bietet ein Captcha für das Veröffentlichen eines Kommentars keine 100prozentige Lösung. Auf diversen anderen Seiten habe ich das WordPress-Plugin „SI CAPTCHA Anti-Spam“ eingesetzt. Und man glaubt es kaum: Das Spam-Aufkommen geht merklich zurück, die Qualität der Kommentare steigt. Wir lernen daraus, dass Kommentar-Spammer sehr geizig sind und der Captcha Code durchaus das Spam-Aufkommen reduziert. Umgekehrt, gebe ich als Kommentator einer Seite eher den Vorzug, wenn ein solches Captcha vorhanden ist. Weiß ich im Gegenzug, dass der Webmaster dadurch das Spam-Aufkommen reduziert und es eher unwahrscheinlich ist, dass mein Kommentar in den Unmengen des PPC-Spams untergeht.

Kommentare auf sirmark.de
Trotz dieser positiven Erfahrungen habe ich auf dieser Seite die WordPress-Kommentar-Funktion nicht freigeschaltet. Faulheit? Ja. Ein Artikel auf t3n.de hat heute mein Interesse geweckt. Dort wird über Mott, einer Diskussions- und Forenplattform berichtet, die sich leider erst in einem Beta-Stadium befindet. Die Beschreibung liest sich sehr gut. Auch der Hinweis, dass hinter diesem Projekt die Macher von JQuery stecken, verstärkt mein Interesse.

Warum Moot.it und nicht die WordPress Kommentar-Funktion?
Auf diese Frage kann ich heute noch keine Antwort geben. Ich selbst sehe sirmark.de immer gerne als Testsystem. Hier probiere ich gerne mal ein neues Plugin aus. Vor der Kommentarfunktion habe ich mich hier ein wenig „gedrückt“. Moot.it liest sich sehr gut. Es soll sehr schnell sein, leicht zu installieren und in der Administration ebenfalls nicht zeitraubend sein. Also werde ich es testen und Euch über meine Erfahrungen unterrichten.
Etwas ist leider jetzt schon klar: Der Content wird sicherlich nicht um Keys erweitert. Denn Moot läd die Kommentare per JavaScript nach. Und man muss davon ausgehen, dass dies von den Suchmaschinen nicht ausgewertet wird. Oder etwa doch? Ich werde es hier testen. Oder wisst Ihr schon die Antwort? Dann hinterlasst doch einen Kommentar …

GD Star Rating
loading...

HowTo: WordPress auf hohen PageSpeed optimieren – Teil 3

Im einleitenden Artikel und in den beiden vorangegangenen Artikel haben wir uns bereits über die Möglichkeiten ausgelassen, einen WordPress Blog in der Geschwindigkeit zu optimieren. Google legt uns nahe, auf die Geschwindigkeit Wert zu legen. Dieser nicht zu unterschätzende Fingerzeig soll heißen, dass eine Seite noch so guten und einzigartigen Inhalt haben kann – wenn die Seite langsam im Aufbau ist, verärgert dies den Leser und Google straft die Seite ab. Grund genug also, die Hinweise der Mutter aller Suchmaschinen nicht auf die leichte Schulter zu nehmen.

JavaScript später parsen
Man war es gewohnt, im Header einer Seite auch alle JavaScript-Blöcke zu definieren. Inzwischen geht man dazu über, die nachzuladenden JavaScript -Dateien erst am Ende der HTML-Seite einzubinden. Man erhöht dadurch zwar nicht die Ladezeit, doch die Darstellung der HTML-Seite erfolgt schneller. Denn erst zum Schluss werden die meist für die Bedienung benötigten JS-Dateien geladen. Wenn man eine Seite selbst erstellt, sollte man dies heute beachten. Bei WordPress bedeutet dies wieder einen tiefen Eingriff und die Gefährdung des Updates. Gerade Plugins binden gerne ihr JavaScript im Header ein. Nur wenig neuere Plugins haben diesen Modus umgestellt. Wer möchte, kann in ein solches Plugin eingreifen.

mod_rewrite.c: Der WordPress-Klassiker zur Definition der Permalinks. Das Mod_rewrite-Modul schreibt online eine lesbare URL („domain.de/kategorie/mein-artikel“) in die von WordPress verwendete interne Struktur um.
ACHTUNG: Den genauen Syntax innerhalb dieses Blockes an die eigene Permalink-Struktur anpassen. WordPress selbst gibt unter den Einstellungen die Struktur vor.

Anfragezeichenfolgen aus statischen Ressourcen entfernen
Google mag es gar nicht, wenn man beispielsweise einer CSS-Datei einen Parameter übergibt. Was das soll? Beispielsweise das WordPress-Plugin Rating Star erstellt das auszuliefernde CSS per PHP-Code. Dies kann Sinn machen, denn dann wird nur der Teil des Codes ausgeliefert, der auch für den Client notwendig ist. Doch Google findet einen Aufruf wie „rating.css?KEY“ wenig schick. Lösung? Aufgrund der getroffenen Konfiguration des Plugins könnte man – wie von Google gewünscht – ein statisches CSS erstellen und veröffentlichen. Problem: Bei jedem Plugin-Update muss ich den neuen Output untersuchen und ggfls. nachbessern.

Da ich seit Monaten auf ein Update des Plugins warte, habe ich den schnellen Weg gewählt: Ich habe die entsprechende PHP Datei geöffnet und den CSS-Teil optimiert (Kompressor). Somit habe ich die Ladezeit schon „ein wenig“ optimiert und lebe weiterhin mit dem „Low priority“-Makel.

Zeichensatz angeben
Zu Recht eine „Low Priority“, doch schnell erledigt. Im Header der HTML-Seite einfach den Meta-Aufruf korrekt einfügen.

Ich hoffe ich konnte hier einige Anregungen und Tipps für die Optimierung geben. Wie ich mehrfach erwähnt habe, folge ich nicht jeder Empfehlung von Google in Sachen PageSpeed. Gerade im Bereich der „Low priority“-Meldungen wäge ich zwischen Aufwand und Nutzen ab. „Rote“ und „gelbe“ Meldungen sind jedoch auf jeden Fall wert, im Sinne der Empfehlung von Google umzusetzen.

GD Star Rating
loading...

HowTo: WordPress auf hohen PageSpeed optimieren – Teil 2

Nachdem wir uns bereits um die optimale Bildergröße gekümmert und den HTML und CSS Code per Kompressor verkleinert haben (HowTo: WordPress auf hohen PageSpeed optimieren – Teil 1), kommen wir nun noch zu weiteren Punkten, die wir verbessern können:

„Browser Caching nutzen“, Dateien online komprimieren
Die folgenden Änderungen können in einer htaccess-Datei vorgenommen werden. Bei Hosting-Paketen ist dies meistens auch die einzige Möglichkeit. Wer einen eigenen (V) Server hat, sollte die Änderungen direkt in der vhost-Datei vornehmen.

Warum? Nun, die htaccess-Datei wird bei jedem Aufruf einer Datei gelesen. Egal ob die Index-Seite, den eingebetteten Bildern, JavaScript und CSS-Dateien. Also alleine für eine Startseite gut und gerne fünf bis zehn Aufrufe. Wenn die Änderung zentral in der vhost vorgenommen werden, wird dies nur beim Start des Apache einmalig gelesen.

Hinweis für Plesk: Bei meinen Plesk-Servern ist das Apache Modul „mod_expires“ nicht aktiviert. Dies kann jedoch über die Plesk-Oberfläche erledigt werden. Aber auch der klassische Weg, das Modul über Apache zu aktivieren, ist möglich.

# BEGIN WordPress

<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType text/css "access plus 1 week"
ExpiresByType application/javascript "access plus 1 month"
ExpiresByType application/x-javascript "access plus 1 month"
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType image/x-icon "access plus 1 year"
</IfModule>

<IfModule mod_deflate.c>
 AddOutputFilterByType DEFLATE text/html text/xml text/css text/plain
 AddOutputFilterByType DEFLATE image/svg+xml application/xhtml+xml application/xml
 AddOutputFilterByType DEFLATE application/rdf+xml application/rss+xml application/atom+xml
 AddOutputFilterByType DEFLATE text/javascript application/javascript application/x-javascript
 AddOutputFilterByType DEFLATE application/x-font-ttf application/x-font-otf
 AddOutputFilterByType DEFLATE font/truetype font/opentype
</IfModule>

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

# END WordPress

Was macht unser Code? Der Code besteht aus drei Blöcken, die jeweils das Vorhandensein eines bestimmten Apache-Modules (<IfModule) prüfen. Wenn das Modul vorhanden ist, wird der Code innerhalb der IF-Tags ausgeführt. Fehler im Code quittiert der Apache mit einem Fehler 500.

mod_expires.c: Wir aktivieren dieses Modul und weisen den Apache an, bestimmten Dateitypen wie Grafiken, JS oder CSS-Dateien ein bestimmtes Ablaufdatum im Header mitzusenden. Somit kann der aufzurufende Browser die Datei cachen und läd sie nicht immer erneut vom Webserver. Dies spart sehr viel Bandbreite, wenn immer wiederkehrende Bilder oder eine zentrale CSS-Datei nicht bei jedem Blättern einer Seite erneut geladen wird.

mod_deflate.c: Obwohl wir unseren HTML und CSS Code bereits über einen Kompressor optimiert haben, weisen wir nun den Apache an, die definierten Dateien per gzip online zu komprimieren und so verkleinert an den Browser zu senden. Was aufwändig klingt, zeigt sich in der Praxis als gängig und optimal. Die Zeit, die der Server für die Komprimierung und der Ziel-Browser für das Entpacken benötigt, ist durch den geringeren Datenaustausch von Server zum Client gut angelegt. Auch kommen heute alle gängigen Browser mit einer solch online optimierten Übertragung zu Recht. In unserer Definition werden nur Textdateien (HTML, CSS etc) und keine Bilder komprimiert.

Im dritten und letzten Teil unserer kurzen Artikelserie über PageSpeed gehen wir auf JavaScript, den Zeichensatz und Mod_rewrite ein.

GD Star Rating
loading...

HowTo: WordPress auf hohen PageSpeed optimieren – Teil 1

Im einleitenden Artikel „Ranking Faktor Page Speed: WordPress optimieren“ dieser kleinen Artikel-Reihe bin ich auf die Gründe, warum man seine Webseite auf Geschwindigkeit optimieren sollte, bereits eingegangen. Hier beschäftigen wir uns nun mit den gängigen Vorschlägen von Google für einen schnelleren WordPress Blog.

404-Fehler: Wenn eine Webseite auf eine Grafik verweist, die nicht vorhanden ist, schickt der Webserver einen Fehler „404“ zurück. Die ist unnötig und bremst die Seite aus. Zumeist sind solche „Leichen“ in der CSS-Datei (style.css) verborgen. Also: Analysieren und entweder den Aufruf entfernen oder die Datei (Image) korrekt zur Verfügung stellen.

GIF-Bilder: Google kritisiert sehr gerne GIFs, die auf der Webseite bzw. in der Theme verwendet werden. Hier erreicht man sehr schnell Abhilfe, indem man das GIF mittels der freien Grafiksoftware „Gimp“ öffnet und als PNG (Kompression 9) exportiert. Diese PNG-Datei dann in den HTML-Code oder CSS-Datei einbinden.

HTML, CSS und JS-Dateien optimieren: Ziel ist es, den nachzuladenden Code so kurz wie möglich bereit zu stellen. Kommentare im Code, so sinnvoll sie für Änderungen sind, sind unnötiger Ballast bei der Übertragung zum Besucher. Auch Einrückungen in HTML oder CSS erhöhen die Lesbarkeit, sind aber unnötig. Also wird man zwei Versionen dieser Dateien benötigen. Die lesbare Ur-Version und eine auf dem produktiven Server zur Auslieferung bereitstehenden optimierten Code.
Zur Optimierung gibt es diverse CSS und HTML online Kompressoren. Für alle gilt: Immer die Original-Version zuerst sichern! Den optimierten Code im Web einsetzen und testen. Hier muss man probieren und experimentieren.
Tipp: Oftmals gibt es Probleme mit WordPress-Dateien, die HTML und PHP-Code beinhalten. Kommentare im PHP-Block bereiten je nach Kompressor hier Probleme. Meist entferne ich zuerst diese Kommentare per Hand und nutze dann einen Kompressor. Je nach Datei optimiere ich auch nur den HTML-Code und lasse den PHP-Block unverändert.

  1. YUI Compressor: JS und CSS Kompressor
  2. HTML Compress: HTML Kompressor

Bilder optimieren, skalierte Version bereitstellen
Viele Punkte Abzug in Rechung stellt Google, wenn man zu große Bilder auf einer Webseite einfügt und diese mittels „width“ und „height“-Tag herunterskaliert. Google hat schon Recht: Es ist unnötige Ressourcenverschwendung. Beispielsweise stellen wir im Artikel „WordPress: Recent Post (Letzte Artikel) mit Thumbnail-Images in der Sidebar anzeigen“ per WordPress eine Sidebar mit Thumbs zur Verfügung. Hier nutzen wir 150px große Bilder. Im Code reduzieren wir die Anzeige auf 70px. Ein böses Foul und Google moniert dies mit einer roten Karte.

Wie man individuelle WordPress-Bildgrößen (automatische Erstellung) generiert, zeige ich in einem weiteren Artikel. Auch sei erwähnt, dass Google die Kompression von JPGs mittels WordPress anmäkelt. Laut Google kann die Kompression noch weiter erhöht werden. Da ich mit 96 Punkten PageSpeed zufrieden bin, ignoriere ich diese „Low priority“-Meldung.

Wichtig auch: WordPress bietet beim Einbinden eines Bildes an, eine vorliegende Bildgröße herunterzurechnen. Dies mit Bedacht wählen. Besser: Die endgültige Größe des einzubindenden Bildes optimal komprimiert via WordPress hoch laden und einbinden. Zuvor das optimale Grafikformat PNG/JPG für Grafiken/Bilder wählen.

Zum Teil 2: HowTo: WordPress auf hohen PageSpeed optimieren – Teil 2

GD Star Rating
loading...

Ranking Faktor Page Speed: WordPress optimieren

Um eine Webseite oder ein Blog optimal für die Suchmaschinen zur Verfügung zu stellen, verwenden wir viel Zeit. Die Texte werden optimiert, der Aufbau der Seite wird entsprechend angepasst und irgendwann (und nicht allzu spät) sollte man sich mit dem Thema „Page Speed“ beschäftigen.
Google (Slogan: „Make the Web faster!“) selbst sagt, dass die Geschwindigkeit einer Webseite ein wichtiger Ranking-Faktor ist. Dass die Zufriedenheit eines Besuchers mit einer Website nicht nur mit dem Inhalt und dem Design, sondern auch mit der Ladezeit zusammenhängt, sollte jedem Surfer bekannt sein. Wer hat schon Geduld, Sekunden um Sekunden zu warten, bis sich eine Webseite aufgebaut hat? Der Onlinehändler Amazon hat nach eigenen Angaben eine Untersuchung durchgeführt die besagt, dass mit jeder Sekunde, die eine Webseite länger zum Aufbau benötigt, 10 Prozent Umsatz weg brechen. Zehn Prozent Umsatz bei Amazon: Das dürfte den einen oder anderen Webmaster animieren, seine Webseite auf die Ladezeit hin zu optimieren.

Aber auch mehr Besucher von Google sollte ein Anreiz sein, den Page Speed seiner Webseite zu kontrollieren und wenn nötig die Seite anzupassen. Google stellt hierfür im Developers Bereich eine Seite bereit, über die man seine Webseite online prüfen kann. Google vergibt bis zu 100 Punkte für den Speed der Seite. Ziel ist also, den Page Speed an 100 anzunähern. Ob wirklich 100 erreicht werden müssen, sei dahingestellt. Viele Webmaster können auch mit einem Page Speed im Bereich 80 bis 90 Punkte gut schlafen. Für viele Seiten habe ich ohne großen Aufwand 96 Punkte erreicht. Die Optimierung um vier Punkte auf 100 habe ich bewusst gelassen. Wer mit seiner Webseite eine Page Speed von unter 80 oder gar unter 70 Punkten hat, sollte auf jeden Fall die Vorschläge von Google angehen.

Webseite oder WordPress-Blog auf Page Speed testen
Nun ist es also endlich an der Zeit, die eigene Webseite einem ersten Speed-Test zu unterziehen. Über das Google Tool PageSpeed wird nach Eingabe der URL die Seite getestet. Neben dem Score (Punkte) erfährt man in den Kategorien „High priority“ (rot), „Medium priority“ (gelb) und „Low priority“, welche Vorschläge Google zur Optimierung vorschlägt. Ziel ist es meiner Meinung nach auf jeden Fall, die Punkte „Rot“ und „Gelb“ abzuarbeiten. Unter den Punkten „Low priority“ und „Experimental rules“ wird es – gerade bei WordPress Blogs – schwer, alle Vorschläge von Google zu befolgen. Hier wären zum Teil tiefe Eingriffe in WordPress Plugins notwendig, die ein Update desselben dann wieder unnötig erschweren. Da viele Updates aus Sicherheitsgründen schnell und unkompliziert eingespielt werden sollen, muss man abwägen, ob einem diese Hürde der „letzte Punkt zum PageSpeed von 100“ wert ist.

Page Speed: Dieser Blog
Diesen Blog sehe ich nicht als Referenz für den PageSpeed an. Bei Speed Test erreichte er 82 von 100 Punkten, ohne eine Anpassung. Die Mängelliste von Google ist lang und zu gegebener Zeit werde ich auch hier die Optimierung angehen.

Hier geht es weiter: In der kurzen Artikel-Serie „HowTo: WordPress auf hohen PageSpeed optimieren – Teil 1“ beschreibe ich die gängigen Änderungen für einen besseren PageSpeed

GD Star Rating
loading...

WordPress: Recent Post (Letzte Artikel) mit Thumbnail-Images in der Sidebar anzeigen

Neben der Anzeige von „ähnlichen Artikeln“ geniest die Anzeige der „Neuste Artikel“ in WordPress eine wichtige Bedeutung. Neben den Suchmaschinen, die auf eine interne Verlinkung achten, kann man auch Besucher für weitere Artikel gewinnen, die einmal auf die Seite gelangt, sich nun auch noch über ein anderes Thema informieren. Schon im Standard bietet WordPress das Widget „Neuste Artikel“ (Recent Post), wie es auch dieser Blog einsetzt. In der Sidebar sieht der Leser eine bestimmte Menge an Artikel, die in jüngster Vergangenheit geschrieben wurden.

Seit der Diskussion um das Star Rating und den Autor-Vorschaubildern in den Google-Suchergebnissen wissen wir, dass ein Bild „mehr sagt als tausend Worte“. Der Wunsch liegt auf der Hand: Das WordPress-Widget „Neuste Artikel“ soll mit Vorschau-Bildern (Thumbs) angereichert werden. Ein einfacher Wunsch – leider keine Standard Lösung.

Lösung 1: Das WordPress Plugin „Special Recent Posts“

Das WordPress Plugin Special Recent Posts

Das WordPress Plugin „Special Recent Posts“ bietet einen Vorschautext samt Image in der WordPress Sidebar auf die neusten Artikel

Was liegt näher, als unter WordPress das 1001 Plugin zu installieren? Bei der Suche nach einem Plugin, welches einem administrative Freiheiten bei der Definition der „Neusten Artikel“ in der Sidebar ermöglicht, stößt man auf das WordPress Plugin „Special Recent Posts“. Dieses Plugin ermöglicht eine Anzeige eines Images zum Artikel. Bei meiner Suche habe ich leider kein weiteres Plugin gefunden, die dies in vernünftiger Form ermöglicht. Um es aber auch gleich vorweg zu nehmen: Zu 100 Prozent war bzw. bin ich nicht zufrieden mit diesem Plugin.
Aber zurück zum Plugin: Die Installation ist problemlos. In den Optionen erreicht man eine Konfigurationsseite des WordPress-Plugins, die sicherlich aber in den meisten Fällen unverändert übernommen werden kann. Interessant wird es erst in den Design-Widgets. Dort findet man nach der Installation des Plugins unter „Verfügbare Widgets“ das Plugin. Anklicken, in die Sidebar ziehen und schon ist das Plugin aktiviert. Doch halt: Zuerst sollten weitere Einstellungen unter den Widgets / Sidebar vorgenommen werden. Hier ist neben dem „Widget Title“, die „Max Number of Pages to Display“ und einige andere Dinge einzustellen. Ein besonderes Augenmerk sollte auf die „Thumbnail Options“ fallen: Hier kann einiges über das Aussehen der Images festgelegt werden.
Positiv beeindruckt hat mich das Caching der Images. Die Thumbs werden einmal generiert und in einem Cache-Verzeichnis gespeichert. In der Regel sind die Thumbs ja nur 50 bis  vielleicht 80 Pixel groß. Das Original-Image aus dem Artikel liegt meist in wesentlich größeren Dimensionen auf der Festplatte. Nachteil: Das Cache-Verzeichnis benötigt weitreichende Schreibrechte. Mehr als mir lieb ist.

Wer schnell seine Sitebar mit Images aus den jeweiligen Artikeln anreichern möchte, kann das WordPress Plugin „Special Recent Posts“ nutzen. Ebenso schnell, wie es installiert ist, kann man dieses Plugin auch wieder löschen.

Was mich am Plugin „Special Recent Posts“ gestört hat:

  • Weitreichende Schreibrechte für den Cache-Ordner von Nöten
  • Design der Anzeige nur über tiefgründige Änderungen in der Plugin-CSS und den
  • PHP-Dateien möglich, was ein Plugin-Update „erschwert“
  • Inkompatibilitäten bei manchen Themes
  • Vorschautext des Artikels zeichenbegrenzt

Lösung 2: Sidebar Widget „Neuste Artikel“ mit Thumbnail-Images ohne Plugin

Wordpress Sidebar Widget Neuste Artikel mit Thumbnail-Images ohne Plugin

Im Eigenbau: WordPress Sidebar Widget „Neuste Artikel“ mit Thumbnail-Images ohne Plugin

Nachdem ich massive Änderungen am Design für eine WordPress Installation vorgenommen habe, die ein zukünftiges Plugin-Update nicht vereinfacht, machte ich mir Gedanken über Alternativen. Es störte mich weiter, dass der Vorschautext eines Artikels nicht individuell bestimmbar, sondern zeichenbegrenzt ist. Dies bedeutet, dass die Vorschau nach x-Zeichen endet, egal ob ein Wort zu Ende ist, oder nicht. Neben diesem unschönen Verhalten hat das Plugin mit einer weiteren von mir eingesetzten Theme unschöne Design-Inkompatibilitäten gezeigt, so dass ich dazu überging, Thumbs in der Sidebar ohne Plugin-Hilfe anzuzeigen.

Grundsätzliche Überlegungen zu Images in der Sidebar bei den letzten Artikeln:

  • Jedem Artikel ist ein Image als Artikelbild zugeordnet. Dies soll auch im Widget „Recent Posts“ angezeigt werden.
  • Wir benötigen eine „Kurzbeschreibung“ zu jedem Artikel. Ein oder zwei Sätze sollen neben dem Artikel-Titel eine Vorschau geben.

Artikelbild den „Neusten Artikel“ zuordnen
Zu aller erst muss ein Artikelbild jedem Artikel zugeordnet werden. Dies ist  Bestandteil von WordPress und im Artikel „WordPress: Artikelbild (Vorschaubild) einfügen“ ausführlich beschrieben. Wer bei der Erstellung eines WordPress-Artikels den Kasten „Artikelbild“ nicht zu Gesicht bekommt, der muss die functions.php seiner Theme ändern. Informationen dazu siehe das Update im eben beschriebenen Artikel.

Somit haben wir nun das notwendige Image zum Artikel. WordPress legt das Image in der Dimension 150×150 Pixel ab. Diese Größe werden wir zur Anzeige unseres Thumbs nicht benötigen. Doch die verkleinerte Anzeige eines Images auf rund 60 bis 80 Pixel ist bei einem Original-Image von 150 Pixel vertretbar. Bei 300, 400 oder gar mehr Pixel, wäre dies eine deutliche Traffic-Verschwendung.

Kommen wir nun zum Vorschautext. Dieser soll kurz und prägnant sein, Lust zum Weiterlesen machen. Beim zuvor beschriebenen Plugin hat mich gestört, dass der Text nach einer bestimmten Anzahl von Zeichen einfach angeschnitten wurde. Eine Kurzbeschreibung bietet WordPress als Feld nicht an. Da die meisten WordPress-Nutzer auch das Plugin „All in one SEO“ nutzen, hätte man auch das Feld „Description“ nutzen können. Wer möchte, kann die folgende Lösung so umschreiben. Ich nutze hier ein eigenes „Benutzerdefiniertes Feld“ namens „kurzbeschreibung“. Vorteil: Ich kann hier speziell für diesen Zweck meinen Vorschausatz definieren.

Was wir nun also vornehmen müssen sind Änderungen in der Theme. Kritiker mögen einwenden, dass auch hier Code-Änderungen vorgenommen werden. Ja, nur Hand aufs Herz: Plugin-Änderungen macht der Webmaster aus Sicherheitsgründen, ein Update der Theme wird selten bis gar nicht durchgeführt.

Kommen wir nun zum Code. Wir öffnen das PHP-Script „sidebar.php“ unserer Theme. Der folgende Code muss nun an der passenden Stelle eingefügt werden. Dieser Code ist nicht optimiert und bewusst hier so angezeigt, um individuelle Anpassungen zu erleichtern:

<li id="meta" class="widget-container">

<h2 class="widget-title"><?php _e( 'Überschrift Neuste Artikel'); ?></h2>
<ul>

<?php $the_query = new WP_Query('showposts=10&orderby=post_date&order=desc');

while ($the_query->have_posts()) : $the_query->the_post();
      $id = $the_query->post->ID;
      $mymeta_field = get_post_meta($id, "kurzbeschreibung", false);
      $kurzbeschreibung = $mymeta_field[0];
      ?>
      <li>
            <a title="<?php the_title(); ?>" href="<?php the_permalink() ?>"><?php the_post_thumbnail(array(70,70), array ('class' => 'alignleft')); ?></a>
            <a title="<?php the_title(); ?>" href="<?php the_permalink() ?>"><?php the_title(); ?></a> <?php echo $kurzbeschreibung; ?>
    </li><br>
    <?php endwhile; ?>
</ul>
   <?php wp_reset_query(); ?>
</li>

Was passiert in unserem Code?

  1. Wir fügen einen neuen „Widget-Container“ ein. Dieser bezieht seine Daten durch die SQL-Abfrage mittels „WP_Query“. Im Select werden mittels „Showpost“ die neusten („DESC“) 10 Artikel abgefragt.
  2. Dann gehen wir die SQL-Abfragemenge mittels While-Schleife durch, setzen die Variable $id mit der aktuellen Post_ID, rufen das Meta-Feld „kurzbeschreibung“ des Artikels auf uns speichern diese in der Variable $kurzbeschreibung. Dieser Code ist sicherlich optimierungsfähig.
  3. Dass öffnen wir den Tag „<li>“, fügen das Artikel-Images in der Dimension 70×70 Pixel hinzu, versehen es mit der CSS-Class „alignleft“ und einem Hyperlink. Wenn uns die Anzeige des Images nicht zusagt, können wir dem Thumbnail eine eigene CSS-Klasse zuweisen und im CSS-Code der Theme entsprechende Anweisungen vergeben.
  4. Als Vorschautext wird zuerst der Title des Artikels („the_title()“) mit Link zum Artikel und dann unser individueller Vorschautext aus dem benutzerdefinierten Feld angezeigt.
  5. Zu guter Letzt beenden wir den „<li>“ bzw. den „<ul>“-Tag, schließen die While-Schleife ab und resetten auch die Query. Das Abschließende „<li>“ darf natürlich nicht vergessen werden.

 

GD Star Rating
loading...

Praxis-Test: Bookmark-Auswirkungen auf die eigene Seite

Im Artikel „Bookmark richtig setzen“ habe ich kurz Bookmarks sowie die Nutzung von Bookmark-Submittern beschrieben. Heute möchten wir die Auswirkungen auf das Suchmaschinen Ranking einer Webseite durch das Setzen von Bookmarks prüfen.

test bookmark

Bookmarks erhöhen die Impressionen

Test 1: Setzen von Bookmarks auf die Hauptseite
Zuerst habe ich getestet, wie sich Bookmarks auf eine Hauptseite verhalten. Vorauszuschicken muss man, dass dies genau von vielen SEOs als falsch empfunden wird. Ich persönlich bin auch der Meinung, dass man dies unterlassen sollte, wollte jedoch die Auswirkung testen. Die Seite selbst ist für mich keine Hauptseite und schon einige Jahre alt. Sie dümpelt in den Suchergebnissen vor sich hin, so dass die zu erwartenden Erfahrungen sehr spannend waren. Im ersten Test habe ich also über 70 Bookmarks automatisiert auf die Startseite „geschossen“. Wie wir in der Statistik sehen können, hat die große Suchmaschine sehr positiv auf die Bookmarks reagiert. Die Impressionen haben sich mehr als verdoppelt.

Test 2: Setzen von Bookmarks auf bestehende AVZ-Einträge
Gängige Meinung der SEOs ist, dass man Bookmarks nicht für eine Hauptseite, sondern zur Unterstützung von Backlinks nutzen sollte. Also habe ich versucht, ältere AVZ-Einträge mit Bookmarks zu beglücken. An den darauffolgenden vier Tagen (nach Test 1) habe ich an je einem Tag eine AVZ-URL mit Link zu meiner Hauptseite mit Bookmarks versorgt. In der Grafik ist zu erkennen, dass sich dies positiv auf die Impressionen ausgewirkt hat. Aber eine „wahre Explosion“ ist nicht erfolgt.

Nachhaltigkeit von Test 1 und Test 2
Leider habe ich beide Tests direkt nacheinander durchgeführt, so dass die beiden Tests nur zusammen betrachtet werden können. Zu beobachten war, dass die Impressions massiv zugenommen haben. Leider war die Zunahme nur ein Strohfeuer. Nach rund 14 Tagen fielen die Impressions wieder auf den vorherigen Wert. Das Ranking hat im Testzeitraum etwas zugenommen, war jedoch nicht von Bedeutung.

schaden bookmark dem ranking

Erhöhen Bookmarks auch die Position?

Test 3: Bookmark auf einen Artikel in diesem Blog
Auffallend ist, dass der Suchbegriff „gimp effekte“ bei der großen Suchmaschine 1.000 Impressionen auf einen Artikel in meinem Blog erzeugt. Die durchschnittliche Position ist mit „180“ allerdings sehr schlecht und führt dazu, dass natürlich auch keine Klicks über diese Keyword-Kombination erzeugt werden. Also wollte ich wissen, ob man mittels Bookmark diese Position verbessern kann. Für den Test habe ich also rund 70 Bookmarks auf den betroffenen Artikel mit dem Key „gimp effekte“ gesetzt. Werden die Suchmaschinen-Zugriffe „durch die Decke gehen“?

Weit gefehlt. Rund zehn Tage später zeigt das Bild keine signifikanten Verbesserungen. Der Graf bewegt sich im üblichen Rahmen, die „durchschnittliche Position“ ist jedoch von 180 auf 170 gesunken. Auf die Nachhaltigkeit zu dokumentieren habe ich verzichtet.

Fazit: Sind Bookmark sinnvoll?
Es hat bei meinem Test keine Verschlechterungen gegeben, wenn ich Bookmarks auf das Hauptprojekt gesetzt habe. Allerdings würde ich dem SEO-Rat folgen, keine Bookmarks auf ein Money-Projekt zu setzen. In meinen Tests haben die Bookmarks keine nachhaltige Verbesserung der Ergebnisse gezeigt. Sind Bookmarks also so schlecht wie ihr Ruf?

Bookmarks sind keine Geheimwaffe und das manuelle Setzen von Bookmarks sicherlich Zeitverschwendung (vielleicht von einer kleinen Handvoll bei gut platzierten Bookmark-Dienste mal abgesehen). Trotzdem kann die Anschaffung eines Bookmark Submitters sinnvoll sein. Das erstmalige Versorgen von Satelliten-Seiten wie Freeblogs oder ähnliche, welche ich im Rahmen des noch laufenden Test „Suchmaschinen optimieren in 10 Tage“ noch beschreiben werde, ist eine der Anwendungsmöglichkeiten. Dafür sind die rund 100 Euro Anschaffungspreis und die paar Dollar für dem De-Captcha-Dienst sicherlich gut angelegt. Doch bahnbrechende Erfolgsergebnisse darf man sich von Bookmarks nicht erhoffen.

GD Star Rating
loading...

Bookmark richtig setzen

Wer sich mit Suchmaschinenoptimierung beschäftigt, stößt unweigerlich auch das Angebot, sogenannte „Bookmarks“ (= „Lesezeichen“, die gesetzt werden, bzw. auf Seiten, auf denen es möglich ist, ein solches Bookmark zu setzen. Der Grund für Bookmarkdienste liegt auf der Hand: Durch Eintragung der eigenen Seite kann man schnell und einfach einen Backlink für seine eigene Seite erzeugen. Nachdem die ersten Bookmark-Seiten etabliert waren, schossen hunderte Bookmark-Dienste wie Pilze aus dem Boden. Alle nur zu einem Zweck: Für Suchmaschinen-Optimierer (SEO) eine Backlinkquelle zu erzeugen. Denn durch Automation ist es binnen Minuten möglich, 100, 200 oder gar 1000 Bookmarks und somit Backlinks zu erzeugen.

Bookmarks als Backlink in der untersten Schicht
In SEO-Kreisen werden Bookmarks als sehr „niederwertige Backlinks“ angesehen. Man geht auch davon aus, dass bei Suchmaschinen diese Links nicht als hochwertig angesehen werden. Es gibt die Aussage von Suchmaschinen-Spezialisten, die vor Bookmarks auf ein Moneyprojekt (= Hauptseite) sogar warnen. Wie sich diese Links verhalten, wollen wir hier nun überprüfen.

Bookmarks automatisiert setzen
Man sollte, wenn man sich mit Bookmarks beschäftigt, zuerst einmal einen Nachmittag mit den gängigen Bookmark-Seiten beschäftigen. Es schadet nicht, an diesem Nachmittag Bookmarks per Hand zu setzen. Dies erhöht später den „WOW-Effekt“, wenn man einem Bookmark-Submitter bei der Arbeit zuschaut. Zudem erhält man ein Gefühl dafür, wie man die Felder im Submitter auszufüllen hat bzw. versteht besser, warum der Submitter keine Eintragungsquote von 100 Prozent ausweist.

Ich habe meine ersten Tests mit dem Public Bookmark Submitter durchgeführt. Für knapp 100 Euro ist dieser online erhältlich. Eine knappe, aber ausreichende Doku, erklärt die auszufüllenden Felder. Eine Liste mit knapp 100 Bookmark-Dienste liegt bei. Auch eine kurze Erklärung, dass man De-Captcha-Dienste nutzen kann.

Captcha-Breaker für Bookmarks nutzen
Jeder kennt Captchas, diese kleinen Bilder mit Zahlen oder Text, die dazu dienen, einen Spider von einem Menschen zu unterscheiden. Und nahezu alle Bookmark-Dienste nutzen ein Captcha, um so automatisierte Anmeldungen zu unterbinden. Doch inzwischen ist De-Captcha eine Dienstleistung, die man nicht missen möchte. Die Submitter wie auch der Public Bookmark Submitter liefert das Captcha automatisch an den Dienst weiter und erhält über diesen binnen Sekunden die korrekte Antwort. Für jedes Lösen eines Captchas bezahlt man ein paar Cent. Für meinen Test habe ich per Vorkasse 1000 Captchas für rund fünf Dollar geordert. Geld, das man gerne ausgibt.

Bookmark-Submitter nutzen
Alle Felder ausfüllen und der Submitter legt automatisiert die Konten an, wenn ein De-Captcha-Dienst hinterlegt ist. Der Submitter greift dann automatisiert auf das verwendete Email-Konto zu (POP-Account; eigenes Freemailer-Konto nutzen!), liest das vom Dienst vergebene Passwort aus. Im zweiten Schritt wird das eigentliche Bookmark angelegt. In meinen Tests wurden so rund 70 Bookmarks angelegt. Bei rund 30 Diensten schlug das Anlegen aus unterschiedlichen Gründen fehl. Was nach schlechter Quote klingt, ist letztlich doch nicht so schlimm. Vor allem, wenn man die Gründe analysiert. Neben Hosting-Probleme bei einzelnen Bookmarkdienste haben viele Bookmark-Webmaster auch bewusst „Spezialregeln“ aufgestellt, die das Automatisieren verhindern sollen. Der eine Dienst verlangt mindestens fünf Tags, der andere untersagt ein Bookmark mit fünf oder mehr Tags. Der eine Dienst möchte 500 Zeichen in der Beschreibung, der andere weigert sich, so lange Beschreibungen zu akzeptieren.

Vielleicht hat man nach der ersten Anmeldung noch die Muse, die fehlgeschlagenen Anmeldungen per Hand zu überarbeiten. Doch diese Muse ist schnell dahin und man empfindet die Quote als durchaus akzeptabel.

GD Star Rating
loading...

Auswahl der wichtigen Artikelverzeichnisse (AVZ)

Wie wir im Artikel „Suchmaschinen optimieren in 10 Tagen“ gesehen haben, gehören Links aus Artikelverzeichnisse (AVZ) trotz Pinguin, Panda und weiteren Google-Updates zum Linkmix dazu. Sicherlich wäre es falsch, ausschließlich auf Links aus AVZ zu setzen, so wie wir es bisher im Beispielprojekt getan haben, doch gegen einige Links aus Artikelverzeichnisse, Webkataloge oder ähnliche haben Suchmaschinen nach wie vor nichts auszusetzen.

Zuerst stell sich natürlich die Frage, bringen Links aus Artikelverzeichnisse überhaupt noch etwas?
Dies kann man schnell und eindeutig mit einem JA beantworten. Die große Suchmaschine hat in der Vergangenheit viele AVZ und somit die Links aus den Verzeichnissen abgewertet, doch es macht Sinn sich die Mühe zu machen, aus den verbleibenden Artikelverzeichnissen sich die „Rosinen“ herauszupicken und dort Content zu platzieren.

Daher folgen hier die ultimativen 10 Artikelverzeichniss-Tipps:

  1. Die gesamte eingehende Linkzahl zu Grunde gelegt, sollten AVZ zehn, maximal 20 Prozent ausmachen.
  2. Es macht Sinn, neue AVZs zu Testen, da hier der Webmaster eher gewillt ist, neue Artikel auch freizugeben
  3. Es macht aber noch mehr Sinn, auf „alte“ AVZs zu setzen (sofern diese noch Artikel aufnehmen), da hier per Abfrage geprüft werden kann, wie gut das Artikelverzeichnis in Suchmaschinen vertreten ist. Denn ein Link aus einem abgestraften AVZ ist meines Erachtens nicht schlimm, aber nicht den Aufwand wert.
  4. Bei der Auswahl eines AVZ immer zuerst nachschauen, welches Datum der neuste Artikel trägt. Ist dieser älter als vier Wochen, liegt der Verdacht nahe, dass der Webmaster sein Projekt inzwischen ignoriert.
  5. Einen eingereichten Artikel immer samt Einrechungsdatum dokumentieren. Wenn der Artikel über einige Wochen nicht veröffentlicht wurde, das AVZ gedanklich abhaken und den eingereichten Artikel anderweitig veröffentlichen.
  6. Genau protokollieren, wann ein Artikel eingereicht wurde, wie der Ablauf war und wann die Veröffentlichung erfolgte. Diese Liste als Basis für weitere Projekte nehmen.
  7. Peinlichst genau an die Mindestanzahl der Wörter halten, die der Webmaster vorgibt. Eine subjektive Erfahrung zeigt, dass längere Artikel eher veröffentlicht werden, als knapp gehaltene Artikel.
  8. Nicht auf nennenswerten Besucherstrom über die AVZ-Links hoffen. Meine Auswertung der Logfiles hat ergeben, dass kaum ein Besucher über ein Artikelverzeichnis auf die beworbene Seite kommt. Somit ist dies auch – zumindest nach meiner Einschätzung – leider kein Auswahlkriterium eines Verzeichnisses.
  9. Das Spinning eines Artikels ist möglich. Wer jedoch ein bisschen Geld in die Hand nehmen kann, lässt sich einige einfache Artikel schreiben. Mit wenig Aufwand ist sofort aus einem Artikel eine zweite Version erzeugt, so dass mit fünf bezahlten Artikeln schnell zehn Artikel für Artikelverzeichnisse vorliegen.
  10. „Kein Artikel ist so schlecht, dass er nicht für ein Artikelverzeichnis taugt“. Diesen Satz habe ich vor geraumer Zeit in einem Forum gelesen. Dem (unbekannten) Autor muss ich recht geben: Man muss keine „Meisterwerke“ bei einem AVZ einreichen.
GD Star Rating
loading...