12 Mẹo tối ưu hóa hình ảnh quan trọng bạn cần biết

12 Mẹo tối ưu hình ảnh quan trọng mà bạn cần biết

Think about the last time you uploaded an image to your website. Chances are you downloaded it from a stock photography site, uploaded it to the backend of your site, and then inserted it to the page.

This makes a shining example of image optimization, right? Not quite.

You’ve added a giant bowling ball weight to your site that’s slowing down the page speed. And, search engines can’t read your images without alt text.

Let’s change that.

Over 20% of all U.S. web searches happen on Google Images, according to 2018 data from Jumpshot.

SEO amateurs and pros alike know that optimizing images for your website is notoriously worth the time spent.

Dan Morgan at WebSpection got one of his photos to rank #1 in Google Images for “best person in Cardiff” in less than four days by optimizing his image.

And, Robbie Richards generated 150,732 visits by adding image alt tags, compressing images, and a few other SEO tricks.

Without proper image optimization, you’re wasting a valuable SEO asset.

It’s like the search engines are giving away Oreos and milk for free. But, you only take the Oreo. When in reality, the Oreo is way better dunked in milk.

Image optimization creates many advantages such as better user experience, faster page load times, and additional ranking opportunities. And, it’s becoming an increasingly more important role.

As Matt Southern pointed out, Gary Illyes’ statement on image search in a recent Reddit chat:

“We simply know that media search is way too ignored for what it’s capable doing for publishers so we’re throwing more engineers at it as well as more outreach.”

But which factors are most important to ensure your images are findable and don’t slow down your site?

Here are 12 important image optimization tips you need to know.

1. Chọn đúng định dạng phù hợp

Decoding all the various image formats can feel like your first time ordering at Taco Bell. But, before you can start adding images to your site, you want to make sure you’ve chosen the best file type.

While there are many image formats to choose from, the PNG and JPEG are the most common for the web.

Đối với tôi, PNG là người hùng không được công nhận trong định dạng hình ảnh. Nhưng, trong việc sử dụng hàng ngày, tôi thích sử dụng PNG sau đó chuyển đổi chúng thành WebP.

Chỉ cần cẩn thận nếu bạn sử dụng hình ảnh .jpg bên trong định dạng SVG nội tuyến vì hệ thống của Google không thể lập chỉ mục cho những hình ảnh này.

2. Nén hình ảnh của bạn

Đúng vậy, không gì tồi tệ hơn là một trang web bị phình to sau khi tải lên một hình ảnh chưa được nén.

Các công cụ tìm kiếm sẽ nhìn vào trang web của bạn giống như bạn nhìn vào một cái xô lớn Crisco: Bạn không thể định nghiêm túc đặt nó lên trang web của mình, phải không?

Theo HTTP Archive, hình ảnh chiếm trung bình 21% trọng lượng của một trang web.

Đó là lý do tại sao tôi rất khuyến nghị nén hình ảnh của bạn trước khi tải lên trang web của bạn. Bạn có thể làm điều này trong Photoshop hoặc bạn có thể sử dụng một công cụ như TinyPNG.

TingPNG cũng có một plugin WordPress mà bạn có thể sử dụng.

Tuy nhiên, tôi thích sử dụng WP Smush làm plugin WordPress của mình. Nó giảm kích thước tệp hình ảnh mà không làm mất chất lượng.

Dù bạn sử dụng plugin nào, hãy chắc chắn tìm một plugin nén hình ảnh ở bên ngoài máy chủ của họ. Điều này giảm tải trên trang web của bạn.

Hoặc, bạn có thể đi một bước xa hơn và sử dụng một CDN hình ảnh phát hiện thiết bị và tối ưu hóa hình ảnh trước khi giao hàng. Cloudinary và Imgix là hai tùy chọn để thử nghiệm.

Increasingly.com đã cải thiện tốc độ trang web lên 33% / 2 giây bằng cách nén hình ảnh.

Tôi có nghĩa là, có một cái gì đó hấp dẫn về tốc độ tải trang nhanh hơn khi bạn nén hình ảnh của mình.

Nếu bạn không chắc chắn cách hình ảnh của bạn ảnh hưởng đến tốc độ trang của bạn, tôi khuyên bạn nên sử dụng công cụ PageSpeed Insights của Google.

3. Tạo ra hình ảnh độc đáo

Bạn muốn hình ảnh của bạn nổi bật trên trang web của bạn. Nếu bạn điền trang web của mình bằng hình ảnh cổ điển, bạn sẽ trông không độc đáo – giống hàng nghìn trang web khác không nổi bật.

