9 ms·

SEO mistakes I've made and how I fixed them

306 points by MaximeHeckel 6y ago

ShorsHammer 6y ago
This site is basically just a mashed potato of content without js. Anyone care to do a summary? It seems quite interesting.
- capableweb 6y ago
  - Make sure you either never have trailing slash or always have trailing slash (make sure you have canonical pages and redirects as little as possible) - Have canonical pages - Don't trust code you haven't read/don't understand - Make sure you view changes you make and that they are actually made when you think they are - Make sure what you want to be rendered on the page is actually rendered - Write tests Seems like a bunch of tips for people who are just starting out with web development, to not miss the most obvious problems. How this post is currently on the top of the front page will forever be a question for me. I'm glad more people are discovering SEO and it's importance, but this guide is specifically for one technology and are general tips about development rather than SEO really.
  - MaximeHeckel 6y ago
    > How this post is currently on the top of the front page will forever be a question for me. OP/Author here, to me too trust me
- mkhalil 6y ago
  Turning off JS revealed practically the same website, but go on.
- MaximeHeckel 6y ago
  Yes, sites require a bit of JS (added some client side feature recently). Hope the summary other commenter gave you helped
krisroadruck 6y ago
I have been doing SEO professionally for just over a decade at this point. I've seen that trailing slash issue on more sites than I care to count. It's especially fun when people link to the wrong version of important pages in their nav and footer creating 301'd links across their entire site. An easy fix, but frustratingly common oversight.
- marketingPro 6y ago
  I need to ask, what's your job satisfaction like?
  - walshemj 6y ago
    In what sense? seeing the same problem multiple times can be a bit of a pain in the ass
