diff --git a/app/src/features/support/SupportPage.tsx b/app/src/features/support/SupportPage.tsx
index fc6201770c..cc55882794 100644
--- a/app/src/features/support/SupportPage.tsx
+++ b/app/src/features/support/SupportPage.tsx
@@ -1,37 +1,19 @@
-import {
-  mdiAccountSupervisor,
-  mdiAutoFix,
-  mdiCardAccountMailOutline,
-  mdiCheckDecagram,
-  mdiChevronLeft,
-  mdiChevronRight,
-  mdiDatabaseCog,
-  mdiEye,
-  mdiFileOutline,
-  mdiFolder,
-  mdiHome,
-  mdiInformationOutline,
-  mdiListBoxOutline,
-  mdiPaw,
-  mdiPineTreeVariant,
-  mdiWifiMarker
-} from '@mdi/js';
+import { mdiChevronLeft, mdiChevronRight } from '@mdi/js';
 import Icon from '@mdi/react';
 import { Box, Button, Container, Divider, Paper, Stack, Typography } from '@mui/material';
-import AutocompleteSearchField from 'components/fields/AutocompleteSearch/AutocompleteSearchField';
 import PageHeader from 'components/layout/PageHeader';
 import CustomToggleButtonGroup from 'components/toolbar/CustomToggleButtonGroup';
 import { useSearchParams } from 'hooks/useSearchParams';
-import { ReactNode, SetStateAction } from 'react';
-import { ISupportPageView, SupportPageParams, SupportPageView } from '../support/constants/SupportPageView';
-import { SupportOverview } from './content/overview/SupportOverview';
-import { SupportProjects } from './content/projects/SupportProjects';
-import { SupportObservations } from './content/projects/surveys/data/observations/SupportObservations';
-import { SupportData } from './content/projects/surveys/data/SupportData';
-import { SupportTelemetry } from './content/projects/surveys/data/telemetry/SupportTelemetry';
-import { SupportSampling } from './content/projects/surveys/sampling/SupportSampling';
-import { SupportSurveys } from './content/projects/surveys/SupportSurveys';
-import { SupportTeam } from './content/projects/team/SupportTeam';
+import { useMemo, useState } from 'react';
+import {
+  ISupportPageView,
+  SupportPageParams,
+  SupportPageView,
+  SupportPageViewMap,
+  SupportPageViews
+} from './SupportPageView';
+
+const VIEW_KEY = 'v';
 
 /**
  * Returns information about how to use the app, definitions, and other resources for users.
@@ -41,153 +23,52 @@ import { SupportTeam } from './content/projects/team/SupportTeam';
 export const SupportPage = () => {
   const { searchParams, setSearchParams } = useSearchParams<SupportPageParams>();
 
-  const currentViewParam = searchParams.get('support_view');
-  const currentView = (currentViewParam as SupportPageView) || SupportPageView.GENERAL;
+  // Initialize activeView based on the URL params
+  const [activeView, setActiveView] = useState(
+    (searchParams.get(VIEW_KEY) as SupportPageView) ?? SupportPageView.overview
+  );
 
-  // Add nested structure
-  const views: ISupportPageView[] = [
-    {
-      label: 'Overview',
-      value: SupportPageView.GENERAL,
-      icon: mdiHome,
-      children: []
-    },
-    {
-      label: 'Projects',
-      value: SupportPageView.PROJECTS,
-      icon: mdiFolder,
-      children: [
-        {
-          label: 'Team',
-          value: SupportPageView.PROJECT_TEAM,
-          icon: mdiAccountSupervisor,
-          children: []
-        },
-        {
-          label: 'Surveys',
-          value: SupportPageView.SURVEYS,
-          icon: mdiListBoxOutline,
-          children: [
-            {
-              label: 'Sampling',
-              value: SupportPageView.SAMPLING,
-              icon: mdiAutoFix,
-              children: []
-            },
-            {
-              label: 'Data',
-              value: SupportPageView.DATA,
-              icon: mdiDatabaseCog,
-              children: [
-                {
-                  label: 'Observations',
-                  value: SupportPageView.OBSERVATIONS,
-                  icon: mdiEye,
-                  children: []
-                },
-                {
-                  label: 'Telemetry',
-                  value: SupportPageView.TELEMETRY,
-                  icon: mdiWifiMarker,
-                  children: []
-                },
-                {
-                  label: 'Animals',
-                  value: SupportPageView.ANIMALS,
-                  icon: mdiPaw,
-                  children: []
-                },
-                {
-                  label: 'Habitat Features',
-                  value: SupportPageView.HABITAT,
-                  icon: mdiPineTreeVariant,
-                  children: []
-                }
-              ]
-            },
-            {
-              label: 'Attachments',
-              value: SupportPageView.FILES,
-              icon: mdiFileOutline,
-              children: []
-            },
-            {
-              label: 'Metadata',
-              value: SupportPageView.METADATA,
-              icon: mdiInformationOutline,
-              children: []
-            }
-          ]
-        }
-      ]
-    },
-    {
-      label: 'Standards',
-      value: SupportPageView.DATA_STANDARDS,
-      icon: mdiCheckDecagram,
-      children: []
-    },
-    {
-      label: 'Contact',
-      value: SupportPageView.CONTACT,
-      icon: mdiCardAccountMailOutline,
-      children: []
+  const handleViewChange = (view: SupportPageView) => {
+    if (view) {
+      setActiveView(view);
+      setSearchParams(searchParams.set(VIEW_KEY, view));
     }
-  ];
+  };
 
-  // Finding the current view and navigating to the correct parent/child
-  const findView = (value: SupportPageView, views: ISupportPageView[]): ISupportPageView | null => {
-    for (const view of views) {
-      if (view.value === value) {
-        return view;
-      }
-      if (view.children.length > 0) {
-        const foundChild = findView(value, view.children);
-        if (foundChild) return foundChild;
-      }
-    }
-    return null;
+  // Recursively flattens child views
+  const flattenViews = (views: ISupportPageView[]): ISupportPageView[] => {
+    return views.flatMap((view) => [view, ...flattenViews(view.children ?? [])]);
   };
 
-  const currentViewData = findView(currentView, views);
-  const currentIndex = views.findIndex((view) => view.value === currentView);
-  const nextView = views[(currentIndex + 1) % views.length];
-  const prevView = views[(currentIndex - 1 + views.length) % views.length];
+  // Find the current view object for its label, icon, children
+  const currentView = useMemo(
+    () => flattenViews(SupportPageViews).find((view) => view.value === activeView),
+    [activeView]
+  );
 
-  const handleViewChange: React.Dispatch<SetStateAction<SupportPageView>> = (value) => {
-    const newView = typeof value === 'function' ? value(currentView) : value;
-    setSearchParams(searchParams.set('support_view', newView));
-    window.scrollTo(0, 0);
-  };
+  // Sort views based on the order field
+  const orderedViews = useMemo(
+    () => SupportPageViews.flatMap((view) => [view, ...view.children]).sort((a, b) => a.order - b.order),
+    []
+  );
 
-  const dataMap: Partial<Record<SupportPageView, ReactNode>> = {
-    [SupportPageView.GENERAL]: <SupportOverview />,
-    [SupportPageView.PROJECTS]: <SupportProjects />,
-    [SupportPageView.PROJECT_TEAM]: <SupportTeam />,
-    [SupportPageView.SURVEYS]: <SupportSurveys />,
-    [SupportPageView.SAMPLING]: <SupportSampling />,
-    [SupportPageView.OBSERVATIONS]: <SupportObservations />,
-    [SupportPageView.TELEMETRY]: <SupportTelemetry />,
-    [SupportPageView.DATA]: <SupportData />
-  };
+  const currentIndex = currentView ? orderedViews.findIndex((v) => v.value === currentView.value) : 0;
+  const prevView = orderedViews[currentIndex - 1] || null;
+  const nextView = orderedViews[currentIndex + 1] || null;
+
+  // Get the JSX content to display for the activeView
+  const children = SupportPageViewMap[activeView];
 
   return (
     <>
       <PageHeader title="Support" />
       <Container maxWidth="xl" sx={{ py: 3 }}>
-        <AutocompleteSearchField
-          onSelect={() => {}}
-          onSearch={() => new Promise(() => 'a')}
-          fieldName=""
-          getOptionLabel={() => ''}
-          label="Search"
-        />
         <Stack direction="row" gap={3} component={Paper} sx={{ p: 3, mt: 3, height: '100%' }}>
           {/* Navigation Pane */}
           <Box width="300px" flexShrink={0}>
             <CustomToggleButtonGroup
