erstattet nesten alle div-elementer med semantiske elementer

src/App.vue

 <template>
-  <div id="app">
+  <main id="app">
     <img alt="Vue logo" src="./assets/logo.png">
-    <div class="">
+    <header>
       <form class="" action="search" method="get">
         <input placeholder="Søk..." name="q" />
         <select class="" name="lang">
@@ -10,11 +10,11 @@
         </select>
         <input type="submit" name="" value="Yay!">
       </form>
-    </div>
-    <img id="spinner" :class="waiting ? 'show' : 'hide'" src="./assets/spinner.gif" alt="" />
+    </header>
+    <img id="spinner" :class="waiting ? 'show' : 'hide'" src="./assets/spinner.gif" alt="Venter på innhold" />
     <SearchResults :hits="search_results" :lang="query_lang" />
     <Article :article="article" />
-  </div>
+  </main>
 </template>
 
 <script>

src/components/Article.vue

 <template>
-  <div class="article" v-show="article.lemmas.length">
+  <article v-show="article.lemmas.length">
     <Header :lemmas="article.lemmas" />
-    <div class="" v-if="article.body.pronunciation.length">
+    <section v-if="article.body.pronunciation.length">
       <h3>Uttale</h3>
         <ul>
           <DefElement v-for="(element, index) in article.body.pronunciation" :key="index" :body='element' />
         </ul>
-    </div>
-    <div class="" v-if="article.body.etymology">
+    </section>
+    <section v-if="article.body.etymology">
       <h3>Etymologi</h3>
         <ul>
           <DefElement v-for="(element, index) in article.body.etymology" :key="index" :body='element' />
         </ul>
-    </div>
-    <div class="">
+    </section>
+    <section>
       <h3>Definisjoner</h3>
       <ol>
         <Definition v-for="(definition, index) in definitions" :key="index" :body='definition' />
       </ol>
-    </div>
-  </div>
+    </section>
+  </article>
 </template>
 
 <script>
@@ -55,7 +55,7 @@ export default {
 
 <!-- Add "scoped" attribute to limit CSS to this component only -->
 <style>
-.article {
+article {
   margin-top: 30px;
 }
 

src/components/SearchResults.vue

 <template>
-  <div class="">
+  <section class="">
     <h2 v-if="hits.length">Søkeresultater</h2>
     <ul>
       <li v-for="(result, index) in extended_results" :key="index">
         <a :href="'/' + lang + '/' + result.id">{{result.label}}</a> ({{result.classification}})
       </li>
     </ul>
-  </div>
+  </section>
 </template>
 
 <script>