diff --git a/src/renderer/common/components/dialog/publicationInfos/tag/tagButton.tsx b/src/renderer/common/components/dialog/publicationInfos/tag/tagButton.tsx
index a56fdd229..50dcd7880 100644
--- a/src/renderer/common/components/dialog/publicationInfos/tag/tagButton.tsx
+++ b/src/renderer/common/components/dialog/publicationInfos/tag/tagButton.tsx
@@ -54,6 +54,28 @@ export const TagButton: React.FC<React.PropsWithChildren<IProps>> = (props) => {
                         search: `?focus=tags&value=${encodeURIComponent_RFC3986(tag as string)}`,
                     }}
                     state={{ displayType: "list" }}
+                    onClick={(e) => {
+                        if (e.altKey || e.shiftKey || e.ctrlKey) {
+                            e.preventDefault();
+                            e.currentTarget.click();
+                        }
+                    }}
+                    onKeyDown={(e) => {
+                        // if (e.code === "Space") {
+                        if (e.key === " " || e.altKey || e.ctrlKey) {
+                            e.preventDefault(); // prevent scroll
+                        }
+                    }}
+                    onKeyUp={(e) => {
+                        // Includes screen reader tests:
+                        // if (e.code === "Space") { WORKS
+                        // if (e.key === "Space") { DOES NOT WORK
+                        // if (e.key === "Enter") { WORKS
+                        if (e.key === " ") { // WORKS
+                            e.preventDefault();
+                            e.currentTarget.click();
+                        }
+                    }}
                 >
                     {tag as string}
                 </Link>
@@ -115,7 +137,7 @@ export const TagReaderButton: React.FC<React.PropsWithChildren<IBaseProps>> = (p
     } else {
         tagString = tag.name;
     }
