2026-09-13

Screenshot Halaman Web Penuh: Simpan Situs Apa Pun sebagai Gambar

Simpan satu halaman web utuh sebagai PNG, JPG, atau WebP. Bandingkan browser dan alat online, lalu atasi gambar kosong, tampilan desktop di ponsel, dan hasil terpotong.

Screenshot Halaman Web Penuh: Simpan Situs Apa Pun sebagai Gambar

Terakhir diperbarui: 13 September 2026. Pengukuran di bawah dilakukan dengan Chromium 151 tanpa antarmuka pada artikel Wikipedia publik.

Tombol screenshot hanya menyimpan bagian yang muat di monitor. Padahal halaman web biasanya jauh lebih panjang, tampil berbeda di ponsel, dan memuat sebagian gambarnya hanya saat Anda menggulir mendekatinya. Tiga fakta ini menjelaskan hampir semua tangkapan halaman yang mengecewakan: berhenti di layar pertama, versi "ponsel" ternyata versi desktop, atau separuh bawah penuh kotak abu-abu.

Jawaban cepat: bagaimana cara screenshot satu halaman web penuh?

Gunakan fitur tangkapan satu halaman penuh bawaan browser untuk halaman yang memerlukan login, dan alat HTML ke gambar online untuk halaman publik dengan lebar perangkat tertentu. Di Firefox, klik kanan halaman, pilih Ambil Tangkapan Layar, lalu Simpan halaman penuh. Di Chrome, buka DevTools, buka menu perintah, lalu pilih Capture full size screenshot.

Untuk halaman publik, tempel alamatnya ke HTML ke Gambar, pilih lebar desktop, tablet, atau ponsel, lalu aktifkan halaman penuh. Sebelum membagikan tangkapan, gulir hasilnya sekali: periksa gambar di bagian bawah, lebar tata letak, dan di mana halaman berakhir.

Metode tangkapan mana yang cocok untuk kebutuhan Anda?

Metode Paling cocok untuk Batasan utama
Tombol screenshot atau alat potong layar Bagian halaman yang terlihat Berhenti di tepi layar
"Simpan halaman penuh" di Firefox Halaman panjang saat sudah login Ikut merekam sesi dan cookie Anda
Tangkapan ukuran penuh di Chrome DevTools Emulasi perangkat yang tepat saat debugging Perlu DevTools dan beberapa klik
Alat HTML ke gambar online Halaman publik, sesi bersih, lebar tertentu Tidak bisa ke halaman login, localhost, atau intranet
Browser tanpa antarmuka lewat skrip Ratusan halaman atau tangkapan terjadwal Skrip dan server harus Anda rawat
  • Pilih browser jika isi halaman berubah setelah login.
  • Pilih alat online jika Anda butuh tampilan pengunjung baru atau tangkapan selebar ponsel dari komputer.
  • Pilih skrip hanya jika volumenya sepadan dengan perawatannya.

Panduan Chrome untuk mengambil screenshot dengan DevTools juga membahas tangkapan area atau satu elemen, berguna saat Anda hanya perlu satu komponen halaman. Mozilla mendokumentasikan opsi tangkapan layar Firefox, termasuk menyimpan halaman penuh.

Apa yang sebenarnya ditangkap "layar pertama" dan "halaman penuh"?

Tangkapan layar pertama tepat satu viewport: 1280 × 800 piksel pada pengaturan desktop yang umum. Tangkapan halaman penuh merender seluruh dokumen yang bisa digulir menjadi satu gambar panjang. Perbedaannya jauh lebih besar dari perkiraan kebanyakan orang.

Grafik batang: layar pertama 800px, tangkapan halaman penuh 12.000px, dan artikel 42.077px

Kami mengukur artikel "Cat" di Wikipedia pada lebar 1280 piksel: tinggi guliran mencapai 42.077 piksel, lebih dari 52 layar pertama yang ditumpuk. Alat kami membatasi tangkapan halaman penuh sampai 12.000 piksel, karena gambar sepanjang itu sudah sulit dilihat dan dibagikan, dan halaman dengan gulir tanpa akhir tidak akan pernah selesai. Jika perlu halaman yang lebih panjang, tangkap per bagian.

