Khi làm nội dung sản phẩm, bài viết hay trang nội dung bạn sẽ thường sử dụng các bài viết dạng text, có đôi khi trong bài viết sẽ cần đưa vào các bảng biểu, hình ảnh, hoặc nội dung cần chỉnh sửa lại màu sắc, font chữ, cỡ chữ cho phù hợp.

Bài viết khi có nhiều nội dung như vậy sẽ thường gây ra tình trạng dung lượng của bài viết khá lớn, khi bạn lưu bài viết hệ thống sẽ hiển thị thông báo bài viết đã vượt qua 30k ký tự, điều này cũng làm ảnh hưởng một phần không nhỏ đến tốc độ load trang cũng như chất lượng của website.

1.Tối ưu nội dung với bài viết có nhiều bảng biểu (table)

Bài viết có nhiều bảng biểu thường là các thông tin liên quan đến báo giá, lịch trình, chi phí của một dịch vụ..., ngoài ra còn có nhiều bài viết sử dụng bảng biểu với các mục đích khác nhau, tuy nhiên về nội dung thì cấu trúc bảng biểu thường khá phức tạp và sẽ sinh ra nhiều đoạn code trùng dẫn đến làm tăng dung lượng bài viết.

Tình trạng sử dụng bảng biểu khi xem bài viết trong Mã HTMl sẽ xuất hiện những đoạn code có quá nhiều style lặp lại, gây ra dung lượng bài viết lớn và ảnh hưởng đến tốc độ load trang, bạn xem thêm ảnh minh họa dưới đây:

Để tối ưu bài viết có nhiều bảng biểu, bạn thực hiện theo các bước sau :

• Bước 1: Tại trang quản trị website, truy cập vào trang sản phẩm, blogs hoặc trang nội dung và chọn bài viết cần tối ưu
• Bước 2: Trong trang chỉnh sửa bài viết, chọn mã HTML

• Bước 3: Tối ưu lại style bài viết bằng cách tạo thẻ style chung cho bài viết như ảnh dưới đây để thay thế cho các đoạn mã phát sinh khi tạo bảng biểu:

• Bước 4: Thực hiện thay đổi xong các đoạn mã style trong bài viết thì dung lượng sẽ được giảm đi khá nhiều.

2.Tối ưu nội dung với bài viết có chứa ảnh base64

Bài viết xuất hiện các hình ảnh chứa ảnh base64 là do người dùng có thể đã copy bài viết có hình ảnh từ một website khác sang hoặc copy nội dung từ file word lên trình soạn thảo của hệ thống.

Tình trạng khi copy ảnh từ một nơi khác sang Sapo Web thì ảnh trong bài viết có thể đã sử dụng dạng Base64 Image sẽ gây ra một số vấn đề :

• Làm tăng dung lượng của file ảnh gốc, ảnh lớn có thể tăng từ 3 - 20% dung lượng (tùy vào độ lớn của hình ảnh)
• Ngoài việc dung lượng bị tăng lên đáng kể do ký tự được mã hóa nhiều, hình ảnh tạo ra khi dùng Base64 Image sẽ không được cache ở trình duyệt sẽ dẫn đến khi load lại trang sẽ load lại toàn bộ hình ảnh, từ đó sẽ gây ảnh hưởng tới hiệu năng của website.
• Việc sử dụng chuỗi ký tự hình ảnh Base64 cũng sẽ làm rối đoạn mã HTML và khi thay đổi một số điểm trên hình ảnh thì phải chuyển đổi lại ảnh và thay đổi đoạn chuỗi đã mã hóa.

Bạn xem thêm ảnh minh họa dưới đây để thấy được hình ảnh có chứa Base64 có số lượng ký tự dẫn đến bài viết có dung lượng lớn:

Để tối ưu bài viết có ảnh base64, bạn thực hiện theo các bước sau:

• Bước 1: Tại trang quản trị website, truy cập vào trang sản phẩm, blogs hoặc trang nội dung và chọn bài viết cần tối ưu
• Bước 2: Trong trang chỉnh sửa bài viết, chọn mã HTML để nhận biết link ảnh base64
• Bước 3: Tiếp theo bạn vào Cấu hình và chọn Quản lý file, thêm mới file ảnh lên, sau đó copy đường dẫn. Bạn quay trở lại khung HTML của nội dung và up link ảnh vào sau src=" " để tối ưu đường dẫn.

• Bước 4: Thay lại link ảnh thành công bạn đã giảm bớt ký tự khá nhiều cho nội dung bài viết

3.Tối ưu đoạn mã HTML

• Bước 1: Truy cập đường link http://www.textfixer.com/html/compress-html-compression.php 
• Bước 2: Copy nội dung HTML vào khung sau đó chọn nút Compress HTML

• Bước 3: Nội dung đã được nén bạn copy đoạn HTML vào bài viết

• Bước 4: Thực hiện như vậy dung lượng đoạn mã HTML sẽ được tối ưu 1 phần.

Trên đây là các thao tác hướng dẫn Hướng dẫn tối ưu dung lượng bài viết

Mọi thắc mắc vui lòng liên hệ tổng đài 1900 6750, hoặc gửi vào hòm thư: [email protected] để Sapo được tư vấn và giải đáp giúp bạn.