-/* 
+/*
     if (pubId && onClickDeleteCb && __) {
         button = (
             <>
diff --git a/src/renderer/library/components/catalog/Header.tsx b/src/renderer/library/components/catalog/Header.tsx
index 95ee3d983..6be309d07 100644
--- a/src/renderer/library/components/catalog/Header.tsx
+++ b/src/renderer/library/components/catalog/Header.tsx
@@ -53,7 +53,7 @@ class Header extends React.Component<IProps, undefined> {
         return (
             <SecondaryHeader>
                 <div>
-                    <p style={{fontWeight: "600", margin: "0 0 5px"}}>{__("header.viewMode")}</p>
+                    <p style={{ fontWeight: "600", margin: "0 0 5px" }}>{__("header.viewMode")}</p>
                     <div style={{ display: "flex", gap: "10px" }}>
                         <Link
                             to={this.props.location}
@@ -66,6 +66,28 @@ class Header extends React.Component<IProps, undefined> {
                             title={__("header.gridTitle")}
                             aria-pressed={displayType === DisplayType.Grid}
                             role={"button"}
+                            onClick={(e) => {
+                                if (e.altKey || e.shiftKey || e.ctrlKey) {
+                                    e.preventDefault();
+                                    e.currentTarget.click();
+                                }
+                            }}
+                            onKeyDown={(e) => {
+                                // if (e.code === "Space") {
+                                if (e.key === " " || e.altKey || e.ctrlKey) {
+                                    e.preventDefault(); // prevent scroll
+                                }
+                            }}
+                            onKeyUp={(e) => {
+                                // Includes screen reader tests:
+                                // if (e.code === "Space") { WORKS
+                                // if (e.key === "Space") { DOES NOT WORK
+                                // if (e.key === "Enter") { WORKS
+                                if (e.key === " ") { // WORKS
+                                    e.preventDefault();
+                                    e.currentTarget.click();
+                                }
+                            }}
                         >
                             {(displayType === DisplayType.Grid) ?
                                 <SVG svg={CheckIcon} ariaHidden /> :
@@ -84,6 +106,28 @@ class Header extends React.Component<IProps, undefined> {
                             title={__("header.listTitle")}
                             aria-pressed={displayType === DisplayType.List}
                             role={"button"}
+                            onClick={(e) => {
+                                if (e.altKey || e.shiftKey || e.ctrlKey) {
+                                    e.preventDefault();
+                                    e.currentTarget.click();
+                                }
+                            }}
+                            onKeyDown={(e) => {
+                                // if (e.code === "Space") {
+                                if (e.key === " " || e.altKey || e.ctrlKey) {
+                                    e.preventDefault(); // prevent scroll
+                                }
+                            }}
+                            onKeyUp={(e) => {
+                                // Includes screen reader tests:
+                                // if (e.code === "Space") { WORKS
+                                // if (e.key === "Space") { DOES NOT WORK
+                                // if (e.key === "Enter") { WORKS
+                                if (e.key === " ") { // WORKS
+                                    e.preventDefault();
+                                    e.currentTarget.click();
+                                }
+                            }}
                         >
                             {(displayType === DisplayType.List) ?
                                 <SVG svg={CheckIcon} ariaHidden /> :
diff --git a/src/renderer/library/components/layout/BreadCrumb.tsx b/src/renderer/library/components/layout/BreadCrumb.tsx
index 0c6fc820e..eda8c3b59 100644
--- a/src/renderer/library/components/layout/BreadCrumb.tsx
+++ b/src/renderer/library/components/layout/BreadCrumb.tsx
@@ -59,6 +59,28 @@ const LinkItemBreadcrumb = ({item: {name, path}, isTheFirstOne}: {item: IBreadCr
         state={{ displayType: (location.state && (location.state as IRouterLocationState).displayType) ? (location.state as IRouterLocationState).displayType : DisplayType.Grid }}
         title={name}
         className={stylesButtons.button_transparency}
+        onClick={(e) => {
+            if (e.altKey || e.shiftKey || e.ctrlKey) {
+                e.preventDefault();
+                e.currentTarget.click();
+            }
+        }}
+        onKeyDown={(e) => {
+            // if (e.code === "Space") {
+            if (e.key === " " || e.altKey || e.ctrlKey) {
+                e.preventDefault(); // prevent scroll
+            }
+        }}
+        onKeyUp={(e) => {
+            // Includes screen reader tests:
+            // if (e.code === "Space") { WORKS
+            // if (e.key === "Space") { DOES NOT WORK
+            // if (e.key === "Enter") { WORKS
+            if (e.key === " ") { // WORKS
+                e.preventDefault();
+                e.currentTarget.click();
+            }
+        }}
     >
         {isTheFirstOne ? <SVG ariaHidden={true} svg={BreacrmbsNavIcon} /> : <></>}
         <p >{name}</p>
@@ -202,7 +224,7 @@ const BreadCrumb = () => {
                     </li>
                 }
                 {
-                    // displayFullBreadcrumb && 
+                    // displayFullBreadcrumb &&
                     // (<li key={between.length+2} id="breadcrumb-li-plus">
                     //     <button onClick={() => {
                     //         setDisplayFullBreadcrumb(false);
diff --git a/src/renderer/library/components/layout/LibraryHeader.tsx b/src/renderer/library/components/layout/LibraryHeader.tsx
index 18aa7cf5e..351633af6 100644
--- a/src/renderer/library/components/layout/LibraryHeader.tsx
+++ b/src/renderer/library/components/layout/LibraryHeader.tsx
@@ -158,12 +158,34 @@ class Header extends React.Component<IProps, undefined> {
             <li className={classNames(...styleClasses, "R2_CSS_CLASS__FORCE_NO_FOCUS_OUTLINE")} key={index}>
                 <Link
                     to={nextLocation}
-                    state = {{displayType: (nextLocation.state && (nextLocation.state as IRouterLocationState).displayType) ? (nextLocation.state as IRouterLocationState).displayType : DisplayType.Grid}}
+                    state={{ displayType: (nextLocation.state && (nextLocation.state as IRouterLocationState).displayType) ? (nextLocation.state as IRouterLocationState).displayType : DisplayType.Grid }}
                     replace={true}
                     aria-pressed={active}
                     role={"button"}
                     className={classNames(active ? stylesButtons.button_nav_primary : "", !active ? "R2_CSS_CLASS__FORCE_NO_FOCUS_OUTLINE" : "")}
                     title={item.label}
+                    onClick={(e) => {
+                        if (e.altKey || e.shiftKey || e.ctrlKey) {
+                            e.preventDefault();
+                            e.currentTarget.click();
+                        }
+                    }}
+                    onKeyDown={(e) => {
+                        // if (e.code === "Space") {
+                        if (e.key === " " || e.altKey || e.ctrlKey) {
+                            e.preventDefault(); // prevent scroll
+                        }
+                    }}
+                    onKeyUp={(e) => {
+                        // Includes screen reader tests:
+                        // if (e.code === "Space") { WORKS
+                        // if (e.key === "Space") { DOES NOT WORK
+                        // if (e.key === "Enter") { WORKS
+                        if (e.key === " ") { // WORKS
+                            e.preventDefault();
+                            e.currentTarget.click();
+                        }
+                    }}
                 >
                     <SVG ariaHidden svg={item.svg} />
                     <h3>{item.label}</h3>
diff --git a/src/renderer/library/components/layout/LibraryLayout.tsx b/src/renderer/library/components/layout/LibraryLayout.tsx
index 5c8c38ec4..edddd702b 100644
--- a/src/renderer/library/components/layout/LibraryLayout.tsx
+++ b/src/renderer/library/components/layout/LibraryLayout.tsx
@@ -227,9 +227,31 @@ class LibraryLayout extends React.Component<IProps, undefined> {
                         ...this.props.location,
                         pathname: route,
                     }}
-                    style={{width: "20px"}}
+                    style={{ width: "20px"}}
                     state = {{displayType: (this.props.location.state && (this.props.location.state as IRouterLocationState).displayType) ? (this.props.location.state as IRouterLocationState).displayType : DisplayType.Grid}}
                     className={stylesButtons.button_nav_tertiary}
+                    onClick={(e) => {
+                        if (e.altKey || e.shiftKey || e.ctrlKey) {
+                            e.preventDefault();
+                            e.currentTarget.click();
+                        }
+                    }}
+                    onKeyDown={(e) => {
+                        // if (e.code === "Space") {
+                        if (e.key === " " || e.altKey || e.ctrlKey) {
+                            e.preventDefault(); // prevent scroll
+                        }
+                    }}
+                    onKeyUp={(e) => {
+                        // Includes screen reader tests:
+                        // if (e.code === "Space") { WORKS
+                        // if (e.key === "Space") { DOES NOT WORK
+                        // if (e.key === "Enter") { WORKS
+                        if (e.key === " ") { // WORKS
+                            e.preventDefault();
+                            e.currentTarget.click();
+                        }
+                    }}
                 >
                     <SVG svg={AvatarIcon} title={__("opds.shelf")} />
                 </Link>
@@ -267,9 +289,31 @@ class LibraryLayout extends React.Component<IProps, undefined> {
                         ...this.props.location,
                         pathname: route,
                     }}
-                    style={{width: "20px"}}
-                    state = {{displayType: (this.props.location.state && (this.props.location.state as IRouterLocationState).displayType) ? (this.props.location.state as IRouterLocationState).displayType : DisplayType.Grid}}
+                    style={{ width: "20px" }}
+                    state={{ displayType: (this.props.location.state && (this.props.location.state as IRouterLocationState).displayType) ? (this.props.location.state as IRouterLocationState).displayType : DisplayType.Grid }}
                     className={stylesButtons.button_nav_tertiary}
+                    onClick={(e) => {
+                        if (e.altKey || e.shiftKey || e.ctrlKey) {
+                            e.preventDefault();
+                            e.currentTarget.click();
+                        }
+                    }}
+                    onKeyDown={(e) => {
+                        // if (e.code === "Space") {
+                        if (e.key === " " || e.altKey || e.ctrlKey) {
+                            e.preventDefault(); // prevent scroll
+                        }
+                    }}
+                    onKeyUp={(e) => {
+                        // Includes screen reader tests:
+                        // if (e.code === "Space") { WORKS
+                        // if (e.key === "Space") { DOES NOT WORK
+                        // if (e.key === "Enter") { WORKS
+                        if (e.key === " ") { // WORKS
+                            e.preventDefault();
+                            e.currentTarget.click();
+                        }
+                    }}
                 >
                     <SVG svg={HomeIcon} title={__("header.homeTitle")} />
                 </Link>
@@ -304,15 +348,37 @@ class LibraryLayout extends React.Component<IProps, undefined> {
             );
 
             refreshComponet = (
-                <button className={stylesButtons.button_nav_tertiary} style={{width: "20px", height: "20px"}}>
+                <button className={stylesButtons.button_nav_tertiary} style={{ width: "20px", height: "20px" }}>
                     <Link
                         to={{
                             ...this.props.location,
                             pathname: route,
                         }}
-                        style={{height: "unset"}}
-                        state = {{displayType: (this.props.location.state && (this.props.location.state as IRouterLocationState).displayType) ? (this.props.location.state as IRouterLocationState).displayType : DisplayType.Grid}}
+                        style={{ height: "unset" }}
+                        state={{ displayType: (this.props.location.state && (this.props.location.state as IRouterLocationState).displayType) ? (this.props.location.state as IRouterLocationState).displayType : DisplayType.Grid }}
                         className={classNames(stylesButtons.button_refresh, "R2_CSS_CLASS__FORCE_NO_FOCUS_OUTLINE")}
+                        onClick={(e) => {
+                            if (e.altKey || e.shiftKey || e.ctrlKey) {
+                                e.preventDefault();
+                                e.currentTarget.click();
+                            }
+                        }}
+                        onKeyDown={(e) => {
+                            // if (e.code === "Space") {
+                            if (e.key === " " || e.altKey || e.ctrlKey) {
+                                e.preventDefault(); // prevent scroll
+                            }
+                        }}
+                        onKeyUp={(e) => {
+                            // Includes screen reader tests:
+                            // if (e.code === "Space") { WORKS
+                            // if (e.key === "Space") { DOES NOT WORK
+                            // if (e.key === "Enter") { WORKS
+                            if (e.key === " ") { // WORKS
+                                e.preventDefault();
+                                e.currentTarget.click();
+                            }
+                        }
                     >
                         <SVG svg={RefreshIcon} title={__("header.refreshTitle")} />
                     </Link>
@@ -325,8 +391,30 @@ class LibraryLayout extends React.Component<IProps, undefined> {
                         to={{
                             ...this.props.location,
                         }}
-                        state = {{displayType: (this.props.location.state && (this.props.location.state as IRouterLocationState).displayType) ? (this.props.location.state as IRouterLocationState).displayType : DisplayType.Grid}}
+                        state={{ displayType: (this.props.location.state && (this.props.location.state as IRouterLocationState).displayType) ? (this.props.location.state as IRouterLocationState).displayType : DisplayType.Grid }}
                         className={classNames(stylesButtons.button_refresh, "R2_CSS_CLASS__FORCE_NO_FOCUS_OUTLINE")}
+                        onClick={(e) => {
+                            if (e.altKey || e.shiftKey || e.ctrlKey) {
+                                e.preventDefault();
+                                e.currentTarget.click();
+                            }
+                        }}
+                        onKeyDown={(e) => {
+                            // if (e.code === "Space") {
+                            if (e.key === " " || e.altKey || e.ctrlKey) {
+                                e.preventDefault(); // prevent scroll
+                            }
+                        }}
+                        onKeyUp={(e) => {
+                            // Includes screen reader tests:
+                            // if (e.code === "Space") { WORKS
+                            // if (e.key === "Space") { DOES NOT WORK
+                            // if (e.key === "Enter") { WORKS
+                            if (e.key === " ") { // WORKS
+                                e.preventDefault();
+                                e.currentTarget.click();
+                            }
+                        }}
                     >
                         <SVG svg={RefreshIcon} title={__("header.refreshTitle")} />
                     </Link>
diff --git a/src/renderer/library/components/opds/Entry.tsx b/src/renderer/library/components/opds/Entry.tsx
index 846fec38a..927687bca 100644
--- a/src/renderer/library/components/opds/Entry.tsx
+++ b/src/renderer/library/components/opds/Entry.tsx
@@ -60,7 +60,29 @@ class Entry extends React.Component<IProps, undefined> {
                     ...this.props.location,
                     pathname: route,
                 }}
-                state = {{displayType: (this.props.location.state && (this.props.location.state as IRouterLocationState).displayType) ? (this.props.location.state as IRouterLocationState).displayType : DisplayType.Grid}}
+                state={{ displayType: (this.props.location.state && (this.props.location.state as IRouterLocationState).displayType) ? (this.props.location.state as IRouterLocationState).displayType : DisplayType.Grid }}
+                onClick={(e) => {
+                    if (e.altKey || e.shiftKey || e.ctrlKey) {
+                        e.preventDefault();
+                        e.currentTarget.click();
+                    }
+                }}
+                onKeyDown={(e) => {
+                    // if (e.code === "Space") {
+                    if (e.key === " " || e.altKey || e.ctrlKey) {
+                        e.preventDefault(); // prevent scroll
+                    }
+                }}
+                onKeyUp={(e) => {
+                    // Includes screen reader tests:
+                    // if (e.code === "Space") { WORKS
+                    // if (e.key === "Space") { DOES NOT WORK
+                    // if (e.key === "Enter") { WORKS
+                    if (e.key === " ") { // WORKS
+                        e.preventDefault();
+                        e.currentTarget.click();
+                    }
+                }}
             >
                 <span>
                     <span title={entry.subtitle ? entry.subtitle : entry.title}>{entry.title}</span>
diff --git a/src/renderer/library/components/opds/FeedList.tsx b/src/renderer/library/components/opds/FeedList.tsx
index 17dfc2d09..e49f8980a 100644
--- a/src/renderer/library/components/opds/FeedList.tsx
+++ b/src/renderer/library/components/opds/FeedList.tsx
@@ -92,6 +92,28 @@ class FeedList extends React.Component<IProps, IState> {
                                     }}
                                     state={{ displayType: (this.props.location.state && (this.props.location.state as IRouterLocationState).displayType) ? (this.props.location.state as IRouterLocationState).displayType : DisplayType.Grid }}
                                     className={stylesCatalogs.catalog_content}
+                                    onClick={(e) => {
+                                        if (e.altKey || e.shiftKey || e.ctrlKey) {
+                                            e.preventDefault();
+                                            e.currentTarget.click();
+                                        }
+                                    }}
+                                    onKeyDown={(e) => {
+                                        // if (e.code === "Space") {
+                                        if (e.key === " " || e.altKey || e.ctrlKey) {
+                                            e.preventDefault(); // prevent scroll
+                                        }
+                                    }}
+                                    onKeyUp={(e) => {
+                                        // Includes screen reader tests:
+                                        // if (e.code === "Space") { WORKS
+                                        // if (e.key === "Space") { DOES NOT WORK
+                                        // if (e.key === "Enter") { WORKS
+                                        if (e.key === " ") { // WORKS
+                                            e.preventDefault();
+                                            e.currentTarget.click();
+                                        }
+                                    }}
                                 >
                                     <div style={{ width: "100%", height: "50px", backgroundColor: "var(--color-extralight-grey)", borderBottom: "1px solid var(--color-light-grey)", position: "absolute", top: "2px" }}></div>
                                     <div className={stylesCatalogs.catalog_title}>
diff --git a/src/renderer/library/components/opds/PageNavigation.tsx b/src/renderer/library/components/opds/PageNavigation.tsx
index be85191da..b1b457bb5 100644
--- a/src/renderer/library/components/opds/PageNavigation.tsx
+++ b/src/renderer/library/components/opds/PageNavigation.tsx
@@ -90,7 +90,7 @@ class PageNavigation extends React.Component<IProps, undefined> {
 
 
         return (
-            <div className={stylesPublication.opds_publication_wrapper} ref={this.fixedElementRef} style={{width: "unset"}}>
+            <div className={stylesPublication.opds_publication_wrapper} ref={this.fixedElementRef} style={{ width: "unset" }}>
                 {/* <button className={stylesButtons.button_primary_blue} onClick={() => console.log(pageLinks)}>Log "pageLinks"</button> */}
                 {/* <p className={stylesPublication.allBooks_header_pagination_title}>{__("catalog.numberOfPages")}</p> */}
                 <div className={stylesPublication.allBooks_header_pagination_container}>
