diff --git a/site/content/docs/5.2/components/navbar.md b/site/content/docs/5.2/components/navbar.md
index 19310c0d25..4f0fb9cc88 100644
--- a/site/content/docs/5.2/components/navbar.md
+++ b/site/content/docs/5.2/components/navbar.md
@@ -49,7 +49,7 @@ Here's an example of all the sub-components included in a responsive dark-themed
   <div class="container-fluid">
     <div class="navbar-brand">
       <a class="stretched-link" href="#">
-        <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted" loading="lazy">
+        <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted - Back to Home" loading="lazy">
       </a>
     </div>
     <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
@@ -101,7 +101,7 @@ The `.navbar-brand` can be used to contain most elements, but an anchor works be
     <div class="container-fluid">
       <div class="navbar-brand">
         <a class="stretched-link" href="#">
-          <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted" loading="lazy">
+          <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted - Back to Home" loading="lazy">
         </a>
         <h1 class="title">Navbar</h1>
       </div>
@@ -115,7 +115,7 @@ The `.navbar-brand` can be used to contain most elements, but an anchor works be
     <div class="container-fluid">
       <div class="navbar-brand">
         <span class="stretched-link">
-          <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted" loading="lazy">
+          <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted - Back to Home" loading="lazy">
         </span>
         <h1 class="title">Navbar</h1>
       </div>
@@ -138,7 +138,7 @@ Please note that you should also add the `aria-current` attribute on the active
   <div class="container-fluid">
     <div class="navbar-brand">
       <a class="stretched-link" href="#">
-        <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted" loading="lazy">
+        <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted - Back to Home" loading="lazy">
       </a>
     </div>
     <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
@@ -171,7 +171,7 @@ And because we use classes for our navs, you can avoid the list-based approach e
   <div class="container-fluid">
     <div class="navbar-brand">
       <a class="stretched-link" href="#">
-        <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted" loading="lazy">
+        <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted - Back to Home" loading="lazy">
       </a>
     </div>
     <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
@@ -196,7 +196,7 @@ You can also use dropdowns in your navbar. Dropdown menus require a wrapping ele
   <div class="container-fluid">
     <div class="navbar-brand">
       <a class="stretched-link" href="#">
-        <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted" loading="lazy">
+        <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted - Back to Home" loading="lazy">
       </a>
     </div>
     <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
@@ -251,7 +251,7 @@ Immediate child elements of `.navbar` use flex layout<!-- Boosted mod: no justif
   <div class="container-fluid">
     <div class="navbar-brand me-auto">
       <a class="stretched-link" href="#">
-        <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted" loading="lazy">
+        <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted - Back to Home" loading="lazy">
       </a>
     </div>
     <form class="d-flex navbar-item" role="search">
@@ -307,7 +307,7 @@ Mix and match with other components and utilities as needed.
   <div class="container-fluid">
     <div class="navbar-brand">
       <a class="stretched-link" href="#">
-        <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted" loading="lazy">
+        <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted - Back to Home" loading="lazy">
       </a>
     </div>
     <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarText" aria-controls="navbarText" aria-expanded="false" aria-label="Toggle navigation">
@@ -355,7 +355,7 @@ Although it's not required, you can wrap a navbar in a `.container` to center it
     <div class="container-fluid">
       <div class="navbar-brand">
         <a class="stretched-link" href="#">
-          <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted" loading="lazy">
+          <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted - Back to Home" loading="lazy">
         </a>
       </div>
     </div>
@@ -370,7 +370,7 @@ Use any of the responsive containers to change how wide the content in your navb
   <div class="container-md">
     <div class="navbar-brand">
       <a class="stretched-link" href="#">
-        <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted" loading="lazy">
+        <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted - Back to Home" loading="lazy">
       </a>
     </div>
   </div>
@@ -388,7 +388,7 @@ Fixed navbars use `position: fixed`, meaning they're pulled from the normal flow
   <div class="container-fluid">
     <div class="navbar-brand">
       <a class="stretched-link" href="#">
