25 lines
826 B
TypeScript
25 lines
826 B
TypeScript
interface SidePeekSEOProps {
|
|
title: string
|
|
shouldInert?: boolean
|
|
}
|
|
|
|
// Sidepeeks generally have important content that should be indexed by search engines.
|
|
// The content is hidden behind a modal, but it is still important for SEO.
|
|
// This component is used to provide SEO information for the sidepeek content.
|
|
export default function SidePeekSEO({
|
|
title,
|
|
shouldInert = false,
|
|
children,
|
|
}: React.PropsWithChildren<SidePeekSEOProps>) {
|
|
return (
|
|
// Both inert and sr-only to ensure that the content is not focusable
|
|
// or visible to screen readers but still available for SEO.
|
|
// The other possible options, such as aria-hidden and the hidden attribute,
|
|
// are less suitable for SEO purposes.
|
|
<div className="sr-only" inert={shouldInert}>
|
|
<h2>{title}</h2>
|
|
{children}
|
|
</div>
|
|
)
|
|
}
|