, ,

Belajar Dasar-Dasar HTML Untuk Pemula

Setelah sekian lama nggak check this blog karena peradaban dunia maya yang terus berkembang. Jujur saja, nulis blog di jaman sekarang tuh rasanya sangat membosankan ketimbang ngepost konten di sosmed. Beda dengan 10 tahun lalu, blog ibarat game "Mobile Legends" yang bikin saya lupa waktu karena terlalu asik berimajinasi. wkwkwk...

So, kenapa saya bisa nongol lagi pada postingan kali ini? Coz ini adalah tugas kuliah yang diturunkan oleh dosen pengampu mata kuliah Pemrograman Internet. Langsung saja kita membahas terlebih dahulu tentang HTML.

Apa itu HTML?

HTML adalah singkatan dari Hypertext Markup Language. Disebut hypertext karena di dalam HTML sebuah text biasa dapat berfungsi lain, kita dapat membuatnya menjadi link yang dapat berpindah dari satu halaman ke halaman lainnya hanya dengan meng-klik text tersebut. Kemampuan text inilah yang dinamakan hypertext, walaupun pada implementasinya nanti tidak hanya text yang dapat dijadikan link.
Disebut Markup Language karena bahasa HTML menggunakan tanda (mark), untuk menandai bagian-bagian dari text. Misalnya, text yang berada di antara tanda tertentu akan menjadi tebal, dan jika berada di antara tanda lainnya akan tampak besar. Tanda ini di kenal sebagai HTML tag.
HTML bukanlah bahasa pemrograman (programming language), tetapi bahasa markup (markup language), hal ini terdengar sedikit aneh, tapi jika anda telah mengenal bahasa pemrograman lain, dalam HTML tidak akan ditemukan struktur yang biasa di temukan dalam bahasa pemrograman seperti IF, LOOP, maupun variabelHTML hanya sebuah bahasa struktur yang fungsinya untuk menandai bagian-bagian dari sebuah halaman.
Selain HTML, dikenal juga xHTML yang merupakan singkatan dari eXtensible Hypertext Markup LanguagexHTML merupakan versi lama dari HTML (sebelum era HTML5 seperti saat ini). xHTML menggunakan aturan penulisan yang lebih ketat. Jika anda menemukan artikel yang membahas xHTML, bisa disamakan dengan HTML, karena perbedaannya tidak terlalu banyak.
Btw empat paragraf di atas ini saya kutip dari situs duniailkom.
Cara menjalankan HTML
kita bisa membuat file yang disimpan dengan ekstensi .html dengan menggunakan aplikasi notepad atau semacamnya.
Contoh:
Ketikkan kode ini di notepad:


simpan dengan nama belajar_1.html, kemudian buka file tersebut di browser, dan berikut hasilnya:


Pengertian Tag Tag HTML Belajar 1 :

<html> (Untuk membuat sebuah dokumen HTML)
<head> (Untuk memulai Bagian Header atau Atas)
<title> (Tag untuk membuat judul dari sebuah halaman)
<body> (Tag untuk membuat tubuh dari sebuah halaman)
<h1>to<h6> (Tag untuk membuat heading)

belajar_2.html



hasilnya:

Pengertian Tag Tag HTML Belajar 2 :

<html> (Untuk membuat sebuah dokumen HTML)
<head> (Untuk memulai Bagian Header atau Atas)
<title> (Tag untuk membuat judul dari sebuah halaman)
<body> (Tag untuk membuat tubuh dari sebuah halaman)
<h1>to<h6> (Tag untuk membuat heading)
<hr>(Tag untuk membuat perubahan dasar kata)
<p> (Tag untuk membuat paragraf)
<br> ( untuk Membuat sebuah baris baru atau enter dan Memasukan satu baris putus)

belajar_3.html




Hasilnya:


Pengertian Tag Tag HTML Belajar 3 :

<html> (Untuk membuat sebuah dokumen HTML
<head> (Untuk memulai Bagian Header atau Atas
<title> (Tag untuk membuat judul dari sebuah halaman
<body> (Tag untuk membuat tubuh dari sebuah halaman)
<h1>to<h6> (Tag untuk membuat heading)
<hr>(Tag untuk membuat perubahan dasar kata)
<p> (Tag untuk membuat paragraf)
<ol> (Tag untuk membuat daftar dengan nomor)
<li>  (Tag untuk membuat sebuah item daftar)
<ul>  (Tag untuk membuat daftar dengan selain nomor)

Belajar_4.html



HTML ini khusus untuk menampilkan gambar, berikut hasilnya:
Penjelasan:

untuk menampilkan gambar di browser, pastikan kita bisa menyebutkan nama dan "alamat" gambar yang dituju dengan jelas.

Jadi sampai disini dulu tulisan saya mengenai contoh-contoh dasar pembuatan file html. Jika ada salah dan kurang saya mohon maaf. Jangan segan untuk menyelipkan komentar Anda di bawah ini agar memotivasi saya untuk lebih semangat berkarya untuk kedepannya. :)

0 comments:

Post a Comment