Bagaimana cara melihat html di browser saya?

Artikel ini menjelaskan cara mengakses kode sumber HTML situs web di browser web Google Chrome, serta mengakses dan menggunakan alat pengembang Chrome. Melihat kode sumber situs adalah cara terbaik bagi pemula untuk mempelajari HTML

Lihat Kode Sumber di Chrome

Jadi bagaimana Anda melihat kode sumber situs web?

  1. Buka browser web Google Chrome (jika Anda belum menginstal Google Chrome, ini adalah unduhan gratis)

  2. Arahkan ke halaman web yang ingin Anda periksa

  3. Klik kanan halaman dan lihat menu yang muncul. Dari menu itu, klik Lihat sumber halaman

    Bagaimana cara melihat html di browser saya?
    Bagaimana cara melihat html di browser saya?

  4. Kode sumber untuk halaman itu sekarang akan muncul sebagai tab baru di browser

  5. Alternatifnya, Anda juga dapat menggunakan pintasan keyboard Ctrl+U di PC untuk membuka jendela dengan kode sumber situs yang ditampilkan. Di Mac, pintasan ini adalah Command+Option+U

Hilary Allison / Lifewire

Gunakan Alat Pengembang Chrome

Selain kemampuan View page source sederhana yang ditawarkan Google Chrome, Anda juga dapat memanfaatkan Developer Tools mereka yang luar biasa untuk menggali lebih dalam ke dalam sebuah situs. Alat-alat ini memungkinkan Anda tidak hanya melihat HTML, tetapi juga CSS yang berlaku untuk melihat elemen dalam dokumen HTML tersebut

Untuk menggunakan alat pengembang Chrome

  1. Buka Google Chrome

  2. Arahkan ke halaman web yang ingin Anda periksa

  3. Pilih menu tiga titik di pojok kanan atas jendela browser

  4. Dari menu, arahkan kursor ke Lebih banyak alat lalu pilih Alat pengembang di menu yang muncul

    Bagaimana cara melihat html di browser saya?
    Bagaimana cara melihat html di browser saya?

  5. Sebuah jendela akan terbuka yang menampilkan kode sumber HTML di sebelah kiri panel dan CSS terkait di sebelah kanan

  6. Alternatifnya, jika Anda mengklik kanan elemen di halaman web dan memilih Periksa dari menu yang muncul, alat pengembang Chrome akan muncul dan menyorot bagian tertentu yang Anda pilih di HTML dengan CSS yang sesuai ditampilkan di sebelah kanan. Ini sangat membantu jika Anda ingin mempelajari lebih lanjut tentang bagian tertentu dari suatu situs

Cara Memeriksa Elemen di Mac

Apakah Melihat Kode Sumber Sah?

Selama bertahun-tahun, kami memiliki banyak pertanyaan desainer web baru apakah dapat diterima untuk melihat kode sumber situs dan menggunakannya untuk pendidikan mereka dan pada akhirnya untuk pekerjaan yang mereka lakukan. Meskipun menyalin kode situs secara grosir dan menyebarkannya sebagai milik Anda di situs web tentu saja tidak dapat diterima, menggunakan kode tersebut sebagai batu loncatan untuk belajar sebenarnya adalah berapa banyak kemajuan yang dibuat dalam industri ini.

Seperti yang kami sebutkan di awal artikel ini, Anda akan kesulitan menemukan profesional web yang bekerja hari ini yang belum mempelajari sesuatu dengan melihat sumber situs. Ya, melihat kode sumber situs itu legal. Menggunakan kode itu sebagai sumber daya untuk membangun sesuatu yang serupa juga aman. Mengambil kode apa adanya dan meneruskannya sebagai pekerjaan Anda adalah tempat Anda mulai menghadapi masalah.   

Pada akhirnya, profesional web belajar dari satu sama lain dan sering memperbaiki pekerjaan yang mereka lihat dan terinspirasi, jadi jangan ragu untuk melihat kode sumber situs dan menggunakannya sebagai alat pembelajaran.

Lebih Dari Sekedar HTML

Satu hal yang perlu diingat adalah bahwa file sumber bisa sangat rumit (dan semakin kompleks situs web yang Anda lihat, semakin kompleks pula kode situs tersebut). Selain struktur HTML yang menyusun halaman, juga akan ada CSS (cascading style sheets) yang menentukan tampilan visual situs tersebut. Selain itu, banyak situs web saat ini akan menyertakan file skrip yang disertakan bersama HTML

Kemungkinan ada beberapa file skrip yang disertakan; . Terus terang, kode sumber situs bisa tampak berlebihan, terutama jika Anda baru melakukannya. Jangan frustrasi jika Anda tidak segera mengetahui apa yang terjadi dengan situs tersebut. Melihat sumber HTML hanyalah langkah pertama dalam proses ini. Dengan sedikit pengalaman, Anda akan mulai memahami dengan lebih baik bagaimana semua bagian ini cocok satu sama lain untuk membuat situs web yang Anda lihat di browser. Saat Anda semakin terbiasa dengan kode tersebut, Anda akan dapat belajar lebih banyak darinya, dan kode tersebut tidak akan terlalu menakutkan bagi Anda.

FAQ

  • Bagaimana cara mengedit kode HTML di Chrome?

    Buka Alat Pengembang di Chrome dengan menekan Ctrl (atau Command di Mac) + Shift + I. Dari sana, tekan Ctrl (Command on Mac) + O dan pilih file sumber tersimpan yang ingin Anda edit untuk membukanya

  • Bagaimana cara melihat kode sumber halaman di Chrome jika Lihat Sumber dinonaktifkan?

    Jika situs web telah menonaktifkan opsi Lihat Sumber, Anda mungkin masih dapat melihatnya di balik terpal. Dari bagian atas jendela browser pilih View > Developer > View Source, yang akan menampilkan kode sumber halaman web

  • Bagaimana cara melihat kode sumber situs di Chrome menggunakan perangkat Android saya?

    Arahkan ke situs web yang ingin Anda lihat menggunakan aplikasi Chrome perangkat Anda, lalu pilih bilah alamat browser. Pindahkan kursor teks ke paling kiri—di depan URL—dan ketik view-source, lalu tekan Enter atau pilih Go

    Bagaimana cara melihat HTML di Chrome?

    Google Chrome .
    Klik ikon menu. pada bilah alat peramban
    Pilih Alat lainnya, lalu Lihat Sumber

    Bagaimana cara melihat HTML?

    Ponsel atau tablet Android menggunakan Chrome .
    Buka browser Google Chrome di ponsel atau tablet Android Anda
    Buka halaman web yang kode sumbernya ingin Anda lihat
    Ketuk sekali di bilah alamat dan gerakkan kursor ke depan URL
    Ketik sumber tampilan. dan ketuk Enter atau Go

    Bisakah HTML dilihat di browser apa pun?

    HTML. Melihat file HTML . Anda dapat melakukan ini tanpa harus memindahkan file ke ~/. www, ubah izin, dll. Selain itu, sebagian besar browser juga memungkinkan Anda melakukan perubahan (berdasarkan WYSIWYG). You can view an HTML-file that is under preparation by opening it in a browser. You can do this without having to move the file to ~/. www, change permissions, etc. Moreover, most browsers will allow you do changes as well (on a WYSIWYG basis).