diff --git a/src/App/components/Breadcrumb/__snapshots__/index.test.js.snap b/src/App/components/Breadcrumb/__snapshots__/index.test.js.snap
index 8a346a6e97..d8af195639 100644
--- a/src/App/components/Breadcrumb/__snapshots__/index.test.js.snap
+++ b/src/App/components/Breadcrumb/__snapshots__/index.test.js.snap
@@ -1,74 +1,82 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Component: Breadcrumb renders breadcrumb with the provided items in the items prop 1`] = `
-<ol
-  className="breadcrumb"
->
-  <li
-    key="0"
+<nav>
+  <ol
+    className="breadcrumb"
   >
-    <span>
-      test
-    </span>
-  </li>
-</ol>
+    <li
+      key="0"
+    >
+      <span>
+        test
+      </span>
+    </li>
+  </ol>
+</nav>
 `;
 
 exports[`Component: Breadcrumb renders breadcrumb with the provided items wrapped in anchor tags when href is provided in the items prop 1`] = `
-<ol
-  className="breadcrumb"
->
-  <li
-    key="0"
+<nav>
+  <ol
+    className="breadcrumb"
   >
-    <a
-      href="www.example.com"
+    <li
+      key="0"
     >
-      test
-    </a>
-  </li>
-</ol>
+      <a
+        href="www.example.com"
+      >
+        test
+      </a>
+    </li>
+  </ol>
+</nav>
 `;
 
 exports[`Component: Breadcrumb renders multiple breadcrumbs when provided in the items prop 1`] = `
-<ol
-  className="breadcrumb"
->
-  <li
-    key="0"
-  >
-    <span>
-      test #1
-    </span>
-  </li>
-  <li
-    key="1"
-  >
-    <span>
-      test #2
-    </span>
-  </li>
-  <li
-    key="2"
+<nav>
+  <ol
+    className="breadcrumb"
   >
-    <span>
-      test #3
-    </span>
-  </li>
-  <li
-    key="3"
-  >
-    <span>
-      test #4
-    </span>
-  </li>
-</ol>
+    <li
+      key="0"
+    >
+      <span>
+        test #1
+      </span>
+    </li>
+    <li
+      key="1"
+    >
+      <span>
+        test #2
+      </span>
+    </li>
+    <li
+      key="2"
+    >
+      <span>
+        test #3
+      </span>
+    </li>
+    <li
+      key="3"
+    >
+      <span>
+        test #4
+      </span>
+    </li>
+  </ol>
+</nav>
 `;
 
 exports[`Component: Breadcrumb renders with default items when no items is provided through items prop 1`] = `
-<ol
-  className="breadcrumb"
->
-  <DefaultItems />
-</ol>
+<nav>
+  <ol
+    className="breadcrumb"
+  >
+    <DefaultItems />
+  </ol>
+</nav>
 `;
diff --git a/src/App/components/Breadcrumb/index.js b/src/App/components/Breadcrumb/index.js
index 62c6a849c9..c290b70854 100644
--- a/src/App/components/Breadcrumb/index.js
+++ b/src/App/components/Breadcrumb/index.js
@@ -17,9 +17,11 @@ const DefaultItems = () => (
 );
 
 const Breadcrumb = ({ items }) => (
-    <ol className="breadcrumb">
-        {items ? _renderItems(items) : <DefaultItems />}
-    </ol>
+    <nav>
+        <ol className="breadcrumb">
+            {items ? _renderItems(items) : <DefaultItems />}
+        </ol>
+    </nav>
 );
 
 Breadcrumb.propTypes = {