diff --git a/src/components/shared/Table.tsx b/src/components/shared/Table.tsx
index 8a3c7e88c3..dca3da8b60 100644
--- a/src/components/shared/Table.tsx
+++ b/src/components/shared/Table.tsx
@@ -235,6 +235,13 @@ const TableHeadRows = ({ forceDeselectAll }: { forceDeselectAll: () => unknown }
 		dispatch(updatePages());
 	};
 
+	const handleSortKeyDown = (event: React.KeyboardEvent, colName: string) => {
+		if (event.key === "Enter" || event.key === " ") {
+			event.preventDefault();
+			sortByColumn(colName);
+		}
+	};
+
 	return (
 		<>
 			{columns.map((column, key) =>
@@ -245,17 +252,34 @@ const TableHeadRows = ({ forceDeselectAll }: { forceDeselectAll: () => unknown }
 							"col-sort": reverse !== "NONE" && !!sortBy && column.name === sortBy,
 							sortable: true,
 						})}
-						onClick={() => sortByColumn(column.name)}
+						aria-sort={
+							column.name === sortBy
+								? reverse === "ASC"
+									? "ascending"
+									: reverse === "DESC"
+										? "descending"
+										: "none"
+								: "none"
+						}
 					>
-						<span>
+						<span
+							role="button"
+							tabIndex={0}
+							onClick={() => sortByColumn(column.name)}
+							onKeyDown={event => handleSortKeyDown(event, column.name)}
+						>
 							<span>{t(column.label)}</span>
-							<div>
-								<LuChevronUp
-									className={cn("chevron-up", { active: reverse === "ASC" && column.name === sortBy })}
-								/>
-								<LuChevronDown
-									className={cn("chevron-down", { active: reverse === "DESC" && column.name === sortBy })}
-								/>
+							<div className={cn({ "chevron-pair": !(column.name === sortBy && reverse !== "NONE") })}>
+								{!(column.name === sortBy && reverse === "DESC") && (
+									<LuChevronUp
+										className={cn("chevron-up", { active: reverse === "ASC" && column.name === sortBy })}
+									/>
+								)}
+								{!(column.name === sortBy && reverse === "ASC") && (
+									<LuChevronDown
+										className={cn("chevron-down", { active: reverse === "DESC" && column.name === sortBy })}
+									/>
+								)}
 							</div>
 						</span>
 					</th>
diff --git a/src/styles/components/_tables.scss b/src/styles/components/_tables.scss
index b4e43ab170..d9e839f038 100644
--- a/src/styles/components/_tables.scss
+++ b/src/styles/components/_tables.scss
@@ -181,20 +181,44 @@
                 justify-content: center;
 
                 .chevron-up {
-                    position: relative;
-                    top: 3px;
                     color: variables.$color-gray;
                 }
                 .chevron-down {
-                    position: relative;
-                    top: -3px;
                     color: variables.$color-gray;
                 }
                 .active {
                     color: variables.$color-darkgray;
                 }
+
+                &.chevron-pair {
+                    visibility: hidden;
+
+                    .chevron-up{
+                        position: relative;
+                        top: 3px;
+                    }
+                    .chevron-down {
+                        position: relative;
+                        top: -3px;
+                    }
+                }
             }
         }
+
+        &.sortable:hover div.chevron-pair,
+        &.sortable:focus-within div.chevron-pair {
+            visibility: visible;
+        }
+
+        &.sortable span[role="button"] {
+            outline: none;
+        }
+
+        &.sortable:focus-within {
+            outline-style: auto;
+            outline-color: -webkit-focus-ring-color;
+            outline-offset: -2px;
+        }
     }
 
     tr {