From 82eae1b5f4bdf39ffac2512d0d478b501ae386a5 Mon Sep 17 00:00:00 2001 From: Sam Bhagwat Date: Thu, 29 Mar 2018 12:52:42 -0700 Subject: [PATCH 1/5] add seo link --- www/src/pages/docs/doc-links.yaml | 2 ++ 1 file changed, 2 insertions(+) diff --git a/www/src/pages/docs/doc-links.yaml b/www/src/pages/docs/doc-links.yaml index e984df870e0ea..992a371d7ea26 100644 --- a/www/src/pages/docs/doc-links.yaml +++ b/www/src/pages/docs/doc-links.yaml @@ -64,6 +64,8 @@ link: /docs/plugin-authoring/ - title: Proxying API Requests link: /docs/api-proxy/ + - title: Seach Engine Optimization (SEO) + link: /docs/seo/ - title: Using CSS-in-JS Library Glamor link: /docs/glamor/ - title: Using CSS-in-JS Library Styled Components From f55052c8612946b53ce195655c14ae991ef74e9b Mon Sep 17 00:00:00 2001 From: Sam Bhagwat Date: Thu, 29 Mar 2018 13:24:31 -0700 Subject: [PATCH 2/5] Create seo.md --- docs/docs/seo.md | 26 ++++++++++++++++++++++++++ 1 file changed, 26 insertions(+) create mode 100644 docs/docs/seo.md diff --git a/docs/docs/seo.md b/docs/docs/seo.md new file mode 100644 index 0000000000000..9eab3f7e4bdf6 --- /dev/null +++ b/docs/docs/seo.md @@ -0,0 +1,26 @@ +# SEO with Gatsby + +Gatsby offers several advantages to your site in search engine result placement. Some come out of the box, and some require light configutation. + +### Server rendering + +Because Gatsby pages are server-rendered, rather than client-rendered, the entire DOM tree is visible in the page source, and thus available to Google and all search indexes. + +(You can see this by clicking "View Source" on this page). + +### Speed boost + +Gatsby's many built-in speed optimizations, such as rendering to static files, progressive image loading, and following the PRPL pattern, help your site be lightning-fast by default. + +Starting in January 2018, Google [gives faster sites a bump in search rankings](https://searchengineland.com/google-speed-update-page-speed-will-become-ranking-factor-mobile-search-289904) -- so using Gatsby gives your site a ranking boost, as well as a search boost. + +### Page metadata + +Storing elements such as page title and description in the metadata allows search engines to better index your content. + +A common way to do this is to place a Helmet component from the [Gatsby React Helmet plugin](/packages/gatsby-plugin-react-helmet) in your layout element, and place metadata within the Helmet component. + +Some examples: +* [Official GatsbyJS.org site](https://github.com/gatsbyjs/gatsby/blob/master/www/src/layouts/index.js) +* [Jason Lengstorf's personal website](https://github.com/jlengstorf/lengstorf.com/blob/master/src/components/SEO.js) + From 756c1f6c1e70529dd3fcb0eee252695c90bf91aa Mon Sep 17 00:00:00 2001 From: Mike Allanson Date: Fri, 30 Mar 2018 11:01:57 +0200 Subject: [PATCH 3/5] Typo --- docs/docs/seo.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/docs/seo.md b/docs/docs/seo.md index 9eab3f7e4bdf6..4e0f3496e5f9a 100644 --- a/docs/docs/seo.md +++ b/docs/docs/seo.md @@ -1,6 +1,6 @@ # SEO with Gatsby -Gatsby offers several advantages to your site in search engine result placement. Some come out of the box, and some require light configutation. +Gatsby offers several advantages to your site in search engine result placement. Some come out of the box, and some require light configuration. ### Server rendering From 0b4ed0cb3441206b4e2014b6e24609e475c25756 Mon Sep 17 00:00:00 2001 From: Mike Allanson Date: Fri, 30 Mar 2018 11:02:17 +0200 Subject: [PATCH 4/5] Typo --- www/src/pages/docs/doc-links.yaml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/www/src/pages/docs/doc-links.yaml b/www/src/pages/docs/doc-links.yaml index 992a371d7ea26..219bfde934c33 100644 --- a/www/src/pages/docs/doc-links.yaml +++ b/www/src/pages/docs/doc-links.yaml @@ -64,7 +64,7 @@ link: /docs/plugin-authoring/ - title: Proxying API Requests link: /docs/api-proxy/ - - title: Seach Engine Optimization (SEO) + - title: Search Engine Optimization (SEO) link: /docs/seo/ - title: Using CSS-in-JS Library Glamor link: /docs/glamor/ From ef5af183bf940936069107a904dc6d9919c91913 Mon Sep 17 00:00:00 2001 From: Kyle Mathews Date: Fri, 30 Mar 2018 10:42:26 -0500 Subject: [PATCH 5/5] Copy edits --- docs/docs/seo.md | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/docs/docs/seo.md b/docs/docs/seo.md index 4e0f3496e5f9a..793dea18d4311 100644 --- a/docs/docs/seo.md +++ b/docs/docs/seo.md @@ -1,26 +1,26 @@ # SEO with Gatsby -Gatsby offers several advantages to your site in search engine result placement. Some come out of the box, and some require light configuration. +Gatsby helps your site place better in search engines. Some advantages come out of the box and some require configuration. ### Server rendering -Because Gatsby pages are server-rendered, rather than client-rendered, the entire DOM tree is visible in the page source, and thus available to Google and all search indexes. +Because Gatsby pages are server-rendered, rather than client-rendered, all the page content is available to Google and other search engines or crawlers. -(You can see this by clicking "View Source" on this page). +(You can see this by viewing the source for this page). ### Speed boost -Gatsby's many built-in speed optimizations, such as rendering to static files, progressive image loading, and following the PRPL pattern, help your site be lightning-fast by default. +Gatsby's many built-in performance optimizations, such as rendering to static files, progressive image loading, and the PRPL pattern—all help your site be lightning-fast by default. -Starting in January 2018, Google [gives faster sites a bump in search rankings](https://searchengineland.com/google-speed-update-page-speed-will-become-ranking-factor-mobile-search-289904) -- so using Gatsby gives your site a ranking boost, as well as a search boost. +Starting in January 2018, Google [rewards faster sites with a bump in search rankings](https://searchengineland.com/google-speed-update-page-speed-will-become-ranking-factor-mobile-search-289904). ### Page metadata -Storing elements such as page title and description in the metadata allows search engines to better index your content. +Add metadata to pages, such as page title and description, helps search engines understand your content and when to show your pages in search results. -A common way to do this is to place a Helmet component from the [Gatsby React Helmet plugin](/packages/gatsby-plugin-react-helmet) in your layout element, and place metadata within the Helmet component. +A common way to add metadata to pages is to add [react-helmet](https://github.com/nfl/react-helmet) components (together with the [Gatsby React Helmet plugin](/packages/gatsby-plugin-react-helmet) for SSR support) to your page components. -Some examples: +Some examples using react-helmet: * [Official GatsbyJS.org site](https://github.com/gatsbyjs/gatsby/blob/master/www/src/layouts/index.js) * [Jason Lengstorf's personal website](https://github.com/jlengstorf/lengstorf.com/blob/master/src/components/SEO.js)