@@ -105,6 +105,28 @@ class PageNavigation extends React.Component<IProps, undefined> {
                                     ...this.props.location,
                                     pathname: buildRoute(pageLinks.first[0]),
                                 }}
+                                onClick={(e) => {
+                                    if (e.altKey || e.shiftKey || e.ctrlKey) {
+                                        e.preventDefault();
+                                        e.currentTarget.click();
+                                    }
+                                }}
+                                onKeyDown={(e) => {
+                                    // if (e.code === "Space") {
+                                    if (e.key === " " || e.altKey || e.ctrlKey) {
+                                        e.preventDefault(); // prevent scroll
+                                    }
+                                }}
+                                onKeyUp={(e) => {
+                                    // Includes screen reader tests:
+                                    // if (e.code === "Space") { WORKS
+                                    // if (e.key === "Space") { DOES NOT WORK
+                                    // if (e.key === "Enter") { WORKS
+                                    if (e.key === " ") { // WORKS
+                                        e.preventDefault();
+                                        e.currentTarget.click();
+                                    }
+                                }}
                             >
                                 <SVG ariaHidden={true} svg={ArrowFirstIcon} />
                             </Link> :
@@ -125,6 +147,28 @@ class PageNavigation extends React.Component<IProps, undefined> {
                                         ...this.props.location,
                                         pathname: buildRoute(pageLinks.previous[0]),
                                     }}
