diff --git a/site/src/AppRouter.tsx b/site/src/AppRouter.tsx
index 91c5f09ced71a..1da2cf2c5b413 100644
--- a/site/src/AppRouter.tsx
+++ b/site/src/AppRouter.tsx
@@ -4,21 +4,21 @@ import { AuthAndFrame } from "./components/AuthAndFrame/AuthAndFrame"
 import { RequireAuth } from "./components/Page/RequireAuth"
 import { PreferencesLayout } from "./components/Preferences/Layout"
 import { IndexPage } from "./pages"
-import { NotFoundPage } from "./pages/404"
-import { CliAuthenticationPage } from "./pages/cli-auth"
-import { HealthzPage } from "./pages/healthz"
-import { SignInPage } from "./pages/login"
-import { OrganizationsPage } from "./pages/orgs"
-import { PreferencesAccountPage } from "./pages/preferences/account"
-import { PreferencesLinkedAccountsPage } from "./pages/preferences/linkedAccounts"
-import { PreferencesSecurityPage } from "./pages/preferences/security"
-import { PreferencesSSHKeysPage } from "./pages/preferences/sshKeys"
-import { SettingsPage } from "./pages/settings"
-import { TemplatesPage } from "./pages/templates"
-import { TemplatePage } from "./pages/templates/[organization]/[template]"
-import { CreateWorkspacePage } from "./pages/templates/[organization]/[template]/create"
+import { NotFoundPage } from "./pages/404Page/404Page"
+import { CliAuthenticationPage } from "./pages/CliAuthPage/CliAuthPage"
+import { HealthzPage } from "./pages/HealthzPage/HealthzPage"
+import { LoginPage } from "./pages/LoginPage/LoginPage"
+import { OrgsPage } from "./pages/OrgsPage/OrgsPage"
+import { AccountPage } from "./pages/PreferencesPages/AccountPage/AccountPage"
+import { LinkedAccountsPage } from "./pages/PreferencesPages/LinkedAccountsPage/LinkedAccountsPage"
+import { SecurityPage } from "./pages/PreferencesPages/SecurityPage/SecurityPage"
+import { SSHKeysPage } from "./pages/PreferencesPages/SSHKeysPage/SSHKeysPage"
+import { SettingsPage } from "./pages/SettingsPage/SettingsPage"
+import { CreateWorkspacePage } from "./pages/TemplatesPages/OrganizationPage/TemplatePage/CreateWorkspacePage"
+import { TemplatePage } from "./pages/TemplatesPages/OrganizationPage/TemplatePage/TemplatePage"
+import { TemplatesPage } from "./pages/TemplatesPages/TemplatesPage"
 import { UsersPage } from "./pages/UsersPage/UsersPage"
