SEO

frontend/app/pages/index.vue

@@ -2,11 +2,47 @@
 import FixedLayout from '~/components/layouts/FixedLayout.vue';
 import TableHeader from '~/components/parts/TableHeader.vue';
 import api from '~/composables/api'
+import { useSeo } from '~/composables/seo'
 
 const { get, post } = api();
 const { locale } = useI18n();
 const { t } = useI18n();
 
+useSeo({
+  title: 'Home',
+  description: 'Aran Roig — Developer, Artist & Designer. Exploring projects in software engineering, digital art, and interactive design.',
+  canonicalUrl: '/',
+  structuredData: {
+    '@context': 'https://schema.org',
+    '@type': 'WebPage',
+    '@id': 'https://aranroig.com/#webpage',
+    url: 'https://aranroig.com',
+    name: 'Aran Roig — Developer, Artist & Designer',
+    description: 'Personal website of Aran Roig — developer, artist, and designer.',
+    inLanguage: ['en', 'es', 'ca'],
+    publisher: {
+      '@type': 'Person',
+      name: 'Aran Roig'
+    }
+  }
+});
+
+useHead({
+  script: [
+    {
+      type: 'application/ld+json',
+      innerHTML: JSON.stringify({
+        '@context': 'https://schema.org',
+        '@type': 'Person',
+        name: 'Aran Roig',
+        url: 'https://aranroig.com',
+        sameAs: [],
+        jobTitle: 'Developer, Artist & Designer'
+      })
+    }
+  ]
+});
+
 const currentPath = computed(() => route.path);
 const route = useRoute();
 
@@ -126,6 +162,7 @@ const sectionTargets = {
 <template>
   <TableHeader></TableHeader>
   
+   <h1 style="position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;">Aran Roig — Developer, Artist & Designer</h1>
    <div id="top" style="scroll-margin-top: 60px;">&nbsp;</div>
 
   <FixedLayout>