Tinggi juga memengaruhi format. WebP tidak bisa menyimpan gambar yang tinggi atau lebarnya melebihi 16.383 piksel, jadi tangkapan yang sangat panjang bisa gagal disimpan sebagai WebP meski berhasil sebagai PNG dan JPG.

Format apa yang sebaiknya dipakai untuk tangkapan halaman web?

Pilih PNG untuk halaman yang didominasi teks dan antarmuka, WebP untuk berbagi di web, dan JPG hanya bila tujuan menolak keduanya. Kami menyimpan tangkapan yang sama dari artikel "Cat" yang penuh gambar, berukuran 1280 × 12.000 piksel, dengan tiga cara:

Format Ukuran file Kompresi Cocok untuk
PNG 4,33 MB Lossless Arsip, tinjauan desain, laporan bug
JPG, kualitas 90 3,05 MB Lossy; teks kecil bisa sedikit buram Formulir dan aplikasi yang menolak format lain
WebP, kualitas 90 1,86 MB Lossy; teks kecil bisa sedikit buram Berbagi dan menyematkan di web

Halaman berisi teks dan antarmuka berwarna datar biasanya jauh lebih kecil sebagai PNG dibanding halaman penuh foto ini, karena itu PNG tetap menjadi bawaan untuk tangkapan antarmuka. Panduan format screenshot kami menjelaskan mengapa JPEG membuat teks kecil buram, dan perbandingan WebP, JPEG, dan PNG membahas untung ruginya lebih dalam. Untuk memperkecil tangkapan tanpa mengubah format, gunakan kompresor gambar.

Mengapa gambar hilang di screenshot halaman penuh?

Sebagian besar halaman modern memuat gambar secara lazy: browser hanya mengambil setiap gambar saat Anda menggulir mendekatinya. Tangkapan halaman penuh tidak menggulir, sehingga bagian bawah bisa masih berupa kotak kosong saat gambar diambil. Ulasan MDN tentang lazy loading menjelaskan perilaku browser ini.

Grafik: 44 dari 45 gambar bawah kosong jika langsung ditangkap, tidak ada setelah digulir dulu

Uji coba kami menunjukkan dampaknya dengan jelas. Di artikel "Cat", 55 dari 58 gambar memakai lazy loading. Saat langsung ditangkap, 44 dari 45 gambar di bawah dua layar pertama masih kosong. Setelah halaman digulir sampai habis lalu kembali ke atas, tidak ada lagi yang kosong.

  • Gulir sampai bawah lalu kembali sebelum menangkap dengan DevTools atau Firefox.
  • Tunggu satu atau dua detik setelah menggulir agar gambar terakhir selesai diunduh.
  • Periksa sepertiga bagian bawah hasil lebih dulu, karena celah biasanya muncul di sana.

Alat HTML ke Gambar kami sekarang melakukan guliran ini secara otomatis untuk tangkapan halaman penuh. Kami menambahkannya setelah mengukur angka di atas.

Mengapa screenshot ponsel menampilkan situs versi desktop?

Jendela yang sempit bukanlah ponsel. Banyak situs memilih tata letak berdasarkan string user agent browser, bukan lebar jendela. MDN menjelaskan deteksi melalui user agent ini dan alasan cara tersebut masih umum.

Grafik: di lebar 390px tata letak desktop setinggi 7.544px, versi ponsel 2.299px dengan user agent ponsel

Kami memuat artikel "Screenshot" di Wikipedia dua kali dalam viewport selebar 390 piksel. Dengan user agent desktop, situs mengirim tata letak desktop yang dijejalkan ke jendela sempit, setinggi 7.544 piksel. Dengan user agent ponsel, situs mengirim versi ponsel yang sebenarnya, setinggi 2.299 piksel.

Jadi, mempersempit browser desktop hampir tidak memberi tahu apa yang dilihat pengunjung ponsel. Mode perangkat di Chrome mengubah user agent sekaligus lebar, begitu pula opsi ponsel dan tablet di alat kami.

Mengapa alat online tidak bisa menangkap localhost, intranet, atau halaman yang perlu login?

