Question 1

Sự khác biệt chính giữa useHead và useSeoMeta trong Nuxt là gì?

Accepted Answer

useHead là một composable chung để quản lý tất cả các thẻ trong head HTML (title, script, link, style, meta), trong khi useSeoMeta chỉ chuyên cho các thẻ meta SEO với kiểu TypeScript nghiêm ngặt. useSeoMeta mang lại độ an toàn kiểu tốt hơn và tự động kiểm tra các thuộc tính SEO như og:image, twitter:card, trong khi useHead yêu cầu cấu hình thẻ meta thủ công. Nên dùng useSeoMeta cho metadata SEO và useHead cho các phần tử head khác.

Question 2

Thẻ canonical là gì và tại sao nó quan trọng đối với SEO?

Accepted Answer

Thẻ canonical (rel=canonical) cho công cụ tìm kiếm biết đâu là phiên bản chính của một trang khi nhiều URL có nội dung tương tự hoặc giống nhau. Nó ngăn phạt nội dung trùng lặp và hợp nhất PageRank về URL canonical. Trong Nuxt, thẻ canonical được tạo tự động theo mặc định cho mỗi trang, trỏ đến URL hiện tại. Có thể tắt hoặc tùy chỉnh nó qua useSeoMeta với canonical: false hoặc một URL cụ thể. Rất quan trọng đối với các trang có phân trang, bộ lọc hoặc phiên bản đa ngôn ngữ.

Question 3

Làm thế nào để tắt lập chỉ mục một trang cụ thể trong Nuxt mà vẫn cho phép crawling?

Accepted Answer

Sử dụng useSeoMeta với robots: 'noindex, follow' cho phép crawler truy cập trang và đi theo các liên kết, nhưng ngăn lập chỉ mục trong kết quả tìm kiếm. Cách này được ưu tiên hơn robots.txt cho các trang đã được lập chỉ mục, vì robots.txt chặn crawling nhưng không xóa trang khỏi chỉ mục. Phương án thay thế: dùng defineRouteRules với robots: 'noindex' để cấu hình tập trung. Để chặn crawling hoàn toàn, cần robots.txt với Disallow nhưng kém linh hoạt theo từng trang.

SEO với Nuxt

Sự khác biệt chính giữa useHead và useSeoMeta trong Nuxt là gì?

Câu trả lời

Thẻ canonical là gì và tại sao nó quan trọng đối với SEO?

Câu trả lời

Làm thế nào để tắt lập chỉ mục một trang cụ thể trong Nuxt mà vẫn cho phép crawling?

Câu trả lời

Các thuộc tính Open Graph thiết yếu để chia sẻ mạng xã hội hiệu quả là gì?

Làm thế nào để tạo sitemap động trong Nuxt từ một API bên ngoài?

Các chủ đề phỏng vấn Vue.js / Nuxt.js khác

Kiến thức nền tảng JavaScript

JavaScript hiện đại (ES6+)

Kiến thức cơ bản về Vue

Component Vue

Vue Router

Pinia State Management

Vuex (Legacy)

Composition API

Tính reactive của Vue

Kiến thức cơ bản về Nuxt

Data Fetching trong Nuxt

SSR & SSG trong Nuxt

Server Routes Nuxt

Module Nuxt

Composables trong Vue

Form & Validation Vue

Quản lý trạng thái Nuxt

Testing trong Vue

Triển khai Nuxt & CI/CD

Hiệu năng Vue

Các mẫu nâng cao trong Vue

TypeScript với Vue

Xác thực Nuxt

Quốc tế hóa trong Nuxt

Kiến trúc Vue

Bảo mật Nuxt

Hệ sinh thái Vue

Di chuyển Vue 2→3 & Nuxt 2→3

Nắm vững Vue.js / Nuxt.js cho lần phỏng vấn tiếp theo