feat(website): improve adopters carousel SEO and accessibility

Promotes the carousel label from <p> to <h2>, links the section to the
heading via aria-labelledby, adds an accessible label per chip, and
turns the opaque logo <img> tags into proper lazy-loaded assets with
explicit dimensions.

Adds a subline naming seven brands (Docker, Microsoft, HashiCorp,
Vercel, Google Cloud, AWS, Anthropic) so the homepage now has
indexable text referencing actual adopters — previously the brand
information only lived inside animated chips.

Emits a schema.org ItemList of Organization entities (JSON-LD) on the
homepage, which none of the comparable OSS sites (Vite, Biome, Astro,
Nx, Turborepo) currently expose — cheap differentiator for rich
search results.

website/.vitepress/adopters.ts

@@ -0,0 +1,80 @@
+export interface Adopter {
+  name: string;
+  url: string;
+  img: string;
+}
+
+export const adopters: Adopter[] = [
+  // Big brand names
+  {
+    name: 'Docker',
+    url: 'https://github.com/docker/mcp-registry',
+    img: 'https://github.com/docker.png'
+  },
+  {
+    name: 'Microsoft',
+    url: 'https://github.com/Azure/Azure-Sentinel',
+    img: 'https://github.com/microsoft.png'
+  },
+  {
+    name: 'HashiCorp',
+    url: 'https://github.com/hashicorp/terraform-aws-terraform-enterprise-hvd',
+    img: 'https://github.com/hashicorp.png'
+  },
+  {
+    name: 'Vercel',
+    url: 'https://github.com/vercel/terraform-provider-vercel',
+    img: 'https://github.com/vercel.png'
+  },
+  {
+    name: 'Google Cloud',
+    url: 'https://github.com/GoogleCloudPlatform/deploystack',
+    img: 'https://github.com/GoogleCloudPlatform.png'
+  },
+  {
+    name: 'AWS',
+    url: 'https://github.com/aws-samples/appmod-blueprints',
+    img: 'https://github.com/aws-samples.png'
+  },
+  {
+    name: 'Anthropic',
+    url: 'https://github.com/anthropics/buffa',
+    img: 'https://github.com/anthropics.png'
+  },
+  // Notable open source projects
+  {
+    name: 'Flet',
+    url: 'https://github.com/flet-dev/flet',
+    img: 'https://github.com/flet-dev.png'
+  },
+  {
+    name: 'GoReleaser',
+    url: 'https://github.com/goreleaser/goreleaser',
+    img: 'https://github.com/goreleaser.png'
+  },
+  {
+    name: 'Arduino CLI',
+    url: 'https://github.com/arduino/arduino-cli',
+    img: 'https://github.com/arduino.png'
+  },
+  {
+    name: 'FerretDB',
+    url: 'https://github.com/FerretDB/FerretDB',
+    img: 'https://github.com/FerretDB.png'
+  },
+  {
+    name: 'Tyk',
+    url: 'https://github.com/TykTechnologies/tyk',
+    img: 'https://github.com/TykTechnologies.png'
+  },
+  {
+    name: 'Charmbracelet',
+    url: 'https://github.com/charmbracelet/glamour',
+    img: 'https://github.com/charmbracelet.png'
+  },
+  {
+    name: 'Outline',
+    url: 'https://github.com/OutlineFoundation/outline-server',
+    img: 'https://github.com/OutlineFoundation.png'
+  }
+];

website/.vitepress/components/AdoptersCarousel.vue

