Pengertian
HTML, Fungsi HTML serta Sejarah HTML
HTML
adalah bahasa markup internet (web) berupa kode dan simbol yang dimasukkan
kedalam sebuah file yang ditujukan untuk ditampilkan didalam sebuah website.
Singkatnya, HTML adalah bahasa markup yang digunakan untuk membuat website.
Website yang dibuat dengan HTML ini, dapat dilihat oleh semua orang yang
terkoneksi dengan internet. Tentunya dengan menggunakan aplikasi penjelajah
internet (browser) seperti Internet Explorer, Mozilla Firefox dan Google Chrome.
Seperti yang sudah saya jelaskan sebelumnya, HTML adalah singkatan dari Hyper
Text Markup Language. Tapi mengetahui singkatannya saja tidak akan cukup.
Karena itu saya akan menyajikan arti dari kata kata tersebut. HyperText adalah
metode dimana kita "berpindah" disekeliling web, dengan mengeklik
sebuah teks yang bernama hyperlink. Hyperlink adalah sebuah teks khusus di
internet, dimana saat teks tersebut diklik, akan membawa kita ke halaman web
selanjutnya/halaman web lain yang telah ditentukan. Markup adalah hal yang
dilakukan oleh tag HTML kepada teks yang ada didalamnya. HTML menandai teks
yang berada didalamnya sebagai tipe teks tertentu. Misalnya saja jika kita
menandai sebuah teks dengan tag html , maka teks tersebut akan berubah
menjadi italic (huruf yang miring). Sedangkan jika kita menandainya dengan ,
maka
teks tersebut akan berubah menajadi bold (huruf tebal). Language yang berarti
bahasa. HTML adalah sebuah bahasa, yang memiliki kata kata berupa kode dan
syntax seperti bahasa yang lain. Saat ini bahasa HTML masih terus dikembangkan
Hal ini dikarenakan pengguna internet semakin hari semakin berkembang pesat.
Oleh karena itu bahasa HTML harus ditingkatkan lagi agar bisa menciptakan
halaman web yang lebih berkualitas. Untuk itulah dibentuk sebuah organisasi
yang bertanggungjawab mengembangkan bahasa HTML. Organisasi ini bernama W3C.
Fungsi
dan Kegunaan HTML
Untuk
Membuat Halaman Web. Bahasa HTML digunakan untuk membuat halaman web. Semua
halaman web pasti dibuat dengan menggunakan HTML. Sebagai Pondasi Bagi Sebuah
Website. Sebuah rumah jika tidak memiliki pondasi maka akan cepat roboh. Begitu
juga dengan website. Jika tidak memiliki HTML sebagai pondasi, kita tidak dapat
mengimplementasikan bahasa lainnya seperti CSS (bahasa untuk mendesain
website), Javascript (bahasa untuk menambah prilaku website), dan PHP (bahasa
pemrograman server website). Untuk menandai teks pada halaman web. Misalnya,
kita dapat menandai sebuah teks menjadi bergaris bawah dengan menggunakan tag
html Untuk menandai elemen/bagian pada halaman web. Sebuah website memiliki
beberapa bagian seperti header, navigasi, main dan footer. Kita dapat menandai
setiap bagiannya dengan HTML. Untuk menampilkan informasi dalam bentuk tabel
Untuk menambahkan objek seperti audio, video, gambar, dll dalam halaman web
Struktur Dasar HTML
1. Element Element terdiri dari 3 bagian, yaitu tag pembuka, isi dan penutup. Contohnya untuk menampilkan judul dari sebuah halaman, kita membuat kode html seperti ini Yang berwarna biru, itu adalah pembuka. Yang warna hijau adalah isi. Sedangkan yang warna merah adalah penutup. Isi adalah optional, dalam artian tidak masalah jika kita tidak memberikan isi. Beda dengan pembuka dan penutup, keduanya harus ada dalam sebuah kode html. Jika tidak maka akan terjadi error, dan kode tidak akan berfungsi. Ada juga pembuka dan penutup yang berbeda dengan contoh diatas. Contohnya seperi ini Pada tag input kita tidak perlu menutupnya
dengan ,cukup dengan /> . Bahkan dengan menuliskan > saja juga bisa.
2. Tag Tag adalah teks khusus berupa dua karakter < dan >. Contohnya tag dengan nama head, dengan nama body, dan sebagainya. Tag ini sudah diatur dari sananya, jadi kita tidak boleh membuatnya sendiri. Misal jika kita menulis , jelas tidak akan berfungsi. Untuk lebih memperjelas, berikut ini struktur dasar kode html Hai teman teman, ini website pribadi saya lho.. Penjelasan untuk menandai awal dan akhir dari file HTML berisikan keterangan informasi seperti title dan jenis dokumen sebagai judul halaman web bagian ini adalah konten utama web seperti header, navigasi, artikel , sidebar dan footer Anda dapat menuliskan kode html di aplikasi bawaan Windows, Notepad. Bisa juga mendownload aplikasi khusu untuk menulis kode yaitu Notepad++.
3. Atribut Atribut terdapat didalam script sebuah elemen, fungsinya untuk memberi informasi tambahan tentang elemen. Nilai dari atribut harus ditutup dengan tanda kutip. Kode diatas akan membuat sebuah kotak isian yang dikhususkan untuk menulis password. Dalam artian, jika kita menulis di isian tersebut, tulisan kita akan berubah menjadi bintang bintang seperi ini ******Struktur Dasar HTML, pada kesempatan kali ini saya akan mencoba
memberikan informasi tentang struktur HTML. Seharusnya informasi ini
diberikan saat pertama kali, agar lebih memahami tentang fungsi dari
tiap-tiap struktur HTML
Berikut Struktur Dasar HTML:
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
Penjelasan Kode:
<html>
......
</html>
Tag <html> ini digunakan untuk menyatakan bahwa halam website menggunakan bahasa HTML.
<head>
......
</head>
Tag <head> adalah kepala dari halaman website. Pada tag ini anda
bisa menambahkan banyak informasi seperti meta, css, javascript, font
dan lain lain.
Contoh, memanggil external file css dan javascript dan font dari google webfont.
<head>
<title>
Contoh dari Title
</title>
<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="style.css" >
<script type="text/javascript" href="script.js"></script>
</head>
<title>
.......
</title>
Tag <title> digunakan untuk menyatakan title website anda. Tag ini disimpan didalam tag <head></head>
<div style="border: 1px solid #ddd; padding: 10px; background-color: #fafafc; text-align: left;">
Copas kode tersebut di mode "HTML" saat menulis postingan. Lalu klik "Compose", dan masukkan kode HTML hasil Parsing.
Kode menghilangkan judul halaman statis di atas, setelah "dibungkus", menjadi begini:
<b:if cond='data:blog.pageType == "static_page"'>
<style>
.post-title.entry-title{display: none;}
</style>
</b:if>
