Design : Envelope Media Tech |
Hallo sobat!
Kembali di
blog codingin, setelah kemarin kita sudah berkenalan dengan yang namanya bahasa
pemrograman,apa saja jenis, tingkatan dan lainnya, kini saatnya kita berkenalan dengan beragam
bahasa program yang terdapat didalamnya.
Untuk sobat yang belum tahu dengan postingan kami sebelumnya
silahkan baca dulu Kenalan dengan bahasa pemrograman
Dan jika sudah, yuk mari kita lanjutkan.
Oke, saat
sobat ingin membuat sebuah website ataupun blog , sobat akan menggunakan salah
satu bahasa program yang namanya HTML atau
HyperText Markup Langunge.
Apa itu HTML?
HyperText Markup Languange (selanjutnya HTML) merupakan sebuah bahasa
standar dalam pemrograman untuk membuat sebuah dokumen web (halaman web)
terdiri dari kode-kode singkat yang mana kode tersebut akan memerintah web
browser untuk menampilkan bagaimana susunan, struktur, hingga bentuk dari
sebuah website/blog. Nah, jika sobat akan membangun sebuah website atau bahkan
ingin menjadi seorang developer web, maka html-lah yang harus sobat pelajari
dan pahami terlebih dahulu, hal ini karena dengan bahasa program html yang akan
lebih mensupport sobat untuk mudah menguasai bahasa markah ini, selain nantinya
juga bisa menggunakan bahasa python.
Apa saja struktur
dasar html?
Struktur dasar
html terdiri dari elemen, tag, dan atribut. Nah disini kita akan membahas satu
persatu dari struktur html tersebut:
Petama
elemen, elemen terdiri dari tiga bagin yaitu tag pembuka, tag isi, dan tag penutup. Contohnya title digunakan
untuk menampilkan judul dari sebuah website seperti :
<title>Codingin</title>
Kedua tag, tag merupakan sebuah teks khusus berupa dua
karakter “<” dan “>” dan didalamnya terdapat sebuah perintah elemen. Seperti
:
<html> untuk memulai pengkodingan di html dan diakhiri
dengan tag </html> di akhir pengkodingan
<head> untuk pengerjaan bagan kepala website dengan
isinya berupak informas, file, dokumen dan diakhiri tag </head>
<title> untuk pengerjaan bagian judul website dengan
isinya berupa judul dari website tersebut dan di akhiri </title>
<bodi> untuk pengerjaan bagian badan dan diakhiri dengan
tag </body>
Seperti pada gambar :
Ketiga atribut, atribut merupakan bagian yang terdapat dalam
sebuah elemen dan berfungsi memberikan penjelasan tambahan bagi sebuah elemen,
seperti :
1.
Class berfungsi untuk menentukan sebuah
classname pada sebuah elemen
2.
Id berfungsi untuk menentukan sebuah id unik
dalam sebuah elemen
3.
Style berfungsi untuk menentukan sebuah inline
sebuah CSS style sebuah elemen
4.
Title berfungsi menentukan informasi tambahan
untuk sebuah elemen
Bagaimana mengatur
halaman?
Lalu, setelah
sobat sudah tahu dengan pengenalan, struktruknya, elemen hingga tag, sekarang
kita masuk pada cara mengatur sebuah halaman dengan html dan pengenalan elemen
untuk penulisan yaitu :
- Heading, untuk penulisan pada judul ada beberapa elemen mengatur besar kecil tulisan pada halaman judul yaitu dengan menggunakan <h1> sampai dengan <h6>
Seperti gambar :
Disini silahkan sobat pilih salah satu diantara <h1>
sampai <h6>
hasilnya :
- Paragraf, membuat paragraph atau lebih tepatkan menuliskan isi dari laman website dalam bentuk paragraph setelah heading. Nah, caranya dengan menambahkan elemen tag <p>
seperti gambar :
hasilnya :
Teks editor
Perlu kita ingat sebelum membuat kodingan website seperti
gambar diatas, tentu saja kita menggunakan yang namanya sebuah teks editor, nah
teks editor tersebut berfungsi sebagai media untuk penulisan kodingannya, dan
tanpa teks editor maka kodingan tidak akan bisa berjalan. Contoh dari teks
editor tersebut yaitu notepad, notepad++, VSCode, SublimeText dan masih banyak
lagi.
Extensi File
Extensi file pada html ialah (.html) hal ini merupakan hal
wajib setelah sobat akan menyimpan file berformat html
Kesimpulan
Jadi, jika sobat ingin membuat sebuah website atau ingin
menjadi pengembang sebuah website maka html-lah yang harus sobat pelajari. Tidak
susah untuk mempelajarinya karena html sendiri sudah dibuat dengan tag, elemen
yang sedemikian rupa.
Baik sobat, itu tadi sedikit pengenalan dari bahasa
pemrograman html, semoga kita dapat saling berbagi sedikit ilmu dan bermanfaat.
Tetap nantikan postingan selanjutnya tentang perkenalan dengan bahasa program
dan tutorial lainnya.