Kommentarvorschau deaktiviert

Dieter — Fri, 18 Dec 2009 20:27:38 +0000

Erst vor zwei Monaten hatte ich auf Webseiten-Infos.de eine Kommentarvorschau eingerichtet. Diese basiert auf dem WordPress-Plugin Live Comment Preview (siehe hierzu meinen Blogbeitrag “Kommentarvorschau auf Webseiten-Infos.de“).

Da ich damals die Funktion mit einer if-Abfrage in die Template-Datei comments.php eingebunden hatte, gab es beim Deaktivieren des Plugins keine Probleme.

Aber warum habe ich diese Funktion deaktiviert?

Drei Gründe:

Die Vorschau flackerte bei viel Text und es war dann nur noch schwer möglich den Mauszeiger (Cursor) an das Ende des Kommentarfeldes zu setzen.
Die Kommentarvorschau ist zwar nett (nice to have), aber keine zwingend erforderliche Funktionalität. Die Implementierung der Kommentarvorschau führte nicht zu einer auffälligen Änderung bei der Anzahl oder Qualität der Kommentare auf Webseiten-Infos.de.
Gewichtiger und ausschlaggebend war für mich aber, dass das Plugin die Ladezeit der Webseiten mit Kommentarfeld um über eine halbe Sekunde verlängerte. Ursächlich hierfür war das zusätzlich zu ladende JavaScript. Das stellte ich mit dem Addon Firebug für den Browser Firefox fest. Ich hatte zwar im JavaScript die Kommentare und überflüssigen Leerzeichen entfernt, aber die Ladezeit verkürzte sich dadurch leider nicht nennenswert.

Wie auch immer, nun ist die Kommentarfunktion wieder weg und Webseiten-Infos.de ist noch besser für einen möglichen Bonus bei den Suchergebnissen mit der neuen Google Caffeine Suchmaschine gerüstet.

Mag sein, dass ich den Eindruck eines Geschwindigkeitssüchtigen vermittle, aber Geschwindigkeit zählt (speed matters). Dies zeigt auch die Einführung von Website-Leistung unter Google Labs in den Google Webmaster Tools (siehe hierzu auch die Blogbeiträge “Wie schnell ist meine Site?” und “Anzeige der Website-Performance in den Webmaster-Tools” bei der Google Webmaster-Zentrale).

Findest Du auch das Geschwindigkeit (so) wichtig ist?

Was tust Du, damit Deine Webseiten schneller laden?

Kommentare

