diff --git a/docs/blog/100days/accessibility/index.md b/docs/blog/100days/accessibility/index.md index 469727fa0ee5c..af45e5e59331d 100644 --- a/docs/blog/100days/accessibility/index.md +++ b/docs/blog/100days/accessibility/index.md @@ -16,7 +16,7 @@ _Learn more about [#100DaysOfGatsby here](/blog/100days)!_ Web developers love Gatsby because a Gatsby site gives you rock solid performance, SEO, and sets you up for success in building an accessible site. However as you continue to develop your project, and your editors begin adding content to the site, all three of those site features may suffer. -Over the next three challenges, we’ll ask you to enhance your site’s performance, SEO, and accessibility, starting with the accessibility of your forms and images. +Over the next three challenges, we’ll ask you to enhance your site’s performance, [SEO](/blog/100days/seo), and accessibility, starting with the accessibility of your forms and images. As a Gatsby developer, you want to ensure that everyone can access your work, including users who rely on assistive technology to read and navigate your site. Two of the biggest sinkholes for these users are inaccessible forms and images. In previous prompts, we asked you to add images and forms to your project. Now that you have those elements on your site, we ask that you examine and ensure their accessibility. diff --git a/docs/blog/100days/seo/index.md b/docs/blog/100days/seo/index.md new file mode 100644 index 0000000000000..5a8ca5d90a030 --- /dev/null +++ b/docs/blog/100days/seo/index.md @@ -0,0 +1,41 @@ +--- +title: Challenge 9 - Optimize Your Website for Search Engines (SEO) +date: 2020-02-26 +author: "Hashim Warren" +excerpt: "Learn how to make your website rank no. 1 in search engines" +tags: ["learning-to-code", "contest", "100-Days-of-Gatsby", "accessibility"] +--- + +_Gatsby was named the [#1 new technology to learn in 2020](https://www.cnbc.com/2019/12/02/10-hottest-tech-skills-that-could-pay-off-most-in-2020-says-new-report.html)!_ + +_To help you learn about Gatsby and our ecosystem, we invite you to take the #100DaysOfGatsby challenge! If you are new to Gatsby, you can follow along with our beginner-friendly weekly prompts. Or if you are familiar with Gatsby and want to go deeper, we invite you to [build your first Gatsby Theme](/docs/themes/building-themes/)._ + +_Learn more about [#100DaysOfGatsby here](/blog/100days)!_ + +## Challenge 9: Help Your Site Rank No. 1 in Search Engines + +In a previous challenge we asked you to make your site's [forms and images more accessible](/blog/100days/accessibility/) so all people can view and interact with your content. This week we invite you to do the same for robots - namely the search engine "spiders" that crawl the web, indexing and ranking webpages. + +Good news - Gatsby gives you a head start to strong [search engine optimization (SEO)](/docs/seo/), similar to the way our framework helps you with accessibility. Gatsby sites are blazing fast, which is a [positive ranking factor for Google](https://backlinko.com/hub/seo/pagespeed). Also, Gatsby sites avoid some common SEO pitfalls of React projects by creating navigation between routes that search engine spiders understand how to crawl. + +An underappreciated feature of Gatsby is the [prefetching of pages](/docs/routing/#performance-and-prefetching) which makes a site feel snappy and dramatically more engaging. This may reduce user bounce rates and ["pogo sticking"](https://backlinko.com/hub/seo/pogosticking) which is a major _negative_ ranking factor for Google. + +Today we're going beyond the default SEO features of Gatsby, and moving on to advanced enhancements. Use the SEO resources below to make your Gatsby site competitive in search rankings! + +### SEO Challenge Resources + +#### Customize Your Site's Description in Search Engine Results + +[Add metadata to pages](/docs/seo/#page-metadata) so search engines and social media sites can display a custom preview of your site's content. + +#### Guide search spider to important or recently updated pages + +[Learn about sitemaps](/blog/2019-05-07-advanced-sitemap-plugin-for-seo/) and add one to your site using [a Gatsby plugin](/packages/gatsby-plugin-advanced-sitemap/). + +#### Create alternate page titles for individual blog posts + +Add a [new field in your blog's Markdown frontmatter](/docs/adding-markdown-pages/#frontmatter-for-metadata-in-markdown-files) for page titles that will appear in search engines, that may be different than the title of your blog post that appears on the page. + +#### What to Do If You Need Help + +If you get stuck during the challenge, you can ask for help from the [Gatsby community](/contributing/community/) and the [AskGatsbyJS](https://twitter.com/AskGatsbyJS) Twitter account. You can find fellow Gatsby Developers on [Discord](https://discordapp.com/invite/gatsby), [Reddit](https://www.reddit.com/r/gatsbyjs/), [Spectrum](https://spectrum.chat/gatsby-js), and [Dev](https://dev.to/t/gatsby).