Quá nhiều trang web đầy quá nhiều hình ảnh cổ điển giống nhau.

Hãy nghĩ về một trang web doanh nghiệp, một công ty tư vấn, một doanh nghiệp tự hào về dịch vụ khách hàng. Tất cả các trang web này đều sử dụng hình ảnh cổ điển giống nhau của một người đàn ông cười.

Tôi chắc chắn bạn đã nhìn thấy một hình ảnh giống như thế này:

Dù bạn đã tối ưu hình ảnh cổ điển của mình một cách hoàn hảo hay không, nó sẽ không có cùng tác động hoặc lợi ích SEO tiềm năng như một hình ảnh gốc chất lượng cao và độc đáo.

Càng có nhiều hình ảnh gốc bạn có, trải nghiệm tốt hơn cho người dùng và khả năng xếp hạng tốt hơn trên các tìm kiếm liên quan của bạn càng cao.

Hãy nhớ rằng các hình ảnh lớn có khả năng xuất hiện trong Google Discover.

Như Google đề xuất trong nguồn tài nguyên SEO nâng cao của mình,

“Hình ảnh lớn cần có ít nhất 1200 px rộng và được bật bằng cách sử dụng cài đặt max-image-preview: large hoặc bằng cách sử dụng AMP.”

Đừng sử dụng logo của bạn như hình ảnh.

4. Cẩn thận với bản quyền

Bất kể các tệp hình ảnh bạn chọn sử dụng, hãy đảm bảo không có xung đột bản quyền.

Cục Bưu chính đang trả 3,5 triệu đô la trong một vụ kiện bản quyền hình ảnh. Và, Skechers đã bị kiện 2,5 triệu đô la.

Nếu Getty, Shutterstock, DepositFiles hoặc một nhà cung cấp hình ảnh cổ phiếu khác sở hữu một hình ảnh mà bạn sử dụng và bạn không có giấy phép sử dụng, thì bạn rủi ro bị kiện với một vụ kiện đắt đỏ.

Theo Đạo luật Bản quyền Thiên niên kỷ Số hóa (DMCA), bạn có thể nhận được thông báo nếu bạn vi phạm bất kỳ vấn đề bản quyền nào. Nếu chủ sở hữu của một nội dung nhìn thấy nội dung của họ trên trang web của bạn, họ có thể đưa ra một yêu cầu gỡ bỏ DMCA mà bạn phải tuân thủ.

Google Images cho phép bạn lọc kết quả dựa trên những hình ảnh có sẵn để sử dụng lại và Mindy Weinstein chia sẻ 41 trang web khác nhau để tìm hình ảnh miễn phí.

5. Đặt tên tệp hình ảnh theo ý muốn

Khi nói đến SEO, việc tạo tên tệp mô tả, giàu từ khóa là vô cùng quan trọng.

Không tùy chỉnh tên tệp hình ảnh của bạn giống như mua một chiếc burrito không có gì bên trong. Nó đơn giản là tồi tệ.

Tên tệp hình ảnh thông báo cho Google và các công cụ tìm kiếm khác về vấn đề chủ đề của hình ảnh.

Thường thì, tên tệp sẽ có dạng “IMG_722019” hoặc tương tự. Đó giống như việc đặt món ăn từ một thực đơn bằng một ngôn ngữ khác. Nó không giúp ích cho Google.

Thay đổi tên tệp từ tên mặc định để giúp các công cụ tìm kiếm hiểu hình ảnh của bạn và nâng cao giá trị SEO của bạn.

Điều này đòi hỏi một chút công việc, tùy thuộc vào thư viện phương tiện của bạn có đến đâu, nhưng việc thay đổi tên hình ảnh mặc định luôn là một ý tưởng tốt.

Hãy giả sử bạn có một hình ảnh về sô cô la chẳng hạn.

Tôi có thể đặt tên nó đơn giản là “chocolate” nhưng nếu bạn bán sô cô la trên trang web của mình, tiềm năng mỗi hình ảnh có thể được đặt tên là “chocolate-1,” “chocolate-2,” và cứ thế.

Tôi đã đặt tên hình ảnh này là “dark-chocolate-coffee” để cho người dùng và các công cụ tìm kiếm hiểu hình ảnh này.

Liên quan: Google về tên tệp hình ảnh và một sai lầm SEO đáng ngạc nhiên

6. Viết Văn Bản Thay Thế Thân Thiện Với SEO cho Hình Ảnh

Alt tags là một phương án thay thế văn bản cho hình ảnh khi một trình duyệt không thể hiển thị chính xác chúng. Tương tự như tiêu đề, thuộc tính alt được sử dụng để mô tả nội dung của tệp hình ảnh.