18. Dezember 2009, Micha schreibt: Kurze Ladezeiten sind schon wichtig. Ich habe grade heute das Redesign von wpengineer.com hochgeladen. Dabei habe ich HTML Markup reduziert, CCS Bilder zu sinnvollen Sprite-Gruppen zusammengefasst. Natürlich läuft dort mein Stylesheetkompressor, der 4 CSS Dateien mit 35k zu einer mit 21k macht. Leider wirken sich die Avatare und auch die Buysellads negativ aus, aber ein ganz nacktiges Blog wollte ich nicht haben und 300$ im Monat sind mir doch etwas wichtiger als die Ladezeit ;) .
19. Dezember 2009, Dieter schreibt: Lieber Micha, das Redesign von wpengineer.com gefällt mir gut. Der Wiedererkennungswert ist erhalten geblieben. Zudem habe ich den Eindruck, dass die Seiten nun noch übersichtlicher geworden sind. Irritiert hat mich allerdings, dass das Logo nicht (mehr?) mit der Startseite verlinkt ist. Ist für mich ein Quasi-Standard, den ich gewohnt bin. Hast Du den Whitespace-Anteil (leicht) erhöht und/oder das Design simplified? Deine Maßnahmen zur Geschwindigkeitsoptimierung sind erkennbar erfolgreich (laut Firebug braucht die Startseite bei mir mit DSL 6000 nur rd. 1,5 Sekunden und laut websiteoptimization.com gibt es nur 12 HTTP-Requests). Aus meiner Sicht hast Du schon fast alle wesentlichen Optimierungsmaßnahmen für die Ladezeit von WordPress-basierte Websites im Einsatz. Trotz Avatare (Gravatare) und Buysellads lädt die Startseite von wpengineer.com erfreulich schnell. Eine WordPress-spezifische Beschleunigungsempfehlung wird es noch in einem meiner nächsten Blogbeiträge geben. Soviel sei schon mal verraten: Sie zielt auf die Reduzierung der Wartezeit für die Antwort des Servers (response time). Da besteht nach meiner Einschätzung voraussichtlich noch eine Optimierungsmöglichkeit für wpengineer.com (derzeit rd. 0,8 Sekunden). Auf Deinen Stylesheet-Kompressor, der ja in Deinem Premium-Theme zu Ehren kommen soll, bin ich genauso wie auf das Premium-Theme selbst schon sehr gespannt. Beste Grüße Dieter
19. Dezember 2009, Micha schreibt: Ja, das Logo :) Ich wollte das Logo als Image loswerden, damit bei abgeschalteten Stylesheets die Grafik nicht zu sehen ist. Der Whitespace-Anteil wurde erhöht, vorher war es ein bischen eng, vor allem in der Sidebar. Die Kommentare muß ich noch mal überarbeiten. Irgendwie gefällt mir das noch nicht so richtig...
19. Dezember 2009, Dieter schreibt: Das Logo als Hintergrund-Grafik? Dann klappt das Verlinken natürlich nicht mehr. Andererseits wird man Grafiken, auch Hintergrund-Grafiken, doch mit Grafiken ausblenden / nicht laden los. :confused: Ich hatte anfangs auf Webseiten-Infos.de sogar mal das Logo entfernt gehabt (siehe meine Blogbeiträge "Wo ist das Logo?" und "Das neue Logo ist da!"). Ute hatte mich dann aber davon überzeugt, doch wieder ein Logo einzubauen. Ja, Whitespace (Typografischer Weißraum, Leerraum) ist wohl ein, wenn nicht das mächtigste Mittel zur Gestaltung einer Website. Richtig dosiert profitiert davon jede Webseite. In der Sidebar von wpengineer.com würde ich mal mit einem noch leicht größeren vertikalen Abstand zwischen den Listenpunkten experimentieren und den Abstand von Zeilen bei mehrzeiligen Listenpunkten testweise leicht verringern. Ich muss zu meiner Schande eingestehen, dass ich auf die Schnelle mit Firebug keine entsprechenden CSS-Anweisungen gezaubert bekommen habe.
19. Dezember 2009, Micha schreibt: So Dieter, jetzt kannst du wieder wie gewohnt auf die Grafik klicken um zur Homepage zu gelangen. Ich wollte sie nicht loswerden im Sinne von nicht mehr laden. Ich wollte sie nur als Hintergrundbild um sie im print und bei abgeschalteten Stylesheets nicht mehr angezeigt haben.
19. Dezember 2009, Dieter schreibt: Micha: Danke! :-D So ist es für mich wieder vertraut. Der Mensch ist halt ein Gewohnheitstier. ;-) Ausblenden für das Drucken per CSS geht doch aber auch mit normalen Grafiken. Ist hier auf Webseiten-Infos.de im Stylesheet mit @media print {#header img {display: none}} realisiert. Nicht mehr Anzeigen bei abgeschalteten Stylesheets funktioniert allerdings wirklich nur mit Hintergrund-Grafiken. Wie hast Du denn das Logo als Hintergrund-Grafik anklickbar gemacht?
19. Dezember 2009, Micha schreibt: Nur ein Anker um den leeren Span, der die Hintergrundgrafik hält.
19. Dezember 2009, Dieter schreibt: Wow, den Kniff kannte ich noch nicht! Danke für die Erläuterung!
4. März 2010, Ulf. Mehr oder minder täglich Privatkram. schreibt: Ich HASSE diese idiotische Linkvorschau bei WordPress!... Hasst Ihr sie auch so sehr, diese aufpoppenden Vorschaufensterchen für Links, die den eigentlichen Text verdecken und schlecht lesbar machen? Meint Ihr auch, dieser Mist gehört abgeschafft? Wozu soll......

Kommentarvorschau auf Webseiten-Infos.de

Dieter — Thu, 15 Oct 2009 14:28:39 +0000

Und schon wieder gab mir Thomas Scholz aka toscho einen guten Tipp: Kommentarvorschau mit dem WordPress-Plugin Live Comment Preview.

Die Installation und Aktivierung des Plugins ist einfach:

Im Administrationsbereich (Backend) über Plugins > Installieren oder auf den Rechner herunterladen (downloaden), ZIP-Datei entpacken und mit einem ftp-Programm den Ordner live-comment-preview einschließlich der darin enthaltenen Dateien in den Unterordner wp-content/plugins/ auf Deinem Webspace kopieren.
Anschließend im Administrationsbereich (Backend) über Plugins > Verwalten das Plugin aktivieren und fertig.

Folgende Anpassungen habe ich hier am Code des Plugins (live-comment-preview.php) noch vorgenommen:

Zum einem habe ich den Code für die Darstellung des Gravatars (siehe hierzu meinen Blogbeitrag “Bild oder Foto beim Kommentar“) in der Vorschau entfernt (Zeilen 42 und 43). Bei Thomas beschwerten sich Leser, die eine langsame Internetverbindung haben: Der Gravatar wurde immer wieder neu geladen.
Das Wort “Says” habe ich in der Zeile 42 (vorher 44) gelöscht.
In der Zeile 40 habe ich die Angaben bezüglich style wie folgt geändert:
1
style="clear:both;margin:.5em 0 -1em -1em;"
In der Zeile 258 (vorher 260) habe ich in
Kommentarvorschau eingefügt:

Kommentarvorschau

Meine CSS-Datei habe ich um folgenden Code ergänzt:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

#commentPreview
{
margin: 0 0 1em 0;
padding: 0;
}
#commentPreview
{
border: 1px solid #736355;
background: #fff;
padding: 3px;
color: #111;
}
#commentPreview
{
width: 90%;
}

In der Template-Datei comments.php des von mir modifizierten Themes YAML Green habe ich folgende Ergänzung unmittelbar oberhalb des Codes für die Quicktags (Fett, Kursiv etc) vorgenommen, damit die Kommentarvorschau nicht unter, sondern über dem Kommentarfeld erscheint:
1
if (function_exists('live_preview')) live_preview(); ?>

Im Plugin-Verzeichnis von WordPress ist zwar nur die Kompatibilität des Plugins bis zur Version 2.5 angegeben, das dürfte aber daher rühren, dass die letzte Aktualisierung (Update) des Plugins vom April 2008 ist (Version 1.9). Bei mir scheint es aber auch mit WordPress 2.8.4 problemlos zu funktionieren.

Meinungen und Verbesserungsvorschläge für die hier nun eingesetzte Kommentarvorschau sind jederzeit gerne willkommen.

Einfach einen Kommentar schreiben.

Nachtrag:

Die Kommentarvorschau habe ich wieder deaktiviert und die Gründe in meinem Blogbeitrag “Kommentarvorschau deaktiviert” aufgeführt.

Kommentare

14. April 2010, Leo schreibt: Geniales Plugin. Hab ich auch direkt installiert.
14. April 2010, Dieter schreibt: @Leo Dann bin ich mal gespannt, wann Du es - wie ich - auch wieder deinstallierst. ;-)

Webseiten-Infos.de » Kommentarvorschau

Kommentarvorschau deaktiviert

Kommentare

Ähnliche Beiträge

Kommentarvorschau auf Webseiten-Infos.de

Kommentare

Ähnliche Beiträge