diff --git a/src/client.ts b/src/client.ts
index fe78e553..b52bf8b3 100644
--- a/src/client.ts
+++ b/src/client.ts
@@ -76,10 +76,10 @@ const utterancesOrigin = script.src.match(/^https:\/\/utteranc\.es|http:\/\/loca
 const frameUrl = `${utterancesOrigin}/utterances.html`;
 script.insertAdjacentHTML(
   'afterend',
-  `<div class="utterances">
+  `<aside class="utterances" aria-label="Comments">
     <iframe class="utterances-frame" title="Comments" scrolling="no" src="${frameUrl}?${new URLSearchParams(attrs)}" loading="lazy"></iframe>
-  </div>`);
-const container = script.nextElementSibling as HTMLDivElement;
+  </aside>`);
+const container = script.nextElementSibling as HTMLElement;
 script.parentElement!.removeChild(script);
 
 // adjust the iframe's height when the height of it's content changes
diff --git a/src/new-comment-component.ts b/src/new-comment-component.ts
index daae9130..a010d4fc 100644
--- a/src/new-comment-component.ts
+++ b/src/new-comment-component.ts
@@ -30,7 +30,8 @@ export class NewCommentComponent {
     private user: User | null,
     private readonly submit: (markdown: string) => Promise<void>
   ) {
-    this.element = document.createElement('article');
+    this.element = document.createElement('section');
+    this.element.setAttribute('aria-label', 'Write a comment');
     this.element.classList.add('timeline-comment');
 
     this.element.innerHTML = `