How does CSS affect SEO?

[Music]
Hello and welcome to a new episode of
Search of the Record, a podcast coming
to you from the Google Search team where
we talk all about search and maybe have
some fun along the way. My name is
Martin and I am a search relations
uh engineer. I I don't even know what my
job title is anymore, but I'm part of
the search relations team. And with me
is John Miller. Hello, John.
>> Hello, Martin. So great to join you
here. What a surprise,
>> right? It's always surprising when we
see each other.
Oh man, so many conferences, so many
travels. Um, but here we are. Universe
brought us back together. Woohoo. What
would you like to talk about today? What
have you brought for us?
>> I would like to talk about CSS.
>> Oo, wait. Does CSS Wait, wait, wait,
wait, wait. Does CSS have anything to do
with SEO?
>> Doesn't everything have to do with SEO?
>> Well, I mean, like my cat's sleep cycle
probably does not have anything to do
with with SEO, does it?
>> Well, unless it unless it wakes you at
5:00 a.m.,
>> which it does, but that's fine. Um but
but no like seriously I mean CSS is just
styles. So how does my website look?
What fonts to use? What colors does how
does that what how does that have no
what does it have impact?
>> Well I mean Google's guidelines say you
should make your CSS files crawable. So
there must be some kind of magic in
there, right?
>> Okay, I'll bite. But I haven't seen many
people talk about it. Like I I don't
think it's a topic in the SEO world, is
it?
>> Well, we could make it one. What do you
think?
>> Okay. Okay. Let's let's explore this
topic. That sounds like an interesting
route to go. So, why is no one talking
about CSS with regards to SEO? Where
where should they be looking? What what
should they should there be a starting
point? like why would they matter? How
does it work? Like how do people use
let's start with how do people use CSS
these days?
>> How do people use CSS? Um they link to a
CSS file from their HTML pages and links
are the basis of everything around SEO,
right?
>> Okay. Okay. But what do they put in
their stylesheets? Do we have any
insights to that? I looked at a few
places where people talk about uh CSS
kind of the the status of the world of
CSS because I know a little bit about
CSS but basically my knowledge is based
on
uh kind of I don't know how I made my
web pages way back in the day when you
made HTML pages in an editor and wrote
your own CSS.
So I I have no idea what has happened
with CSS since then and I know there are
some people who are really active in the
world of CSS and kind of bringing new
things out. So
>> I my assumption is things have changed a
little bit
>> and
>> with regards to SEO
it feels like every now and then we get
SEO questions that kind of map to CSS.
So, I thought like all of the front-end
developers who are kind of doing CSS on
the side, like maybe it would be good to
have an episode just to talk about SEO
for CSS.
>> Fair. That makes sense. I I think it's a
little bit like JavaScript. It's usually
fine to use C like I mean everyone's
using CSS. It's fine. It's perfectly
fine to use CSS, but it provides a lot
of flexibility and power and sometimes
you can accidentally build things that
are not going the way that you
anticipate them to go. Um, so yeah, I
think that makes sense. I I guess there
might actually be implications. I
remember a few really weird cases and
questions that we got that turned out to
involve CSS. Yeah, that's a it's a good
point. Yeah, and I think CSS has
changed. the way that that it has been
used has changed a lot over the years.
So may might make makes sense to talk
about it now.
>> Cool. Yeah. I mean I doubt there are
things in CSS that break the way that
JavaScript can break things for search,
but like maybe I mean maybe I'm I'm sure
there are very creative CSS developers
who can make things that
search engines don't really understand.
>> Yep. Oh yeah. Well, they understand it.
It's just backfiring in interesting ways
sometimes. It's uh Yeah. Okay. We'll
we'll get to those. We'll get to those.
Let's
>> let's start at the beginning. Websites
have grown. Has CSS grown over the time
as well? I guess so.
>> Yeah. In preparation for this, I looked
at the HTTP archive web almanac, which
they do every year or so, and they did
one or they did a report on CSS in 2022.
I don't know if there's a newer one. I
>> I check there isn't. No.
>> Okay. Well, I don't know what that
means. CSS dead.
[Laughter]
>> Hope not. I hope not.
>> I don't think so. I don't think so.
>> Cool. So, I I looked there and I thought
we could kind of walk through some of
the things that are in there. And the
the first one that they kind of start
off with is the size of CSS that is
included in HTML pages.
I don't know about you, but when I write
my CSS files, they're usually a lot
smaller than my HTML pages. How how do
you do it?
>> Yeah. Okay. So that depends a little bit
on if you're handwriting or your CSS,
which of of course you can still do and
that's perfectly fine. Um, but you don't
necessarily do that, especially if you
just like design like things for
multiple clients or if you just want to
quickly build like a landing page or
something. You might use like a
framework because there are kind of like
pre-built CSS CSSes or stylesheets
um that you can just use um and then
style your your content with. And these
are sometimes quite large I believe.
Okay, so it's like the the old school
people who are writing their own HTML
and writing their own CSS, they have
small and sleek pages and those that use
a framework have the full bloat.
>> No, I mean you can like remove the
unused rules and you can split the files
and these kind of things. So you you
have ways to do it. Um but maybe not
everyone does like some people just like
plug it in and then just forget about
it. I don't know. Yeah. So the the web
almanac says
every year we see CSS grow in size and
in 2022 the medium style sheet size was
68 kilobytes or 72 kilobytes. I I think
like one is desktop, one is mobile.
>> First is mobile, second is desktop. It's
interesting that there's not that much
difference between the two, but it's
quite large.
>> Yeah, those are large files. just like I
don't know if I had to write that
manually I would spend way too much time
on it. So I guess these are frameworks
in that case.
>> I think so.
>> Okay. They also mentioned the largest
one that they found was 78 megabytes.
>> What?
>> Which is crazy.
>> What?
>> Yeah.
>> These are text files.
>> I don't know. Like maybe I just don't
understand modern CSS but I don't know
how you can fit 78 megabytes into one. I
guess if you like have lots and lots of
images as data urls in your CSS maybe,
but that's a really weird choice.
>> Yeah,
>> that's such a bad idea. Oh god,
>> I mean I have heard of people who have
audio files in their text files, so who
am I to judge?
>> That's a really nice insider joke.
For the people who have seen that file
and have laughed and enjoyed it, it has
been great. For those who haven't, look
around the internet a little closer.
>> That's kind of mean. I I think like look
around the internet to find one text
file.
>> Okay. Look,
>> will keep people busy.
>> That's That's true. But uh look at
someone's websites uh text files, let's
put it that way, and you will be
surprised.
>> Okay, we'll see.
>> Some of our websites,
>> we'll see who actually takes a look.
It's It's not for humans. It's more for
robots. But whatever. We'll see.
>> Okay.
>> Okay. Moving on to more serious topics.
>> Uh, one one question I still regularly
get is whether CSS class names have any
SEO effect.
>> Yeah, I hear that question as well. I
don't think it does. I don't think we
care because the CSS class names are
just that. They're just assigning a
specific
somewhat identifiable bit of stylesheet
rules to elements and that's that's it.
That's all. You could name them all
blurb. It would not make a difference
from an SEO perspective. It would just
be really really hard for developers and
designers to identify what this is
supposed to be.
>> But these are words in the HTML page
now. Yeah, but they're not part of the
text content.
>> Oh, so it's not because it's not
visible, it wouldn't have any effect on
>> SEO. No, it's like making up HTML
elements that don't exist like I don't
know, put the keyword in a in a tag name
or something and then hope that that's
what is in. No, it's not. It's just a
random HTML element then.
>> Okay. What about simpler crawlers? like
I don't know if you were if you're
manually parsing the HTML file and
feeding it to an AI model
would would it have an effect there?
>> I mean that depends on how you implement
that. But normally what you do is you as
you say you parse the HTML. So you say
like so give me all the elements and
then give me all the text content from
the elements and that would strip out
all the attributes including class
names.
>> Okay, cool. Well that's one thing. So
basically no need to put keywords into
your CSS file or at least into your
class names, right?
>> No. Yeah. No.
>> Okay. Um then I saw that there is this
um exclamation mark important CSS.
>> Mhm.
>> I I never understood that. It's like on
the one hand, why is exclamation mark in
the beginning and important? It's like
could you put something in here that is
important or it's like I don't
understand.
>> H so okay that's uh that's um
workaround I would call it. Um CSS has
something called specificity and that's
a beautiful word and I'm really excited
that I can actually pronounce it
properly. Specificity. So how specific
how specific is a rule? So you can say
like all elements do like a little
asterisk all elements on the page should
have green text. Uh and then a few other
things and then you might at some point
be like well no links should be blue
historically. So I go a and then address
all the uh a elements all the links on a
page and say like you have a color of
blue.
And then sometimes you have like certain
rules that are less specific than other
rules because you can play this game
more and more. So like if you say like
all elements that's very unspecific. If
you say all anchor elements or link
elements that is a little more specific.
If you say every link element that has a
different site, every link element that
has a different site and has like a
specific class attached. So you can make
it more and more specific. And normally
the more specific rules override the
less specific rules. But then sometimes
you're left off with like a one link
that you want to be read.
>> And now you can create either a class
and say like red link. So you do like a
dot red link or something like that. Or
um which makes it more specific than the
other links. Or you can if you for some
reason can't do that because something
more specific sets the color and you
have to have it in a less specific rule
which I don't think you ever do. Um you
can override it by saying important. So
this is important. I really really
really want this color to be red. I'm
not even sure what happens if you have
multiple
conflicting important rules. I'm not
sure how that gets passed. I would have
to read that up in the specification.
But um it's an override for specificity.
So you can say like it doesn't matter
what else comes after this like it
doesn't matter how specific that rule
is. This should be the declaration and
it doesn't have to be color. It can be
anything like font size, display
dimensions, these kind of things with
important. You overrule the specificity
system.
>> Oh my god, you said that so many times I
can't say it once.
specificity
>> specific
>> almost almost you got moving on to a
different topic that
>> it's unfortunate it's such a lovely
topic I once said the wonderful
poetically sentence or the wonderful
poetic sentence specificity as specified
by the specification that was
>> wow okay
>> that is crazy
>> so many words so little meaning
>> okay so it was like lots of apostrophes
mean no not apostrophes exclamation mark
>> exclamation mark
>> lots of exclamation marks mean it's very
very important
>> followed by the word important yes
>> yeah may I'm sure there's some SEO
equivalent to this I don't know okay
another topic that I know I've run into
because the the folks in the indexing
side contacted me about this once is
pseudo classes like before and after
>> yes
>> can you explain lightly what what that
is.
>> Oh god. Okay. Um uh are they pseudo
classes or pseudo elements? I I always
confuse the two. It doesn't matter. Um
the idea is so in CSS the way that let's
explain CSS really quick for those who
have never like encountered it or seen
it from up close. CSS is a text file
that styles the HTML document that you
created. So it gives it gives us a
possibility to separate the styling, the
way that things look from the content.
Back in the days, you had to basically
like build tables into your HTML files
to kind of like move things into columns
and rows and position them next to each
other. Um, that is nasty because it is
technically not tabular data. You just
abuse a table to do like some sort of
grid layout. CSS allows you to separate
out the style information completely
from the HTML document. And that
hypothetically has the nice benefits
that you could switch CSS files based on
user preference. For instance,
>> if I want something very flashy and very
colorful, I could have one stylesheet
and then someone else wants a black and
white version of it. They can have a
second stylesheet. Hypothetically, um I
think practically that also exists. I
think there's like extensions for the
browsers. In these files, in these
stylesheets, you say this kind of
element and that can be one specific
element, a bunch of elements, elements
inside other elements or um classes of
elements or specific ids of elements. Um
so you can say like all headlines or you
can say like all headlines that have
breaking news as a class name or
something like that. M
>> and then you can give them properties
and you can say like the color should be
this, the font size should be this, the
size should be this, the they should
break the text around them, they should
not break the text around them, yada
yada yada.
With pseudo elements or pseudo classes,
you can also add content around things.
So, let's say like you want a little
unicorn pile of poop in front of every
headline for some reason or maybe a
light bulb like you want to split like
you want a little light bulb in front.
Light bulb is probably nicer than a
little pile of poop. So, you want a
little light bulb in front of every
headline. Then you can say like you can
either ask everyone who's editing the
HTML to add a little light bulb uni-ode
character in front of their actual
headline or you can use CSS in one place
and say like okay so before every H2
element H1 element whatever you've got
add this little piece of content here
this little light bulb
>> and then you would have a little light
bulb in front of every every headline
without having to actually put it in the
HTML document. Okay.
>> Which for decoration I think is fine.
>> Okay.
>> I think you can do that. Yeah. I I guess
you can also do certain other things
with before and after, but I'm not sure
what else you can do with it.
>> So, could you put like the whole
headline in there?
>> See, that's the problem. Yes, you can.
You can do that. I don't think you
should.
>> Is this like an opinion?
>> No. This is based on on technical merit
in this case. Um it is it is an opinion
but it is it has technical merit. The
the reason why I say you shouldn't do
that is again if you look at a we we we
just discussed like oh but what about
other crawlers and and and search
engines and whatnot that might not
>> like see it this way. pretty much anyone
who programmatically consumes HTML and
that's like crawlers, search engines,
bots in general and also accessibility
tools sometimes.
>> Mhm.
>> They go through this HTML document and
they parse it and they understand like
okay so here's an headline element,
here's a link, here's some text inside
the headline element, here's some text
inside the link and so on and so forth.
They go through the HTML for that
>> the HTML, not the CSS. The CSS for them
doesn't matter as much because the idea
again the original idea is to separate
presentation from content. So content is
in the HTML and how it is presented is
in the CSS. So with before and after if
you add decorative elements like a
little triangle or a little dot or a
little light bulb or like a little
unicorn whatever I think that is fine
because it's decorative. It doesn't have
>> meaning in the sense of the content
without it would still be fine. It would
not look as funky
>> and fresh,
>> but it would be perfectly fine. If you
put actual content in the CSS that
violates this fundamental principle.
>> Oh, okay. So, it's kind of like
you're breaking something more like a
philosophical rule kind of thing.
>> Yeah.
>> Yeah. a fundamental principle of the web
parsers could implement something to
then also parse the CSS and get the
before and after content, but you really
shouldn't have to do that because it
should be in the HTML, the content that
you care about.
>> More of a technical side note, do you
know if this before and after stuff is
included in the DOM?
Ah,
I'm not
>> It's like not a trick question that I
It's like I'm trying to not not a trick
question. I'm just kind of curious
>> because my mental model is when when we
do rendering, we look at the DOM, right?
>> Mhm.
>> That is a that is a good question that I
don't have the answer to actually um
because I haven't tried this. But
>> I I think it's easy to test this. So if
I created like a div with some content
>> Yeah. Um, and then have like some some
text in it. And then we have some CSS
that has like a a diff before kind of
situation with some content. I wonder if
that shows up in the DOM.
>> Yeah. Interesting. Okay.
>> I think the browser shows it in the DOM
so that you can more easily
>> like uh do something with it. But I
believe
>> I I don't I don't think it actually is
part of the DOM. I think it just shows
the way.
>> Okay. Uh-huh.
>> So, the kind of one of the reasons I
remember this before and after uh stuff
is that there was once an escalation
from the indexing team that said we
should contact the site and tell them to
stop using before and after.
>> Um because they were using the before
pseudo class or pseudo element or
whatever.
>> Yeah, I'm not sure what it is either. I
would have to double check that.
>> Oh my god,
anyway. They were using the before to
add a number sign to everything that
they considered hashtags. And our
indexing system was like, it would be so
nice if we could recognize these
hashtags on the page because maybe
they're useful for something.
>> Uh but because they were using CSS to
add the hashtag symbol, we were like,
these are just words on the page. Mhm.
>> I I don't know what what came out of it
because usually we also have the notion
of we should be able to process the web
however it comes.
>> Yeah.
>> So maybe in rendering in the meantime
that is used in the DOM. I don't
actually know.
>> It's a it's a tricky I so I just tested
it real quick because
>> that's who I am. I just quickly coded
something. It's not in the DOM.
>> Oh, okay. So it doesn't it doesn't get
picked up by rendering. Okay. So
>> correct
>> definitely don't use before and after
CSS pseudo classes if you want to add
something that adds
context content
>> content content. Mhm.
>> Uh design elements probably fine.
>> Yeah.
>> Okay. Cool. Um we should document this
somewhere.
>> Oh god. Yeah. I think we So this is this
is interesting because I I think we
never documented it but I think we we
had it in a presentation somewhere at
some point. Um yeah we let me let me let
me get on that.
>> Okay. You don't have to.
>> So you heard it here first.
>> H we don't have to do it live. Uh then
another thing that I noticed in the web
almanac is they talk about values and
units. And that reminded me of this
weird quirk that we had with I think
hero images
um which used what is it 100 VH which is
VH is what is it vertical height?
>> Yeah.
>> Viewport height I think.
>> Viewport height. Okay. So 100 VH would
mean the whole viewport I guess.
>> Yes. Correct. That's what it's supposed
to mean.
>> Okay.
It's like percent of the viewport. So
it's like 100 VH is 100% of the viewport
height.
>> Okay. So the the weird thing that is
kind of related to this is people
complained that the
uh what is it? the inspect URL tool that
does this rendering preview
>> um would show this gigantic image and
none of the content when you had a hero
image like this.
Does that make sense?
>> Yeah, it does. Oh god. Yeah, because we
do something funky in rendering when it
comes to like viewports. And this is
exactly why I keep telling people do not
look at the screenshot. Always look at
the rendered HTML because what we do is
it's called viewport expansion. Uh it's
something that we do in rendering. It
doesn't really matter how that works,
but fundamentally we try to catch a
reasonable amount of things that are
only happening if they are in viewport.
So we are like progressively resizing
the viewport and most specifically we do
that for height. So if you have
something that says 100% of the viewport
height, then the problem is that this
keeps growing until we either say like,
okay, this is unreasonably long or um
until it actually is done. And the
problem with 100% of the viewport height
is when we keep growing the viewport to
kind of go like okay now we are not
covering the entire height then that
will never happen and eventually we'll
just give up and stop the the expansion.
That's not necessarily a problem but it
looks really weird on the screenshot.
>> Okay. So if your textual content is not
visible in that screenshot because you
have this giant image in its place, is
that a problem? Would we consider that
to be hidden content or like less useful
content?
>> I don't know how we are processing
things because I know there has been a
change. I would have to look up that
specific question, but I believe it's
not necessarily a problem because it's
still in the DOM. it's still accessible
to the crawlers. So, I believe that we
will process it just like normal stuff.
>> Okay. Well, I I think that makes sense.
Like if it's in a DOM, if it's rendered
on the page, it's not visible in that
screenshot. It's like it's still on the
page. Um, is this something that you
think sites should fix? Like if they
check their image in or the the URL in
one of these tools, should they tweak
the CSS to be like full viewport except
maximum so much? I don't know if you can
even do that in CSS.
>> You can give it a maximum height and
maximum width. So you can restrict the
the growth a little bit. And I believe
like in this case if it's like a header
image,
I'm not sure why it has to cover the
entire height of the viewport. And then
also if you want to cover the entire
height of the viewport, what happens if
people have to scroll because it only
covers the viewport and the viewport is
just what you see on a screen. So it
doesn't really scale up to how big the
content is. So um I'm not sure what
people are trying to accomplish there. I
might want to think about that and maybe
find another way to get the effect that
I want. And max width is or max height
in this case is probably a good way to
do that.
>> So it's almost like it's also an
accessibility issue. So you wouldn't
necessarily fix it for SEO, but it's
like what are you actually trying to do
here? And maybe there is a smarter way
to do that.
>> Yeah. Yeah, I would say so.
>> Okay,
cool.
Then in the report they also talk about
colors very briefly.
>> Um which I know in in the early early
days people would use font color and
font size and things like that to hide
text on a page.
>> It feels like that's a lot less common
now.
I don't have any data, but it's like
anecdotally from your like browsing the
web, do you see people hiding things
with like same foreground, same
background color?
>> No, not that much anymore. I mean, they
use like display none, so they don't
show it, but they are having it in the
DOM. That has happened.
>> Oh, okay. Oh, so it's almost like if you
want to hide something, it's like might
as well just hide it properly.
>> Yeah. Instead of in plain sight. Yeah.
>> Okay. Yeah. Uh then the other topic that
comes up fairly regularly is CSS images.
I
>> I had someone ping me I think last week
or a week before on social media. It's
like my developer has decided to use CSS
for all of the images because they
believe it's better. Um
does this work? Like is there anything
to watch out for there? there there is a
bunch of things that you need to keep in
mind when you do that. So number one
again there is ideally a separation
between the way the site looks and what
the content is. Now an image can be one
of both or both like it can be
decorative or it can convey content.
If I have, I don't know, like a really
nice kind of wallpaper pattern in the
background, then that doesn't really
that doesn't really constitute content.
It just makes it look nifty, I guess. I
don't know if I have like a
>> like the '9s. Yeah.
>> Yeah. Exactly. Like if I have, I don't
know, a a GIF of like something
bubbling, then I have or like stars
with twinkling, then I can put that as a
background and it doesn't really add to
the content. and it just makes it look a
certain way, fine. If I have like a
landscape that I really like and I kind
of want to make that the background of
all my my content, then fine, put it in
the background as well. But if I if I
have a blog post about this specific
landscape and I want to like tell people
like look at this amazing panoramic view
of the landscape here and then it's a
background image even if it's not like a
whole page background image but like a
div container that is empty and then has
like the the image there or even if it
has text and then the image is there
like it you can style random HTML
elements in a way that it looks like
it's the browser shows an image with
like a border and like a caption and
something like that. And it looks like
an image, but it is from a content
perspective not an image because it is
just like an empty or maybe like a
textual block of stuff with a background
image that has been loaded for
decorative purposes. The problem is the
content specifically references this
image, but it doesn't have the image as
part of the content, which is confusing
because for a user looking at the
browser, what what you what are you
talking about, Martin? the image is
right there.
>> But if you look at the DOM, it
absolutely isn't there. It is just a CSS
thing that has been like loaded to style
the page. So, if you have a content
image, if the image is part of the
content and you're like, "Look at this
house that I just bought, then you want
an img, an image tag
or a picture tag that actually has the
actual image as part of the DOM because
you want us to see like ah so this page
has this image that is not just
decoration. it is part of the content
and then image search can pick it up and
then we can like understand the
connection between the content and the
image and these kind of things. That's
the huge difference. So if you use CSS
for all images as long as they are
entirely decorative and the content
would work just as well without them.
Cool. if they are an integral part of
the content like a news story look at
how the the the market is responding to
the news of blah blah blah and then like
an image of of stocks going up or down.
>> Mhm.
>> That's part of the content that's not
decoration.
>> Okay. So
I I don't know like this just came to
mind like what about what do you think
about something like stock photos that
are added to a page to just decorate it?
M
>> could you consider those to be
decorative or would you want them to be
indexed?
>> I I mean you're probably not going to
get them indexed because probably the
stock website has them indexed first and
we understand that you're using a stock
photo which is just a copy of this other
photo I guess.
>> Am I right? Yeah. Right. That's what
probably going to happen.
>> Um
>> so you're not going to get as much
benefits from it. But then again from a
semantic point of view like the meaning
is still like this is this image is not
mine. It's a stock image that we bought
or licensed
>> but it is still part of the content. I I
personally think
>> okay that makes sense like okay so I I
think fundamentally stepping back a bit
it's almost like that philosophical
divide of CSS should be for the styling
and anything content related should be
in HTML.
>> Yeah.
>> Okay. So let's see. I I think the the
things we talked about um on the one
hand class names class names are
styling. They're not content. So of
course they don't have really an effect.
>> Uh the before and after um pseudo
classes.
>> Okay, I'm googling this now. What is
this CSS before? Is that a What is it?
Creates a pseudo element. Okay.
>> Oh, it's a pseudo element. Oh my gosh.
Okay, I got it wrong. Uh, so adding
decoration with these is fine. Adding
content that you want indexed doesn't
make sense because pro it yeah like like
you tested it doesn't end up in the DOM.
So even in rendering it wouldn't show
up.
>> Uh then this weird 100%
viewport height thing which is unrelated
to SEO I think but just makes debugging
weirder. Mhm.
>> So that's worth fixing. And then the
images, like you mentioned, really that
philosophical divide again. It's like if
it's about your content, put it in your
content with an image tag or
>> picture tag or
>> I I don't even know what the difference
is nowadays. I have to double check. Um,
but if it's if it's just purely
decorative, if you want to add this '90s
website vibe with uh wallpaper behind
your pages, go for the CSS side.
>> Correct.
>> Do you think there's anything we're
missing?
>> Um,
I don't think we are missing anything
specific here. No. Oh, another thing I I
sometimes run into is people using CSS
to create tables and then putting
tabular data in them. That also feels
like a misuse, right? Or is that
>> I mean ah god there is I'm not sure if
that is a solved problem or if that
still is like an actual challenge. I
remember
tables and tabular data in general is
tricky to make responsive as in like if
you are on a small screen.
Yeah, that it's not that easy. Um
>> Okay.
>> So I I guess they maybe just working
around that problem.
I don't know.
>> I don't know. I I think the part where
tabular data is sometimes useful for
indexing is if we can recognize that
they're like rows and columns of
information and we can kind of combine
those properly. And I imagine if you use
just CSS instead of a table element
probably that's not that easy.
>> No. No, we won't get that. Yeah, you
lose. Also, I'm not sure how well screen
readers respond to that.
>> Yeah. Okay, cool. That was super
insightful.
>> Oh my god, that was that was uh
surprisingly technical. I like that.
Yeah,
>> CSS for SEO, everything you need to
know.
>> Nice. We also found a lack of
documentation for this one thing and I'm
I'm looking forward to see that uh
landing. I'll I'll keep you all posted.
We'll fix that. Hopefully, I'll try.
>> Cool.
>> Well, all right, John, that was uh
surprisingly fun. Um, thanks a lot for
for this conversation and I think that's
it for this episode. Should we direct
people to places where they can find
more?
>> Yeah, Martin, where where can they find
out more?
>> So, for CSS, I would go to web.dev that
has like lots of articles that explains
how to do things. And if you know what
you want to do and you know what CSS
bits and pieces you look for, then
probably Mozilla Developer Network. So,
MDN is a good place to go to find the
reference content. And we need to fix
this documentation
hole, so to speak. And I'll I'll put
something on our documentation which is
at developers.google.comarch.
Yeah.
>> About pseudo elements.
>> Elements. Elements. Elements. Yeah.
Yeah. It's it's weird because I think
there are pseudo classes as well like
hover and active and these kind visited
and these kind of things that are pseudo
classes and then check out MDN. They'll
explain the difference to you. We are
not the right people to explain the
difference I think. Um anyway,
>> well, thanks a lot, Martin.
>> Yeah, thanks thanks for being here with
me, John, and uh thanks for bringing
this interesting topic. So, uh and
thanks to everyone out there for
listening in on us going through CSS
together, I guess. So, um thanks a lot
and goodbye.
>> Bye.
[Music]
>> We've been having fun with these podcast
episodes and we hope that you, the
listener, have found them both
entertaining and insightful, too. Feel
free to drop us a note on LinkedIn or
chat with us at one of the next events
that we go to if you have any thoughts.
And of course, don't forget to like and
subscribe. Thank you and goodbye.
[Music]