Yang Perlu Diketahui
-
Di Safari: Klik kanan pada halaman web dan pilih Inspect Element.
- Di Chrome, Anda dapat mengklik kanan dan mengklik Inspect.
- Untuk mengaktifkan fitur di Safari: Safari > Preferensi > Lanjutan > centang Tampilkan menu Kembangkan di bilah menu kotak.
Artikel ini mengajarkan Anda cara memeriksa elemen situs web di Mac. Ini terlihat pada cara melakukannya melalui Safari dan Google Chrome.
Bagaimana Cara Menggunakan Fitur Inspect Element di Mac?
Sebelum memeriksa elemen di Mac saat menggunakan Safari, Anda harus mengaktifkan menu pengembang di dalam browser. Berikut ini cara mengaktifkannya dan apa yang harus dilakukan untuk memeriksa elemen.
Jika Anda dapat melihat Kembangkan antara Bookmark dan Jendela, Menu Pengembang telah diaktifkan, dan Anda dapat melompat ke langkah 4.
Menggunakan Fitur Elemen Inspeksi di Safari
Berikut cara menggunakan Inspect Element di Safari, browser default di komputer Mac.
-
Di Safari, klik Safari > Preferensi.
Image -
Klik Lanjutan.
Image -
Klik Tampilkan menu Kembangkan di bilah menu lalu tutup jendela.
Image - Saat menjelajahi situs web, klik kanan pada item yang ingin Anda periksa.
-
Klik Periksa Elemen.
Image -
Sekarang Anda dapat melihat kode di balik situs web yang telah Anda periksa.
Image
Menggunakan Fitur Elemen Inspeksi di Chrome pada Mac
Jika Anda menggunakan Chrome daripada Safari di Mac, akan lebih mudah untuk melihat elemen karena tidak perlu mengaktifkan fitur tersebut. Inilah yang harus dilakukan.
- Di Chrome, jelajahi situs web.
- Klik kanan pada elemen yang ingin Anda periksa.
-
Klik Periksa.
Image -
Sekarang Anda dapat melihat kode di jendela samping di Chrome.
Image
Mengapa Saya Tidak Dapat Memeriksa di Mac Saya?
Anda mungkin tidak dapat memeriksa elemen di Mac jika Anda belum mengaktifkan menu Pengembang di Safari. Berikut adalah pengingat bagaimana melakukannya.
-
Di Safari, klik Safari > Preferensi.
Image -
Klik Lanjutan.
Image -
Klik Tampilkan menu Kembangkan di bilah menu lalu tutup jendela.
Image
Cara Membuat Perubahan Situs Web dengan Memeriksa Elemen
Selain memungkinkan Anda untuk melihat kode di situs web, Anda juga dapat mengubah elemen situs web untuk sementara melalui Elemen Inspeksi. Berikut cara melakukannya melalui Safari.
Prosesnya sangat mirip dengan browser lain.
- Saat menjelajahi situs web, klik kanan pada item yang ingin Anda periksa.
- Klik Periksa Elemen.
- Klik dua kali pada teks dalam kode untuk membuatnya dapat diedit.
- Hapus atau masukkan string teks baru.
- Ketuk Enter.
- Kode sekarang telah diubah sementara hanya untuk keuntungan Anda.
Mengapa Anda Ingin Menggunakan Fitur Elemen Inspeksi?
Mampu memeriksa elemen sangat membantu karena berbagai alasan.
- Untuk mengubah kode dengan cepat. Perancang situs web untuk sementara dapat mengubah berbagai hal di situs web untuk melihat bagaimana perubahan tersebut memengaruhi berbagai hal.
- Untuk memeriksa kode. Baik desainer maupun orang pemasaran dapat memeriksa kode untuk mengonfirmasi bahwa hal-hal seperti detail Google Analytics ada di sana.
- Untuk melihat gambar secara terpisah dari situs. Jika sebuah situs tidak mengizinkan Anda untuk membuka gambar di tab atau jendela baru, melihat elemen memungkinkan.
-
Tinker. Melihat kode halaman web dapat membantu Anda memahami apa yang Anda lihat, menghilangkan misteri tentang apa dan mengapa ada apa dengan situs yang Anda kunjungi. Ini seperti membongkar alat untuk melihat cara kerjanya, tetapi tidak ada sekrup yang hilang dalam kasus ini.
FAQ
Apakah sah memeriksa situs web?
Ya. Namun, jika Anda berencana untuk menggunakan kode atau aset apa pun dari situs web, pastikan untuk menghubungi pemiliknya dan menambahkan catatan hak cipta.
Bagaimana cara menyalin HTML dari situs web dengan elemen inspeksi?
Di Chrome, klik kanan halaman dan pilih Inspect, lalu buka bagian atas dan klik kanan tag (mis.). Pilih Copy > Copy outerHTML, lalu tempel kode tersebut ke dalam file teks atau HTML.
Dapatkah saya menyalin CSS dari situs web dengan elemen inspeksi?
Ya. Klik kanan elemen yang ingin Anda salin dan pilih Inspect. Klik kanan pada kode yang disorot dan pilih Copy > Copy styles.
Bagaimana cara melihat kata sandi yang saya simpan menggunakan elemen inspeksi?
Untuk membuka kata sandi tersembunyi, klik kanan pada kotak teks kata sandi dan pilih Periksa. Di bagian yang disorot, cari type="password" dan ganti password dengan text. Ada cara yang lebih mudah untuk menampilkan semua sandi Anda di Chrome.
