Google hat eine richtig gute Erfindung gemacht

Achtung, dieser Blog­post wird tech­nisch – aber die Lektüre lohnt sich: Wir finden näm­lich he­raus, wie wir beim Ver­linken einer Web­site exakt auf die ge­wünsch­te Stelle ver­wei­sen können.

Neulich bin ich einem interessanten Web-Phänomen begegnet. Wenn wir bei Google eine Frage stellen, dann kann es passieren, dass wir zuoberst in der Liste mit den Ergebnissen ein Zitat sehen, in dem die Antwort auf die Frage markiert ist.

Sollen wir auf den Link klicken, dann gelangen wir zur Website, wobei der Browser direkt zu der Stelle springt, an der das entsprechende Zitat zu finden ist. Nicht nur das:  Es wird auch farblich hervorgehoben, sodass sofort sehen, wo im Beitrag und in welchem Kontext das Zitat zu finden ist.

Ein Beispiel: Diese Suchanfrage hier führt zu diesem Suchtreffer hier.

Als Antwort auf eine Frage zitiert Google eine Passage aus einer Website.
… und beim Anklicken dieses Zitats erscheint im Browser gleich die passende Stelle, farblich markiert, auf der Original-Website.

Ganz ohne Zweifel: Das ist wahnsinnig praktisch. Ich ärgere mich seit zwanzig Jahren, dass ich (oft) nach dem Öffnen eines Treffers in Google nochmals die Suchfunktion des Browsers bemühen muss, um zu der Stelle im Text zu gelangen, die mich interessiert.

Bislang ein Ding der Unmöglichkeit

Es fallen nun zwei Dinge auf:

  • Der Trick funktioniert in Google Chrome, in Microsoft Edge und in Safari und Firefox am iPhone. Er funktioniert aber nicht bei Firefox in der Desktop-Version.
  • Und: Mit den Möglichkeiten der Webbeschreibungssprache HTML, wie wir sie bisher kennen, ist dieser Trick nicht zu realisieren.

Mit HTML können wir in einem Link nur auf eine bestimmte Stelle verweisen, wenn dort eine Sprungmarke (ein Anker) gesetzt ist. Da wir (normalerweise) keinen Zugriff auf fremde Websites haben, ist das nicht machbar. Und wir haben auch keine Möglichkeit, einen Text auf einer fremden Website zu markieren. Also bringt Chrome diesen Trick zustande?

Eine URL mit einem ziemlichen Rattenschwanz

Die Nachforschungen sind nicht schwierig. Wenn wir uns den Link ansehen, fällt ein langes Anhängsel am Ende auf:

#:~:text=Oberfl%C3%A4chliche%20Verletzungen%20heilen%20innerhalb%20von,zur%C3%BCck%2C%20die%20die%20Sehf%C3%A4higkeit%20vermindern.

Man muss nicht fünf Jahre Informatik studiert haben, um festzustellen, dass über den Parameter #:~:text= der Anfang und das Ende der Markierung übergibt, getrennt von einem Komma. Ausserdem ist der Text Prozent-codiert, damit die URL nicht auseinanderfällt.

Es klappt auch mit selbstgebastelten Links

Die naheliegende Frage an dieser Selle: Können wir solche Links auch von Hand basteln?

Zu diesem Zweck versuchen wir mehr über diesen URL-Bestandteil herauszufinden. Über eine Diskussion auf Stackoverflow erfahren wir, dass das Feature Scroll to Text Fragment heisst und können uns auf github.io über die Spezifikationen schlaumachen.

Hier erfahren wir, dass wir folgende Parameter verwenden können: [prefix-,]start[,end][,-suffix], wobei der einzige erforderliche Parameter start ist. Wenn nur start angegeben wird, ist die erste Instanz dieser exakten Textzeichenfolge der Zieltext. Und encodiert werden müssen Bindestriche, Ampersand (&) und Kommas.

Und tatsächlich: Zwei manuell gebastelte Links (hier und hier) funktionieren tadellos. Fürs Codieren habe ich diesen URL-Encoder benutzt.

Link to Text Fragment auch mit Firefox

Das ist grossartig: Surferinnen und Surfern erspart es, lange auf einer Website nach der gewünschten Textstelle zu suchen. Und ich als Mensch, der andauernd Links in Websites schreibt, habe endlich die Möglichkeit, exakt auf die entscheidende Stelle zu verweisen – und die Leute nicht bloss grob in die richtige Richtung zu schicken.

Wie erwähnt unterstützt Firefox Scroll to Text Fragment bislang nicht – und ich habe auch nicht herausgefunden, ob es Interesse bei Mozilla gibt, das zu ändern. Aber, gute Nachrichten: Wir können uns mit einer Erweiterung behelfen: Link to Text Fragment rüstet das Feature für den Mozilla-Browser nach.

Beitragsbild: Google schaut noch etwas genauer hin (Microsoft Image Creator zum Prompt «A robot with a google logo on the chest with a big magnifying class, through which a human female looks on a page with text written on it, in a colorful, detailed illustration»).

Kommentar verfassen