JustARandomGuy 6y ago
Note that the article is about optimizing a Gatsby site for SEO; it's not a general SEO tips site, of which there are many. With that said, it's quite amusing how small SEO changes can dramatically improve search visibility. It's one of the reasons why I point people to using Wordpress + SEO plugins like Yoast, which deal with most if not all of these edge cases automatically.
- richrichardsson 6y ago
  > general SEO tips site Are there any of these that are any good? I know next to nothing about SEO and would love to learn a bit more, but I've never found any useful resource that isn't some kind of crappy spam-blog or so old that I'm left doubting if the information is still relevant.
  - krisroadruck 6y ago
    Ahrefs blog is pretty solid. Also Backlinko (Brian Dean), or anything by Nick Eubanks.
  - DeusExMachina 6y ago
    I often read backlinko.com and ahrefs.com
    - cubecul 6y ago
      +1. These are the only two worth reading for most people.
  - andygcook 6y ago
    If you're doing content marketing, then this case study from Apollo Digital is very useful: https://apollodigital.io/blog/seo-case-study https://apollodigital.io/blog/seo-case-study
  - seanwilson 6y ago
    > I know next to nothing about SEO and would love to learn a bit more, but I've never found any useful resource that isn't some kind of crappy spam-blog or so old that I'm left doubting if the information is still relevant. You could try my on-page SEO guide that's more aimed at developers (https://www.checkbot.io/guide/seo/ https://www.checkbot.io/guide/seo/) and my Chrome extension that checks these SEO factors for you automatically (https://www.checkbot.io https://www.checkbot.io). I tried to keep the SEO guide concise with everything backed up with links to authoritative sources like Google or Mozilla.
jrockway 6y ago
I checked my own website for these issues (trailing slash canonicalization, canonical links in <head>) and it seems like Hugo (or the template I started with) handles all of this for me.
pembrook 6y ago
This article pretty much sums up why static site generators are such a pain in the ass. If you're just starting in your static site journey after moving away from something like Wordpress, you'll probably feel like you discovered the holy grail for a while. Yes, Netlify is amazing at first, and yes, it's a pleasure to build sites without fighting a wonky old-school PHP CMS. However, this will wear thin after you start to care about creating regular content and the nuances of SEO (as the person who wrote this article discovered). I've gotten SSG fatigue over the last couple of years and have completely switched over to building marketing sites and blogs in Webflow. No worries about build process, no setting up SEO from scratch every time, no wiring up a wonky headless CMS and building rigid content models, no writing blog posts in VScode and then forgetting how I set up my front matter, no PITA trying to set up a new section on your site and then realizing it breaks your headless CMS wiring, Etc. etc.
- helij 6y ago
  I do exactly the same with Hugo. I have a barebones template that is ready to go in a minute. I don't use Netlify but rsync public folder to server directly.
lxe 6y ago
How did we end up in a place where we need react, react-helmet, and graphql to build a static blog?
- lmarcos 6y ago
  I guess you got downvoted because the main point of the article is SEO, not react/react-helmet/graphql... Although I have to admit that I asked myself the same question.
- AgentME 6y ago
  Comparing to other static site generators, you might as well ask how we ended up in a place where we "need" Jekyll, liquid templates, and ruby to build a static blog. Static site generators are great for maintaining static sites with many pages that share templates and commonly-reused components, and React specifically is basically an HTML templating language that just also has the ability to run the same code on the client and update the page while it's open, which is really useful if you have any dynamic bits on your page. It's true there's some stuff downloaded and processed on the client that's dead weight if you're not actually using any dynamic features, but it's asynchronously downloaded and the page successfully does its initial render before that and it's about the size of an image or a font, so I think worrying about it in most cases is a bit overblown.
- pembrook 6y ago
  Every web developer in the 2000s was a PHP dev. To a man with a PHP hammer, everything looks like a PHP nail. Hence Wordpress (although, I must admit Wordpress's plugin ecosystem was genius). Every web developer in 2020 is a React dev. To a man with a React hammer, everything looks like a React nail. Hence, Gatsby. In neither case did it really make sense to build simple marketing sites and blogs with those technologies, they are best suited for dynamic web apps. But, the technology that all the devs want to put on their resumes will ultimately end up powering everything. Common sense be damned. After the static site hype dies down I am hopeful that Webflow will become the defacto solution for marketing/blog sites going forward and the design/marketing teams can fully own them and manage all changes. I'd be happy if I never had to touch another marketing site again.
agustif 6y ago
My only feeedback is go for nextjs, at least trailingSlash is solved for you by default so you don't screw up https://nextjs.org/docs/api-reference/next.config.js/trailing-slash https://nextjs.org/docs/api-reference/next.config.js/trailin...
- MaximeHeckel 6y ago
  OP/Author here, yes looking into NextJS to migrate my blog over. I loved Gatsby at the beginning, but it's very time consuming to maintain on the long run, especially with all the plugins (I started removing those and rewriting some of them)
deleted 6y ago
[deleted]
riboflavin 6y ago
Google Search: Surprisingly smart in some ways, surprisingly dumb in others. And this sort of thing doesn't just make a difference in indexing, but also in other places like analytics – Google Analytics will see a page with a slash and no slash separately, for example, which makes it hard to get an accurate picture of what's performing. We made a list of these factors here, this is #21 but maybe we should move it up! https://www.ercule.co/seo-content-performance/search-engine-friendliness https://www.ercule.co/seo-content-performance/search-engine-...
Donckele 6y ago
LOL, on the latest iphone the website is blank!
- MaximeHeckel 6y ago
  Hey OP/author here, can you tell me a bit more about the issue? I've asked around and it seemed to work as expected on mobile. Would love to know more about what happened in your case
  - Donckele 6y ago
    Hi! The page seems to load and the content flashes on for a second and then screen goes all white. I don’t know what i can do to debug for you apart from mentioning i’m right now using iphone 7 , safari and ios 13.6.1
codingdave 6y ago
Thanks for writing this - I love to see SEO advice that is actually about the content and structure of your pages, and not about playing the SEO games.
tlug 6y ago
Call me old-fashioned, but when I look at the source code of a web page designed using the "modern" frameworks, it looks like a horrible mess of JS/CSS with very little actual content. E.g. take a look at this guy's code snippet's HTML source in the middle of the page - it's just a wall of <div>s and <span>s, for every single visible character. The search engines these days cannot even function without a JS interpreter, something that surely increases the complexity and cost of building one. Long gone are the days when one cared about semantic elegance of HTML code, per-site optimized CSS stored in an external file for easy caching, only occassional use of JS for easier navigation... Nowadays you don't build websites, you have to build "apps". It's one of many signs of the "appification" of Internet.
- forgotmypw17 6y ago
  there is still opportunity to do good web dev these days, but the choice is up to you.
- marban 6y ago
  +1 I'm still getting a bad night's sleep when the W3C validator doesn't give me the green light at the end of the day.
  - BossingAround 6y ago
    microsoft.com, apple.com, a number of large "IT" companies have websites that throw W3C validator errors. I wonder whether there's a few that are completely valid..?
  - walshemj 6y ago
    100% W3C has ZERO effect on SEO you are wasting time and effort
  - AgentME 6y ago
    Nothing about Gatsby or React by itself gets you non-validating HTML. The article has some W3C validation errors, but they seem to be caused by a few CSS errors they made themselves, the choice by their chosen CSS framework to put <style> tags for components directly in the page body next to their component elements, and their chosen code highlighter's choice to use <div> tags inside of <pre> tags. I find it surprising those two tools do that, though I wouldn't describe those issues as having anything to do with the rest of the ecosystem. (I have a Gatsby site using the component CSS library Styled-JSX and the code highlighter PrismJS which don't have those issues, and the site only has a few validation warnings that are purely from my own html. Apparently <section> tags are expected to have headers.)
bilater 6y ago
Great article! I've had issues getting my Twitter links to show an image and hopefully this will help. Honestly it shouldn't be this complicated and Gatsby should have a more robust SEO component.
saagarjha 6y ago
I like how a quarter of the people who've liked the article are Hacker News bots :P
raicem 6y ago
I know the author is probably scratching their own itch there, but articles like this make me appreciate my WordPress blog. I don't have to think twice about this stuff. Especially if my main goal with the blog is to grow an audience and not learn Gatsby.
- butler14 6y ago
  I have seen countless £millions spent on websites over a 10 year career in web that could have been achieved - without compromise - with WP+yoast.
  - _nedR 6y ago
    Interesting. Do you include websites built using SSGs like Hugo, Gatsby in your statement? Also, any tips on how you handle security (with minimal maintainence) and page-load performance in Wordpress?
    - butler14 6y ago
      Security is always the trade off, and I don't have any good answers to that problem (aside regular maintenance). The websites I'm thinking about, though, tended to be marketing websites ('microsites') for large consumer brands, that really didn't do a great deal functionally, and didn't need particularly robust security in the grand scheme of things.
airocker 6y ago
WE encountered the same exact problems. WE use a single page application. prerender.io was our savior.
franze 6y ago
I coded a chrome pluign called "SEO Live Test" previously "Obtrusive Live Testing Framework". It collects the live cycle of the page load, including static Dom, Dom ready Dom, JS executed Live Dom and runs various tests on those (plus some on the collected HTTP responses). All of the issues outline would have been fetched. Tests can be extended so any special cases minded. See here https://chrome.google.com/webstore/detail/franz-enzenhofer-seo-live/jbnaibigcohjfefpfocphcjeliohhold https://chrome.google.com/webstore/detail/franz-enzenhofer-s... a few thousand+ installs by now. If I would code it today it would make it part of the dev tools propably. The book to understand this approach to SEO and the rules in this framework is free for Hacker News readers btw https://gumroad.com/l/understanding-seo/hacker-news https://gumroad.com/l/understanding-seo/hacker-news
- shampto3 6y ago
  This looks really cool! I’ll definitely be checking it out. I’m fairly new to SEO so this may be a beginner question- what is the benefit of using this plug-in versus using the built in dev tools Lighthouse tool?
  - franze 6y ago
    on top of my head: canonical check, ending slash / no ending slash collision check, GSC traffic check, noindex check on HTTP&HTML level, rel-alternate cross-page check, title tag best practice check, highlighter of parameterized URLs, internal link spot checking check, static dom vs rendered dom comparision and extendable
dzink 6y ago
The last time I benchmarked it, Google indexed static html content in about a week and dynamic JS-published content often in about 3 weeks. Frameworks like Gatsby, Hugo, and Wordpress have one or more of 3 problems: too complex, too slow, or too vulnerable, partly because of their mass appeal. So for serious SEO gains we actually stay away from them. This blog issue illustrates the too-complex problemof Gatsby - you don't find out about some minor configuration error until it gets indexed weeks later, and you lose substantial business due to the long feedback loop of SEO. Add to that the long compilation time, and you're looking for alternatives soon after investing massive resources in a setup. Hugo had a different problem the last time we tried it. In a test setup we did, a small configuration issue spewed your entire server and configuration data to anyone who visits a 404 link. Any issue with the setup created the volcano of sensitive data vulnerability. Didn't take the time to dig in any further. Wordpress is a behemoth, but because of that and slow hosting service providers it is incredibly slow to use on a hosted shared server, without caching. On top of that thousands of bots on the web are looking for and sending post requests to Wordpress admin files or php plugins (even if you're behind Cloudflare). There are faster and more performant ways to SEO, especially if you can code.
- duhi88 6y ago
  Agreed for the most part. Anything where SEO is critical (most things these days), we use Laravel for (trying to move away from Wordpress), with some custom classes to help standardize important SEO stuff. I haven't had that experience with Hugo, but I pushed the files up to S3/Github Pages/Netlify and had them served from there. I'm a big fan of the concept. I've had a great time with Gridsome, the VueJS version of Gatsby. I don't understand why, with React, you need to install a 3rd-party dependency just to update your meta tags. Like, it should either be part of your main layout when you set up your site (my Laravel approach), or there should be a built-in configuration for it, like Gridsome has (https://gridsome.org/docs/head/ https://gridsome.org/docs/head/). Every site needs this stuff, so it should be a first-class feature.
  - maerm56 6y ago
    > I don't understand why, with React, you need to install a 3rd-party dependency just to update your meta tags. You don't. This seems to be a common misunderstanding. You're free to and should write your meta tags (and everything else inside the head tag) in plain React components. It's enough to do this on the server side, but the document title should be updated client side, too. React-helmet is an antipattern.
Minor49er 6y ago
I'm a little surprised that the article talks about keywords and not keyphrases. I've found those to be more valuable, especially in the long term, since they're typically harder to unseat if the keywords are too generic. I've set up a quick process for targeting keyphrases in sites and pages that I want to boost. First, I figure out how much interest is in a phrase that is related to what my site is about. I'll go to Google and Bing and start searching for various keywords and see what autocomplete suggests. If the suggestions are relevant, I'll follow them and note roughly how many results there are and how relevant the top results are to the phrase. Next, I'll go to trends.google.com and compare the most relevant phrases to see how many searches are being performed for each. Then I compare that against the list of quality results to see where the biggest gaps are. That helps me to identify the phrase that I want to target. Then, I'll plug the phrase changes into the page that I want new users to land on (typically just the homepage, but this can sometimes be a particular section or article, depending on the site and its goals). Then, I'll go to seowarp.com and throw the page through a Full Scan which reports on phrasing information. Near the bottom, there's a "Duplicate Content" section that will compare similarities between pages, so if there's anything that is textually similar to my target page, I'll adjust it to drive more attention to the target one for relevancy. I'll also do a Single Page scan for my target page. The results of that scan will have a "First Five Targetted Keywords Detected" section that will show any keyphrases that are found on the page. Again, I'll make sure that my target phrase appears and cull any others that might be taking away any attention from it. After that looks good, I'll distribute links to the page that contains the phrase. Usually I'll see results start popping up within a week, but can take longer depending on the strength of the campaign.
- butler14 6y ago
  People (even SEOs and other search marketers) often use keywords and keyphrases and keyword phrases interchangeably, and mean ostensibly the same thing.
- ijidak 6y ago
  Wow. This is a really detailed flow. Do you offer consulting services?
tomaszs 6y ago
The only mistake I made with SEO was to do SEO in the first place. The way Google ranks pages makes today no sense. It is a waste of time doing SEO because above everything else, anyone who has more money will be higher and you can't change that. No matter how good content you have. I have more time to focus on what really matters when I ignored SEO and Google. At this point I don't care if it will index my website or not. It does not have any impact at all.
shhsshs 6y ago
Hitting the Escape key on this site toggles the scroll bar and prevents the page from scrolling. Why is that a good idea? I was very close to assuming the site is broken and leaving, until I figured out how to re-enable scrolling.
- MaximeHeckel 6y ago
  Hey OP/Author here, I just fixed this! I recently added some shortcuts, like a week or so ago, and this one went under the radar. Apologies for the inconvenience, and moreover, thank you for your comment without it I wouldn't have noticed
cpard 6y ago
The post is interesting but what I find a bit annoying with all the posts around SEO is that at the end, I just feel like I have to become a curator for the search engine in order to reach my audience. At the end it shouldn't be like this, it's the search engines responsibility to surface the right content for the right audience. I wish we had as many articles about how to communicate ideas in a more clear way as we have for how to annotate correctly your html code for the search engines.
dustinmoris 6y ago
I thought there would be some SEO tips in the blog post, but it was entirely about some weird issues in Gatsby and Netlify, two technologies which I’m not using. There was nothing about SEO.
nicbou 6y ago
The biggest issue I had with SEO was page speed. Google demands fast, secure website, unless you're already large and authoritative. The second was to neglect link building. Google wants authoritative websites. It also helps to be at the end of everyone's navigation path, no matter what they look for. For everything else, there's the Google Search console.
SkyLinx 6y ago
Even though I'm a web developer and have used various static site generators in the past, I never liked them too much because they seem like more work for me. I prefer dynamic CMS for a number of reasons. Having said that, I believe that things like WordPress can do too many things and are overkill for many people who just want to publish content on a blog. So I built DynaBlogger (https://www.dynablogger.com/ https://www.dynablogger.com/), a simpler alternative with the most needed features and no bloat.
- michaelbrooks 6y ago
  I just signed up and received an email confirmation, but the link was white so I couldn't see it. I had to move my cursor where I thought it was until my cursor changed. I'm using Outlook on Windows 10 if that helps.
  - SkyLinx 6y ago
    Hi there! I didn't realize your reply before, sorry! I will check with Outlook, thanks! Do you have any questions or feedback about the product? :)
- dgellow 6y ago
  I also like dynamic CMS more than static websites, there is something really cool about being able to access your editor and directly update your content. Of course things don't have to be black or white, I'm using Grav, it's a lightweight CMS that uses static files for its content and generate a static cache when something change, so you technically only serve static content but still have the benefits of having an admin UI to manage your website and content. https://getgrav.org/ https://getgrav.org/
fgfdddfgd 6y ago
I think the first two mistakes would have shown up in the Google search console, the third one is a technical issue of the way the site was generated. Basic SEO advice: look in the Google search console and do what Google says you should do.

306 points by MaximeHeckel 6y ago

This site is basically just a mashed potato of content without js. Anyone care to do a summary? It seems quite interesting.

capableweb 6y ago
- Make sure you either never have trailing slash or always have trailing slash (make sure you have canonical pages and redirects as little as possible) - Have canonical pages - Don't trust code you haven't read/don't understand - Make sure you view changes you make and that they are actually made when you think they are - Make sure what you want to be rendered on the page is actually rendered - Write tests Seems like a bunch of tips for people who are just starting out with web development, to not miss the most obvious problems. How this post is currently on the top of the front page will forever be a question for me. I'm glad more people are discovering SEO and it's importance, but this guide is specifically for one technology and are general tips about development rather than SEO really.
- MaximeHeckel 6y ago
  > How this post is currently on the top of the front page will forever be a question for me. OP/Author here, to me too trust me
mkhalil 6y ago
Turning off JS revealed practically the same website, but go on.
MaximeHeckel 6y ago
Yes, sites require a bit of JS (added some client side feature recently). Hope the summary other commenter gave you helped

krisroadruck 6y ago

I have been doing SEO professionally for just over a decade at this point. I've seen that trailing slash issue on more sites than I care to count. It's especially fun when people link to the wrong version of important pages in their nav and footer creating 301'd links across their entire site. An easy fix, but frustratingly common oversight.

marketingPro 6y ago
I need to ask, what's your job satisfaction like?
- walshemj 6y ago
  In what sense? seeing the same problem multiple times can be a bit of a pain in the ass

JustARandomGuy 6y ago

Note that the article is about optimizing a Gatsby site for SEO; it's not a general SEO tips site, of which there are many. With that said, it's quite amusing how small SEO changes can dramatically improve search visibility. It's one of the reasons why I point people to using Wordpress + SEO plugins like Yoast, which deal with most if not all of these edge cases automatically.

richrichardsson 6y ago
> general SEO tips site Are there any of these that are any good? I know next to nothing about SEO and would love to learn a bit more, but I've never found any useful resource that isn't some kind of crappy spam-blog or so old that I'm left doubting if the information is still relevant.
- krisroadruck 6y ago
  Ahrefs blog is pretty solid. Also Backlinko (Brian Dean), or anything by Nick Eubanks.
- DeusExMachina 6y ago
  I often read backlinko.com and ahrefs.com
  - cubecul 6y ago
    +1. These are the only two worth reading for most people.
- andygcook 6y ago
  If you're doing content marketing, then this case study from Apollo Digital is very useful: https://apollodigital.io/blog/seo-case-study https://apollodigital.io/blog/seo-case-study
- seanwilson 6y ago
  > I know next to nothing about SEO and would love to learn a bit more, but I've never found any useful resource that isn't some kind of crappy spam-blog or so old that I'm left doubting if the information is still relevant. You could try my on-page SEO guide that's more aimed at developers (https://www.checkbot.io/guide/seo/ https://www.checkbot.io/guide/seo/) and my Chrome extension that checks these SEO factors for you automatically (https://www.checkbot.io https://www.checkbot.io). I tried to keep the SEO guide concise with everything backed up with links to authoritative sources like Google or Mozilla.

jrockway 6y ago

I checked my own website for these issues (trailing slash canonicalization, canonical links in <head>) and it seems like Hugo (or the template I started with) handles all of this for me.

pembrook 6y ago

This article pretty much sums up why static site generators are such a pain in the ass. If you're just starting in your static site journey after moving away from something like Wordpress, you'll probably feel like you discovered the holy grail for a while. Yes, Netlify is amazing at first, and yes, it's a pleasure to build sites without fighting a wonky old-school PHP CMS. However, this will wear thin after you start to care about creating regular content and the nuances of SEO (as the person who wrote this article discovered). I've gotten SSG fatigue over the last couple of years and have completely switched over to building marketing sites and blogs in Webflow. No worries about build process, no setting up SEO from scratch every time, no wiring up a wonky headless CMS and building rigid content models, no writing blog posts in VScode and then forgetting how I set up my front matter, no PITA trying to set up a new section on your site and then realizing it breaks your headless CMS wiring, Etc. etc.

helij 6y ago
I do exactly the same with Hugo. I have a barebones template that is ready to go in a minute. I don't use Netlify but rsync public folder to server directly.

lxe 6y ago

How did we end up in a place where we need react, react-helmet, and graphql to build a static blog?

lmarcos 6y ago
I guess you got downvoted because the main point of the article is SEO, not react/react-helmet/graphql... Although I have to admit that I asked myself the same question.
AgentME 6y ago
Comparing to other static site generators, you might as well ask how we ended up in a place where we "need" Jekyll, liquid templates, and ruby to build a static blog. Static site generators are great for maintaining static sites with many pages that share templates and commonly-reused components, and React specifically is basically an HTML templating language that just also has the ability to run the same code on the client and update the page while it's open, which is really useful if you have any dynamic bits on your page. It's true there's some stuff downloaded and processed on the client that's dead weight if you're not actually using any dynamic features, but it's asynchronously downloaded and the page successfully does its initial render before that and it's about the size of an image or a font, so I think worrying about it in most cases is a bit overblown.
pembrook 6y ago
Every web developer in the 2000s was a PHP dev. To a man with a PHP hammer, everything looks like a PHP nail. Hence Wordpress (although, I must admit Wordpress's plugin ecosystem was genius). Every web developer in 2020 is a React dev. To a man with a React hammer, everything looks like a React nail. Hence, Gatsby. In neither case did it really make sense to build simple marketing sites and blogs with those technologies, they are best suited for dynamic web apps. But, the technology that all the devs want to put on their resumes will ultimately end up powering everything. Common sense be damned. After the static site hype dies down I am hopeful that Webflow will become the defacto solution for marketing/blog sites going forward and the design/marketing teams can fully own them and manage all changes. I'd be happy if I never had to touch another marketing site again.

agustif 6y ago

My only feeedback is go for nextjs, at least trailingSlash is solved for you by default so you don't screw up https://nextjs.org/docs/api-reference/next.config.js/trailing-slash https://nextjs.org/docs/api-reference/next.config.js/trailin...

MaximeHeckel 6y ago
OP/Author here, yes looking into NextJS to migrate my blog over. I loved Gatsby at the beginning, but it's very time consuming to maintain on the long run, especially with all the plugins (I started removing those and rewriting some of them)

deleted 6y ago

[deleted]

riboflavin 6y ago

Google Search: Surprisingly smart in some ways, surprisingly dumb in others. And this sort of thing doesn't just make a difference in indexing, but also in other places like analytics – Google Analytics will see a page with a slash and no slash separately, for example, which makes it hard to get an accurate picture of what's performing. We made a list of these factors here, this is #21 but maybe we should move it up! https://www.ercule.co/seo-content-performance/search-engine-friendliness https://www.ercule.co/seo-content-performance/search-engine-...

Donckele 6y ago

LOL, on the latest iphone the website is blank!

MaximeHeckel 6y ago
Hey OP/author here, can you tell me a bit more about the issue? I've asked around and it seemed to work as expected on mobile. Would love to know more about what happened in your case
- Donckele 6y ago
  Hi! The page seems to load and the content flashes on for a second and then screen goes all white. I don’t know what i can do to debug for you apart from mentioning i’m right now using iphone 7 , safari and ios 13.6.1

codingdave 6y ago

Thanks for writing this - I love to see SEO advice that is actually about the content and structure of your pages, and not about playing the SEO games.

tlug 6y ago

Call me old-fashioned, but when I look at the source code of a web page designed using the "modern" frameworks, it looks like a horrible mess of JS/CSS with very little actual content. E.g. take a look at this guy's code snippet's HTML source in the middle of the page - it's just a wall of <div>s and <span>s, for every single visible character. The search engines these days cannot even function without a JS interpreter, something that surely increases the complexity and cost of building one. Long gone are the days when one cared about semantic elegance of HTML code, per-site optimized CSS stored in an external file for easy caching, only occassional use of JS for easier navigation... Nowadays you don't build websites, you have to build "apps". It's one of many signs of the "appification" of Internet.

forgotmypw17 6y ago
there is still opportunity to do good web dev these days, but the choice is up to you.
marban 6y ago
+1 I'm still getting a bad night's sleep when the W3C validator doesn't give me the green light at the end of the day.
- BossingAround 6y ago
  microsoft.com, apple.com, a number of large "IT" companies have websites that throw W3C validator errors. I wonder whether there's a few that are completely valid..?
- walshemj 6y ago
  100% W3C has ZERO effect on SEO you are wasting time and effort
- AgentME 6y ago
  Nothing about Gatsby or React by itself gets you non-validating HTML. The article has some W3C validation errors, but they seem to be caused by a few CSS errors they made themselves, the choice by their chosen CSS framework to put <style> tags for components directly in the page body next to their component elements, and their chosen code highlighter's choice to use <div> tags inside of <pre> tags. I find it surprising those two tools do that, though I wouldn't describe those issues as having anything to do with the rest of the ecosystem. (I have a Gatsby site using the component CSS library Styled-JSX and the code highlighter PrismJS which don't have those issues, and the site only has a few validation warnings that are purely from my own html. Apparently <section> tags are expected to have headers.)

bilater 6y ago

Great article! I've had issues getting my Twitter links to show an image and hopefully this will help. Honestly it shouldn't be this complicated and Gatsby should have a more robust SEO component.

saagarjha 6y ago

I like how a quarter of the people who've liked the article are Hacker News bots :P

raicem 6y ago

I know the author is probably scratching their own itch there, but articles like this make me appreciate my WordPress blog. I don't have to think twice about this stuff. Especially if my main goal with the blog is to grow an audience and not learn Gatsby.

butler14 6y ago
I have seen countless £millions spent on websites over a 10 year career in web that could have been achieved - without compromise - with WP+yoast.
- _nedR 6y ago
  Interesting. Do you include websites built using SSGs like Hugo, Gatsby in your statement? Also, any tips on how you handle security (with minimal maintainence) and page-load performance in Wordpress?
  - butler14 6y ago
    Security is always the trade off, and I don't have any good answers to that problem (aside regular maintenance). The websites I'm thinking about, though, tended to be marketing websites ('microsites') for large consumer brands, that really didn't do a great deal functionally, and didn't need particularly robust security in the grand scheme of things.

airocker 6y ago

WE encountered the same exact problems. WE use a single page application. prerender.io was our savior.

franze 6y ago

I coded a chrome pluign called "SEO Live Test" previously "Obtrusive Live Testing Framework". It collects the live cycle of the page load, including static Dom, Dom ready Dom, JS executed Live Dom and runs various tests on those (plus some on the collected HTTP responses). All of the issues outline would have been fetched. Tests can be extended so any special cases minded. See here https://chrome.google.com/webstore/detail/franz-enzenhofer-seo-live/jbnaibigcohjfefpfocphcjeliohhold https://chrome.google.com/webstore/detail/franz-enzenhofer-s... a few thousand+ installs by now. If I would code it today it would make it part of the dev tools propably. The book to understand this approach to SEO and the rules in this framework is free for Hacker News readers btw https://gumroad.com/l/understanding-seo/hacker-news https://gumroad.com/l/understanding-seo/hacker-news

shampto3 6y ago
This looks really cool! I’ll definitely be checking it out. I’m fairly new to SEO so this may be a beginner question- what is the benefit of using this plug-in versus using the built in dev tools Lighthouse tool?
- franze 6y ago
  on top of my head: canonical check, ending slash / no ending slash collision check, GSC traffic check, noindex check on HTTP&HTML level, rel-alternate cross-page check, title tag best practice check, highlighter of parameterized URLs, internal link spot checking check, static dom vs rendered dom comparision and extendable

dzink 6y ago

The last time I benchmarked it, Google indexed static html content in about a week and dynamic JS-published content often in about 3 weeks. Frameworks like Gatsby, Hugo, and Wordpress have one or more of 3 problems: too complex, too slow, or too vulnerable, partly because of their mass appeal. So for serious SEO gains we actually stay away from them. This blog issue illustrates the too-complex problemof Gatsby - you don't find out about some minor configuration error until it gets indexed weeks later, and you lose substantial business due to the long feedback loop of SEO. Add to that the long compilation time, and you're looking for alternatives soon after investing massive resources in a setup. Hugo had a different problem the last time we tried it. In a test setup we did, a small configuration issue spewed your entire server and configuration data to anyone who visits a 404 link. Any issue with the setup created the volcano of sensitive data vulnerability. Didn't take the time to dig in any further. Wordpress is a behemoth, but because of that and slow hosting service providers it is incredibly slow to use on a hosted shared server, without caching. On top of that thousands of bots on the web are looking for and sending post requests to Wordpress admin files or php plugins (even if you're behind Cloudflare). There are faster and more performant ways to SEO, especially if you can code.

duhi88 6y ago
Agreed for the most part. Anything where SEO is critical (most things these days), we use Laravel for (trying to move away from Wordpress), with some custom classes to help standardize important SEO stuff. I haven't had that experience with Hugo, but I pushed the files up to S3/Github Pages/Netlify and had them served from there. I'm a big fan of the concept. I've had a great time with Gridsome, the VueJS version of Gatsby. I don't understand why, with React, you need to install a 3rd-party dependency just to update your meta tags. Like, it should either be part of your main layout when you set up your site (my Laravel approach), or there should be a built-in configuration for it, like Gridsome has (https://gridsome.org/docs/head/ https://gridsome.org/docs/head/). Every site needs this stuff, so it should be a first-class feature.
- maerm56 6y ago
  > I don't understand why, with React, you need to install a 3rd-party dependency just to update your meta tags. You don't. This seems to be a common misunderstanding. You're free to and should write your meta tags (and everything else inside the head tag) in plain React components. It's enough to do this on the server side, but the document title should be updated client side, too. React-helmet is an antipattern.

Minor49er 6y ago

I'm a little surprised that the article talks about keywords and not keyphrases. I've found those to be more valuable, especially in the long term, since they're typically harder to unseat if the keywords are too generic. I've set up a quick process for targeting keyphrases in sites and pages that I want to boost. First, I figure out how much interest is in a phrase that is related to what my site is about. I'll go to Google and Bing and start searching for various keywords and see what autocomplete suggests. If the suggestions are relevant, I'll follow them and note roughly how many results there are and how relevant the top results are to the phrase. Next, I'll go to trends.google.com and compare the most relevant phrases to see how many searches are being performed for each. Then I compare that against the list of quality results to see where the biggest gaps are. That helps me to identify the phrase that I want to target. Then, I'll plug the phrase changes into the page that I want new users to land on (typically just the homepage, but this can sometimes be a particular section or article, depending on the site and its goals). Then, I'll go to seowarp.com and throw the page through a Full Scan which reports on phrasing information. Near the bottom, there's a "Duplicate Content" section that will compare similarities between pages, so if there's anything that is textually similar to my target page, I'll adjust it to drive more attention to the target one for relevancy. I'll also do a Single Page scan for my target page. The results of that scan will have a "First Five Targetted Keywords Detected" section that will show any keyphrases that are found on the page. Again, I'll make sure that my target phrase appears and cull any others that might be taking away any attention from it. After that looks good, I'll distribute links to the page that contains the phrase. Usually I'll see results start popping up within a week, but can take longer depending on the strength of the campaign.

butler14 6y ago
People (even SEOs and other search marketers) often use keywords and keyphrases and keyword phrases interchangeably, and mean ostensibly the same thing.
ijidak 6y ago
Wow. This is a really detailed flow. Do you offer consulting services?

tomaszs 6y ago

The only mistake I made with SEO was to do SEO in the first place. The way Google ranks pages makes today no sense. It is a waste of time doing SEO because above everything else, anyone who has more money will be higher and you can't change that. No matter how good content you have. I have more time to focus on what really matters when I ignored SEO and Google. At this point I don't care if it will index my website or not. It does not have any impact at all.

shhsshs 6y ago

Hitting the Escape key on this site toggles the scroll bar and prevents the page from scrolling. Why is that a good idea? I was very close to assuming the site is broken and leaving, until I figured out how to re-enable scrolling.

MaximeHeckel 6y ago
Hey OP/Author here, I just fixed this! I recently added some shortcuts, like a week or so ago, and this one went under the radar. Apologies for the inconvenience, and moreover, thank you for your comment without it I wouldn't have noticed

cpard 6y ago

The post is interesting but what I find a bit annoying with all the posts around SEO is that at the end, I just feel like I have to become a curator for the search engine in order to reach my audience. At the end it shouldn't be like this, it's the search engines responsibility to surface the right content for the right audience. I wish we had as many articles about how to communicate ideas in a more clear way as we have for how to annotate correctly your html code for the search engines.

dustinmoris 6y ago

I thought there would be some SEO tips in the blog post, but it was entirely about some weird issues in Gatsby and Netlify, two technologies which I’m not using. There was nothing about SEO.

nicbou 6y ago

The biggest issue I had with SEO was page speed. Google demands fast, secure website, unless you're already large and authoritative. The second was to neglect link building. Google wants authoritative websites. It also helps to be at the end of everyone's navigation path, no matter what they look for. For everything else, there's the Google Search console.

SkyLinx 6y ago

Even though I'm a web developer and have used various static site generators in the past, I never liked them too much because they seem like more work for me. I prefer dynamic CMS for a number of reasons. Having said that, I believe that things like WordPress can do too many things and are overkill for many people who just want to publish content on a blog. So I built DynaBlogger (https://www.dynablogger.com/ https://www.dynablogger.com/), a simpler alternative with the most needed features and no bloat.

michaelbrooks 6y ago
I just signed up and received an email confirmation, but the link was white so I couldn't see it. I had to move my cursor where I thought it was until my cursor changed. I'm using Outlook on Windows 10 if that helps.
- SkyLinx 6y ago
  Hi there! I didn't realize your reply before, sorry! I will check with Outlook, thanks! Do you have any questions or feedback about the product? :)
dgellow 6y ago
I also like dynamic CMS more than static websites, there is something really cool about being able to access your editor and directly update your content. Of course things don't have to be black or white, I'm using Grav, it's a lightweight CMS that uses static files for its content and generate a static cache when something change, so you technically only serve static content but still have the benefits of having an admin UI to manage your website and content. https://getgrav.org/ https://getgrav.org/

fgfdddfgd 6y ago

I think the first two mistakes would have shown up in the Google search console, the third one is a technical issue of the way the site was generated. Basic SEO advice: look in the Google search console and do what Google says you should do.