One SEO Professional was concerned about their site’s JavaScript implementation. They had created a question and answer module that contained up to 16,000 answers on a single page.
They hoped it would lead to increased online visibility as well as traffic. Their main concern, however, was that their page was not being fully indexed by Google, although it was indexed by Bing.
Their attempts in adjusting the JavaScript code could not rectify the situation.
Martin answered by taking a deeper dive into their implementation.
Through testing the client’s site in Google Search Console, Martin discovered that Google would not see any of the answer content that was on the page.
Because of the JavaScript implementation, Martin observed that there wasn’t really all that much content on the page that Google could see. There’s a few words here and there, including the privacy and footer, but really no substantial main content as far as Googlebot can tell.
The bulk of the content is hidden in JavaScript and is only visible in the eyes of users. However, because this content isn’t present in the HTML, Googlebot doesn’t see it while it crawls and indexes the page.
Everything is implemented for the user themselves, without much consideration for how Googlebot functions.
Therefore, all the page has is essentially buttons, and this is not working very well because Googlebot doesn’t click on buttons. They click on links.
One way to get around this, while preserving the user-focused implementation, is to turn the questions into a link that a crawler can follow. When someone arrives on a specific URL, you would already load the content, so that Googlebot can see it.
The alternative to doing this would be to have the content physically load and hide it, then show it when someone clicks on it.
The main goal is to have content showing up in the HTML, as well as on the page, so that Google can see exactly what content is visible on the page.
The other goal is to show Google that there is ample information to answer the question on the page. Avoid giving just a one-word answer for the question or, alternatively, group one-word answers with other questions that make sense together.
Otherwise, without this visible text content, Google is unable to properly crawl and index the site.
This interaction happens at approximately the 6:58 mark in the video.
Martin Splitt JavaScript Hangout Transcript
I posted the other question on Google for a day. And maybe I can elaborate a bit. As I explained, Martin, I’m not the technical guy, I’m just sort of more of the product owner. So we mean this, we created this product where you can get from question to an answer really fast on one page. It’s a single page application.
So it helps you guide through different steps. And then it shows you the answer, but on the back end, it is a single page application in JavaScript. The challenge for us is that we have – you could do up to 16,000 answers on one page. And we hope that it will create increased findability also for the users from Google, but it’s indexed – is indexed by Bing, but not by Google.
And we tried a couple of things to improve on this but it seems that there are so many different ways to challenge this that I thought well let’s ask the expert expert on how to best approach it.
Martin 8:11
Do you happen to have a sample URL that I could take a look at?
SEO Professional 8:15
All right, yeah, I have a live URL where you can…
Martin 8:18
If you can throw this in here and then I’ll just quickly Alright, Oh, is it okay this is going to be on the recording if that’s okay, I can share that Okay good. I really like it when people are fine with that because I feel like I don’t want to I don’t want to show something in public that you’re not comfortable showing because I think this is the moment where learning happens publicly and I think that’s generally a good thing.
I understand that a lot of people are hesitant to share it which is why I’m even more glad that you are not hesitant to share so that I can go through this so that you learn as well as everyone watching this video probably learns something from here Oh come on, does this take so long?
Let’s have a look at the test page, just roughly the screenshots. Okay, let’s have a look at the page in a normal browser tab at the same time. So what I’m doing is basically just visiting the URL for the moment and oh, it’s translating into English for me. Thank you very much. That’s very nice. The reason why I do this and now I’m also looking at it in a mobile view so that I have comparative comparable information here – we move the dev tools.
Okay – so Okay, that’s unfortunate because I got – Okay, hold on. Maybe I can zoom out a little bit to the window so that I can actually get rid of this banner here. Ah, this might be my internet connection. I don’t know. But that doesn’t go away. Strange. let’s reload the page real quick, just making sure that it’s not my internet connection or something that’s going Oh, isn’t it might be because we’re translating it and Google Translate might have ideas. Oh, yeah. There we go.
SEO Professional 10:23
That’s just a cookie policy? Yes. Oh, so what you see here is the snippet that’s in the page. And it shows you different steps and asks you questions to come to a specific answer. So each time you click on a specific answer, we get a specific URL. And…
Martin 10:50
I would have to click on one of these Yes, or I guess, okay, okay. Let’s click on Oh, yeah.
SEO Professional 10:57
And here, you get to here, you have an answer. And then the bold text is like the solution part.
Martin 11:05
Okay. Okay. So like, the question is like, is this for free? Yes, the app is for free. Okay. So yeah, the app is gratis. Let’s see if it’s in the HTML as well. Yeah. Or was it like, comma, I think it is. So I went to the mobile friendly test again. You could do this in Search Console, I just don’t have access to your page in Search Console. So yeah, comma. And here we see something, right. But it doesn’t – it’s not in the content. So any of the answer contents here? So any of the content here, like any of this, Googlebot doesn’t see?
So that’s a bit unfortunate. Because that means that probably we’re not seeing much in terms of content here. It’s a little tricky to judge this from the HTML right now, I could copy and paste this over and see what it actually is. Let’s actually do that. So I’ll quickly put this into something that shows us the HTML a little nicer.
At this point, I am experimenting a little bit. Let’s tidy this up so that we can see. So this is pretty much the content that Googlebot sees. And when it comes, you said like, the main content is hidden behind here, right?
SEO Professional 12:52
Yeah, so that’s the subject selections. So yeah, I think this is the path. So this is the first user tab, and then it can, the user can go in on the page, main selection from different tabs and then go to the solution. This is actually, so this is an improvement, where you have FAQ websites with a lot of directory trees, where a customer kinda loses their way. And here we have on one page, you go from a question to an answer. Yeah. And we help guide the customer as best as possible to help them out. Yeah. And it works really well for customers. And yeah…
Martin 13:33
Yes, exactly. So I’m looking from a Google perspective, as I’m coming to this website, and I’m seeing that this is not really content. This is just navigation, which is fine, right? This is not really content. This is also kind of like still, I mean, I don’t speak Dutch. So this is a little tricky. But it looks like this is not that useful as content in terms of the user would not necessarily search for something like this here.
I know that from a user’s perspective, if I tap on this on your site, as a human being, I get interesting content for these things. But if I’m just looking at this, this is not content either. This is- this is a few words. And then down here. This is privacy policy, contact footer stuff. There is not there’s not much in terms of content on this page, right?
If I’m looking at this, I know as a user, there is content hidden behind these things. But if I’m looking at it as a user in the way that I’m seeing it as Googlebot would see it, this page doesn’t really have much content, right?
SEO Professional 14:46
All right. Yeah.
Martin 14:47
I mean, we know that there is more content hidden behind these, but it’s not here. It’s not present in the HTML as Googlebot sees it. So the problem here seems to be that the way that you implemented it for the user – all the content is hidden behind these things. But Googlebot doesn’t see it at all. It’s just not there. And I think that’s because this is not a link. This is probably something else.
This is – Oh, it turns out this is a link, it’s just not. It’s not really a link, it is a link in the sense of the HTML tag is a link tag, good. But it doesn’t have anywhere to go, it doesn’t point to a URL. So what you’re effectively having here is buttons, basically, because you have to click on things, Googlebot doesn’t click on things.
So it doesn’t see the content that is loaded. When I click on this, you have multiple opportunities on how to improve that. One easy way to improve this would be to make this into – Now I know what you mean with we’re implementing href. And that’s, that’s a clever thing. – what you could do is you could make this point to a URL where you already load this basically have I don’t know how I would I quick question, can you actually see, when I share the chrome tab, can you see the developer tools that I’m navigating in right now, or you only see the page?
SEO Professional 16:18
Actually, I can’t…
Martin 16:19
Uh you can’t see the developer tools and actually I can’t see the developer tools. Interesting. Hold on, let me actually share the entire window. So that’s a little easier to show you what I’m doing here, share a window, share this window, please Yes, to share this window. This is going to be freaky, because it’s going to be okay, here we go. So now there should be developer tools on the bottom as well. And I’m trying to increase the size a little bit. Jesus, this is slow. Alright, here we go. So one way of dealing with this is actually making this into a link that a crawler can follow. And it could be, I don’t know, /service, contact, question mark, or like, even better would be something like slash activieren. And then basically, when someone would come to this specific URL, you would already load this content.
So that you actually have or whatever content I clicked on, I can’t remember what I clicked on. But it looks like I’m on this page. So that Google has a page where this content is actually present. The alternative would be to have this content load and just hide it, and then show it when someone clicks on it.
That way Googlebot would also see it, but the user still has the same experience. So the problem here seems to be that Googlebot does not actually see the content. And actually, what I’m wondering is if I even shared the window properly, if I did. Great. So the problem really seems to be that Googlebot can’t see the content. So when we don’t see the content, it looks like the page doesn’t really have much.
And it’s interesting to see that Giacomo answered in the chat as well and your guess is right! So yeah, make this into links that have a URL that loads the content so that Googlebot can be like, so this URL doesn’t really show me much. But these links here, they point me to content that is interesting for users so that I would index this. It looks like we’re not seeing the content. And that’s your problem. Does that make sense?
SEO Professional 18:30
Yes, yes. So I think you click on one button, and then it shows content, but there isn’t a possibility to collect to make it five levels deep. So to go from main topic to sub topic, to sub sub topic, and then to a specific question. And then would this still work?
Martin 18:54
It would still work. And in that case, what I will do is you have to balance things a little bit. The simple answer to the question is it depends on the slightly longer answer. I’m so sorry, if I’m taking time away from everyone else in the chat, no one, okay, everyone’s fine with it. So I’ll just continue.
You will want to have – each URL should have enough content to be relevant, which is like if you have very specific questions with a one word or one sentence answer, then that’s not much in terms of content. So you probably want to structure so that a page always has enough coherent content, which means content that belongs kind of together, and then you can still hide things, but you would load the content anyway.
So Googlebot finds enough content to say like, this page looks like it’s answering enough around the question and – the question in question that sounds weird – the specific question. Yeah, you would have to be a little you would have to try things out a little bit basically. I think the main problem here really is that we are not seeing the content. And we have no way of reaching the content right now.
So that’s why the page is not being indexed. Because we’re not seeing any content. We’re seeing boilerplate and links, but not really, the content. But you can do that with lots of levels of nesting. It’s just a matter of how much nesting makes sense. And where do you want to have the page contain all the questions to a specific product or service, and then just like, hide them, and show them as users navigate on the page, but show all of them in one go to Googlebot. That’s something that you would have to discuss, probably with an SEO expert to help guide you in making decisions there.
