Broken Image Là Gì? Cách Tìm Và Sửa Ảnh Lỗi Trên Website

Broken image là gì và người đọc thấy gì trên trang?

Broken image là ảnh được khai trong trang nhưng trình duyệt không lấy được tệp ảnh từ đường dẫn src. Người đọc thấy một khung trống hoặc biểu tượng ảnh vỡ, kèm chữ alt nếu ảnh có alt. Với bài hướng dẫn có ảnh chụp màn hình hay biểu đồ, mất ảnh là mất luôn một phần nội dung.

Alt giúp giảm thiệt hại khi ảnh không tải được: người đọc vẫn biết chỗ đó lẽ ra có gì. Cách viết nằm ở bài alt text là gì.

Ảnh gãy là nội dung bị thiếu, không chỉ là một lỗi hiển thị.

Vì sao ảnh trên website bị gãy sau một thời gian?

Ảnh bị gãy khi đường dẫn trong src không còn trỏ tới một tệp tải được. Trường hợp hay gặp là tệp bị xóa khỏi thư viện, bị đổi tên, hoặc website đổi tên miền, đổi thư mục mà bài viết vẫn giữ đường dẫn cũ. Ảnh lấy từ một website khác cũng gãy khi bên đó gỡ ảnh.

Việc cần soát trước và sau khi chuyển website nằm ở bài SEO relaunch và migration checklist.

Biết nguyên nhân thì sửa được cả loạt, không phải sửa từng ảnh.

Google xử lý URL ảnh trả mã lỗi như thế nào?

Google không dùng nội dung từ URL trả mã 4xx. Theo tài liệu của Google về mã trạng thái HTTP, một URL từng được dùng mà nay trả 4xx thì hệ thống của Google sẽ thôi dùng URL đó theo thời gian, và URL đã lập chỉ mục sẽ bị gỡ khỏi chỉ mục. Ảnh gãy vì vậy mất dần chỗ trên Google Hình ảnh.

Google tìm ảnh qua thuộc tính src của thẻ img. Trang thực hành SEO hình ảnh của Google khuyên dùng cùng một URL cho một tấm ảnh trên toàn website, để Google lưu và dùng lại ảnh mà không phải tải nhiều lần. Website dùng CDN để chứa ảnh thì nên xác minh tên miền của CDN trong Search Console, để nhận được báo lỗi crawl của ảnh.

Cách Google xử lý từng nhóm mã trạng thái nằm ở tài liệu về mã trạng thái HTTP.

URL ảnh ổn định thì Google giữ ảnh, URL ảnh trả 404 thì Google bỏ dần.

Tìm ảnh gãy trên website bằng cách nào?

Tìm ảnh gãy bằng hai cách: Chrome DevTools cho từng trang, và công cụ crawl cho cả website. Trong DevTools, tab Network lọc theo ảnh cho thấy mã trạng thái của từng tệp, ảnh gãy hiện mã 404. Công cụ crawl đi hết các trang và xuất danh sách ảnh lỗi kèm trang đang chứa nó.

Bốn bước tìm ảnh gãy

1. Mở DevTools: vào tab Network, chọn bộ lọc Img rồi tải lại trang.
2. Đọc cột Status: dòng có mã 404 hoặc dòng màu đỏ là ảnh không tải được.
3. Crawl cả website: dùng công cụ như Screaming Frog để liệt kê ảnh trả mã 4xx và trang chứa ảnh.
4. Gom theo mẫu: sắp danh sách theo đường dẫn để thấy những lỗi cùng một nguyên nhân.

Quy trình soát mã trạng thái cho cả website nằm ở bài HTTP status code audit.

Danh sách ảnh lỗi phải kèm trang đang chứa ảnh, nếu không thì không biết sửa ở đâu.

Sửa ảnh gãy theo thứ tự nào và bằng cách gì?

Sửa ảnh gãy theo thứ tự: trang có nhiều người xem trước, lỗi hàng loạt trước lỗi lẻ. Với mỗi ảnh có ba cách xử lý: đưa tệp trở lại đúng đường dẫn cũ, sửa src trỏ sang đường dẫn mới, hoặc bỏ thẻ ảnh khỏi bài khi ảnh không còn cần.

Cách quyết định giữa sửa, chuyển hướng và bỏ, viết cho link gãy nói chung, nằm ở bài khi nào sửa link gãy, khi nào redirect. Các kỹ thuật ảnh khác nằm ở bài SEO hình ảnh.

Khôi phục tệp ở đường dẫn cũ là cách sửa nhanh nhất khi còn tệp gốc.

Broken image nằm ở đâu trong bảng chuẩn SQA-200?

Sửa ảnh gãy là mục P1.31 trong bảng chuẩn SQA-200, thuộc trụ cột I về kỹ thuật và Core Web Vitals, trọng số 1 điểm. Chuẩn đạt của mục này: sửa 100% thuộc tính src ảnh bị gãy trên mọi URL đã đăng. Mục này đứng ngay sau hai mục về alt ảnh và video của trụ cột.

Các mục đứng cạnh P1.31 trong trụ cột I

• P1.29 Image Alt Text Completeness: 100% ảnh mang thông tin có alt mô tả đúng ngữ cảnh.
• P1.30 Video Indexing & Thumbnail: video nhúng đi kèm VideoObject Schema và ảnh xem trước truy cập được.
• P1.32 200 OK Header Stability: trang chủ lực trả HTTP 200 ổn định, máy chủ không rớt từng lúc.
• P1.33 No-Index Meta Tag Guard: thẻ noindex chỉ đặt trên trang riêng tư hoặc trang tiện ích.

Toàn bộ 99 mục kiểm, chuẩn đạt và điểm từng mục nằm ở bài SQA-200 là gì, mục này ở dòng P1.31 Broken Image Repair.

P1.31 đạt khi không còn URL đã đăng nào chứa thẻ ảnh có src trả lỗi.

Người làm website hay hỏi gì về broken image?

Người làm website hay hỏi ba câu về broken image: ảnh gãy có làm trang tụt hạng không, bao lâu nên quét một lần, và có nên chuyển hướng URL ảnh cũ không. Câu trả lời dựa trên tài liệu của Google về mã trạng thái và về ảnh.

Ảnh gãy có làm trang bị tụt hạng không?

Tài liệu của Google không ghi một hình phạt riêng cho ảnh gãy. Điều tài liệu ghi là URL trả 4xx không được dùng và bị gỡ khỏi chỉ mục, tức tấm ảnh đó mất khỏi Google Hình ảnh. Với người đọc, trang thiếu ảnh là trang thiếu nội dung, nên sửa ảnh gãy trước hết là sửa cho người đọc.

Bao lâu nên quét ảnh gãy một lần?

Quét sau mỗi lần thay đổi lớn: chuyển tên miền, đổi cấu trúc thư mục, dọn thư viện media, đổi CDN. Ngoài ra nên quét theo một lịch cố định cùng lúc với việc soát link gãy. Chuẩn P1.31 của SQA-200 tính trên mọi URL đã đăng, nên bài cũ cũng nằm trong phạm vi quét.

Có nên chuyển hướng URL ảnh cũ sang ảnh mới không?

Nên, khi ảnh cũ đã có nhiều trang dùng hoặc đang hiện trên Google Hình ảnh. Chuyển hướng giữ cho các trang đang trỏ vào URL cũ vẫn có ảnh. Google khuyên dùng cùng một URL cho một tấm ảnh trên toàn website, nên sau khi chuyển hướng vẫn cần sửa src trong bài về URL mới.

Sửa ảnh gãy là việc định kỳ, làm cùng lúc với việc soát link gãy.