gatsbyjs · gillkyle · Feb 28, 2020 · Feb 28, 2020 · Feb 28, 2020 · Feb 28, 2020
diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md
@@ -4,7 +4,7 @@
 -->
 
 <!--
-  Is this a blog post? Check out the docs at https://www.gatsbyjs.org/contributing/blog-and-website-contributions/, and please mention if the blog post is pre-approved
+  Is this a blog post? Check out the docs at https://www.gatsbyjs.org/contributing/blog-contributions/, and please mention if the blog post is pre-approved
   by someone from Gatsby.
 -->
 

diff --git a/...ibuting/blog-and-website-contributions.md → docs/contributing/blog-contributions.md b/...ibuting/blog-and-website-contributions.md → docs/contributing/blog-contributions.md
@@ -1,21 +1,10 @@
 ---
-title: Blog & Website Contributions
+title: Blog Contributions
 ---
 
-We wholeheartedly welcome contributions to the Gatsby blog and website!
+If you'd like to contribute a post to the Gatsby blog, please review the process and guidelines outlined below and submit your idea for the post to our [Gatsby blog proposal form](https://airtable.com/shr3449954866i3iF)
 
-Here are some things to keep in mind when deciding where to contribute to Gatsby:
-
-- [Blog posts](#contributing-to-the-blog) work best for case studies and time-sensitive storytelling (see the [blog post format](#blog-post-format)).
-- [Docs](/contributing/docs-contributions/) are continually relevant and discoverable learning materials that go beyond any one case study or situation.
-- [Website changes](#making-changes-to-the-website) that improve either of these are always welcome!
-
-## Contributing to the blog
-
-If you'd like to contribute a post to the Gatsby blog, please review the process and guidelines outlined below and submit your
-idea for the post to our [Gatsby blog proposal form](https://airtable.com/shr3449954866i3iF)
-
-### Blog proposal submission process
+## Blog proposal submission process
 
 1. Complete and submit the [Gatsby blog proposal form](https://airtable.com/shr3449954866i3iF).
 2. A Gatsby team member will review your proposal and let you know if the proposal has been accepted within the next week or so.
@@ -24,7 +13,7 @@ idea for the post to our [Gatsby blog proposal form](https://airtable.com/shr344
 
 If you have any questions about the process or your submission, please email [marketing@gatsbyjs.com](mailto:marketing@gatsbyjs.com).
 
-### Content guidelines for submitting a blog post proposal
+## Content guidelines for submitting a blog post proposal
 
 As a Gatsby community member, you have unique insight into the ins and outs of learning Gatsby, building with Gatsby, and contributing to Gatsby’s open source community. Contributing to the Gatsby blog is a great way to share your experiences and insights. Here are some guidelines for what kind of content is and isn’t a good fit for the Gatsby blog.
 
@@ -47,17 +36,3 @@ Things we’d like to avoid on the Gatsby blog:
 - **Content that doesn’t seem to have a clear benefit for Gatsby users and/or the Gatsby community.** For example, if you’re writing about a use-case or integration that’s extremely niche or unique to specific conditions that are really uncommon outside of your organization, the Gatsby blog might not be the best place for your content. Likewise, if your blog post doesn’t seem to have any direct relationship with Gatsby (or an interesting indirect relationship with Gatsby), then it may be more appropriate for a personal blog or another community blog.
 
 **Please note** that these are guidelines, not rules. If you think your blog post belongs on the Gatsby blog, we absolutely encourage you to submit it. While we reserve the right to decide what is and isn’t appropriate for the Gatsby blog, we also value and encourage your creativity and your contributions.
-
-## Making changes to the website
-
-If you want to make changes, improvements, or add new functionality to the website, you don't have to set up the full Gatsby repo to contribute. You can spin up your own instance of the Gatsby website with these steps:
-
-- Clone [the Gatsby repo](https://github.com/gatsbyjs/gatsby/) and navigate to `/www`
-- Run `yarn` to install all of the website's dependencies.
-- Run `npm run develop` to preview the site at `http://localhost:8000/`.
-
-> Note: If you are experiencing issues on a Linux machine, run `sudo apt install libvips-dev`, to install a native dependency. You can also reference [Gatsby guide on Linux](/docs/gatsby-on-linux/) for other Linux-specific requirements.
-
-Now you can make and preview your changes before raising a pull request!
-
-For full repo setup instructions, visit the [code contributions](/contributing/code-contributions/) page.
diff --git a/docs/contributing/code-contributions.md b/docs/contributing/code-contributions.md
@@ -21,7 +21,7 @@ To start setting up the Gatsby repo on your machine using git, Yarn and Gatsby-C
 
 Alternatively, you can skip the local setup and [use an online dev environment](/contributing/using-an-online-dev-environment/).
 
-To contribute to the blog or Gatsbyjs.org website, check out the setup steps on the [blog and website contributions](/contributing/blog-and-website-contributions/) page. For instructions on contributing to the docs, visit the [docs contributions page](/contributing/docs-contributions/).
+To contribute to the blog, check out the setup steps on the [blog contributions](/contributing/blog-contributions/) page. For instructions on contributing to the docs, visit the [docs contributions page](/contributing/docs-contributions/). To contribute to the website, see the [website contributions](/contributing/website-contributions/) page.
 
 ## Creating your own plugins and loaders
 

diff --git a/...ntributing/docs-and-website-components.md → .../contributing/docs-and-blog-components.md b/...ntributing/docs-and-website-components.md → .../contributing/docs-and-blog-components.md
@@ -1,13 +1,13 @@
 ---
-title: Docs and Website Components
+title: Docs & Blog Components
 tableOfContentsDepth: 2
 ---
 
 The Gatsbyjs.org site has a handful of components that have been developed to facilitate writing new content for the blog and the docs. There are also components that help organize and lay out content in various pages across the website.
 
-This guide documents what components are available and explains how to use them. You can also refer to the [code for this page on GitHub](https://github.com/gatsbyjs/gatsby/blob/master/docs/contributing/docs-and-website-components.md) to see to how each component can be used, because they are all embedded here!
+This guide documents what components are available and explains how to use them. You can also refer to the [code for this page on GitHub](https://github.com/gatsbyjs/gatsby/blob/master/docs/contributing/docs-and-blog-components.md) to see to how each component can be used, because they are all embedded here!
 
-Information about authoring in Markdown and styling components on the site is also listed.
+Information about authoring in Markdown on the site is also listed.
 
 ## Globally available components
 
@@ -163,7 +163,7 @@ The Horizontal Nav List component takes two props:
 - `slug` - which is provided in the props of the page by default
 - `items` - an array of strings for items to render and wrap with a `<Link />` to subheadings
 
-The docs on Gatsbyjs.org use the [gatsby-remark-autolink-headers](/packages/gatsby-remark-autolink-headers/) plugin to automatically apply hover links to heading tags across docs pages. Because it automatically creates links to subheadings on pages like the glossary, the Horizontal Nav List can supply matching links (like `"guide-list"` which would align with the automatically created link at `/docs/docs-and-website-components#guide-list`).
+The docs on Gatsbyjs.org use the [gatsby-remark-autolink-headers](/packages/gatsby-remark-autolink-headers/) plugin to automatically apply hover links to heading tags across docs pages. Because it automatically creates links to subheadings on pages like the glossary, the Horizontal Nav List can supply matching links (like `"guide-list"` which would align with the automatically created link at `/docs/docs-and-blog-components#guide-list`).
 
 <!-- prettier-ignore -->
 ```markdown
@@ -271,19 +271,3 @@ plugins: [
 ```
 
 Line numbers and line highlighting can be added to code blocks as well, and is explained in detail in the [`gatsby-remark-prismjs` README](/packages/gatsby-remark-prismjs/?=remark#optional-add-line-highlighting-styles).
-
-## Styling components on Gatsbyjs.org with Theme-UI
-
-Styles on the site are applied using [Theme-UI](https://theme-ui.com/), which allows for theming across the site based on design tokens (also called variables).
-
-### Design tokens
-
-Design tokens are used to consolidate the number of colors and style attributes that are applied to components throughout the site. By limiting the styles that can be applied, the site stays consistent with the guidelines for color, typography, spacing, etc.
-
-Tables listing design tokens that are used on the site can be found in the [design guidelines](/guidelines/design-tokens/).
-
-### The `sx` prop
-
-The [`sx` prop](https://theme-ui.com/sx-prop) from Theme-UI allows you to access theme values to style elements and components, it should be used wherever possible. The prop is "enabled" by adding `theme-ui`'s [JSX pragma](https://theme-ui.com/jsx-pragma) at the top of a `js` file.
-
-It is still okay to directly import tokens, e.g. `mediaQueries` or `colors` directly from [`www/src/gatsby-plugin-theme-ui`](https://github.com/gatsbyjs/gatsby/blob/master/www/src/gatsby-plugin-theme-ui/index.js) if it helps your specific use case — for example when global CSS is required, when passing theme values to other libraries or plugins, when authoring complex responsive styles, etc.
diff --git a/docs/contributing/docs-contributions.md b/docs/contributing/docs-contributions.md
@@ -4,7 +4,7 @@ title: Docs Contributions
 
 Gatsby, unsurprisingly, uses Gatsby for its documentation website. Thank you in advance and cheers for contributing to Gatsby documentation! As of February 2019, over 800 people have contributed. It's people like you that make this community great!
 
-> _When deciding where to contribute to Gatsby (docs or [blog](/contributing/blog-and-website-contributions/)?), check out the [docs templates](/contributing/docs-templates/) page._
+> _When deciding where to contribute to Gatsby (docs or [blog](/contributing/blog-contributions/)?), check out the [docs templates](/contributing/docs-templates/) page._
 
 ## Top priorities
 

diff --git a/docs/contributing/how-to-open-a-pull-request.md b/docs/contributing/how-to-open-a-pull-request.md
@@ -89,7 +89,7 @@ There are specific pages about contributing to various parts of the Gatsby ecosy
 
 ### Blog posts
 
-For the Gatsby blog, it's necessary to run your content idea by the Gatsby team before submitting it. For more information, refer to the page on [blog and website contributions](/contributing/blog-and-website-contributions/), including how to propose an idea and setting up the blog to run locally.
+For the Gatsby blog, it's necessary to run your content idea by the Gatsby team before submitting it. For more information, refer to the page on [blog contributions](/contributing/blog-contributions/), including how to propose an idea and setting up the blog to run locally.
 
 ## Follow up with reviews and suggestions
 

diff --git a/docs/contributing/managing-pull-requests.md b/docs/contributing/managing-pull-requests.md
@@ -65,7 +65,7 @@ For PRs that add a site or a starter to the showcase, we ought to check:
 
 For PRs that add a blog post, we ought to check:
 
-- Approval – has the [blog post been approved](/contributing/blog-and-website-contributions/) by marketing or another Gatsby internal team?
+- Approval – has the [blog post been approved](/contributing/blog-contributions/) by marketing or another Gatsby internal team?
 - Correctness — whether the added documentation is technically correct
 - Style — whether the written language follows our [style guide](/contributing/gatsby-style-guide/)
 - Subject matter — blog posts should not be purely promotional, spammy, or inappropriate. An author should check with a member of the Gatsby team that their post is appropriate for the blog before creating their PR.

diff --git a/docs/contributing/setting-up-your-local-dev-environment.md b/docs/contributing/setting-up-your-local-dev-environment.md
@@ -2,7 +2,7 @@
 title: Setting Up Your Local Dev Environment
 ---
 
-This page outlines how to get set up to contribute to Gatsby core and its ecosystem. For instructions on working with docs, visit the [docs contributions](/contributing/docs-contributions/) page. For blog and website setup instructions, visit the [blog and website contributions](/contributing/blog-and-website-contributions/) page.
+This page outlines how to get set up to contribute to Gatsby core and its ecosystem. For instructions on working with docs, visit the [docs contributions](/contributing/docs-contributions/) page. For website setup instructions, visit the [website contributions](/contributing/website-contributions/) page.
 
 > Gatsby uses a "monorepo" pattern to manage its many dependencies and relies on
 > [Lerna](https://lerna.js.org/) and [Yarn](https://yarnpkg.com/en/) to configure the repository for both active development and documentation infrastructure changes.

diff --git a/docs/contributing/website-contributions.md b/docs/contributing/website-contributions.md
@@ -0,0 +1,31 @@
+---
+title: Website Contributions
+---
+
+If you want to make changes, improvements, or add new functionality to the website, you don't have to set up the full Gatsby repo to contribute. You can spin up your own instance of the Gatsby website with these steps:
+
+- Clone [the Gatsby repo](https://github.com/gatsbyjs/gatsby/) and navigate to `/www`
+- Run `yarn` to install all of the website's dependencies.
+- Run `npm run develop` to preview the site at `http://localhost:8000/`.
+
+> Note: If you are experiencing issues on a Linux machine, run `sudo apt install libvips-dev`, to install a native dependency. You can also reference [Gatsby guide on Linux](/docs/gatsby-on-linux/) for other Linux-specific requirements.
+
+Now you can make and preview your changes before raising a pull request!
+
+For full repo setup instructions, visit the [code contributions](/contributing/code-contributions/) page.
+
+## Styling components on Gatsbyjs.org with Theme-UI
+
+Styles on the site are applied using [Theme-UI](https://theme-ui.com/), which allows for theming across the site based on design tokens (also called variables).
+
+### Design tokens
+
+Design tokens are used to consolidate the number of colors and style attributes that are applied to components throughout the site. By limiting the styles that can be applied, the site stays consistent with the guidelines for color, typography, spacing, etc.
+
+Tables listing design tokens that are used on the site can be found in the [design guidelines](/guidelines/design-tokens/).
+
+### The `sx` prop
+
+The [`sx` prop](https://theme-ui.com/sx-prop) from Theme-UI allows you to access theme values to style elements and components, it should be used wherever possible. The prop is "enabled" by adding `theme-ui`'s [JSX pragma](https://theme-ui.com/jsx-pragma) at the top of a `js` file.
+
+It is still okay to directly import tokens, e.g. `mediaQueries` or `colors` directly from [`www/src/gatsby-plugin-theme-ui`](https://github.com/gatsbyjs/gatsby/blob/master/www/src/gatsby-plugin-theme-ui/index.js) if it helps your specific use case — for example when global CSS is required, when passing theme values to other libraries or plugins, when authoring complex responsive styles, etc.
diff --git a/www/redirects.yaml b/www/redirects.yaml
@@ -138,3 +138,7 @@
   # redirecting gatsby-source-filesystem Programmatic Import to plugin README
 - fromPath: /docs/gatsby-source-filesystem-programmatic-import/
   toPath: /packages/gatsby-source-filesystem/
+- fromPath: /contributing/blog-and-website-contributions/
+  toPath: /contributing/blog-contributions/
+- fromPath: /contributing/docs-and-website-components/
+  toPath: /contributing/docs-and-blog-components/
diff --git a/www/src/data/sidebars/contributing-links.yaml b/www/src/data/sidebars/contributing-links.yaml
@@ -63,15 +63,15 @@
               link: /contributing/how-to-write-a-stub/
             - title: Stub List
               link: /contributing/stub-list/
-        - title: Blog & Website Contributions
-          link: /contributing/blog-and-website-contributions/
+        - title: Blog Contributions
+          link: /contributing/blog-contributions/
         - title: Code Contributions
           link: /contributing/code-contributions/
+        - title: Website Contributions
+          link: /contributing/website-contributions/
           items:
             - title: Setting Up Your Local Dev Environment
               link: /contributing/setting-up-your-local-dev-environment/
-        - title: Docs and Website Components
-          link: /contributing/docs-and-website-components/
         - title: Community Contributions
           link: /contributing/community-contributions/
           items:
@@ -83,6 +83,8 @@
               link: /contributing/submit-to-starter-library/
             - title: Submit to Plugin Library
               link: /contributing/submit-to-plugin-library/
+        - title: Docs & Blog Components
+          link: /contributing/docs-and-blog-components/
     - title: Gatsby Brand Guidelines
       items:
         - title: Color