ImageObject Schema và Alt Text cho AI: Tối Ưu Hình Ảnh Để AI Hiểu và Trích Dẫn

Hình ảnh chiếm 50-70% băng thông trang web — nhưng hầu hết website Việt Nam xử lý ảnh như "trang trí" thay vì nguồn dữ liệu có cấu trúc. AI search ngày càng đọc được ảnh, nhưng alt text rõ ràng và ImageObject schema vẫn là cách đáng tin cậy nhất để đảm bảo AI hiểu đúng nội dung ảnh của bạn.

Cách AI xử lý hình ảnh

ImageObject schema trong Article

{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "Hướng dẫn JSON-LD cho người mới bắt đầu",
  "image": [
    {
      "@type": "ImageObject",
      "url": "https://example.vn/images/json-ld-guide-1200x630.jpg",
      "contentUrl": "https://example.vn/images/json-ld-guide-1200x630.jpg",
      "thumbnailUrl": "https://example.vn/images/json-ld-guide-400x210.jpg",
      "width": 1200,
      "height": 630,
      "caption": "Sơ đồ cấu trúc JSON-LD cho Article schema với các trường bắt buộc và tùy chọn",
      "author": {
        "@type": "Organization",
        "name": "AEO Saigon"
      },
      "license": "https://creativecommons.org/licenses/by/4.0/",
      "acquireLicensePage": "https://example.vn/license"
    },
    {
      "@type": "ImageObject",
      "url": "https://example.vn/images/json-ld-result-1200x630.jpg",
      "width": 1200,
      "height": 630,
      "caption": "Screenshot kết quả Rich Results Test sau khi triển khai Article schema"
    }
  ]
}

ImageObject trong Product schema

{
  "@context": "https://schema.org",
  "@type": "Product",
  "name": "Áo Polo Nam Cotton Premium",
  "image": [
    {
      "@type": "ImageObject",
      "url": "https://shop.example.vn/images/ao-polo-nam-navy-front.jpg",
      "contentUrl": "https://shop.example.vn/images/ao-polo-nam-navy-front.jpg",
      "width": 1200,
      "height": 1200,
      "caption": "Áo polo nam màu navy nhìn từ phía trước — cotton 100% dệt pique"
    },
    {
      "@type": "ImageObject",
      "url": "https://shop.example.vn/images/ao-polo-nam-navy-back.jpg",
      "width": 1200,
      "height": 1200,
      "caption": "Áo polo nam màu navy nhìn từ phía sau — cổ bẻ 3 nút"
    },
    {
      "@type": "ImageObject",
      "url": "https://shop.example.vn/images/ao-polo-nam-navy-detail.jpg",
      "width": 800,
      "height": 800,
      "caption": "Chi tiết chất vải cotton pique 220GSM, đường may phẳng"
    }
  ]
}

Next.js: alt text và ImageObject tự động

// components/blog/ArticleImage.tsx
import Image from "next/image";

interface ArticleImageProps {
  src: string;
  alt: string;
  caption?: string;
  width: number;
  height: number;
  priority?: boolean;
}

export function ArticleImage({
  src,
  alt,
  caption,
  width,
  height,
  priority = false,
}: ArticleImageProps) {
  return (
    <figure className="my-8">
      <Image
        src={src}
        alt={alt}
        width={width}
        height={height}
        priority={priority}
        className="rounded-lg w-full h-auto"
      />
      {caption && (
        <figcaption className="mt-2 text-sm text-center text-muted-foreground">
          {caption}
        </figcaption>
      )}
    </figure>
  );
}

// Hàm generate ImageObject từ danh sách ảnh
export function generateImageObjects(
  images: Array<{ url: string; width: number; height: number; caption?: string }>
) {
  return images.map((img) => ({
    "@type": "ImageObject",
    url: img.url,
    contentUrl: img.url,
    width: img.width,
    height: img.height,
    ...(img.caption && { caption: img.caption }),
  }));
}

Checklist tối ưu ảnh cho AI

• Mỗi ảnh có alt text mô tả nội dung thực (không keyword stuffing)
• Alt text 10-120 ký tự, câu hoàn chỉnh, không bắt đầu bằng "Hình ảnh"
• File name có ý nghĩa: kebab-case, không phải IMG_0042.jpg
• ImageObject schema trong Article/Product với url, width, height, caption
• Featured image: 1200×630px (OG), 1200×1200px (Product square)
• figcaption cho infographic và ảnh có nhiều thông tin
• URL ảnh stable — không thay đổi sau khi publish
• Ảnh AI-generated: ghi rõ trong caption và alt text
• Nhiều góc sản phẩm = nhiều ImageObject trong mảng image
• Text version của infographic (table/list) phía dưới để AI đọc được data

Ảnh được tối ưu đúng cách không chỉ giúp AI hiểu content tốt hơn — mà còn cải thiện accessibility (screen reader), tăng traffic từ Google Image Search, và là tín hiệu E-E-A-T khi ảnh có author và license rõ ràng.

Câu hỏi thường gặp