Cara Mengedit Halaman Web di Safari Menggunakan Elemen Inspeksi

Dengan alat Inspect Element-nya, Safari memungkinkan Anda mengotak-atik kode front-end dari halaman web mana pun. Jika Anda ingin menguji seperti apa tampilan halaman dengan teks atau gambar yang berbeda, Anda dapat melakukannya dengan mengubah kodenya dengan Inspect Element.

Ini adalah panduan sederhana yang ditujukan bagi pemula untuk menjelaskan bagaimana Anda dapat mulai bereksperimen dengan Inspect Element di Safari untuk mengedit teks dan gambar situs web dengan pengetahuan pengkodean minimal.

Apa itu Elemen Inspeksi?

Inspect Element adalah alat pengembang. Ini tersedia di Safari, meskipun juga di browser web lain seperti Chrome, Firefox, dan Edge. Dengan Inspect Element, Anda dapat mengintip di balik tirai situs web untuk mengungkapkan kode front-end-nya, seperti HTML dan CSS. Namun, itu tidak memberi Anda visibilitas back-end, seperti database-nya.

Anda tidak hanya dapat melihat kode ini, tetapi Anda juga dapat mengubahnya. Ini berarti Anda dapat mengubah tampilan situs web. Anda dapat mengganti gambar, menyusun ulang beberapa teks, menggunakan font yang berbeda, mengganti skema warnanya, dan banyak lagi. Namun, suntingan ini bersifat lokal. Mereka tidak akan muncul kepada orang lain kecuali Anda; mereka menghilang setelah Anda menyegarkan atau menjauh dari halaman.

Mengapa Anda Harus Menggunakan Elemen Inspeksi?

Inspect Element adalah alat yang hebat jika Anda seorang pengembang web pemula. Anda benar-benar dapat melihat kode yang mendukung situs web favorit Anda, mengubahnya sesuai keinginan di lingkungan dunia nyata. Ada banyak wawasan menyenangkan yang bisa Anda peroleh dari menggunakan Elemen Inspeksi.

Misalnya, pemilik bisnis dapat melihat kata kunci yang disertakan dalam situs web pesaing, atau desainer dapat gunakan Inspect Element untuk mengidentifikasi font yang mereka anggap menarik atau dengan cepat menguji skema warna yang berbeda di situs web mereka.

Untuk saat ini, kita akan fokus pada pengeditan dasar-dasar halaman web menggunakan Inspect Element.

Cara Mengakses Elemen Inspeksi di Safari

Anda dapat membuka Inspect Element di Safari menggunakan menu pengembang:

1. Buka Safari.
2. Klik Safari di bilah menu atas.
3. Dari menu tarik-turun, pilih Preferensi.
4. Pilih Canggih pilihan.
5. Centang kotak yang bertuliskan Tampilkan menu Kembangkan di bilah menu.

Setelah memilih opsi ini, Anda dapat klik kanan di halaman web dan pilih Memeriksa elemen. Atau, Anda dapat memilih Mengembangkan di bilah menu, lalu Tampilkan Inspektur Web.

Cara Menemukan Elemen Web di Elemen Inspeksi

Untuk mulai mengedit elemen, klik kanan apa yang ingin Anda edit dan klik Memeriksa elemen. Ini akan membuka jendela pengembang, dengan bagian yang relevan disorot. Anda mungkin menemukan bahwa elemen tertentu yang ingin Anda elemen (gambar atau teks, katakanlah) tersembunyi; untuk menemukannya, gunakan panah di sebelah kiri untuk memperluas bagian bersarang.

Untuk membantu mempersempit pilihan Anda, klik ikon sasaran dari toolbar Inspect Element. Sekarang, saat Anda menavigasi melalui kode, itu menyoroti bagian itu di situs web. Atau Anda dapat menggunakan kursor untuk menentukan bagian di situs. Ini berguna ketika Anda ingin mengasah sesuatu yang khusus di area halaman web yang ramai.

Cara Mengedit Teks Situs Web Menggunakan Elemen Inspeksi

Untuk membuat sepotong teks dapat diedit setelah menemukannya di kode sumber situs, klik dua kali dia. Anda dapat mengetik teks baru langsung ke dalam kode, atau menghapus teks yang ada. Saat pengeditan selesai untuk string teks tertentu, tekan Memasuki, dan teks pada halaman web akan berubah.

Ini benar-benar sesederhana itu! Satu-satunya saat ini tidak akan berhasil adalah ketika teks sebenarnya adalah bagian dari gambar, seperti logo.

Cara Mengedit Gambar Situs Web Menggunakan Elemen Inspeksi

Sementara gambar muncul secara visual kepada Anda di front-end, dalam kode situs web mereka muncul sebagai tautan. Kamu bisa klik kanan dan gambar dan pilih Memeriksa elemen untuk melompat ke tempat gambar itu berada dalam kode. Gambar situs web biasanya memiliki ekstensi file JPG, GIF, atau PNG, meskipun tidak secara eksklusif.

Klik dua kali string gambar ini dan Anda dapat mengeditnya, atau hanya menyimpannya ke sistem Anda jika diinginkan. Jika Anda ingin mengganti gambar, alihkan ke URL gambar pengganti. Atau Anda dapat menghapus string kode seluruhnya untuk menghapus gambar dari tampilan.

Gali Situs Web Menggunakan Safari

Alat Elemen Inspeksi Safari memungkinkan Anda dengan mudah menemukan dan mengubah kode yang sesuai dengan teks dan gambar, semudah mengganti teks atau string URL. Setelah Anda selesai mengedit situs web dengan Inspect Element, cukup segarkan halaman dan semuanya akan kembali normal.

Cara Mengubah Situs Web Agen Pengguna dan Trik Peramban Anda

Baca Selanjutnya

Tentang Penulis