Khi hình ảnh không tải, bạn sẽ nhìn thấy một hộp hình ảnh với thẻ alt hiện ở góc trên bên trái. Hãy chắc chắn rằng chúng phù hợp với hình ảnh và làm cho hình ảnh liên quan.

Chú ý đến alt tags cũng có lợi cho chiến lược SEO trên trang tổng thể. Bạn muốn đảm bảo rằng tất cả các yếu tố tối ưu hóa khác đều được đặt vào đúng vị trí, nhưng nếu hình ảnh không tải lên vì bất kỳ lý do gì, người dùng sẽ thấy hình ảnh được dự định là gì.

Ngoài ra, việc thêm các thẻ alt phù hợp cho các hình ảnh trên trang web của bạn có thể giúp trang web của bạn đạt được xếp hạng tốt hơn trên các công cụ tìm kiếm bằng cách liên kết từ khóa với hình ảnh. Thậm chí Google cũng đã nhận xét về giá trị của văn bản thay thế cho hình ảnh.

Văn bản thay thế cung cấp cho Google thông tin hữu ích về chủ đề của hình ảnh. Chúng tôi sử dụng thông tin này để giúp xác định hình ảnh tốt nhất để trả về cho truy vấn của người dùng.

Văn bản thay thế là bắt buộc theo Đạo luật Khuyết tật Mỹ đối với những người không thể xem hình ảnh. Văn bản thay thế mô tả chi tiết được đặt cho người dùng biết chính xác hình ảnh có gì. Ví dụ, giả sử bạn có một bức tranh về sô cô la trên trang web của bạn.

Văn bản thay thế có thể đọc:

<img src=”chocolate-1.jpg” alt=”chocolate”/>

Tuy nhiên, một văn bản thay thế tốt hơn để mô tả hình ảnh sẽ đọc:

<img src=”chocolate-1.jpg” alt=”dark chocolate coffee flavored bar”/>

Văn bản thay thế có thể được xem trong phiên bản văn bản đệm của trang, giúp tăng lợi ích cho cả người dùng và các công cụ tìm kiếm. Đối với giá trị SEO tiếp theo, văn bản thay thế có thể làm nút neo nội bộ khi hình ảnh liên kết đến một trang khác trên trang web.

7. Xem xét cấu trúc tệp hình ảnh

Google đã cập nhật Hướng dẫn Hình ảnh của mình. Một trong những cập nhật quan trọng mà họ tiết lộ là họ sử dụng đường dẫn tệp và tên tệp để xếp hạng hình ảnh.

Lặp lại: Đường dẫn tệp và tên tệp là một yếu tố xếp hạng thực sự.

Ví dụ, nếu bạn là một thương hiệu thương mại điện tử với nhiều sản phẩm, thay vì đặt tất cả các hình ảnh sản phẩm của bạn vào một thư mục chung / media /, tôi khuyên bạn nên cấu trúc các thư mục con của mình để liên quan đến các chủ đề liên quan như /shorts/ hoặc /denim/.

Get Your Free SEO Template. Start Saving Time & Ranking Higher.

8. Tối ưu tiêu đề và mô tả trang của bạn

Google cũng tiết lộ rằng nó sử dụng tiêu đề trang và mô tả là một phần của thuật toán tìm kiếm hình ảnh của mình.

Trang hỗ trợ Google nói:

Tất cả các yếu tố cơ bản của SEO trên trang như dữ liệu meta, thẻ tiêu đề, bản sao trên trang, dữ liệu có cấu trúc, v.v. ảnh hưởng đến cách Google xếp hạng hình ảnh của bạn.

Giống như việc đặt tất cả các loại nước sốt lên burrito của bạn. Nó thực sự ngon hơn với guacamole. Vì vậy, hãy chắc chắn thêm guacamole để cải thiện xếp hạng hình ảnh.

9. Xác định kích thước hình ảnh của bạn

Nếu bạn đang sử dụng AMP hoặc PWAs, bạn phải xác định kích thước hình ảnh trong mã nguồn.

Tuy nhiên, nếu bạn không sử dụng cả hai, việc xác định chiều rộng và chiều cao vẫn là một thực hành tốt. Nó cung cấp trải nghiệm người dùng tốt hơn.

Ngoài ra, nó cho phép các trình duyệt xử lý hình ảnh trước khi CSS được tải. Điều này ngăn trang nhảy lên khi tải.