-        <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted" loading="lazy">
+        <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted - Back to Home" loading="lazy">
       </a>
       <h1 class="title">Default</h1>
     </div>
@@ -401,7 +401,7 @@ Fixed navbars use `position: fixed`, meaning they're pulled from the normal flow
   <div class="container-fluid">
     <div class="navbar-brand">
       <a class="stretched-link" href="#">
-        <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted" loading="lazy">
+        <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted - Back to Home" loading="lazy">
       </a>
       <h1 class="title">Fixed top</h1>
     </div>
@@ -414,7 +414,7 @@ Fixed navbars use `position: fixed`, meaning they're pulled from the normal flow
   <div class="container-fluid">
     <div class="navbar-brand">
       <a class="stretched-link" href="#">
-        <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted" loading="lazy">
+        <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted - Back to Home" loading="lazy">
       </a>
       <h1 class="title">Fixed bottom</h1>
     </div>
@@ -427,7 +427,7 @@ Fixed navbars use `position: fixed`, meaning they're pulled from the normal flow
   <div class="container-fluid">
     <div class="navbar-brand">
       <a class="stretched-link" href="#">
-        <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted" loading="lazy">
+        <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted - Back to Home" loading="lazy">
       </a>
       <h1 class="title">Sticky top</h1>
     </div>
@@ -440,7 +440,7 @@ Fixed navbars use `position: fixed`, meaning they're pulled from the normal flow
   <div class="container-fluid">
     <div class="navbar-brand">
       <a class="stretched-link" href="#">
-        <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted" loading="lazy">
+        <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted - Back to Home" loading="lazy">
       </a>
       <h1 class="title">Sticky bottom</h1>
     </div>
diff --git a/site/content/docs/5.2/components/scrollspy.md b/site/content/docs/5.2/components/scrollspy.md
index e4ed700bdf..b86be4f1c9 100644
--- a/site/content/docs/5.2/components/scrollspy.md
+++ b/site/content/docs/5.2/components/scrollspy.md
@@ -35,7 +35,7 @@ Scroll the area below the navbar and watch the active class change. Open the dro
 <div class="bd-example">
   <nav id="navbar-example2" class="navbar px-3 mb-3">
     <a class="navbar-brand" href="#">
-      <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" role="img" alt="Boosted" loading="lazy">
+      <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" role="img" alt="Boosted - Back to Home" loading="lazy">
     </a>
     <ul class="nav nav-pills">
       <li class="nav-item">
@@ -72,7 +72,7 @@ Scroll the area below the navbar and watch the active class change. Open the dro
 ```html
 <nav id="navbar-example2" class="navbar px-3 mb-3">
   <a class="navbar-brand" href="#">
-    <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" role="img" alt="Boosted" loading="lazy">
+    <img src="/docs/{{< param docs_version >}}/assets/brand/orange-logo.svg" width="50" height="50" role="img" alt="Boosted - Back to Home" loading="lazy">
   </a>
   <ul class="nav nav-pills">
     <li class="nav-item">
diff --git a/site/layouts/partials/docs-navbar.html b/site/layouts/partials/docs-navbar.html
index f668a865aa..5da051d1ea 100644
--- a/site/layouts/partials/docs-navbar.html
+++ b/site/layouts/partials/docs-navbar.html
@@ -3,7 +3,7 @@
     <div class="container-xxl">
       <div class="navbar-brand me-auto me-lg-4">
         <a class="stretched-link" href="/">
-          <img src="/docs/{{ .Site.Params.docs_version }}/assets/brand/orange-logo.svg" width="50" height="50" alt="Back to homepage" loading="lazy">
+          <img src="/docs/{{ .Site.Params.docs_version }}/assets/brand/orange-logo.svg" width="50" height="50" alt="Boosted - Back to Home" loading="lazy">
         </a>
       </div>