diff --git a/src/components/Checkbox.svelte b/src/components/Checkbox.svelte
index 0d53ec3ef..369a6a120 100644
--- a/src/components/Checkbox.svelte
+++ b/src/components/Checkbox.svelte
@@ -14,7 +14,7 @@
 {#if selected}
   <button
     class="w-12 h-12 rounded-full text-primary-500 hover:text-primary-600 dark:hover:text-primary-400 transition-colors duration-200 flex items-center justify-center"
-    area-label="Unselect"
+    aria-label="Unselect"
     on:click={() => toggle(false)}
   >
     <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="w-6 h-6">
@@ -28,7 +28,7 @@
 {:else if indeterminate}
   <button
     class="w-12 h-12 rounded-full text-primary-500 hover:text-primary-600 dark:hover:text-primary-400 transition-colors duration-200 flex items-center justify-center"
-    area-label="Unselect"
+    aria-label="Unselect"
     on:click={() => toggle(false)}
   >
     <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="w-6 h-6">
@@ -42,7 +42,7 @@
 {:else}
   <button
     class="w-12 h-12 rounded-full text-gray-200 hover:text-gray-400 dark:text-gray-700 dark:hover:text-gray-600 transition-colors duration-200 flex items-center justify-center"
-    area-label="Select"
+    aria-label="Select"
     on:click={() => toggle(true)}
   >
     <svg
diff --git a/src/components/CloseButton.svelte b/src/components/CloseButton.svelte
index ef0b055a8..824e5ed08 100644
--- a/src/components/CloseButton.svelte
+++ b/src/components/CloseButton.svelte
@@ -2,7 +2,7 @@
   import SquareButton from '~/components/SquareButton.svelte'
 </script>
 
-<SquareButton on:click area-label="Close">
+<SquareButton on:click aria-label="Close">
   <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
     <path
       fill-rule="evenodd"
diff --git a/src/components/CopyToClipboard.svelte b/src/components/CopyToClipboard.svelte
index 3c6515c6c..8e359bfb6 100644
--- a/src/components/CopyToClipboard.svelte
+++ b/src/components/CopyToClipboard.svelte
@@ -17,7 +17,7 @@
     type="button"
     on:click={copy}
     class="relative flex items-center p-1 text-xs text-gray-500 dark:text-gray-100"
-    area-label="Copy to Clipboard"
+    aria-label="Copy to Clipboard"
   >
     <svg
       class="w-5 h-5"
diff --git a/src/components/CreatePlaylistButton.svelte b/src/components/CreatePlaylistButton.svelte
index bf60c34cd..5e22aa135 100644
--- a/src/components/CreatePlaylistButton.svelte
+++ b/src/components/CreatePlaylistButton.svelte
@@ -13,7 +13,7 @@
     downloadMode.set(true)
     dispatch('click')
   }}
-  area-label="Create Playlist"
+  aria-label="Create Playlist"
 >
   <span class="inline">
     <svg
diff --git a/src/components/DownloadButton.svelte b/src/components/DownloadButton.svelte
index b02e4e635..a91e39c77 100644
--- a/src/components/DownloadButton.svelte
+++ b/src/components/DownloadButton.svelte
@@ -23,7 +23,7 @@
   }
 </script>
 
-<ActionButton on:click={onClick} disabled={!$selected.length} area-label="Download Playlist">
+<ActionButton on:click={onClick} disabled={!$selected.length} aria-label="Download Playlist">
   <span class="inline">
     <svg
       fill="currentColor"
diff --git a/src/components/ExpandButton.svelte b/src/components/ExpandButton.svelte
index 3f10910ad..86a1e264d 100644
--- a/src/components/ExpandButton.svelte
+++ b/src/components/ExpandButton.svelte
@@ -12,7 +12,7 @@
     expanded = !expanded
     dispatch('click', { state: expanded })
   }}
-  area-label={expanded ? 'Collapse' : 'Expand'}
+  aria-label={expanded ? 'Collapse' : 'Expand'}
 >
   <svg
     class="w-4 h-4"
diff --git a/src/components/SelectAllButton.svelte b/src/components/SelectAllButton.svelte
index 9203d93d2..42314f365 100644
--- a/src/components/SelectAllButton.svelte
+++ b/src/components/SelectAllButton.svelte
@@ -14,7 +14,7 @@
 </script>
 
 {#if isAllSelected}
-  <OutlineButton on:click={deselectAll} area-label="Deselect All ({$selected.length})">
+  <OutlineButton on:click={deselectAll} aria-label="Deselect All ({$selected.length})">
     <span class="text-gray-500 dark:text-white">
       <svg
         xmlns="http://www.w3.org/2000/svg"
@@ -32,7 +32,7 @@
     <span class="hidden sm:inline">Deselect All ({$selected.length})</span>
   </OutlineButton>
 {:else}
-  <OutlineButton on:click={selectAll} area-label="Select All ({$filteredChannels.length})">
+  <OutlineButton on:click={selectAll} aria-label="Select All ({$filteredChannels.length})">
     <span class="text-gray-500 dark:text-white">
       <svg
         xmlns="http://www.w3.org/2000/svg"