@@ -0,0 +1,201 @@
+<script setup lang="ts">
+import { adopters } from '../adopters';
+
+const loop = [...adopters, ...adopters];
+</script>
+
+<template>
+  <section class="adopters-carousel" aria-labelledby="adopters-heading">
+    <h2 id="adopters-heading" class="label">
+      <span class="slashes">//</span>
+      Trusted by open source projects
+    </h2>
+    <p class="subline">
+      Adopted by <strong>Docker</strong>, <strong>Microsoft</strong>,
+      <strong>HashiCorp</strong>, <strong>Vercel</strong>,
+      <strong>Google Cloud</strong>, <strong>AWS</strong>,
+      <strong>Anthropic</strong> and more.
+    </p>
+
+    <div class="viewport">
+      <div class="track">
+        <a
+          v-for="(item, i) in loop"
+          :key="`${item.name}-${i}`"
+          :href="item.url"
+          target="_blank"
+          rel="noopener"
+          class="chip"
+          :aria-label="`${item.name} on GitHub`"
+        >
+          <img
+            :src="item.img"
+            :alt="`${item.name} logo`"
+            class="logo"
+            loading="lazy"
+            decoding="async"
+            width="28"
+            height="28"
+          />
+          <span class="name">{{ item.name }}</span>
+          <span class="chevron" aria-hidden="true">&rarr;</span>
+        </a>
+      </div>
+    </div>
+  </section>
+</template>
+
+<style scoped>
+.adopters-carousel {
+  max-width: 1248px;
+  margin: 5rem auto 2rem;
+  padding: 0 24px;
+}
+
+.label {
+  font-family: var(--vp-font-family-mono);
+  font-size: 0.8rem;
+  font-weight: 500;
+  letter-spacing: 0.04em;
+  color: var(--vp-c-text-2);
+  text-transform: uppercase;
+  text-align: center;
+  margin: 0 0 0.75rem;
+}
+
+.slashes {
+  color: var(--vp-c-brand-1);
+  margin-right: 0.4em;
+}
+
+.subline {
+  text-align: center;
+  font-size: 0.95rem;
+  color: var(--vp-c-text-2);
+  max-width: 640px;
+  margin: 0 auto 2rem;
+  line-height: 1.5;
+}
+
+.subline strong {
+  color: var(--vp-c-text-1);
+  font-weight: 600;
+}
+
+.viewport {
+  overflow: hidden;
+  -webkit-mask-image: linear-gradient(
+    90deg,
+    transparent 0,
+    #000 6%,
+    #000 94%,
+    transparent 100%
+  );
+  mask-image: linear-gradient(
+    90deg,
+    transparent 0,
+    #000 6%,
+    #000 94%,
+    transparent 100%
+  );
+}
+
+.track {
+  display: flex;
+  gap: 0.875rem;
+  width: max-content;
+  animation: scroll 55s linear infinite;
+  padding: 6px 0;
+}
+
+.track:hover {
+  animation-play-state: paused;
+}
+
+.chip {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.75rem;
+  padding: 0.625rem 1.125rem 0.625rem 0.625rem;
+  border: 1px solid var(--vp-c-divider);
+  border-radius: 999px;
+  background: var(--vp-c-bg-soft);
+  color: var(--vp-c-text-1);
+  text-decoration: none !important;
+  white-space: nowrap;
+  transition:
+    border-color 0.25s ease,
+    background 0.25s ease,
+    transform 0.25s ease,
+    box-shadow 0.25s ease;
+}
+
+.chip:hover {
+  border-color: var(--vp-c-brand-1);
+  background: var(--vp-c-bg);
+  transform: translateY(-2px);
+  box-shadow: 0 6px 20px -10px
+    color-mix(in srgb, var(--vp-c-brand-1) 60%, transparent);
+}
+
+.logo {
+  width: 28px;
+  height: 28px;
+  border-radius: 6px;
+  object-fit: cover;
+  flex-shrink: 0;
+  background: #fff;
+}
+
+.name {
+  font-size: 0.9rem;
+  font-weight: 500;
+  letter-spacing: -0.005em;
+}
+
+.chevron {
+  font-family: var(--vp-font-family-mono);
+  font-size: 0.85rem;
+  color: var(--vp-c-text-3);
+  opacity: 0;
+  transform: translateX(-4px);
+  transition:
+    opacity 0.25s ease,
+    transform 0.25s ease,
+    color 0.25s ease;
+  margin-left: -0.25rem;
+}
+
+.chip:hover .chevron {
+  opacity: 1;
+  transform: translateX(0);
+  color: var(--vp-c-brand-1);
+}
+
+@keyframes scroll {
+  from {
+    transform: translateX(0);
+  }
+  to {
+    transform: translateX(calc(-50% - 0.4375rem));
+  }
+}
+
+@media (max-width: 640px) {
+  .adopters-carousel {
+    margin-top: 3.5rem;
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .track {
+    animation: none;
+    flex-wrap: wrap;
+    justify-content: center;
+    width: 100%;
+  }
+  .chip:hover {
+    transform: none;
+  }
+}
+</style>

website/.vitepress/components/HomePage.vue

@@ -1,12 +1,14 @@
 <script setup lang="ts">
 import { VPHomeSponsors } from 'vitepress/theme';
 import { sponsors } from '../sponsors';
+import AdoptersCarousel from './AdoptersCarousel.vue';
 </script>
 
 <template>
   <div class="content">
     <div class="content-container">
       <main class="main">
+        <AdoptersCarousel />
         <VPHomeSponsors
           v-if="sponsors"
           message="Task is free and open source, made possible by wonderful sponsors."

website/.vitepress/config.ts

@@ -9,6 +9,7 @@ import {
   localIconLoader
 } from 'vitepress-plugin-group-icons';
 import { team } from './team.ts';
+import { adopters } from './adopters.ts';
 import { taskDescription, taskName, ogUrl, ogImage } from './meta.ts';
 import { fileURLToPath, URL } from 'node:url';
 import llmstxt from 'vitepress-plugin-llms';
@@ -107,6 +108,34 @@ export default defineConfig({
       head.push(['meta', { name: 'robots', content: 'noindex, nofollow' }])
     }
 
+    // Structured data for the adopters carousel on the homepage: an ItemList
+    // of Organization entities so search engines can surface Task's adopters
+    // directly in rich results.
+    if (isHome) {
+      head.push([
+        'script',
+        { type: 'application/ld+json' },
+        JSON.stringify({
+          '@context': 'https://schema.org',
+          '@type': 'ItemList',
+          name: 'Organizations and projects using Task',
+          itemListOrder: 'https://schema.org/ItemListUnordered',
+          numberOfItems: adopters.length,
+          itemListElement: adopters.map((a, i) => ({
+            '@type': 'ListItem',
+            position: i + 1,
+            item: {
+              '@type': 'Organization',
+              name: a.name,
+              url: a.url,
+              logo: a.img,
+              sameAs: [a.url]
+            }
+          }))
+        })
+      ])
+    }
+
     return head
   },
   srcDir: 'src',