2026-09-13

Chụp toàn bộ trang web: lưu mọi trang thành ảnh

Lưu cả trang web thành PNG, JPG hoặc WebP. So sánh trình duyệt với công cụ trực tuyến và khắc phục ảnh trống, bản máy tính trên điện thoại, ảnh bị cắt.

Chụp toàn bộ trang web: lưu mọi trang thành ảnh

Cập nhật lần cuối: ngày 13 tháng 9 năm 2026. Số liệu dưới đây đo bằng Chromium 151 không giao diện trên các bài Wikipedia công khai.

Phím chụp màn hình chỉ lưu phần vừa khung màn hình. Trang web thường dài hơn thế nhiều, hiển thị khác trên điện thoại và chỉ tải một số ảnh khi bạn cuộn tới gần. Ba điều này giải thích gần như mọi ảnh chụp trang web không như ý: ảnh dừng ở màn hình đầu, bản "điện thoại" thật ra là bản máy tính, hoặc nửa dưới toàn khung xám.

Câu trả lời nhanh: làm sao chụp toàn bộ một trang web?

Dùng tính năng chụp cả trang có sẵn trong trình duyệt cho trang bạn đã đăng nhập, và dùng công cụ HTML sang ảnh trực tuyến cho trang công khai theo độ rộng thiết bị cụ thể. Trong Firefox, nhấp chuột phải, chọn Chụp ảnh màn hình rồi Lưu toàn bộ trang. Trong Chrome, mở DevTools, mở menu lệnh và chọn Capture full size screenshot.

Với trang công khai, dán địa chỉ vào HTML sang ảnh, chọn độ rộng máy tính, máy tính bảng hoặc điện thoại, rồi bật chụp cả trang. Trước khi chia sẻ, xem lướt ảnh một lượt: kiểm tra ảnh gần cuối, độ rộng bố cục và nơi trang kết thúc.

Cách chụp nào hợp với việc của bạn?

Cách Phù hợp nhất cho Giới hạn chính
Phím chụp màn hình hoặc công cụ cắt Phần trang đang thấy Dừng ở mép màn hình
"Lưu toàn bộ trang" của Firefox Trang dài đã đăng nhập Chụp cả phiên và cookie của bạn
Chụp kích thước đầy đủ trong Chrome DevTools Giả lập thiết bị chính xác khi gỡ lỗi Cần mở DevTools và vài thao tác
Công cụ HTML sang ảnh trực tuyến Trang công khai, phiên sạch, độ rộng cố định Không vào được trang đăng nhập, localhost, mạng nội bộ
Trình duyệt không giao diện chạy bằng script Hàng trăm trang hoặc chụp theo lịch Tự bảo trì script và máy chủ
  • Chọn trình duyệt khi trang đổi nội dung sau khi đăng nhập.
  • Chọn công cụ trực tuyến khi cần giao diện của khách mới hoặc ảnh độ rộng điện thoại từ máy tính.
  • Chỉ chọn script khi khối lượng đủ lớn để đáng bảo trì.

Hướng dẫn của Chrome về chụp màn hình bằng DevTools còn chỉ cách chụp một vùng hoặc một phần tử, tiện khi bạn chỉ cần một khối của trang. Mozilla cũng hướng dẫn các tùy chọn chụp màn hình của Firefox, gồm cả lưu toàn bộ trang.

"Màn hình đầu" và "cả trang" thực sự chụp những gì?

Ảnh màn hình đầu đúng bằng một khung nhìn: 1280 × 800 pixel với thiết lập máy tính phổ biến. Ảnh cả trang vẽ toàn bộ tài liệu có thể cuộn vào một ảnh dài duy nhất. Khác biệt lớn hơn nhiều người nghĩ.

Biểu đồ so sánh màn hình đầu 800px, ảnh cả trang 12.000px và bài viết dài 42.077px

Chúng tôi đo bài "Cat" trên Wikipedia ở độ rộng 1280 pixel: chiều cao cuộn là 42.077 pixel, hơn 52 màn hình đầu xếp chồng. Công cụ của chúng tôi giới hạn ảnh cả trang ở 12.000 pixel, vì ảnh dài như vậy đã khó xem và chia sẻ, còn trang cuộn vô hạn thì sẽ không bao giờ chụp xong. Nếu cần trang dài hơn, hãy chụp từng phần.

