Cara Mudah Belajar HTML Dengan Cara Amati, Tiru, dan Modifikasi

Berikut Adalah Cara Mudah Mempelajari HTML

Siapa pun yang serius ingin memiliki situs web perlu mengetahui tentang HTML, kode komputer yang membentuk situs web.

Berikut Adalah Cara Mudah Mempelajari HTML

HTML adalah bahasa yang sederhana - meskipun beberapa penutur asli mengklaim bahwa bahasa Swahili juga - terdiri dari karakter dari keyboard Anda. Tidak ada hieroglif yang mewah.

Perangkat lunak browser seperti Internet Explorer atau Mozilla Firefox membaca HTML dan membuat tampilan layar mengikuti instruksi yang ditampilkan dalam "tag" di HTML. Tag ini memberi tahu browser cara menampilkan teks dan area berwarna, dan cara mengimpor dan menampilkan gambar dengan cara tertentu untuk membuat halaman web yang menarik.

Anda dapat melihat HTML halaman web apa pun dengan mengklik kanan area kosong halaman web dan kemudian memilih Lihat Sumber atau Lihat Sumber Halaman. Sebuah jendela baru akan terbuka dan Anda akan melihat kode HTML.

Anda dapat mempelajari HTML dengan menyimpan kode ini ke komputer Anda dan bereksperimen dengannya. Untuk memulai, pilih halaman yang tampak sederhana, sebaiknya halaman beranda. Halaman rumah sering disebut sebagai "index.htm" atau "index.html".

Jika kode sumber terlihat di layar Anda, Anda dapat menyimpan halaman web ke komputer Anda dengan mengklik "File/Save As" atau "File/Save Page As". Jika sudah, taruh di folder baru. Ini akan membantu menjaga proyek pembelajaran Anda terorganisir.

Anda dapat menginstruksikan browser Anda untuk membaca versi file yang disimpan secara lokal dengan mengklik "File/Open" atau "Open File/File" saat browser terbuka dan menavigasi ke file yang baru saja Anda simpan. Jika Anda memiliki browser dengan tab, gunakan tab baru untuk itu sehingga Anda dapat kembali ke versi web-host asli.

Jika Anda membuka versi lokal, Anda mungkin melihat gambar yang hilang - gambar mungkin belum disimpan dengan HTML. Kemudian kembali ke versi web. Simpan setiap gambar yang hilang satu per satu dengan mengklik kanan pada gambar dan memilih "Simpan Gambar Sebagai" dan simpan di folder yang Anda buat sebelumnya. Jangan mengubah nama file gambar.

Kembali ke tampilan browser dari halaman web yang disimpan secara lokal dan segarkan layar dengan mengklik tombol segarkan atau menekan F5. Jika semuanya berjalan dengan baik, gambar yang hilang akan muncul. Pengecualian dapat terjadi jika struktur direktori asli situs web menyimpan gambar dalam subdirektori.

Jika Anda sudah mahir, Anda akan membuat subfolder yang identik dan menyimpan gambar di sana. Tetapi karena Anda seorang pemula, lupakan saja dan hiduplah dengan apa yang Anda miliki.

Pencurian selesai! Mulailah dengan itu...

Sekarang setelah Anda membangun kembali halaman berbasis web secara lokal, Anda dapat belajar dengan mengamati dan memodifikasi kode HTML. Anda dapat melihat perubahan yang dihasilkan pada halaman yang ditampilkan.

Untuk melakukan ini, Anda harus membuka file HTML yang sama di browser dan juga di Notepad. Browser harus direferensikan ke file HTML lokal seperti yang dijelaskan di atas. Kemudian buka Notepad dan buka file HTML yang sama di dalamnya. Di bagian bawah jendela Notepad yang bertuliskan "Save as type", pastikan untuk memilih "All files". Jika tidak, file HTML bahkan tidak akan muncul di kotak pencarian.

Atur jendela browser dan jendela Notepad sehingga Anda dapat melihat keduanya. Saya suka membiarkan browser dimaksimalkan dan Notepad "pra" mengisi bagian bawah layar. Ketika saya membuat perubahan pada file Notepad, saya mengklik File/Save dan kemudian tombol Refresh di browser. Jendela Notepad meminimalkan dirinya sendiri dan Anda memiliki cukup waktu untuk melihat perubahan yang Anda buat di tampilan browser.

Jangan khawatir jika Anda melakukan kesalahan. Jika perubahan Anda tidak menguntungkan, buka kembali file Notepad dengan mengklik tombol yang sesuai di bagian bawah layar Anda, lalu klik Edit/Urungkan di Notepad, lalu File/Simpan. Segarkan browser dan boo-boo akan hilang.