-import { WorkspacePage } from "./pages/workspaces/[workspace]"
+import { WorkspacePage } from "./pages/WorkspacesPage/WorkspacesPage"
 
 export const AppRouter: React.FC = () => (
   <Routes>
@@ -32,7 +32,7 @@ export const AppRouter: React.FC = () => (
         }
       />
 
-      <Route path="login" element={<SignInPage />} />
+      <Route path="login" element={<LoginPage />} />
       <Route path="healthz" element={<HealthzPage />} />
       <Route path="cli-auth" element={<CliAuthenticationPage />} />
 
@@ -88,7 +88,7 @@ export const AppRouter: React.FC = () => (
         path="orgs"
         element={
           <AuthAndFrame>
-            <OrganizationsPage />
+            <OrgsPage />
           </AuthAndFrame>
         }
       />
@@ -102,10 +102,10 @@ export const AppRouter: React.FC = () => (
       />
 
       <Route path="preferences" element={<PreferencesLayout />}>
-        <Route path="account" element={<PreferencesAccountPage />} />
-        <Route path="security" element={<PreferencesSecurityPage />} />
-        <Route path="ssh-keys" element={<PreferencesSSHKeysPage />} />
-        <Route path="linked-accounts" element={<PreferencesLinkedAccountsPage />} />
+        <Route path="account" element={<AccountPage />} />
+        <Route path="security" element={<SecurityPage />} />
+        <Route path="ssh-keys" element={<SSHKeysPage />} />
+        <Route path="linked-accounts" element={<LinkedAccountsPage />} />
       </Route>
 
       {/* Using path="*"" means "match anything", so this route
diff --git a/site/src/pages/404.tsx b/site/src/pages/404Page/404Page.tsx
similarity index 100%
rename from site/src/pages/404.tsx
rename to site/src/pages/404Page/404Page.tsx
diff --git a/site/src/pages/cli-auth.tsx b/site/src/pages/CliAuthPage/CliAuthPage.tsx
similarity index 78%
rename from site/src/pages/cli-auth.tsx
rename to site/src/pages/CliAuthPage/CliAuthPage.tsx
index a6a14a4bd9334..4aa825d7630e8 100644
--- a/site/src/pages/cli-auth.tsx
+++ b/site/src/pages/CliAuthPage/CliAuthPage.tsx
@@ -1,10 +1,10 @@
 import { makeStyles } from "@material-ui/core/styles"
 import { useActor } from "@xstate/react"
 import React, { useContext, useEffect, useState } from "react"
-import { getApiKey } from "../api"
-import { FullScreenLoader } from "../components/Loader/FullScreenLoader"
-import { CliAuthToken } from "../components/SignIn/CliAuthToken"
-import { XServiceContext } from "../xServices/StateContext"
+import { getApiKey } from "../../api"
+import { FullScreenLoader } from "../../components/Loader/FullScreenLoader"
+import { CliAuthToken } from "../../components/SignIn/CliAuthToken"
+import { XServiceContext } from "../../xServices/StateContext"
 
 export const CliAuthenticationPage: React.FC = () => {
   const xServices = useContext(XServiceContext)
diff --git a/site/src/pages/healthz.tsx b/site/src/pages/HealthzPage/HealthzPage.tsx
similarity index 100%
rename from site/src/pages/healthz.tsx
rename to site/src/pages/HealthzPage/HealthzPage.tsx
diff --git a/site/src/pages/login.test.tsx b/site/src/pages/LoginPage/LoginPage.test.tsx
similarity index 82%
rename from site/src/pages/login.test.tsx
rename to site/src/pages/LoginPage/LoginPage.test.tsx
index f81efe24118b0..25be19631f937 100644
--- a/site/src/pages/login.test.tsx
+++ b/site/src/pages/LoginPage/LoginPage.test.tsx
@@ -2,12 +2,12 @@ import { act, screen } from "@testing-library/react"
 import userEvent from "@testing-library/user-event"
 import { rest } from "msw"
 import React from "react"
-import { Language } from "../components/SignIn/SignInForm"
-import { history, render } from "../testHelpers"
-import { server } from "../testHelpers/server"
-import { SignInPage } from "./login"
+import { Language } from "../../components/SignIn/SignInForm"
+import { history, render } from "../../testHelpers"
+import { server } from "../../testHelpers/server"
+import { LoginPage } from "./LoginPage"
 
-describe("SignInPage", () => {
+describe("LoginPage", () => {
   beforeEach(() => {
     history.replace("/login")
     // appear logged out
@@ -20,7 +20,7 @@ describe("SignInPage", () => {
 
   it("renders the sign-in form", async () => {
     // When
-    render(<SignInPage />)
+    render(<LoginPage />)
 
     // Then
     await screen.findByText(Language.signIn)
@@ -36,7 +36,7 @@ describe("SignInPage", () => {
     )
 
     // When
-    render(<SignInPage />)
+    render(<LoginPage />)
     const email = screen.getByLabelText(Language.emailLabel)
     const password = screen.getByLabelText(Language.passwordLabel)
     await userEvent.type(email, "test@coder.com")
diff --git a/site/src/pages/login.tsx b/site/src/pages/LoginPage/LoginPage.tsx
similarity index 84%
rename from site/src/pages/login.tsx
rename to site/src/pages/LoginPage/LoginPage.tsx
index 4ca95d9a1cb0d..5ecea1d2f54ae 100644
--- a/site/src/pages/login.tsx
+++ b/site/src/pages/LoginPage/LoginPage.tsx
@@ -2,10 +2,10 @@ import { makeStyles } from "@material-ui/core/styles"
 import { useActor } from "@xstate/react"
 import React, { useContext } from "react"
 import { Navigate, useLocation } from "react-router-dom"
-import { Footer } from "../components/Page/Footer"
-import { retrieveRedirect } from "../util/redirect"
-import { XServiceContext } from "../xServices/StateContext"
-import { SignInForm } from "./../components/SignIn/SignInForm"
+import { Footer } from "../../components/Page/Footer"
+import { SignInForm } from "../../components/SignIn/SignInForm"
+import { retrieveRedirect } from "../../util/redirect"
+import { XServiceContext } from "../../xServices/StateContext"
 
 export const useStyles = makeStyles((theme) => ({
   root: {
@@ -27,7 +27,7 @@ export const useStyles = makeStyles((theme) => ({
   },
 }))
 
-export const SignInPage: React.FC = () => {
+export const LoginPage: React.FC = () => {
   const styles = useStyles()
   const location = useLocation()
   const xServices = useContext(XServiceContext)
diff --git a/site/src/pages/orgs/index.tsx b/site/src/pages/OrgsPage/OrgsPage.tsx
similarity index 54%
rename from site/src/pages/orgs/index.tsx
rename to site/src/pages/OrgsPage/OrgsPage.tsx
index 6278f8b31a255..07a94c5cf8aea 100644
--- a/site/src/pages/orgs/index.tsx
+++ b/site/src/pages/OrgsPage/OrgsPage.tsx
@@ -1,5 +1,5 @@
 import React from "react"
 
-export const OrganizationsPage: React.FC = () => {
+export const OrgsPage: React.FC = () => {
   return <div>Coming soon!</div>
 }
diff --git a/site/src/pages/preferences/account.test.tsx b/site/src/pages/PreferencesPages/AccountPage/AccountPage.test.tsx
similarity index 88%
rename from site/src/pages/preferences/account.test.tsx
rename to site/src/pages/PreferencesPages/AccountPage/AccountPage.test.tsx
index d35d4cb3b2285..014d735010ef3 100644
--- a/site/src/pages/preferences/account.test.tsx
+++ b/site/src/pages/PreferencesPages/AccountPage/AccountPage.test.tsx
@@ -1,16 +1,16 @@
 import { fireEvent, screen, waitFor } from "@testing-library/react"
 import React from "react"
-import * as API from "../../api"
-import * as AccountForm from "../../components/Preferences/AccountForm"
-import { GlobalSnackbar } from "../../components/Snackbar/GlobalSnackbar"
-import { renderWithAuth } from "../../testHelpers"
-import * as AuthXService from "../../xServices/auth/authXService"
-import { Language, PreferencesAccountPage } from "./account"
+import * as API from "../../../api"
+import * as AccountForm from "../../../components/Preferences/AccountForm"
+import { GlobalSnackbar } from "../../../components/Snackbar/GlobalSnackbar"
+import { renderWithAuth } from "../../../testHelpers"
+import * as AuthXService from "../../../xServices/auth/authXService"
+import { AccountPage, Language } from "./AccountPage"
 
 const renderPage = () => {
   return renderWithAuth(
     <>
-      <PreferencesAccountPage />
+      <AccountPage />
       <GlobalSnackbar />
     </>,
   )
@@ -30,7 +30,7 @@ const fillAndSubmitForm = async () => {
   fireEvent.click(screen.getByText(AccountForm.Language.updatePreferences))
 }
 
-describe("PreferencesAccountPage", () => {
+describe("AccountPage", () => {
   describe("when it is a success", () => {
     it("shows the success message", async () => {
       jest.spyOn(API, "updateProfile").mockImplementationOnce((userId, data) =>
diff --git a/site/src/pages/preferences/account.tsx b/site/src/pages/PreferencesPages/AccountPage/AccountPage.tsx
similarity index 79%
rename from site/src/pages/preferences/account.tsx
rename to site/src/pages/PreferencesPages/AccountPage/AccountPage.tsx
index d55616bc9786e..53709ffc793bd 100644
--- a/site/src/pages/preferences/account.tsx
+++ b/site/src/pages/PreferencesPages/AccountPage/AccountPage.tsx
@@ -1,9 +1,9 @@
 import { useActor } from "@xstate/react"
 import React, { useContext } from "react"
-import { isApiError, mapApiErrorToFieldErrors } from "../../api/errors"
-import { AccountForm } from "../../components/Preferences/AccountForm"
-import { Section } from "../../components/Section/Section"
-import { XServiceContext } from "../../xServices/StateContext"
+import { isApiError, mapApiErrorToFieldErrors } from "../../../api/errors"
+import { AccountForm } from "../../../components/Preferences/AccountForm"
+import { Section } from "../../../components/Section/Section"
+import { XServiceContext } from "../../../xServices/StateContext"
 
 export const Language = {
   title: "Account",
@@ -11,7 +11,7 @@ export const Language = {
   unknownError: "Oops, an unknown error occurred.",
 }
 
-export const PreferencesAccountPage: React.FC = () => {
+export const AccountPage: React.FC = () => {
   const xServices = useContext(XServiceContext)
   const [authState, authSend] = useActor(xServices.authXService)
   const { me, updateProfileError } = authState.context
diff --git a/site/src/pages/preferences/linkedAccounts.tsx b/site/src/pages/PreferencesPages/AccountPage/LinkedAccountsPage.tsx
similarity index 71%
rename from site/src/pages/preferences/linkedAccounts.tsx
rename to site/src/pages/PreferencesPages/AccountPage/LinkedAccountsPage.tsx
index dbe47ece1b15a..994492cc91f48 100644
--- a/site/src/pages/preferences/linkedAccounts.tsx
+++ b/site/src/pages/PreferencesPages/AccountPage/LinkedAccountsPage.tsx
@@ -1,5 +1,5 @@
 import React from "react"
-import { Section } from "../../components/Section/Section"
+import { Section } from "../../../components/Section/Section"
 
 const Language = {
   title: "Linked Accounts",
@@ -7,6 +7,6 @@ const Language = {
     "Linking your Coder account will add your workspace SSH key, allowing you to perform Git actions on all your workspaces.",
 }
 
-export const PreferencesLinkedAccountsPage: React.FC = () => {
+export const LinkedAccountsPage: React.FC = () => {
   return <Section title={Language.title} description={Language.description} />
 }
diff --git a/site/src/pages/preferences/sshKeys.tsx b/site/src/pages/PreferencesPages/AccountPage/SSHKeysPage.tsx
similarity index 75%
rename from site/src/pages/preferences/sshKeys.tsx
rename to site/src/pages/PreferencesPages/AccountPage/SSHKeysPage.tsx
index 566451f27e92a..c190590155563 100644
--- a/site/src/pages/preferences/sshKeys.tsx
+++ b/site/src/pages/PreferencesPages/AccountPage/SSHKeysPage.tsx
@@ -1,5 +1,5 @@
 import React from "react"
-import { Section } from "../../components/Section/Section"
+import { Section } from "../../../components/Section/Section"
 
 const Language = {
   title: "SSH Keys",
@@ -7,6 +7,6 @@ const Language = {
     "Coder automatically inserts a private key into every workspace; you can add the corresponding public key to any services (such as Git) that you need access to from your workspace.",
 }
 
-export const PreferencesSSHKeysPage: React.FC = () => {
+export const SSHKeysPage: React.FC = () => {
   return <Section title={Language.title} description={Language.description} />
 }
diff --git a/site/src/pages/PreferencesPages/LinkedAccountsPage/LinkedAccountsPage.tsx b/site/src/pages/PreferencesPages/LinkedAccountsPage/LinkedAccountsPage.tsx
new file mode 100644
index 0000000000000..994492cc91f48
--- /dev/null
+++ b/site/src/pages/PreferencesPages/LinkedAccountsPage/LinkedAccountsPage.tsx
@@ -0,0 +1,12 @@
+import React from "react"
+import { Section } from "../../../components/Section/Section"
+
+const Language = {
+  title: "Linked Accounts",
+  description:
+    "Linking your Coder account will add your workspace SSH key, allowing you to perform Git actions on all your workspaces.",
+}
+
+export const LinkedAccountsPage: React.FC = () => {
+  return <Section title={Language.title} description={Language.description} />
+}
diff --git a/site/src/pages/PreferencesPages/SSHKeysPage/SSHKeysPage.tsx b/site/src/pages/PreferencesPages/SSHKeysPage/SSHKeysPage.tsx
new file mode 100644
index 0000000000000..c190590155563
--- /dev/null
+++ b/site/src/pages/PreferencesPages/SSHKeysPage/SSHKeysPage.tsx
@@ -0,0 +1,12 @@
+import React from "react"
+import { Section } from "../../../components/Section/Section"
+
+const Language = {
+  title: "SSH Keys",
+  description:
+    "Coder automatically inserts a private key into every workspace; you can add the corresponding public key to any services (such as Git) that you need access to from your workspace.",
+}
+
+export const SSHKeysPage: React.FC = () => {
+  return <Section title={Language.title} description={Language.description} />
+}
diff --git a/site/src/pages/preferences/security.tsx b/site/src/pages/PreferencesPages/SecurityPage/SecurityPage.tsx
similarity index 66%
rename from site/src/pages/preferences/security.tsx
rename to site/src/pages/PreferencesPages/SecurityPage/SecurityPage.tsx
index 89121519aa2ca..b1cb8c568e483 100644
--- a/site/src/pages/preferences/security.tsx
+++ b/site/src/pages/PreferencesPages/SecurityPage/SecurityPage.tsx
@@ -1,11 +1,11 @@
 import React from "react"
-import { Section } from "../../components/Section/Section"
+import { Section } from "../../../components/Section/Section"
 
 const Language = {
   title: "Security",
   description: "Changing your password will sign you out of your current session.",
 }
 
-export const PreferencesSecurityPage: React.FC = () => {
+export const SecurityPage: React.FC = () => {
   return <Section title={Language.title} description={Language.description} />
 }
diff --git a/site/src/pages/settings/index.tsx b/site/src/pages/SettingsPage/SettingsPage.tsx
similarity index 100%
rename from site/src/pages/settings/index.tsx
rename to site/src/pages/SettingsPage/SettingsPage.tsx
diff --git a/site/src/pages/templates/[organization]/[template]/create.tsx b/site/src/pages/TemplatesPages/OrganizationPage/TemplatePage/CreateWorkspacePage.tsx
similarity index 100%
rename from site/src/pages/templates/[organization]/[template]/create.tsx
rename to site/src/pages/TemplatesPages/OrganizationPage/TemplatePage/CreateWorkspacePage.tsx
diff --git a/site/src/pages/templates/[organization]/[template]/index.tsx b/site/src/pages/TemplatesPages/OrganizationPage/TemplatePage/TemplatePage.tsx
similarity index 100%
rename from site/src/pages/templates/[organization]/[template]/index.tsx
rename to site/src/pages/TemplatesPages/OrganizationPage/TemplatePage/TemplatePage.tsx
diff --git a/site/src/pages/templates/index.tsx b/site/src/pages/TemplatesPages/TemplatesPage.tsx
similarity index 100%
rename from site/src/pages/templates/index.tsx
rename to site/src/pages/TemplatesPages/TemplatesPage.tsx
diff --git a/site/src/pages/workspaces/[workspace].tsx b/site/src/pages/WorkspacesPage/WorkspacesPage.tsx
similarity index 100%
rename from site/src/pages/workspaces/[workspace].tsx
rename to site/src/pages/WorkspacesPage/WorkspacesPage.tsx