Chiều cao cũng ảnh hưởng tới định dạng. WebP không lưu được ảnh cao hoặc rộng quá 16.383 pixel, nên ảnh rất dài có thể lưu WebP thất bại dù PNG và JPG vẫn được.

Nên dùng định dạng nào cho ảnh chụp trang web?

Chọn PNG cho trang chủ yếu là chữ và giao diện, WebP để chia sẻ trên web, và chỉ dùng JPG khi nơi nhận từ chối cả hai. Chúng tôi lưu cùng một ảnh 1280 × 12.000 pixel của bài "Cat" nhiều hình theo ba cách:

Định dạng Dung lượng Kiểu nén Phù hợp cho
PNG 4,33 MB Không mất dữ liệu Lưu trữ, duyệt thiết kế, báo lỗi
JPG, chất lượng 90 3,05 MB Mất dữ liệu; chữ nhỏ có thể mờ Biểu mẫu và ứng dụng từ chối định dạng khác
WebP, chất lượng 90 1,86 MB Mất dữ liệu; chữ nhỏ có thể mờ Chia sẻ và nhúng trên web

Trang gồm chữ và giao diện màu phẳng thường nén bằng PNG tốt hơn nhiều so với trang nhiều ảnh này, nên PNG vẫn là mặc định cho ảnh chụp giao diện. Hướng dẫn định dạng ảnh chụp màn hình giải thích vì sao JPEG làm nhòe chữ nhỏ, còn so sánh WebP, JPEG và PNG phân tích sâu hơn. Muốn giảm dung lượng mà giữ định dạng, hãy dùng công cụ nén ảnh.

Vì sao ảnh chụp cả trang bị thiếu hình?

Phần lớn trang web hiện đại tải ảnh kiểu lười: trình duyệt chỉ tải từng ảnh khi bạn cuộn tới gần. Ảnh chụp cả trang không cuộn, nên phần phía dưới có thể vẫn là khung trống lúc chụp. Bài viết của MDN về tải lười giải thích cơ chế này.

Biểu đồ: chụp ngay thì 44 trên 45 ảnh phía dưới trống, cuộn trước thì không còn ảnh trống

Thử nghiệm của chúng tôi cho thấy rõ điều đó. Bài "Cat" có 55 trên 58 ảnh dùng tải lười. Chụp ngay thì 44 trên 45 ảnh nằm dưới hai màn hình đầu vẫn trống. Sau khi cuộn hết trang rồi quay lên đầu, không còn ảnh nào trống.

  • Cuộn xuống cuối trang rồi quay lại trước khi chụp bằng DevTools hoặc Firefox.
  • Đợi một hai giây sau khi cuộn để các ảnh cuối tải xong.
  • Kiểm tra một phần ba phía dưới của ảnh trước, vì chỗ trống hay nằm ở đó.

Công cụ HTML sang ảnh của chúng tôi giờ tự cuộn như vậy khi chụp cả trang. Chúng tôi bổ sung sau khi đo các con số trên.

Vì sao ảnh chụp điện thoại lại ra bản máy tính?

Cửa sổ hẹp không phải điện thoại. Nhiều trang chọn bố cục dựa vào chuỗi user agent của trình duyệt chứ không dựa vào độ rộng cửa sổ. MDN mô tả cách nhận diện qua user agent và lý do nó vẫn phổ biến.

Biểu đồ: ở 390px bản máy tính cao 7.544px, với user agent điện thoại bản di động cao 2.299px

Chúng tôi tải bài "Screenshot" trên Wikipedia hai lần trong khung nhìn rộng 390 pixel. Với user agent máy tính, trang gửi bố cục máy tính bị ép vào cửa sổ hẹp, cao 7.544 pixel. Với user agent điện thoại, trang gửi bản di động thật, cao 2.299 pixel.

Vì vậy, thu hẹp trình duyệt máy tính hầu như không cho biết người dùng điện thoại thấy gì. Chế độ thiết bị của Chrome đổi cả user agent lẫn độ rộng, các tùy chọn điện thoại và máy tính bảng của chúng tôi cũng vậy.

Vì sao công cụ trực tuyến không chụp được localhost, mạng nội bộ hay trang cần đăng nhập?

Công cụ chụp trực tuyến tải trang trên máy chủ của nó, trong một trình duyệt mới không có cookie. Nó không bao giờ thấy thông tin đăng nhập đã lưu của bạn, nên trang cần đăng nhập sẽ bị chụp thành màn hình đăng nhập.

