Not everyone knows that as of 2018, when we navigate to an AMP page via a snippet in Google’s SERP, the browser can scroll through our page and color-code the text we were looking for.
Few people know that as of recently this is also possible on regular HTML pages, not just AMP.
And an utterly negligible number know that as of the latest version of Chrome 89, we can control how that selection should visually look. Which gives us room for optimization – which is, after all, what we like.
In this short text, I’m just signaling the existence of such a thing as Text Fragments, the fact that Google uses it in snippets, and the fact of the appearance of the ::target-text pseudo-element. In a while, probably some in the industry will notice this topic and rewrite your documentation with golden tutorials on how to optimize for it – don’t be fooled, no one (including me) has any idea how to do it, and the pseudo-element ::target-text itself has existed for too short a time to do any optimization testing. But tutorials are bound to appear, such an industry. 😉
Spis treści
Text Fragments and ::target-text – what does it involve?
I could beget several paragraphs about what such scrolling is all about, but let’s use an example. Let’s imagine that the following is a snippet in the search results. Let’s click on it:
In a new tab, the page should scroll and highlight a section of text. Your browser should respond in one of 3 ways:
- if your browser is old or incompatible, nothing has happened
- if your browser supports Text Fragments, the above sentence highlighted in yellow (default color)
- if your browser supports target-text (e.g. Chrome version min 89), the above sentence highlighted in green (set by me)
How do we generate a link that scrolls and color-codes the content on our site?
The scheme is quite simple, but you can help yourself with an appropriate extension, such as.
Link to Text Fragment
.
The URL that performs such wonders looks more or less like this:
https://domena.pl/sciezka#:~:text=tekst%20do%20zaznaczenia
This is of course a gross oversimplification, Text Fragments is a much more flexible creation. You can delve more into this topic in this documentation, but for everyday use, generating addresses through the aforementioned extension will suffice.
Google itself creates and selects such links, depending on the search context and content on our site. This, of course, applies for the moment only to a certain fraction of all queries and only to the links found in snippets.
How to control the appearance of the selection?
Until now, the selection was yellow by default, it looks the way it looks, and we don’t have much influence on it. I mean, we didn’t have, because now CSS pseudo-elements are slowly entering the browser-supported ::target-text.
All you need to do is add the code to the style sheet:
::target-text {
background-color: #twojkolor;
color: white;
}
Although logic dictates that it should theoretically be possible to slightly manipulate the appearance beyond the color scheme, I have not been able to increase the font, for example, but only modify the text and background color.
::target-text still has the status of an experimental element, and probably its capabilities and exact behavior will still change a bit. However, I think that the more clever webmasters will already find devious uses for the ability to ostylate selected elements.
As I write these words, ::target-text is already supported by the latest Chrome, Edge and the desktop version of Opera.
How do I force Google to link directly to a piece of content in a snippet?
Well, it can’t be done. I.e. it is possible but it is obviously not easy. Such marking of excerpts in the content only makes sense for queries, where our site provides a specific answer to a specific question, with the answer being only part of a longer content – hence the need to “point” it out to the user.
The only advice for getting Google to refer users directly to snippets of interest is the same as for wanting to be in snippets: good content that matches user intent and a solid onsite job on the technical side.
This type of optimization, as well as the use of Text Fragments itself , will become more important with the announcement of the update, after which Google will place more importance on page fragments.
By the way…
Google is interfering with the appearance of my site through this feature – what can I do about it?
This is not the only question that arises.
First, Google interferes with the appearance of the site. A page, even if we haven’t modified it since 1999, will display differently than it has for the past 20 years if a user is referred there from a snippet with a link to the excerpt.
Secondly, such links do not present the user with the site the way the webmaster intended, but redirect the user to the place Google chooses. So if a user finds the information he is interested in, but along the way misses a product offering or an advertisement – that’s our problem.
Third – somewhat abstractly, but still – Google is violating a boundary. We get pissed when it steals our data and displays it in the SERPs, we get pissed when it displays our pages in AMP directly from the google.com domain, and now on top of that it is encroaching on the perception of our own pages, standing on our servers.
What can we do about it? Well, nothing.
None of these actions break the law; Google, after all, implements its rule with white gloves. After all, one could say that this is the natural order of things and the result of ordinary technological development. New features are emerging – such as Text Fragments, after all, it’s not since today that certain standards have been implemented and others phased out.
Only that the direction of this development is not driven by the needs of Internet users. Google has monopolized almost every branch of its industry, and it is Google that decides what users “want.” With the largest search engine and the world’s most popular browser, it sets standards only with its long-term benefit in mind.
To be clear – I’m not against the new feature – I even think it has potential – but it’s another step by Google to modify the world wide web according to its own interests – even if, on occasion, users will benefit.