+                                    onClick={(e) => {
+                                        if (e.altKey || e.shiftKey || e.ctrlKey) {
+                                            e.preventDefault();
+                                            e.currentTarget.click();
+                                        }
+                                    }}
+                                    onKeyDown={(e) => {
+                                        // if (e.code === "Space") {
+                                        if (e.key === " " || e.altKey || e.ctrlKey) {
+                                            e.preventDefault(); // prevent scroll
+                                        }
+                                    }}
+                                    onKeyUp={(e) => {
+                                        // Includes screen reader tests:
+                                        // if (e.code === "Space") { WORKS
+                                        // if (e.key === "Space") { DOES NOT WORK
+                                        // if (e.key === "Enter") { WORKS
+                                        if (e.key === " ") { // WORKS
+                                            e.preventDefault();
+                                            e.currentTarget.click();
+                                        }
+                                    }}
                                 >
                                     <SVG ariaHidden={true} svg={ChevronRight} />
                                 </Link>
@@ -171,6 +215,28 @@ class PageNavigation extends React.Component<IProps, undefined> {
                                     ...this.props.location,
                                     pathname: buildRoute(pageLinks.next[0]),
                                 }}
+                                onClick={(e) => {
+                                    if (e.altKey || e.shiftKey || e.ctrlKey) {
+                                        e.preventDefault();
+                                        e.currentTarget.click();
+                                    }
+                                }}
+                                onKeyDown={(e) => {
+                                    // if (e.code === "Space") {
+                                    if (e.key === " " || e.altKey || e.ctrlKey) {
+                                        e.preventDefault(); // prevent scroll
+                                    }
+                                }}
+                                onKeyUp={(e) => {
+                                    // Includes screen reader tests:
+                                    // if (e.code === "Space") { WORKS
+                                    // if (e.key === "Space") { DOES NOT WORK
+                                    // if (e.key === "Enter") { WORKS
+                                    if (e.key === " ") { // WORKS
+                                        e.preventDefault();
+                                        e.currentTarget.click();
+                                    }
+                                }}
                             >
                                 <SVG ariaHidden={true} svg={ChevronRight} />
                             </Link>