-              views={views}
-              activeView={currentView}
+              views={SupportPageViews}
+              activeView={activeView}
               onViewChange={handleViewChange}
               orientation={'vertical'}
             />
@@ -200,10 +81,10 @@ export const SupportPage = () => {
             {/* Content */}
             <Box flex="1 1 auto">
               <Typography variant="h2" gutterBottom mb={3}>
-                {currentViewData?.label}
+                {currentView?.label}
               </Typography>
 
-              <Stack gap={2}>{dataMap[currentView]}</Stack>
+              <Stack gap={2}>{children}</Stack>
             </Box>
 
             {/* Chevron Arrows */}
@@ -211,7 +92,11 @@ export const SupportPage = () => {
               direction="row"
               alignItems="center"
               justifyContent={
-                currentIndex === 0 ? 'flex-end' : currentIndex === views.length - 1 ? 'flex-start' : 'space-between'
+                currentIndex === 0
+                  ? 'flex-end'
+                  : currentIndex === SupportPageViews.length - 1
+                  ? 'flex-start'
+                  : 'space-between'
               }
               sx={{ width: '100%', '& .MuiButton-root': { fontWeight: 700 } }}>
               {currentIndex > 0 && (
@@ -221,7 +106,7 @@ export const SupportPage = () => {
                   Previous
                 </Button>
               )}
-              {currentIndex < views.length - 1 && (
+              {currentIndex < SupportPageViews.length - 1 && (
                 <Button
                   onClick={() => handleViewChange(nextView.value)}
                   endIcon={<Icon path={mdiChevronRight} size={1} />}>
diff --git a/app/src/features/support/SupportPageView.tsx b/app/src/features/support/SupportPageView.tsx
new file mode 100644
index 0000000000..288f263ec8
--- /dev/null
+++ b/app/src/features/support/SupportPageView.tsx
@@ -0,0 +1,170 @@
+import {
+  mdiAccountSupervisor,
+  mdiAutoFix,
+  mdiCheckDecagram,
+  mdiDatabaseCog,
+  mdiEye,
+  mdiFileOutline,
+  mdiFolder,
+  mdiHome,
+  mdiInformationOutline,
+  mdiListBoxOutline,
+  mdiPaw,
+  mdiPineTree,
+  mdiWifiMarker
+} from '@mdi/js';
+import { ReactNode } from 'react';
+import { SupportOverview } from './views/content/overview/SupportOverview';
+import { SupportProjects } from './views/content/projects/SupportProjects';
+import { SupportAnimals } from './views/content/projects/surveys/data/animals/SupportAnimals';
+import { SupportHabitat } from './views/content/projects/surveys/data/habitat/SupportHabitat';
+import { SupportObservations } from './views/content/projects/surveys/data/observations/SupportObservations';
+import { SupportData } from './views/content/projects/surveys/data/SupportData';
+import { SupportTelemetry } from './views/content/projects/surveys/data/telemetry/SupportTelemetry';
+import { SupportFiles } from './views/content/projects/surveys/files/SupportFiles';
+import { SupportMetadata } from './views/content/projects/surveys/metadata/SupportMetadata';
+import { SupportSampling } from './views/content/projects/surveys/sampling/SupportSampling';
+import { SupportSurveys } from './views/content/projects/surveys/SupportSurveys';
+import { SupportTeam } from './views/content/projects/team/SupportTeam';
+import { SupportStandards } from './views/content/standards/SupportStandards';
+
+export enum SupportPageView {
+  overview = 'overview',
+  standards = 'standards',
+  animals = 'animals',
+  telemetry = 'telemetry',
+  observations = 'observations',
+  projects = 'projects',
+  surveys = 'surveys',
+  sampling = 'sampling',
+  data = 'data',
+  files = 'files',
+  metadata = 'metadata',
+  habitat = 'habitat',
+  team = 'team'
+}
+
+export interface ISupportPageView {
+  label: string;
+  value: SupportPageView;
+  icon: string;
+  order: number;
+  children: ISupportPageView[];
+}
+
+export type SupportPageParams = {
+  v: SupportPageView;
+};
+
+export const SupportPageViews: ISupportPageView[] = [
+  {
+    label: 'Overview',
+    value: SupportPageView.overview,
+    icon: mdiHome,
+    order: 1,
+    children: []
+  },
+  {
+    label: 'Projects',
+    value: SupportPageView.projects,
+    icon: mdiFolder,
+    order: 2,
+    children: [
+      {
+        label: 'Team',
+        value: SupportPageView.team,
+        icon: mdiAccountSupervisor,
+        order: 3,
+        children: []
+      },
+      {
+        label: 'Surveys',
+        value: SupportPageView.surveys,
+        icon: mdiListBoxOutline,
+        order: 4,
+        children: [
+          {
+            label: 'Sampling',
+            value: SupportPageView.sampling,
+            icon: mdiAutoFix,
+            order: 5,
+            children: []
+          },
+          {
+            label: 'Data',
+            value: SupportPageView.data,
+            icon: mdiDatabaseCog,
+            order: 6,
+            children: [
+              {
+                label: 'Observations',
+                value: SupportPageView.observations,
+                icon: mdiEye,
+                order: 7,
+                children: []
+              },
+              {
+                label: 'Animals',
+                value: SupportPageView.animals,
+                icon: mdiPaw,
+                order: 9,
+                children: []
+              },
+              {
+                label: 'Telemetry',
+                value: SupportPageView.telemetry,
+                icon: mdiWifiMarker,
+                order: 8,
+                children: []
+              },
+              {
+                label: 'Habitat Features',
+                value: SupportPageView.habitat,
+                icon: mdiPineTree,
+                order: 10,
+                children: []
+              }
+            ]
+          },
+          {
+            label: 'Files',
+            value: SupportPageView.files,
+            icon: mdiFileOutline,
+            order: 10,
+            children: []
+          },
+          {
+            label: 'Metadata',
+            value: SupportPageView.metadata,
+            icon: mdiInformationOutline,
+            order: 10,
+            children: []
+          }
+        ]
+      }
+    ]
+  },
+  {
+    label: 'Standards',
+    value: SupportPageView.standards,
+    icon: mdiCheckDecagram,
+    order: 9,
+    children: []
+  }
+];
+
+export const SupportPageViewMap: Partial<Record<SupportPageView, ReactNode>> = {
+  [SupportPageView.overview]: <SupportOverview />,
+  [SupportPageView.projects]: <SupportProjects />,
+  [SupportPageView.team]: <SupportTeam />,
+  [SupportPageView.surveys]: <SupportSurveys />,
+  [SupportPageView.sampling]: <SupportSampling />,
+  [SupportPageView.observations]: <SupportObservations />,
+  [SupportPageView.telemetry]: <SupportTelemetry />,
+  [SupportPageView.data]: <SupportData />,
+  [SupportPageView.files]: <SupportFiles />,
+  [SupportPageView.metadata]: <SupportMetadata />,
+  [SupportPageView.habitat]: <SupportHabitat />,
+  [SupportPageView.animals]: <SupportAnimals />,
+  [SupportPageView.standards]: <SupportStandards />
+};
diff --git a/app/src/features/support/content/projects/surveys/data/animals/SupportAnimals.tsx b/app/src/features/support/content/projects/surveys/data/animals/SupportAnimals.tsx
deleted file mode 100644
index 17a6586b02..0000000000
--- a/app/src/features/support/content/projects/surveys/data/animals/SupportAnimals.tsx
+++ /dev/null
@@ -1,67 +0,0 @@
-import Box from '@mui/material/Box';
-import Stack from '@mui/material/Stack';
-import Typography from '@mui/material/Typography';
-
-/**
- * Information about Animals
- *
- * @returns {*}
- */
-export const SupportAnimals = () => (
-  <Stack gap={5} mb={3}>
-    <Box>
-      <Typography key="project-components-2">
-        Animals are uniquely recognized individuals that you may have captured or marked. When you add an Animals to
-        your Survey, you create a profile for that individual that can be referenced in the future. This allows for all
-        information about the individual to be easily gathered.
-      </Typography>
-    </Box>
-
-    <Box>
-      <Typography fontWeight={700} variant="h4" mb={2}>
-        Species
-      </Typography>
-      <Typography gutterBottom key="gensims2">
-        The species is the taxon that you observed. If you cannot determine the species, you can use a higher taxon like
-        the genus or family.
-      </Typography>
-      <Typography gutterBottom key="gensims2">
-        Temporarily, the list of available species comes from the&nbsp;
-        <a href="itis.gov">Integrated Taxonomic Information System</a>. We are working with the Conservation Data Center
-        to integrate British Columbia's official taxonomy information and replace the Integrated Taxonomic Information
-        System.
-      </Typography>
-    </Box>
-
-    <Box>
-      <Typography fontWeight={700} variant="h4" mb={2}>
-        Sampling Information
-      </Typography>
-      <Typography gutterBottom key="gensims2">
-        You can link observations to sampling information&mdash;sites, techniques, and periods&mdash;by selecting the
-        period when the observation was made. You can still add observations without sampling information, but
-        observations without sampling sites are commonly considered incidentals and less reliable for rigorous analyses.
-      </Typography>
-    </Box>
-
-    <Box>
-      <Typography fontWeight={700} variant="h4" mb={2}>
-        Species-specific Attributes
-      </Typography>
-      <Typography gutterBottom key="gensims2">
-        You can add species-specific attributes (eg. life stage, sex, body condition) to your observations. The
-        attributes applicable to a species are defined in the Standards.
-      </Typography>
-    </Box>
-
-    <Box>
-      <Typography fontWeight={700} variant="h4" mb={2}>
-        Environmental Conditions
-      </Typography>
-      <Typography gutterBottom key="gensims2">
-        You can add environmental conditions (eg. temperature, cloud cover, wind speed) to your observations. Possible
-        environmental conditions are defined in the Standards.
-      </Typography>
-    </Box>
-  </Stack>
-);
diff --git a/app/src/features/support/components/AccordionSupportCard.tsx b/app/src/features/support/views/components/AccordionSupportCard.tsx
similarity index 100%
rename from app/src/features/support/components/AccordionSupportCard.tsx
rename to app/src/features/support/views/components/AccordionSupportCard.tsx
diff --git a/app/src/features/support/constants/SupportPageView.tsx b/app/src/features/support/views/constants/SupportPageView.tsx
similarity index 86%
rename from app/src/features/support/constants/SupportPageView.tsx
rename to app/src/features/support/views/constants/SupportPageView.tsx
index 8d8951790c..a503f6e6de 100644
--- a/app/src/features/support/constants/SupportPageView.tsx
+++ b/app/src/features/support/views/constants/SupportPageView.tsx
@@ -1,3 +1,4 @@
+
 export enum SupportPageView {
   GENERAL = 'GENERAL',
   STRUCTURE = 'STRUCTURE',
@@ -7,27 +8,25 @@ export enum SupportPageView {
   TELEMETRY = 'TELEMETRY',
   OBSERVATIONS = 'OBSERVATIONS',
   CONTACT = 'CONTACT',
-  PROJECTS = "PROJECTS",
+  PROJECTS = 'PROJECTS',
   SURVEYS = 'SURVEYS',
-  SAMPLING = "SAMPLING",
+  SAMPLING = 'SAMPLING',
   DATA = 'DATA',
   PROJECT_TEAM = 'PROJECT_TEAM',
   FILES = 'FILES',
   METADATA = 'METADATA',
-  HABITAT = "HABITAT"
+  HABITAT = 'HABITAT'
 }
 
 export interface ISupportPageView {
   label: string;
   value: SupportPageView;
   icon: string;
-  children: ISupportPageView[]
+  children: ISupportPageView[];
 }
 
-// export const SUPPORT_VIEW_KEY = 'support_view';
-
 export type SupportPageParams = {
-  support_view?: SupportPageView;
+  v: SupportPageView;
 };
 
 export enum MarkdownTypeSupportNameEnum {
diff --git a/app/src/features/support/content/overview/SupportOverview.tsx b/app/src/features/support/views/content/overview/SupportOverview.tsx
similarity index 100%
rename from app/src/features/support/content/overview/SupportOverview.tsx
rename to app/src/features/support/views/content/overview/SupportOverview.tsx
diff --git a/app/src/features/support/content/projects/SupportProjects.tsx b/app/src/features/support/views/content/projects/SupportProjects.tsx
similarity index 100%
rename from app/src/features/support/content/projects/SupportProjects.tsx
rename to app/src/features/support/views/content/projects/SupportProjects.tsx
diff --git a/app/src/features/support/content/projects/surveys/SupportSurveys.tsx b/app/src/features/support/views/content/projects/surveys/SupportSurveys.tsx
similarity index 100%
rename from app/src/features/support/content/projects/surveys/SupportSurveys.tsx
rename to app/src/features/support/views/content/projects/surveys/SupportSurveys.tsx
diff --git a/app/src/features/support/content/projects/surveys/data/SupportData.tsx b/app/src/features/support/views/content/projects/surveys/data/SupportData.tsx
similarity index 100%
rename from app/src/features/support/content/projects/surveys/data/SupportData.tsx
rename to app/src/features/support/views/content/projects/surveys/data/SupportData.tsx
diff --git a/app/src/features/support/views/content/projects/surveys/data/animals/SupportAnimals.tsx b/app/src/features/support/views/content/projects/surveys/data/animals/SupportAnimals.tsx
new file mode 100644
index 0000000000..b469896fec
--- /dev/null
+++ b/app/src/features/support/views/content/projects/surveys/data/animals/SupportAnimals.tsx
@@ -0,0 +1,48 @@
+import Box from '@mui/material/Box';
+import Stack from '@mui/material/Stack';
+import Typography from '@mui/material/Typography';
+
+/**
+ * Information about Animals
+ *
+ * @returns {*}
+ */
+export const SupportAnimals = () => (
+  <Stack gap={5} mb={3}>
+    <Box>
+      <Typography key="project-components-2">
+        Animals are known individuals that have captured or marked. When you add an Animals to your Survey, you're
+        establishing create a profile for that individual that can be referenced again in the future. This makes it
+        possible to gather all information about a specific individual.
+      </Typography>
+    </Box>
+
+    <Box>
+      <Typography fontWeight={700} variant="h4" mb={2}>
+        Captures
+      </Typography>
+      <Typography gutterBottom key="gensims2">
+        You can add information about where and when you captured an animal, along with any markings that you applied or
+        measurements that you recorded.
+      </Typography>
+    </Box>
+
+    <Box>
+      <Typography fontWeight={700} variant="h4" mb={2}>
+        Markings
+      </Typography>
+      <Typography gutterBottom key="gensims2">
+        You can add markings that you applied during a capture event.
+      </Typography>
+    </Box>
+
+    <Box>
+      <Typography fontWeight={700} variant="h4" mb={2}>
+        Mortalities
+      </Typography>
+      <Typography gutterBottom key="gensims2">
+        You can add information about where and when the animal died.
+      </Typography>
+    </Box>
+  </Stack>
+);
diff --git a/app/src/features/support/views/content/projects/surveys/data/habitat/SupportHabitat.tsx b/app/src/features/support/views/content/projects/surveys/data/habitat/SupportHabitat.tsx
new file mode 100644
index 0000000000..727f792673
--- /dev/null
+++ b/app/src/features/support/views/content/projects/surveys/data/habitat/SupportHabitat.tsx
@@ -0,0 +1,19 @@
+import Box from '@mui/material/Box';
+import Stack from '@mui/material/Stack';
+import Typography from '@mui/material/Typography';
+
+/**
+ * Information about Habitat
+ *
+ * @returns {*}
+ */
+export const SupportHabitat = () => (
+  <Stack gap={5} mb={3}>
+    <Box>
+      <Typography key="project-components-2">
+        We are working on supporting wildlife habitat feature data
+      </Typography>
+    </Box>
+
+  </Stack>
+);
diff --git a/app/src/features/support/content/projects/surveys/data/observations/SupportObservations.tsx b/app/src/features/support/views/content/projects/surveys/data/observations/SupportObservations.tsx
similarity index 98%
rename from app/src/features/support/content/projects/surveys/data/observations/SupportObservations.tsx
rename to app/src/features/support/views/content/projects/surveys/data/observations/SupportObservations.tsx
index 6e10b083d3..7d280259f2 100644
--- a/app/src/features/support/content/projects/surveys/data/observations/SupportObservations.tsx
+++ b/app/src/features/support/views/content/projects/surveys/data/observations/SupportObservations.tsx
@@ -12,7 +12,7 @@ export const SupportObservations = () => (
     <Box>
       <Typography key="project-components-2">
         Observations are counts of species at specific locations and times. The location is typically a sampling site,
-        but you can also add observations without a sampling site if you know the coordinate location.
+        but you can also add observations without a sampling site.
       </Typography>
     </Box>
 
diff --git a/app/src/features/support/content/projects/surveys/data/telemetry/SupportTelemetry.tsx b/app/src/features/support/views/content/projects/surveys/data/telemetry/SupportTelemetry.tsx
similarity index 96%
rename from app/src/features/support/content/projects/surveys/data/telemetry/SupportTelemetry.tsx
rename to app/src/features/support/views/content/projects/surveys/data/telemetry/SupportTelemetry.tsx
index c0a53c1400..bfaa2e602d 100644
--- a/app/src/features/support/content/projects/surveys/data/telemetry/SupportTelemetry.tsx
+++ b/app/src/features/support/views/content/projects/surveys/data/telemetry/SupportTelemetry.tsx
@@ -59,8 +59,8 @@ export const SupportTelemetry = () => (
         then the capture event for that animal when the device was put on.
       </Typography>
       <Typography gutterBottom>
-        When linking the animal and device, you'll reference the capture event when the device was put on, painting the
-        full picture of your telemetry data.
+        When linking the animal and device, you'll reference the capture event when the device was put on to paint the
+        full picture of your data.
       </Typography>
     </Box>
 
diff --git a/app/src/features/support/views/content/projects/surveys/files/SupportFiles.tsx b/app/src/features/support/views/content/projects/surveys/files/SupportFiles.tsx
new file mode 100644
index 0000000000..cbae6e1051
--- /dev/null
+++ b/app/src/features/support/views/content/projects/surveys/files/SupportFiles.tsx
@@ -0,0 +1,101 @@
+import Box from '@mui/material/Box';
+import List from '@mui/material/List';
+import ListItem from '@mui/material/ListItem';
+import Stack from '@mui/material/Stack';
+import Typography from '@mui/material/Typography';
+
+/**
+ * Information about Files
+ *
+ * @returns {*}
+ */
+export const SupportFiles = () => (
+  <Stack gap={5} mb={3}>
+    <Box>
+      <Typography key="project-components-2">
+        The sampling information in a Survey describes exactly where, when, and how you collected data. The term
+        sampling is used because we often collect just a sample of ecological data to represent the area of interest,
+        saving us from having to collect data everywhere.
+      </Typography>
+    </Box>
+
+    <Box>
+      <Typography fontWeight={700} variant="h4" mb={2}>
+        Sampling Site
+      </Typography>
+      <Typography gutterBottom key="gensims2">
+        A sampling site is a location where data is collected. Sampling sites can be points, transects, or areas,
+        depending on how you sampled:
+      </Typography>
+      <List sx={{ listStyleType: 'disc', '& .MuiListItem-root': { ml: 5 }, mb: 2 }}>
+        <ListItem sx={{ display: 'list-item' }}>
+          <Typography>
+            <strong>Points</strong> should represent fixed locations where data was collected
+          </Typography>
+        </ListItem>
+        <ListItem sx={{ display: 'list-item' }}>
+          <Typography>
+            <strong>Transects</strong> should represent paths that data were collected along, including flight paths
+          </Typography>
+        </ListItem>
+        <ListItem sx={{ display: 'list-item' }}>
+          <Typography>
+            <strong>Areas</strong> should represent bigger areas that data were collected in
+          </Typography>
+        </ListItem>
+      </List>
+      <Typography fontWeight={700} variant="h5" mb={2}>
+        Choose What Works
+      </Typography>
+      <Typography gutterBottom key="gensims2">
+        You might be wondering whether your site is a point, line, or area. We recommend using the option that you think
+        is best, given your objectives and understanding of the data. If your area is small enough to be considered a
+        point without losing information, you can keep it simple by using a point. You can add comments to your site to
+        save important details.
+      </Typography>
+    </Box>
+
+    <Box>
+      <Typography fontWeight={700} variant="h4" mb={2}>
+        Technique
+      </Typography>
+      <Typography gutterBottom key="gensims2">
+        Techniques represent the methods that you used to collect data at your sampling sites. Techniques can contain a
+        variety of information:
+      </Typography>
+      <List sx={{ listStyleType: 'disc', '& .MuiListItem-root': { ml: 5 } }}>
+        <ListItem sx={{ display: 'list-item' }}>
+          <Typography>
+            <strong>Method</strong> is the category of common methods that the technique belongs to, such as visual
+            encounter or camera trap
+          </Typography>
+        </ListItem>
+        <ListItem sx={{ display: 'list-item' }}>
+          <Typography>
+            <strong>Attributes</strong> describe how you implemented a method, like the model of your camera trap or
+            size of your net
+          </Typography>
+        </ListItem>
+        <ListItem sx={{ display: 'list-item' }}>
+          <Typography>
+            <strong>Attractants</strong> are tools used to increase your chances of observing the target species, such
+            as bait or light
+          </Typography>
+        </ListItem>
+      </List>
+    </Box>
+
+    <Box>
+      <Typography fontWeight={700} variant="h4" mb={2}>
+        Period
+      </Typography>
+      <Typography gutterBottom key="gensims2">
+        Periods represent precisely when you collected data, which you might call a sampling session. Using the terms
+        above, periods indicate &zwnj;
+        <strong>when you applied a technique at a sampling site</strong>. Precise start and end information is important
+        because it helps interpet the absence of species from your data&mdash;was the species missing because it didn't
+        occur at that time or the species wasn't being searched for at that time?
+      </Typography>
+    </Box>
+  </Stack>
+);
diff --git a/app/src/features/support/views/content/projects/surveys/metadata/SupportMetadata.tsx b/app/src/features/support/views/content/projects/surveys/metadata/SupportMetadata.tsx
new file mode 100644
index 0000000000..4b79f41a04
--- /dev/null
+++ b/app/src/features/support/views/content/projects/surveys/metadata/SupportMetadata.tsx
@@ -0,0 +1,101 @@
+import Box from '@mui/material/Box';
+import List from '@mui/material/List';
+import ListItem from '@mui/material/ListItem';
+import Stack from '@mui/material/Stack';
+import Typography from '@mui/material/Typography';
+
+/**
+ * Information about Metadata
+ *
+ * @returns {*}
+ */
+export const SupportMetadata = () => (
+  <Stack gap={5} mb={3}>
+    <Box>
+      <Typography key="project-components-2">
+        The sampling information in a Survey describes exactly where, when, and how you collected data. The term
+        sampling is used because we often collect just a sample of ecological data to represent the area of interest,
+        saving us from having to collect data everywhere.
+      </Typography>
+    </Box>
+
+    <Box>
+      <Typography fontWeight={700} variant="h4" mb={2}>
+        Sampling Site
+      </Typography>
+      <Typography gutterBottom key="gensims2">
+        A sampling site is a location where data is collected. Sampling sites can be points, transects, or areas,
+        depending on how you sampled:
+      </Typography>
+      <List sx={{ listStyleType: 'disc', '& .MuiListItem-root': { ml: 5 }, mb: 2 }}>
+        <ListItem sx={{ display: 'list-item' }}>
+          <Typography>
+            <strong>Points</strong> should represent fixed locations where data was collected
+          </Typography>
+        </ListItem>
+        <ListItem sx={{ display: 'list-item' }}>
+          <Typography>
+            <strong>Transects</strong> should represent paths that data were collected along, including flight paths
+          </Typography>
+        </ListItem>
+        <ListItem sx={{ display: 'list-item' }}>
+          <Typography>
+            <strong>Areas</strong> should represent bigger areas that data were collected in
+          </Typography>
+        </ListItem>
+      </List>
+      <Typography fontWeight={700} variant="h5" mb={2}>
+        Choose What Works
+      </Typography>
+      <Typography gutterBottom key="gensims2">
+        You might be wondering whether your site is a point, line, or area. We recommend using the option that you think
+        is best, given your objectives and understanding of the data. If your area is small enough to be considered a
+        point without losing information, you can keep it simple by using a point. You can add comments to your site to
+        save important details.
+      </Typography>
+    </Box>
+
+    <Box>
+      <Typography fontWeight={700} variant="h4" mb={2}>
+        Technique
+      </Typography>
+      <Typography gutterBottom key="gensims2">
+        Techniques represent the methods that you used to collect data at your sampling sites. Techniques can contain a
+        variety of information:
+      </Typography>
+      <List sx={{ listStyleType: 'disc', '& .MuiListItem-root': { ml: 5 } }}>
+        <ListItem sx={{ display: 'list-item' }}>
+          <Typography>
+            <strong>Method</strong> is the category of common methods that the technique belongs to, such as visual
+            encounter or camera trap
+          </Typography>
+        </ListItem>
+        <ListItem sx={{ display: 'list-item' }}>
+          <Typography>
+            <strong>Attributes</strong> describe how you implemented a method, like the model of your camera trap or
+            size of your net
+          </Typography>
+        </ListItem>
+        <ListItem sx={{ display: 'list-item' }}>
+          <Typography>
+            <strong>Attractants</strong> are tools used to increase your chances of observing the target species, such
+            as bait or light
+          </Typography>
+        </ListItem>
+      </List>
+    </Box>
+
+    <Box>
+      <Typography fontWeight={700} variant="h4" mb={2}>
+        Period
+      </Typography>
+      <Typography gutterBottom key="gensims2">
+        Periods represent precisely when you collected data, which you might call a sampling session. Using the terms
+        above, periods indicate &zwnj;
+        <strong>when you applied a technique at a sampling site</strong>. Precise start and end information is important
+        because it helps interpet the absence of species from your data&mdash;was the species missing because it didn't
+        occur at that time or the species wasn't being searched for at that time?
+      </Typography>
+    </Box>
+  </Stack>
+);
diff --git a/app/src/features/support/content/projects/surveys/sampling/SupportSampling.tsx b/app/src/features/support/views/content/projects/surveys/sampling/SupportSampling.tsx
similarity index 92%
rename from app/src/features/support/content/projects/surveys/sampling/SupportSampling.tsx
rename to app/src/features/support/views/content/projects/surveys/sampling/SupportSampling.tsx
index 909fe6fd0e..db3f84b3cb 100644
--- a/app/src/features/support/content/projects/surveys/sampling/SupportSampling.tsx
+++ b/app/src/features/support/views/content/projects/surveys/sampling/SupportSampling.tsx
@@ -13,9 +13,9 @@ export const SupportSampling = () => (
   <Stack gap={5} mb={3}>
     <Box>
       <Typography key="project-components-2">
-        The sampling information in a Survey describes exactly where, when, and how you collected data within your area
-        of interest. The term sampling is used because we often collect just a sample of ecological data to represent
-        the area of interest, saving us from having to collect data everywhere.
+        The sampling information in a Survey describes exactly where, when, and how you collected data. The term
+        sampling is used because we often collect just a sample of ecological data to represent the area of interest,
+        saving us from having to collect data everywhere.
       </Typography>
     </Box>
 
@@ -60,8 +60,8 @@ export const SupportSampling = () => (
         Technique
       </Typography>
       <Typography gutterBottom key="gensims2">
-        Techniques represent the methods that you used to collect data at your sampling sites. Techniques can contain a variety of
-        information:
+        Techniques represent the methods that you used to collect data at your sampling sites. Techniques can contain a
+        variety of information:
       </Typography>
       <List sx={{ listStyleType: 'disc', '& .MuiListItem-root': { ml: 5 } }}>
         <ListItem sx={{ display: 'list-item' }}>
diff --git a/app/src/features/support/content/projects/team/SupportTeam.tsx b/app/src/features/support/views/content/projects/team/SupportTeam.tsx
similarity index 100%
rename from app/src/features/support/content/projects/team/SupportTeam.tsx
rename to app/src/features/support/views/content/projects/team/SupportTeam.tsx
diff --git a/app/src/features/support/standards/SupportPageStandards.tsx b/app/src/features/support/views/content/standards/SupportStandards.tsx
similarity index 98%
rename from app/src/features/support/standards/SupportPageStandards.tsx
rename to app/src/features/support/views/content/standards/SupportStandards.tsx
index 29e1cedee5..0e4f9685ee 100644
--- a/app/src/features/support/standards/SupportPageStandards.tsx
+++ b/app/src/features/support/views/content/standards/SupportStandards.tsx
@@ -5,7 +5,7 @@ import Stack from '@mui/material/Stack';
 import Typography from '@mui/material/Typography';
 import { AccordionStandardCard } from 'features/standards/view/components/AccordionStandardCard';
 
-export const SupportPageStandards = () => {
+export const SupportStandards = () => {
   return (
     <Box>
       <Typography variant="h2" gutterBottom>
diff --git a/app/src/features/support/data/animals.tsx b/app/src/features/support/views/data/animals.tsx
similarity index 100%
rename from app/src/features/support/data/animals.tsx
rename to app/src/features/support/views/data/animals.tsx
diff --git a/app/src/features/support/data/contact.tsx b/app/src/features/support/views/data/contact.tsx
similarity index 100%
rename from app/src/features/support/data/contact.tsx
rename to app/src/features/support/views/data/contact.tsx
diff --git a/app/src/features/support/data/dataStandards.tsx b/app/src/features/support/views/data/dataStandards.tsx
similarity index 100%
rename from app/src/features/support/data/dataStandards.tsx
rename to app/src/features/support/views/data/dataStandards.tsx
diff --git a/app/src/features/support/data/foundation.tsx b/app/src/features/support/views/data/foundation.tsx
similarity index 100%
rename from app/src/features/support/data/foundation.tsx
rename to app/src/features/support/views/data/foundation.tsx
diff --git a/app/src/features/support/data/observations.tsx b/app/src/features/support/views/data/observations.tsx
similarity index 100%
rename from app/src/features/support/data/observations.tsx
rename to app/src/features/support/views/data/observations.tsx
diff --git a/app/src/features/support/data/structure.tsx b/app/src/features/support/views/data/structure.tsx
similarity index 100%
rename from app/src/features/support/data/structure.tsx
rename to app/src/features/support/views/data/structure.tsx
diff --git a/app/src/features/support/data/telemetry.tsx b/app/src/features/support/views/data/telemetry.tsx
similarity index 100%
rename from app/src/features/support/data/telemetry.tsx
rename to app/src/features/support/views/data/telemetry.tsx
diff --git a/app/src/features/support/data/types.tsx b/app/src/features/support/views/data/types.tsx
similarity index 100%
rename from app/src/features/support/data/types.tsx
rename to app/src/features/support/views/data/types.tsx
diff --git a/app/src/features/support/general/SupportPageGeneral.tsx b/app/src/features/support/views/general/SupportPageGeneral.tsx
similarity index 100%
rename from app/src/features/support/general/SupportPageGeneral.tsx
rename to app/src/features/support/views/general/SupportPageGeneral.tsx