Markerad text via länkar i Chrome/Chromium

Som du har säkert har märkt av i dina Google-sökningar den senaste månaden eller två – i alla fall om du använder en Chromium-baserad webbläsare – så har Google rullat ut markering och länkning till text direkt i sökmotorn.

Faktum är att Google har jobbat på denna funktionaliteten ett bra tag; redan 2018 experimenterade de med detta för AMP-sidor för att nu slutligen rulla ut det för "vanliga" HTML-sidor i juni. Vanligtvis kallas tekniken för "link to text fragment" eller "scroll to text fragment".

En enkel Google sökning...

...Leder till ett markerat resultat

I Chromium har det funnits stöd inbyggt för denna typen av URL:er sedan version 80. Specifikationen finns att läsa i sin helhet hos WICG.

Det är helt klart en användbar teknologi som är fullt tillgänglig för alla att använda, inte bara för Googles sökresultat. Det hela bygger på att man kan direkt i URL:en välja text som ska "highlight:as"/markeras genom en URL-fragment:

#:~:text=

Ett enkelt exempel är att man kanske vill markera var på sidan man hittar ens kontaktuppgifter: marcusolsson.me/kontakta#:~:text=Kontaktuppgifter.

I enlighet med den fulla specifikationen kan man även filtrera ut texten med hjälp av prefix och suffix m.m:

#:~:text=[prefix-,]textStart[,textEnd][,-suffix]

Givetvis är inte detta särskilt användarvänligt att göra manuellt, därför Google erbjuder en extension för att automatiskt komponera en URL till texten. Bygger man exempelvis en webbapplikation så är det även väldigt enkelt att ha en "helper" för att bygga upp liknande URL:er.

1<?php
2 
3function buildTextLink(string $url, string $text) : string {
4    return sprintf('%s#:~:text=%s', $url, rawurlencode($text));
5}
6 
7// rawurlencode() to RFC 3986-/"percent"-encode the string
1<?php
2 
3function buildTextLink(string $url, string $text) : string {
4    return sprintf('%s#:~:text=%s', $url, rawurlencode($text));
5}
6 
7// rawurlencode() to RFC 3986-/"percent"-encode the string

Jag misstänker på sikt att man kommer att se mer och mer av dessa typer av länkar när fler får upp ögonen för tekniken och man hittar intressanta användningsområden.