Deppenlink entfernen
25.01.2009 in: Markup, PHP, Trickkiste, Webdesign und WordPress • 43 Kommentare
Letzte Änderung: 16.11.2010, 02:09 Uhr.
Achtung: Künftig verwende bitte mein Plugin Remove Redundant Links. Es überwindet viele Schwächen der unten vorgestellten Version, und es kann automatisch aktualisiert werden. Darin findest du eine gut dokumentierte PHP-Klasse, die du auch ohne WordPress verwenden kannst.
Richtige Links führen auf eine neue Seite. Ein Deppenlink auf die alte. Der Klick bewirkt schlicht ein Neuladen; er irritiert den Leser, verlängert die Liste des Zurück-Buttons und trägt zum allgemeinen Informationsrauschen auf der Seite bei. Ganz mieses Interaktionsdesign.
Viele aktuelle Blogs und Content-Management-System produzieren solche Deppenlinks, und nur wenige Autoren machen sich die Mühe, diese wieder zu entfernen. Schade.
Dabei läßt sich das Problem ganz einfach lösen: Der Autor weiß, wie sein Quellcode vor der Ausgabe aussieht, und welche Seite gerade aufgerufen wird. Jetzt muß er nur noch die passenden Stellen im Code ersetzen – und schon ist er kein Depp mehr. Und seine Leser müssen eine Entscheidung weniger treffen.
In meinen WordPress-Themes benutze ich ein PHP-Script, das die gesamte Ausgabe des HTML-Codes abfängt, aufräumt und dann sauber ausliefert. Darin findet sich diese Funktion:
Update 16.11.2010: Gelöscht, war Mist.
Alte Version
Diese Version sollte nicht mehr verwendet werden; ich lasse sie nur stehen, weil schon Beiträge andernorts darauf verweisen.
/** * Entfernt Deppenlinks. * * @author Thomas Scholz <http://toscho.de> * @param string $str Zu filternder String * @return string */ function remove_self_links($str) { $_SERVER['REQUEST_URI'] = strip_tags($_SERVER['REQUEST_URI']); /* Absolute URLs zu absoluten Pfaden. * Zweimal str_replace() ist schneller als einmal preg_replace(). */ $str = str_replace( 'href="http://'. $_SERVER['SERVER_NAME'], 'href="', $str); $str = str_replace( "href='http://". $_SERVER['SERVER_NAME'], "href='", $str); /* Links auf die Startseite sind jetzt leer, müssen gefüllt werden. */ $str = str_replace(array("href=''", 'href=""'), "href='/'", $str); /* Links auf die aktuelle Seite entfernen. Nur bei GET. */ if ( 'GET' != $_SERVER['REQUEST_METHOD'] ) { return $str; } $str = preg_replace('~<a\s*([^>]*)href\s*=\s*(["|\'])' . $_SERVER['REQUEST_URI'] . '\\2([^>]*)>(.*)</a>~Umis', '<span title="Hier befinden Sie sich gerade." class="current">' . "\\4" . '</span>', $str); return $str; }
In WordPress kann man sich diese Funktion entweder in die eigenen Scripte einbauen, oder man schreibt sie in die eigene functions.php und setzt ganz oben in die header.php folgende Zeile:
ob_start('remove_self_links');
Das reicht schon. Damit erwischt man nicht nur Links in der Navigation, sondern auch beispielsweise in der Übersicht einer Kategorie.
Anhand der Klasse current kann man diese Nicht-Links jetzt auch mit CSS ansprechen:
.current {
color: #777;
background: #fff;
}
Natürlich funktioniert das nicht nur in WordPress, sondern mit jeder Seite, die mit PHP generiert wird. Da kann man entweder mit dem generellen ob_start() für alles arbeiten oder so:
<?php /* Puffer starten. */ ob_start(); ?> <!-- normaler HTML-Code, beispielsweise die Navigation --> <?php /* Puffer abfangen. */ $clean = ob_get_contents(); /* Puffer leeren. */ ob_end_clean(); /* Aufräumen. */ $clean = remove_self_links($clean); /* Ausgeben. */ echo $clean; /* Fertig. */ ?>
Löst ihr dieses Problem anders? Wie? Oder gar nicht? Warum?
Und wenn es mal schnell gehen muss oder man den HTML-Code nicht ändern kann, reicht manchmal auch ein bisschen CSS-Kosmetik um den Link vor normalen Benutzern zu tarnen:
a.current, a.current:hover { cursor: default; text-decoration: none; color: #000; }(Die nötigen Properties sind natürlich individuell unterschiedlich.)
Ich bin immer noch ein Pseudo-Depp im Blog. ;)
Bevor der Deppenlink schwindet, muss ich erst die Plugins für Kategorien, Tags und Breadcrumbs umprogrammieren.
Demnächst, eben.
Derzeit sind die aktuellen Links anwählbar, um schneller in der Navigation zurück zu kommen, aber wenigstens fett ausgezeichnet.
Nicht sehr toll als USability. Aber es geht noch.
Ich muss mal die Navigation des Blogs überdenken.
Dein Blog ist bestimmt in Perl geschrieben, oder? Da kannst du doch auch Outputbuffering verwenden.
Hier im Blog fasse ich zum Entfernen der Deppenlinks kein einziges Plugin an; ich sorge einfach dafür, daß die Reparatur zuletzt arbeitet. Das spart das ganze Gefrickel.
Also ich habe das Problem bisher leider nicht gelöst, sondern nur etwas abmildern können.
Ich setze das WordPress-Plugin Breadcrumb NavXT ein. Dort sowie beim aktivem Menüpunkt meiner Hauptnavigation habe ich für die aktuelle Seite den Link nicht nur mit Fettdruck gestaltet, sondern auch noch mit der Standardfarbe schwarz versehen und den Mauszeiger an normalen Text angepasst.
Dein PHP-Skript bekam ich leider nicht umgesetzt. Dafür fehlt es mir (noch?) an den entsprechenden PHP-Kenntnissen. Leider!
Schreibe die Funktion (den ersten großen Quelltext) in die Datei
functions.phpdeines aktuellen Themes.In die
header.phpdes Themes schreibst du ganz oben, direkt nach dem<?phpden zweiten Code:ob_start('remove_self_links');Das sollte in jedem WordPress funktionieren, und Programmierwissen brauchst du dazu nicht.
Dieter am 05.02.2009 · 16:38
Danke für den Hinweis, dass man den Code jeweils noch in
phpund?>setzen muss.Damit funktionierte es! Super!
Leider zerhaute es mir dafür dann das Layout.
Konkret: Tabreiter der aktiven Seite war weg und der Linktext oberhalb und bei Blogbeiträgen verschwand (verständlicherweise) das als CSS-Image eingefügte Icon dafür, so dass der "Nichtlink" einen unschönen Einzug bekam.
Ich gehe davon aus, dass sich das über entsprechende CSS-Festlegungen für Nichtlinks in den Navigationsbereichen beheben lässt. Allerdings ist meine CSS-Datei viel zu groß. Da muss ich noch einmal in mich gehen, ob ich dafür einen so großen Aufwand betreiben sollte.
Ersetze einfach das
#nav_main ul li.current_page_item ain dergreen_2col_right.cssdurch#nav_main ul li .current. Das war’s schon.Herzlichen Dank für Deine Hilfe.
Das war es aber leider nicht schon. Der Tab mit dem "Nichtlink" springt hoch und die Startseite lässt sich dann nicht mehr über die Hauptnavigation aufrufen. Und das ist nur das, was mir direkt auffiel. Das ist mir ein zu hoher Anpassungsaufwand. Habe noch bedeutsamere Baustellen.
Klaus am 01.04.2009 · 15:40
Hallo Thomas,
ich wollte mich ausdrücklich für dein Script zum "Deppenlink" entfernen bedanken.
Meine PHP-Kenntnisse sind äußerst rudimentär, mit WordPress fange ich gerade an und trotzdem hat es einwandfrei geklappt.
Bis dann im XHTML-Forum.
Gruß
Klaus
Servus Toscho,
so ganz hab ich die Problematik noch immer nicht verstanden. Du versuchst hier was genau? Bitte um Erklärung.
@k: Ich entferne den Link auf die Startseite, wenn du auf der Startseite bist, und den auf auf die Kontaktseite, wenn du auf der Kontaktseite bist. Und so weiter.
d. am 04.07.2009 · 18:25
idee & script klingen gut, leider bekomme ich es aber nicht in wordpress umgesetzt. ich verwende in meinem eigenen theme bisher KEINE functions.php.
wie soll ich das script denn dann einbinden?
und mein menü ist aktuell so gestaltet:
#navmenu{ text-align: left; text-decoration: none; list-style-type: none; list-style-image: none;} #navmenu a:link, #navmenu a:visited{ text-decoration:none; font-size: 16px; font-weight: bold; color:white; border: 1px dashed #ffffff; padding: 2px;} #navmenu a:active, #navmenu a:hover{ text-decoration: none; color: #333366; background-color: #FFffff; border: 1px dashed #333366; padding: 2px;} #navmenu ul { margin:0; padding:0; float:left; width:100%; list-style-type:none; } #navmenu ul li { display:inline; margin-right:10px; padding:0; float:left;} #navmenu ul li.page_item a { display:block; text-decoration:none; }Reicht im Anschluss Dein...
.current { color: #777; background: #fff; }? oder muss ich das in meine #navmenu einbinden?
danke für hilfe!
@d.: Du kannst den Code auch ganz oben in die
header.phpschreiben, vor die erste HTML-Ausgabe.Ob du nur
.current {}schreibst oder#navmenu .current {}hängt davon ab, wie die aktuelle Seite in deinem Menu aussehen soll.mike am 06.06.2010 · 13:59
Die Idee an sich finde ich sehr gut.
Ich sehe nur ein kleines Problem, wo ich mir uneinig bin, wer/was in Sachen Usability gewinnt: nämlich der sogenannte "Permanentlink".
Sicher, den kann $User sich auch aus der Adressleiste kopieren, aber für den einen oder anderen mag es bequemer sein, diesen rechtsmausig zu kopieren. (für was auch immer, in Mail einfügen etc.)
Irgendwelche Meinungen dazu?
@mike: Ich halte sehr wenig von diesen Links:
Insgesamt sehe ich also mehr Nach- als Vorteile.
mike am 06.06.2010 · 14:38
Ok, danke, bin fast überredet ;)
Mal schauen, ob noch wer Pro-link-argumente in petto hat, ansonsten setze ich das mal zeitnah um. Bisher nie wirklich drüber nachgedacht.
Hallo Thomas,
du hast es vermutlich eh bemerkt, dass ich dich zitiert habe:
http://webdesign.weisshart.de/blog/2010/06/06/eine-seite-soll-nicht-auf-sich-selbst-verlinken/
Aber nun zur Pro- und Kontra-Frage:
Das geilste Argument: Google belohnt den Deppenlink!?
Davon wollte mich heute tatsächlich jemand per Twitter überzeugen.
Das Problem? Dieser Jemand rankt bei Google saumäßig gut.
Und nun?
@Fritz: Eine wissenschaftliche Untersuchung hat mal gemessen: In Gegenden mit vielen Störchen lag die Geburtenrate auffällig hoch. Kausalität tritt nicht dort auf, wo es einem gerade paßt. ☺
Sachlich betrachtet gibt es keinen Grund, warum eine Seite relevanter sein soll, die sich selbst verlinkt. Das halte ich für Unfug.
Heinz-Georg am 12.07.2010 · 21:28
Hallo Thomas,
das, was ich Stunden gesucht hab!
Ich finde bei mir bloß nicht wo die Formatierung herkommt. Ich habe in der style.css eine Klasse .current angelegt, aber die Seite reagiert da nicht drauf.
Ich bin zwar mit der aktuellen Formatierung ganz zufrieden, wüsste aber gern wo ich das verändern kann.
Vielleicht kannst du mir kurz helfen.
Danke
Heinz-Georg
@Heinz-Georg: In der Seite, die du hier im Kommentar angegeben hast, funktioniert es; die Formatierung wird angewandt. Sie ist nur wenig deutlich. Wenn du mal einen anderen Hintergrund verwendest, siehst du das Ergebnis sicher besser.
Nebenbei: Das Theme Twenty Ten solltest du nicht direkt bearbeiten, sonst gehen deine Änderungen beim nächsten Update verloren. Lege lieber ein Child Theme an.
Heinz-Georg am 14.07.2010 · 19:08
Hallo Thomas,
ich weiß nicht, wo er die Formatierung her hat. Ich habe in style.css folgenden code eingefügt:
.current {
color: #777;
background: #fff;
}
Also müsste die Schrift doch blau sein!?
Zu dem zweiten Punkt, das wusste ich vorher nicht, hab aber schon einiges in ein paar php Dateien und der style.css geändert. Kann ich da das Theme nicht besser ganz umbenennen?
Gruß & Danke
Heinz-Georg
@Heinz-Georg:
#777;ist Dunkelgrau. Blau wäre beispielsweise#007.Und ja, du kannst das Theme auch umbenennen. Dann profitierst du natürlich nicht mehr von den Verbesserungen der Updates.
Hej Thomas,
ich hatte mich noch nie mit der Hexadezimale Kurzform beschäftgt, was ich jetzt nachgeholt hab. Hatte die drei Zahlen in den PS Farbwähler eingegeben und der zeigte mir blau. Oh.
Die Seite ist eh fast nur statisch, das mit Chlid Theme mach ich beim nächsten Projekt.
Nochmals Danke
Heinz-Georg
Thomas am 20.07.2010 · 10:55
Ausgezeichneter Guide. Ich habe dieses Umstand immer auf eine etwas kompliziertere Art und Weise realisiert.
So ist es aber um einiges eleganter!
Andreas Borutta am 15.09.2010 · 16:08
Sehr nützliches Skript! Herzlichen Dank.
Bisher habe ich die Navi für jede einzelne Seite - um den Deppenlink zu vermeiden - immer manuell erstellt.
Im Site-Titel von Startseiten findet man ebenfalls häufig einen Deppenlink.
Zum Beispiel auf alistapart.com.
Muster:
<h1><a href="/" title="Zur Startseite">Lorem Ipsum</a></h1>
Auf der Startseite will man:
<h1>Lorem Ipsum</h1>
Das erzeuge ich weiterhin händisch.
Andreas am 05.11.2010 · 00:14
Großartiges, kleines Script!
Was habe ich immer umständlich ausgeblendet, nun aber, versprach das Script saubere Abhilfe:
Unter meiner lokalen Testumgebung funktioniert es reibungslos.
Habe eins, zwei, drei - alles weiter umgebaut und anschließend auf den Server hochgeladen. Das, was lokal(Apache) erwartungsgemäß lief, ist Online schlichtweg nicht zu sehen.
Woran kann das nur liegen?
@Andreas: Eventuell kommt dir ein zweites Outputbuffering in die Quere. Wenn du beispielsweise nach dem
ob_start('remove_self_links');noch einob_start('ob_gzhandler');stehen hast, so bekommt das Script nur komprimierten Code vor die Nase, mit dem es nichts mehr anfangen kann.Oder ein anderes Script leert den Outputbuffer zu zeitig, dann bekommt mein Script nur noch einen leeren String zu Gesicht.
Vielleicht hilft dir schon ein
error_reporting(E_ALL | E_NOTICE);ganz am Anfang der Datei?Andreas am 05.11.2010 · 13:32
Danke für die schnelle Hilfe. ☺ Ich nutze übrigens kein WordPress.
Das Error_reporting zeigt keine Fehler an.
Wenn es doch lokal funktioniert, wie sollten dann die nachfolgenden Zeilen in:
D:\xampp\htdocs\...\...\includes\classes\Template.class.php (3 hits)
Line 56: ob_start();Line 58: $data = ob_get_contents();
Line 59: ob_end_clean();
online stören???
Liegts möglicherweise an 1&1?
@Andreas:
ob_end_clean()leert den Puffer und deaktiviert die Ausgabe-Pufferung. Aus dem Fragment ersehe ich natürlich keinen Zusammenhang, also kann ich dir nicht mehr dazu sagen. Sieh auch mal bei ob_start() nach, da stehen einige hilfreiche Hinweise im Handbuch.Andreas am 05.11.2010 · 19:57
@Thomas Scholz: Hut ab, Thomas,
man sollte bei Verwendung Deines großartigen Scripts beim Webhoster 1&1 die 3 Angaben $_SERVER['REQUEST_URI'] durch
$_SERVER['REDIRECT_SCRIPT_URI']ersetzen.Jetzt funktioniert das Scripten.
Dank für Alles, insbsondere der zeitnahen Unterstützung!
@Andreas: Interessant. Was steht denn in
$_SERVER['REQUEST_URI']drin? Oder ist das gar nicht gesetzt? Läuft PHP bei dir als Modul oder über CGI?Andreas am 05.11.2010 · 23:49
@Thomas Scholz: PHP läuft als Modul. Abfrage auf $_SERVER['REQUEST_URI'] zeigt ein Pfad auf, Beispiel: kunden/1/48566314/htdocs/ ...
@Andreas: Der unsinnige Wert reicht nach einer bösen Fehlkonfiguration. Weise 1&1 bitte mal darauf hin, daß solche Pfade in
REQUEST_URInichts verloren haben, ja?Ich habe jetzt die Funktion so geändert, daß sie auch diesen Fall hoffentlich abfängt. Außerdem habe ich den regulären Ausdruck genauer erklärt und die Performance ein wenig verbessert.
Testest du die Version 1.1 das bitte mal?
Bei mir betrachtet Version 1.1 jeden Link als Deppenlink und wandelt ihn um. ☻
Eine neue Fassung des Scriptes findet ihr jetzt im Pluginverzeichnis auf WordPress.org: Remove Redundant Links.
@Thomas Scholz: Erstmal Danke für das Plugin. Funktioniert prima. Nur eine Sache will bei mir nicht funktionieren (vielleicht hab ich da aber auch was falsch verstanden): Wenn ich bei replace_a ein span eintrage, dann wandelt das Plugin mir alle anchor in spans um ... was ja irgendwie nicht so Sinn der Sache ist, oder? ;).
Hm, ich glaube ich muß mir das noch mal in Ruhe ansehen.
Andreas am 18.04.2011 · 20:58
Lokal läuft die aktuelle Version Deines Scriptes, beim Provider 1&1 jedoch nicht ...
Hm, ich habe gerade ein kurioses Problem, wenn ich das Remove-Redundant-Links-Plugin verwende und für eine Lytebox data-rel="lytebox" verwenden will. Mit aktivierten Plugin wird da bei der Ausgabe rel="lytebox" und data="-" draus.
Da wird wohl etwas zu gut gefiltert.
Im Moment kann ich noch nicht so recht sehen welcher Teil des Skripts da Schuld sein könnte.
@Sven: Danke, ist notiert. Ich muß es ohnehin nochmal anfassen, weil auch mit beim Ersetzen des Elementes
<a>ein Fehler auftritt. Falls du mal irgendwo einen minimalen Testfall ablegen könntest, als Gist beispielsweise, wäre das sehr hilfreich. :)@Thomas Scholz: Ich hab's für mich gelöst bekommen indem ich in der class.Remove_Redundant_Links.php in parse_attributes im Regulären Ausdruck \W durch [^A-Za-z0-9-] (irgendwo habe ich gesehen, dass jemand anstelle meiner Zeichenfolge [\W-] empfohlen hat, aber das macht bei mir nicht dasselbe) ersetzt habe.
Damit funktioniert jetzt soweit ich sehe für mich alles wie gewünscht. Das wird jetzt nicht unbedingt die beste und ultimative Lösung sein, aber im Moment reicht mir das so.
@Sven: Ja, das sollte genügen. Mittelfristig will ich jeden Regex aus der Klasse verbannen, das verträgt sich mit Markup einfach nicht.
@Thomas Scholz: Da bin ich ja mal gespannt auf das überarbeitete Plugin (wenn's dann irgendwann soweit ist ;-)).
Ich hatte schon überlegt, ob man über sowas wie benutzerdefinierte Felder dem Plugin vorgeben könnte das es bestimmte Strings ignorieren soll, aber das kann vielleicht auch nach hinten losgehen oder ist vielleicht auch für manche zu kompliziert.
Ich habe in diesem Jahr noch zwei Deadlines und möchte nicht für jeden einzelnen Bugfix eine neue Version ausgeben. Wird also erst Anfang Januar wieder.