Thuộc tính kích thước hình ảnh cũng quan trọng để ngăn chặn các vấn đề về Cumulative Layout Shift (CLS) có thể gây cản trở cho tối ưu hóa Core Web Vitals của bạn.

Đảm bảo rằng bạn bao gồm các thuộc tính chiều rộng và chiều cao cho mọi yếu tố hình ảnh và video là quan trọng.

10. Tạo hình ảnh thân thiện với di động

Ồ, SEO di động. Ở mức tệ nhất, nó có thể khiến tỷ lệ thoát cao và tỷ lệ chuyển đổi thấp. Nhưng, ở mức tốt nhất, nó có thể mang lại cho bạn nhiều sức mạnh xếp hạng và tương tác người dùng tốt hơn.

Vấn đề là, làm thế nào để tối ưu hình ảnh của bạn cho chỉ mục di động lần đầu tiên?

May mắn thay, Google cung cấp hướng dẫn về các thực hành tốt cho hình ảnh.

Ngắn gọn, bạn muốn tạo hình ảnh đáp ứng. Điều này có nghĩa là hình ảnh sẽ tự điều chỉnh kích thước theo kích thước của trang web, dù người dùng sử dụng máy tính để bàn hay di động. Nó điều chỉnh kích thước theo kích thước thiết bị.

Mozilla cung cấp hướng dẫn chi tiết về việc sử dụng các thuộc tính srcset và sizes để cung cấp cho trình duyệt các hình ảnh nguồn phụ bổ sung, cho phép hiển thị nội dung hình ảnh giống nhau đã được thay đổi kích thước cho thiết bị.

Quan trọng là định dạng nó với một phần khác nhau của giá trị thuộc tính trên mỗi dòng, như được thể hiện trong ví dụ này từ nguồn tài nguyên của họ:

<img srcset=”elva-fairy-480w.jpg 480w,

elva-fairy-800w.jpg 800w”

sizes=”(max-width: 600px) 480px,

800px”

src=”elva-fairy-800w.jpg”

alt=”Elva dressed as a fairy”>

Tìm hiểu thêm về việc sử dụng srcset để tạo hình ảnh đáp ứng tại đây.

11. Thêm hình ảnh vào bản đồ trang của bạn

Dù bạn đang thêm hình ảnh của mình vào bản đồ trang hiện có của bạn hay tạo một bản đồ trang mới cho hình ảnh, bạn muốn có hình ảnh ở đâu đó trong bản đồ trang của bạn.

Có hình ảnh của bạn trong bản đồ trang cực kỳ tăng khả năng công cụ tìm kiếm lục và xếp hạng các hình ảnh của bạn. Do đó, dẫn đến nhiều lưu lượng truy cập trang web hơn.

Nếu bạn đang sử dụng WordPress, Yoast và RankMath cung cấp một giải pháp bản đồ trang trong plugin của họ.

12. Thêm dữ liệu có cấu trúc

Dữ liệu có cấu trúc gắn kết các loại nội dung của bạn để hướng dẫn Google và các công cụ tìm kiếm cung cấp kết quả trực quan tốt hơn. Về cơ bản, Google có thể phục vụ hình ảnh của bạn như một kết quả phong phú nếu bạn thêm dữ liệu có cấu trúc.

Ví dụ, nếu bạn sử dụng schema markup trên một trang sản phẩm và bạn đánh dấu hình ảnh là một sản phẩm, Google có thể ghép hình ảnh này với một nhãn giá. Các công cụ tìm kiếm bỏ qua thuật toán và sử dụng thông tin được cung cấp trong dữ liệu có cấu trúc để cung cấp hình ảnh phù hợp.

Kết luận về Tối ưu hóa hình ảnh

Vì vậy, trước khi bạn bắt đầu tải hình ảnh lên trang web của bạn, hãy đảm bảo tuân thủ các nghi lễ tối ưu hóa hình ảnh từ trên đây.

Điều quan trọng nhất là đảm bảo hình ảnh và văn bản thay thế liên quan đến trang. Những điểm quan trọng khác:

Tối ưu hóa hình ảnh không phải là trò đùa. Với sự phát triển của công nghệ tìm kiếm bằng giọng nói, phương tiện đang trở nên ngày càng quan trọng và toàn bộ trang web của bạn sẽ được hưởng lợi từ việc thực hiện các bước trên.

Chúc bạn tìm được cách tối ưu hóa hình ảnh một cách thành công!

Ảnh nổi bật: Paulo Bobita/Search Engine Journal

Tìm hiểu thêm về chúng tôi tại: TRANHUNG Digital

Mọi bản chụp màn hình được thực hiện bởi tác giả