Nó cũng từ chối địa chỉ mạng riêng như localhost, 192.168.x.x hay mạng nội bộ công ty. Cho khách ẩn danh khiến máy chủ tải địa chỉ bất kỳ là lỗ hổng quen thuộc tên là giả mạo yêu cầu phía máy chủ (SSRF), được mô tả trong tổng quan SSRF của OWASP. Công cụ cẩn thận sẽ kiểm tra mọi kết nối của trang, kể cả chuyển hướng, chứ không chỉ địa chỉ bạn nhập.

Với những trang đó, hãy dùng tính năng chụp cả trang của chính trình duyệt bạn. Nó chạy trên máy bạn, trong phiên của bạn, nên thấy đúng những gì bạn thấy.

Xử lý sự cố khi chụp trang web

Hiện tượng Nguyên nhân thường gặp Cách xử lý
Khung xám ở nửa dưới Ảnh tải lười chưa được yêu cầu Cuộn trước hoặc dùng công cụ tự cuộn
Ảnh điện thoại trông như máy tính Trang chọn bố cục theo user agent Dùng giả lập thiết bị, không chỉ thu hẹp cửa sổ
Ảnh chụp ra biểu mẫu đăng nhập Trình duyệt mới không có phiên Chụp cả trang bằng trình duyệt của bạn
Trang dừng giữa bài viết Giới hạn chiều cao hoặc cuộn vô hạn Chụp từng phần hoặc chọn màn hình đầu
Thông báo cookie che nội dung Lần truy cập đầu chưa đồng ý Cắt bỏ hoặc tắt nó trong trình duyệt của bạn
Địa chỉ riêng bị từ chối Chặn có chủ ý để phòng SSRF Chụp bằng trình duyệt của bạn

Thông báo hoặc thanh tiêu đề cố định che nội dung dễ xử lý nhất sau khi chụp: cắt đi bằng công cụ cắt ảnh thay vì chụp lại.

Danh sách kiểm tra trước khi chia sẻ

  1. Độ rộng đúng thiết bị cần.
  2. Nửa dưới không có ảnh trống.
  3. Trang kết thúc đúng chỗ.
  4. Không có thông báo che nội dung.
  5. Xóa dữ liệu riêng tư.
  6. Giữ PNG cho trang nhiều chữ.
  7. Ghi lại ngày chụp.

Trang web thay đổi liên tục. Khi ảnh chụp dùng làm bằng chứng, tham chiếu thiết kế hay báo lỗi, ngày chụp cũng là một phần của thứ nó ghi lại.

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

Có chụp được trang yêu cầu đăng nhập không?

Công cụ trực tuyến không truy cập được tài khoản của bạn nên không chụp được; hãy dùng tính năng chụp cả trang của trình duyệt khi đã đăng nhập.

Vì sao ảnh chụp cả trang bị cắt ngang?

Nhiều công cụ giới hạn chiều cao; công cụ của chúng tôi dừng ở 12.000 pixel, còn trang tải thêm nội dung khi cuộn thì không có điểm kết thúc tự nhiên.

HTML sang ảnh có giống chụp màn hình trang web không?

Trong cách dùng thông thường là giống: cả hai đều hiển thị trang trong trình duyệt rồi lưu kết quả thành tệp ảnh.

Nên chọn độ rộng nào khi chụp giao diện điện thoại?

Dùng 390 pixel, độ rộng CSS của nhiều mẫu iPhone gần đây, kèm user agent điện thoại để trang gửi đúng bố cục di động.

Vì sao một số ảnh hiện thành khung trống?

Chúng dùng tải lười và chưa được tải lúc chụp; hãy cuộn trang trước khi chụp hoặc dùng công cụ tự cuộn giúp bạn.

Có chụp được riêng một phần trang không?

Có; Chrome DevTools chụp được một phần tử, hoặc bạn chụp cả trang rồi cắt phần cần dùng.

Công cụ trực tuyến có giữ bản sao trang không?

Nó tải trang trong một trình duyệt tạm thời để tạo ảnh; hãy xem thông tin quyền riêng tư của từng công cụ để biết kết quả được lưu bao lâu.

Sử dụng các công cụ miễn phí trong khi bạn theo dõi hướng dẫn.