HTML
Pengertian
HTML (HyperText Markup Language ) adalah bahasa standar yang digunakan untuk membuat atau membuka halaman website dan aplikasi web.
Sejarah HTML berawal dari Tim Berners-Lee ,seorang ahli fisika dari lembaga penelitian CERN yang berasal dari Swiss. HTML pertama kali diliris pada tahun 1991 dengan 18 tag . Sejak saat itu, setiap kali ada versi terbarunya, pasti akan selalu ada tag dan attribute yang baru juga .
Ketika anda menggunakan bahasa markup ini , Anda menggunakan struktur kode sederhana (tag dan attribute) untuk mark up halaman website. Misalnya, Anda membuat sebuah paragraf dengan menempatkan enclosed text di antara tag pembuka <p> dan tag penutup </p>.
<p>This is how you add a paragraph in HTML.</p>
<p>You can have more than one!</p>
Kita akan mempelajari tentang pengertian HTML, cara membuat file HTML, berkenalan dengan tag dan atribut HTML, hingga membahas tag-tag penting HTML, seperti tag <a>, tag <img>, <table>, dan tag <form> HTML.
Dalam mempelajari HTML, harap diingat bahwa HTML dirancang untuk membuat struktur dasar dari halaman web. Jika anda ingin merubah tampilan dari sebuah tag, misalnya ingin membuat background paragraf berwarna merah, atau ingin memberi efek bayangan pada gambar, sebaiknya menggunakan CSS, bukan langsung dari HTML.
Kerangka HTML
Berikut ini merupakan beberapa macam kerangka inti yang membentuk struktur bahasa markup mulai tag, elemen, dan atribut.
- Tag, merupakan perintah atau awalan instruksi yang nantinya akan dibaca pada web browser. Misalnya adalah penggunaan tag <strong>, yang berfungsi untuk memberikan ketebalan pada teks paragraf.
- Element, merupakan proses keseluruhan kode yang dimulai dari tag pembuka (< >) dan diakhiri dengan tag penutup (</>), sebagai contoh element <p>Ini adalah website saya</p>.
- Attribute, merupakan informasi atau perintah tambahan yang dimasukkan ke dalam sebuah elemen. Misalnya saja <img class=”gambar” src=”komputer.jpg” alt=”komputer1” />, sehingga atributnya adalah class, src dan alt image.
Tiga Unsur Penyusun Halaman Web
Untuk bisa menguasai pemrograman web secara komprehensif, setidaknya kita harus mempelajari 3 unsur penting penyusun halaman web .
HTML sebagai tulang, sendi, dan hal-hal lain yang merepresentasikan struktur bangunan tubuh halaman web.
Sedangkan bagian tubuh lainnya seperti kulit, rambut, atau aksesoris lain yang menyelimuti tubuh seperti pakaian, sepatu, topi dan sebagainya, maka itu direpresentasikan dan didefinisikan oleh CSS.
Contoh HTML Sederhana
Kode HTML tersusun dari elemen, tag, dan konten.
Berikut ini contoh kode HTML yang sangat sederhana.
<!DOCTYPE html>
<html lang="id">
<head>
<title>Belajar HTML Dasar | Jago Ngoding</title>
</head>
<body>
<h1>Halo, dunia!</h1>
<p>Aku akan mempelajari HTML</p>
</body>
</html>
Kode di atas berisi beberapa informasi seperti:
- <html> (Tag pembuka untuk HTML) untuk tag ini wajib karna ini pembuka
- <head>(Bagian kepala )
- <title>Belajar HTML Dasar | Jago Ngoding</title>(Tag untuk membuat judul)
- </head>(Bagian kepala)
- <body>(Bagian badan)
- <h1>Halo, dunia!</h1>( Bagian untuk ukuran Paragraf ,untuk menambahkan ukuran paragraf
- lain misalnya paragraf kedua tag akan berubah bukan lagi<h1> tetapi <h2> begitu juga dengan paragraf seterusnya <h3>,<h4>,<h5><h6> sampe seterusnya.
- <p>Aku akan mempelajari HTML</p>(Bagian untuk membuat paragraf)
- </body>(Bagian penutup badan)
- </html>(Bagian penutup untuk html )
Kemudian simpan file difolder baru agar mudah ditemukan.Dan simpan dengan nama
dan di tambah .html di belakang nam file anda.
Contoh:
👉Membuat warna font dengan menggunakan kode di html
Kode ini berfungsi mewakili berbagai macam warna dengan format tertentu yang dapat di baca
oleh bahasa komputer.Untuk lebih mengetahui kode warna anda bisa membuka web https://www.computerhope.com/htmcolor.htm
Berikut adalah beberapa kode warna HTML yang bisa dijadikan referensi untuk memberi warna pada font.
1.Red #FF0000 (255,0,0)
2.Black #000000 (0, 0, 0)
3.Yellow #FFFF00 (255, 255,0 )
4.White #FFFFFF (255,255,255)
5.Green #006400 (0,100,0)
👉Menggunakan kode warna di HTML
Untuk menggunakan kode warna dapat digunakan ditag <body> .Sedangkan untuk mengubah warna pada satu atau sebagian kecil anda dapat menngunakan format :
<font colors = "# ff0000"> text </font>
Warna yang ada di HTML dapat di defenisikan sebagai kode HEX yang merupakan kode berjumlah enam digit yang mewakili jumlah warna meraah, hijau, dan biru (RBG), contoh:
<h1 style="color:blue;">A Blue Heading</h1>
<p style="color:red;">A red paragraph.</p>
Try it Yourself »ðŸ‘‰Menggunakan size font
Untuk mengatur huruf pada HTML anda dapat menggunakan tag <font> dan tag penutup </font>.
<body>
<font size="1">ini adalah ukuran font 1</font><br>
<font size="2">ini adalah ukuran font 2</font><br>
<font size="3">ini adalah ukuran font 3</font><br>
<font size="4">ini adalah ukuran font 4</font><br>
<font size="5">ini adalah ukuran font 5</font><br>
<font size="6">ini adalah ukuran font 6</font><br>
</body>
Contohnya :
<h1 style="font-size:300%;">This is a heading</h1>
<p style="font-size:160%;">This is a paragraph.</p>
👉Menambahkan gambar di HTML
Dapat ditambahkan dengan menggunakan tan <img>.Tag ini memilki atribut yakni src.Jika tidak menggunakan src
maka gambar and tidak akkan di tamapilkan.Alamat URL gambar pada src dapat berupa URL maupun alamat path.
Contoh :
<img src="w3schools.jpg" alt="W3Schools.com" width="104" height="142">
Sekian materi html yang bisa saya jelaskan dalam blog saya yang berjurusan informatika mengenai HTML. Saya dengan nama Hani Wulandari.