Saya tidak akan mengajarkan HTML dalam artikel ini. Poingo Resources memiliki sumber daya yang bagus untuk mempelajari HTML secara mendalam.

Namun, saya akan memberi Anda beberapa hal untuk membantu Anda memulai:

1. Semua "tag" HTML dimulai dan diakhiri dengan karakter yang dikenal sebagai "kurung", juga digunakan untuk "lebih besar dari" atau "kurang dari" dalam persamaan matematika. Saya tidak dapat memasukkannya ke dalam artikel ini karena dapat menyebabkan browser Anda kacau. Saya akan menggunakan { dan } sebagai gantinya dalam artikel ini untuk mewakili chevron.

2. Semua file HTML dimulai dengan {html} dan diakhiri dengan {/html}

3. File HTML memiliki dua bagian utama, "kepala" dan "tubuh". Bagian "head" dimulai dengan tag {head} dan diakhiri dengan tag {/head}.

4. Header berisi judul halaman dan data "meta", yang merupakan informasi yang tidak ditampilkan tentang halaman web itu sendiri. Bagian "kepala" halaman tidak penting. Anda bisa membuktikannya sendiri:

Di file Notepad, hapus tag {head} dan {/head} dan semua yang ada di antaranya. File/Simpan Notepad, segarkan browser dan lihat apa yang terjadi. Tampilan dapat berubah jika, misalnya, header berisi tautan ke lembar gaya terpisah, tetapi konten sebenarnya harus tetap ada di sana.

5. Bagian "body" dimulai dengan tag {body} dan diakhiri dengan tag {/body}. Ini berisi konten Anda dan karena itu sangat penting.

6. Selain tag HTML yang dijelaskan di atas, ada banyak tag lain yang memformat teks, membuat tabel, menautkan ke gambar, menautkan ke situs web lain, dan bahkan membuka email yang sudah dikemas dalam perangkat lunak email Anda sendiri.

7. Banyak tag, seperti yang di atas, memiliki tag pembuka dan penutup. Misalnya, jika saya ingin membuat beberapa bagian dari teks menjadi tebal, saya akan meletakkan tag {b} sebelum teks terlebih dahulu dan kemudian menempatkan {/b} setelah teks yang dicetak tebal.

8. Tag lain tidak memerlukan akhir, seperti B. {br}, yang membuat jeda baris, dan {p}, yang memulai paragraf baru.

Situs web rusak sekarang!

Anda sekarang memiliki informasi yang cukup untuk menjadi berbahaya. Mari kita terapkan.

Pelajaran Satu - Membuat Teks yang Nendang

Di file Notepad, cari bagian teks yang dapat dikenali di teks utama. Ubah teks menjadi sesuatu yang lucu, konyol atau cabul karena pendidikan harus menarik. Di editor, klik File/Simpan dan segarkan browser. Teks funky Anda akan muncul. Anda sekarang telah merusak halaman web pertama Anda. Selamat!

Pelajaran dua - Jadikan teks Anda tebal

Di file Notepad, tempatkan tag awal yang dicetak tebal {b} dan tidak dicetak tebal {/b} di sekitar teks. Simpan file Notepad dan segarkan browser. Lihat seperti apa. Anda sekarang telah dengan berani pergi ke tempat yang belum pernah Anda kunjungi sebelumnya.

Pelajaran Tiga - Tingkatkan Tulisan Anda

Untuk membuat teks Anda benar-benar besar, cobalah mengelilinginya dengan {h1} dan {/h1}. Selain membuat teks Anda menjadi sangat besar, tag ini memberi tahu mesin pencari bahwa menurut Anda teks ini SANGAT PENTING!!!

Pelajaran 4 - Menghilang dan tampilkan gambar lain

Seperti yang kita pelajari sebelumnya, gambar adalah file terpisah. Mereka dapat diakses melalui tag khusus yang mungkin terlihat seperti ini: <img src="http://www.my-ftp.com/images/westgate.jpg"> Temukan sesuatu yang terlihat seperti ini dan hapus seluruh ekspresi, termasuk dua tanda kurung. Simpan Notepad dan segarkan browser. Selamat tinggal foto!

Sekarang kembali ke Notepad dan klik "Edit/Undo". Simpan Notepad lagi dan segarkan browser. Selamat datang kembali!

Apakah Anda sudah menguasainya? Amati, Tiru, dan Modifikasi.

Next Post Previous Post
No Comment
Add Comment
comment url