@@ -187,7 +253,30 @@ class PageNavigation extends React.Component<IProps, undefined> {
                                     to={{
                                         ...this.props.location,
                                         pathname: buildRoute(pageLinks.last[0]),
-                                    }}>
+                                    }}
+                                    onClick={(e) => {
+                                        if (e.altKey || e.shiftKey || e.ctrlKey) {
+                                            e.preventDefault();
+                                            e.currentTarget.click();
+                                        }
+                                    }}
+                                    onKeyDown={(e) => {
+                                        // if (e.code === "Space") {
+                                        if (e.key === " " || e.altKey || e.ctrlKey) {
+                                            e.preventDefault(); // prevent scroll
+                                        }
+                                    }}
+                                    onKeyUp={(e) => {
+                                        // Includes screen reader tests:
+                                        // if (e.code === "Space") { WORKS
+                                        // if (e.key === "Space") { DOES NOT WORK
+                                        // if (e.key === "Enter") { WORKS
+                                        if (e.key === " ") { // WORKS
+                                            e.preventDefault();
+                                            e.currentTarget.click();
+                                        }
+                                    }}
+                                >
                                     <SVG ariaHidden={true} svg={ArrowLastIcon} />
                                 </Link>
                                 : <SVG ariaHidden={true} svg={ArrowLastIcon} />}