Does Google Index Text Content in CSS Pseudo Elements?
Traditionally when Google (or other search engines) look for text-based content to index - they expect to find this content directly in the HTML of the webpage that is served to them.
This changed somewhat with the rise of sites using JavaScript to serve anywhere from small pieces of content to entire websites.
Google was forced then to invest resources attempting to render and index JavaScript based content as effectively as possible.
But what about text content that is sourced purely from CSS? It is possible to add content to a page using CSS pseudo elements such as ::before and ::after combined with the CSS content property.
Year after year as CSS gets more advanced and other features are introduced, such as the ability to do mathematical calculations or count elements using only CSS, the likelihood of devs and designers adopting these features becomes higher.
Before we start it is important to note that in the large majority of situations using CSS pseudo elements and the 'content' property (instead of HTML) to display any significant amount of text based content on a website is absolutely not best practice for various reasons, including:
