JavaScript SEO office hours May 27th, 2020

Key Takeaways

hello and welcome to this week's JavaScript SEO office hours my name is Martin split I am in the Google search relations team and I am a little bit of a expert on the JavaScript rendering and indexing side of things so I'm here to answer your questions regarding JavaScript SEO problems and you can ask you questions either in the YouTube post that we do before these meetups or you can join these live recordings by joining the link that will be posted shortly before the actual hangout in YouTube post comments awesome thank you very much for everyone who is joining I see that we are a small select group today there's not that many questions in YouTube so we'll see how much content we have today let's start with the YouTube question hi Martin from the quick look on the front five theme built with BFGS 20 20 25 or can you see any SEO issues there or recommend some improvement this is actually I think this is a good opportunity to give you an idea of how I would look into these things and let me just like start a screen share because I actually haven't taken a look before so I'll just do this now and the question is if I can actually get that chrome window that I just opened no it has to be okay in that case okay I just clicked on the wrong thing and actually have to share an entire screen which is a sorry entire window that's that's fine so I would start by looking at the theme itself so the the theme itself was 2020 dot front if I go to org No was it not 20/20 I'll just click on actually I'm just gonna copy the link and then we'll see what happens if I made them it's okay it's a redirect thing yes want to go to that side there we go I must have mistyped something somewhere from TT not front if I don't know where it's at fortify aha okay so a very quick kind of litmus test would be to just run a light house audit and in this case I actually you know what I just aren't gonna run all of these maybe not progressive web app we don't care that much to just get a rough feeling for how does this website generally work how well does it work how fast is it that looks pretty good they are all ready so the thing is in the in the SEO audits in lighthouse they are very very basic in their vendor agnostic so a lot of google specific stuff we can't or don't want to put into lighthouse but even here we see some suggestions that's a mobile usability potentially mobile usability issue where some of the tap targets are not large enough most of the audits pass so we do have a viewport we don't have a title we do have a Meta Description in this case that would be service setup kind of an issue not really a theming issue links have descriptive tags robots.txt valid out attributes of images a trifling legible phones avoids plugin so it's not using job or anything in the performance it looks pretty good as well first content feel pain would be a little faster but that's okay first meaningful paint yeah so you either sure so there it could be better but it's pretty solid I wouldn't worry about that so that's like the very first stage of taking a look at this that I would do and then the next thing that I like to do is I like to ask the mobile-friendly test if there's any surprises any problems with actually getting to the to the content oh great yeah and then I see a car there and I see a car there and I don't see cars anymore oh okay Google doesn't trust my guests browsing window no more crosswalks seriously I don't think I have more buses okay this oh that was it that was a cheap trick is that a bus or is that a truck no it's a Fed Ex it's a truck okay I wish I could machine learn these things and not have to fill them out are we good at something or are you showing me more buses know that's what red lights so that's what ah that is frustrating okay sorry I should have just logged in and then I would have avoided all these funky what okay I'm sorry I'm a robot apparently maybe it's because I spend too much time with Googlebot who knows what what are you okay nothing it's not a bus good uh I think I'll cut that from the video because that was just stupid here we go come on come on but yeah so um performance-wise looks good the screenshot looks all right to me in the very first get go mobile friendly no loading issues no surprises there is something going on with some Jason issue but we don't care like it doesn't matter for SEO yes the HTML looks pretty complete there is can I see if they have a description that's my computer getting slow right now both come on well there was so we could figure out what this is where the data rh comes from i'm not sure but it doesn't really matter like it looks pretty solid from an SEO perspective it's fast maybe look at the tap target sizes where my house was complaining because that could also be mobile usability issue but besides that I think this is an okay theme and that's more or less what I look for so I look at the rendered HTML I do a smoke test of the the screen child and light house gives you a few pointers as well so good question but I don't think there's anything to look at specifically I guess then the tricky bit is probably setting it up correctly with your actual content but the theme itself seems to be fine do we have questions from the audience any of you having a question while we are at it I've got a quick one it's about how many resources stuff load in the page that if there's any kind of limits that you recommend to make sure something's going to render properly one point I kind of got some arbitrary figures on I'll okay panicked cranky from under 50 and try and make sure they fire in like 0.2 seconds and that seems to be a relatively sane target and under that they tend to get reliably thing but that's not always the case you see pages with way more successfully always render and sometimes pages with less that don't so and there's a lot of nuances to that I don't know if there's any kind of guidance the general guidance is the fewer the better I would say with the asterisk that you want to split reasonably so that caching is effective so basically that we don't really have a hard limit or anything it's just the more resources they are the more likely you are to experience that something does not load or if you're looking at the users perspective from a user's perspective there's a chance that the network cuts out or some transmission error happens so the fewer resources the better but be reasonable it doesn't help to have everything in one huge file because then you can't effectively cache because then if one thing in this large file changes the entire file needs to be downloaded so what about generally tries to be smart about these things by caching very aggressively so even if one render fails we will see that it fails but then we have at least cache like a bunch of resources already and then we would try and then we would probably get the rest of the resources if crawl budget is a huge issue and that is usually true for websites with millions of pages then then that could be a consideration like trying to keep the number of resources as low as possible but for websites that are relatively small that's not an issue and for for us in general we are trying to fetch everything we can and we use aggressive caching to alleviate the number of resources so that's why you see websites the lots of resources doing well as well as websites are small number of resources and sometimes things just go wrong and then it doesn't really matter how many resources you have if it's that resource that is critical and we are not fetching it then we have to be try but we are we trying so that's at least good well that's a that's a good question yeah it's a it's a bit of a it's a very subjective thing and the very nuanced thing as you said you want to make sure that you are taking a look at your specific situation and judge based on that there's no like general formula or silver bullet that that can be applied to this question I could say it depends right um one last YouTube question and then I asked you again for audience questions thanks des for the question hello Martin I have a new site where each in each article comments are enabled by users so users can come in on articles okay these comments are grouped in HTML code within the json-ld called comment with different attributes like orthotics and date I've seen that Googlebot renders these comments in HTML view from the move off any tool but I don't want to be indexed and searched because there are comments with no SEO value for the page how can I manage the situation generally speaking you don't have to there like the fact that we render something I mean generally speaking we index everything that is on the page generally but if the comments are user general we are relatively good at eith figuring out that this is user-generated content and B it doesn't really matter it doesn't it doesn't hurt to have these comments there it doesn't give you any benefit but I would not this is one of these cases where I think you're not looking at a non-problem and when there is a known problem then you don't have to solve anything that's why I would advise against trying to come up with a clever way of hiding there are definitely ways of hiding things from Google BOTS view but I just would not because there is a chance that you are shooting yourself in the foot by creating something that is less stable that's robust or that you accidentally overshoot so for instance to give you a very simple example for this one thing is if these comments are fetched by a script on your website let's say like you have a common strays file that actually fetches these comments from the back end and puts them in the in the content you could robot away there with the comments jeaious and then we can fetch the comments trace and so we can't execute that JavaScript and so we can't actually fetch the comments but if you play around with your robots.txt you might end up accidentally may be blocking more than just that or like I don't know block all the JavaScript but now your main content doesn't show up anymore so then in trying to fix something that wasn't a problem in the first place you actually made the problem or you created an actual problem that wasn't there before so I would advise against worrying too much about this unless you have very very good reasons to like I don't know if if the content is very hard to distinguish from the main content or something like that then we might not see that it's user generated common content but if it is just comments as you would normally mark them up and there is sufficient content on the page then don't worry about that it's more risky than useful all right we have exhausted questions pull from YouTube I think I will check the previous JavaScript SEO office hours because I know that sometimes people post after the actual hangout into these posts but do we have an audience question in the meantime home search News was playing that was loud do we have an audience question that we could look at not today fair enough let's have a look maybe we have something in the previous one mmm I think I answered that one previously but I can answer it again my crawl rate is very low I lost traffic is it because of that no crawl rate has no quality indicator or like signal of something positive it just it's possible that your server was responding with a 504 some requests or it's possible that you just have a version of the content in know that the the change frequency is low in which case why would we crawl again it doesn't it doesn't hurt it's not a problem per se if you're running a single-page application and it uses written website a client-side rendering and the HTML preview shows a blank page you want to figure out so I'm assuming that you mean the rendered HTML in any of the testing tools that we provide like that your inspection tool them over for any test over which results test if you see blank HTML or like an empty page HTML that doesn't have the actual content in it check if you are robotic any of your resources that getting the javascript that fetches this stuff if anything wasn't loaded properly that's something that you want to look into and last but not least just double check what could be the reason for this I mean that I can't answer that question because it's like saying my car doesn't start what what's happening and it's like it can be anything it can be the battery is dead it can be that you've there you have no fuel it can be that it's like the it's still locked somehow or wire where like it can be so many different things and that's the same here you want to be a little careful with that but basically just like try to try to make changes in the application and simplify things in the application until you get a positive render that concludes HTML and render HTML and then try to figure out what breaks it I call or I use a technique that's called bisecting so I have a situation here our version here that doesn't work and I know I had a version in here that did work I'd say there's 16 6 months in between I jumped three months back does it work or not if it works at this point and then that means that my my search radius is now only the last three months then I go one and a half months back basically I jump from so now I'm three months back I jumped one and a half month to the front still works here so it must be in the middle here and then I basically just like iterative ly jump closer to a version that will break and eventually you find the versions like works here doesn't work here and then you know what the changes are that were made between the working version and the broken version and that way you can figure out what could potentially be the problem and this is why I am so happy that we have the newer tools because previously you had a screenshot in the old render and that didn't really tell you anything it's just like yeah it's broken and I see it's blank but that's pretty much it and then trying to figure out what specifically broke that last bit that that pushed it over the edge was not that easy it's a lot easier now you can use tools like local toggle or and rock to put your local development version into a publicly reachable URL temporarily so that you can try this out with the testing tools but yeah that's what I would do all right if we don't have any further questions from the audience and I would say this was a short office hour more like an office half an hour any questions from the audience so just a very quick one if that's ok when you call something like an API if you have a no index X robots header on that API that's not a really an issue is if your rendering I don't think that's an issue I haven't tested this that's a very interesting question I should effin definitely have a look at that but normally we would fetch the API call because it's not a robot head it's just no index and then we would get the data back and use that in rendering but I don't think that no index on a an API it makes any difference really that's what I would expect I would test that because I'm not a percent sure about this but from logic that should be you how it behaves good question and like questions where I don't know the answer and I actually have to test it's good awesome in which case thank you very very much for joining I'll post into the youtube.com slash Google Webmaster stat community the thread for questions for the next office hours which will be on Wednesday B what day is that 3rd of June or something I think it is I think it's already June but I'm not sure um where's my calendar next Wednesday is the 3rd of June hey I'm actually not bad so on 3rd of June we'll have another job SEO office hours I'll leave a thread on the community tab of our YouTube channel where you can ask your questions and then I also post the link to the media to the hangout there if you want to join the recording thank you so much for joining my little audience here in the Hangout skal was a pleasure stay safe stay healthy have a great time bye bye bye bye thank you thanks for joining great