Alat tangkapan online memuat halaman di servernya sendiri, dalam browser baru tanpa cookie. Alat itu tidak pernah melihat login yang Anda simpan, sehingga halaman yang perlu login akan tertangkap sebagai layar login.

Alat itu juga menolak alamat jaringan privat seperti localhost, 192.168.x.x, atau intranet perusahaan. Membiarkan pengunjung anonim membuat server mengambil alamat sembarang adalah celah keamanan yang dikenal sebagai server-side request forgery (SSRF), yang dijelaskan dalam ulasan SSRF dari OWASP. Alat yang cermat memeriksa setiap koneksi yang dibuat halaman, termasuk pengalihan, bukan hanya alamat yang Anda ketik.

Untuk halaman seperti itu, gunakan tangkapan halaman penuh di browser Anda sendiri. Fitur itu berjalan di komputer Anda dan di dalam sesi Anda, jadi melihat persis apa yang Anda lihat.

Mengatasi masalah tangkapan situs

Gejala Kemungkinan penyebab Solusi
Kotak abu-abu di separuh bawah Gambar lazy tidak pernah diminta Gulir dulu atau pakai alat yang menggulir otomatis
Tangkapan ponsel terlihat seperti desktop Situs memilih tata letak dari user agent Gunakan emulasi perangkat, bukan jendela sempit
Tangkapan menampilkan formulir login Browser baru tidak punya sesi Pakai tangkapan halaman penuh di browser Anda
Halaman berhenti di tengah artikel Batas tinggi atau gulir tanpa akhir Tangkap per bagian atau pilih layar pertama
Banner cookie menutupi isi Kunjungan pertama belum menyetujui Potong atau tutup di browser Anda
Alamat privat ditolak Sengaja diblokir untuk mencegah SSRF Tangkap di browser Anda sendiri

Banner atau header tetap yang menutupi isi paling mudah dihapus setelahnya: potong dengan Pemotong Gambar daripada menangkap ulang.

Daftar periksa sebelum membagikan tangkapan

  1. Pastikan lebar sesuai perangkat yang dimaksud.
  2. Periksa sepertiga bawah dari gambar kosong.
  3. Pastikan halaman berakhir di tempat yang tepat.
  4. Cari banner yang menutupi isi penting.
  5. Hapus data pribadi yang tak terlihat pengunjung.
  6. Pakai PNG untuk halaman penuh teks.
  7. Catat tanggal tangkapan.

Halaman web terus berubah. Saat tangkapan dipakai sebagai bukti, referensi desain, atau laporan bug, tanggalnya menjadi bagian dari apa yang direkamnya.

Pertanyaan yang Sering Diajukan

Bisakah saya menangkap halaman yang mengharuskan login?

Tidak dengan alat online yang tidak punya akses ke akun Anda; gunakan tangkapan halaman penuh di browser Anda sendiri saat sedang login.

Mengapa screenshot halaman penuh saya terpotong?

Banyak alat membatasi tinggi; alat kami berhenti di 12.000 piksel, dan halaman yang terus memuat konten saat digulir memang tidak punya ujung.

Apakah HTML ke gambar sama dengan screenshot website?

Dalam penggunaan sehari-hari, ya: keduanya merender halaman di browser lalu menyimpan hasilnya sebagai file gambar.

Lebar berapa yang dipilih untuk tangkapan ponsel?

Gunakan 390 piksel, lebar CSS banyak iPhone terbaru, bersama user agent ponsel agar situs mengirim tata letak ponsel yang sebenarnya.

Mengapa sebagian gambar tampil sebagai kotak kosong?

Gambar itu dimuat secara lazy dan belum diambil; gulir halaman sebelum menangkap atau gunakan alat yang melakukannya untuk Anda.

Bisakah saya menangkap satu bagian halaman saja?

Bisa; Chrome DevTools dapat menangkap satu elemen, atau tangkap halaman penuh lalu potong bagian yang dibutuhkan.

Apakah alat online menyimpan salinan halaman?

Alat itu memuat halaman di browser sementara untuk membuat gambar; periksa keterangan privasi tiap alat untuk mengetahui berapa lama hasilnya disimpan.

Gunakan alat gratis sambil mengikuti panduan.