Pengertian, Sejarah, dan Fungsi-fungsi pada Bahasa Pemrograman HTML dan CSS
Bismillahirahmanirahim
Assalamualaikum warahmatullahi wabarakatuh, Selamat siang dan Salam sejahtera bagi kita semua.
Puji Syukur saya haturkan kehadirat Allah SWT yang telah memberi kita
banyak sekali nikmat, salah satunya nikmat sehat sehingga kita bisa
berjumpa pada kesempatan yang berbahagia ini. Shalawat dan salam bagi
Rasulullah SAW.
Oke Selamat siang sahabat DP4Update
semuanya. Senang sekali rasanya bisa menulis artikel lagi :D , oyah
saya ingin memenuhi janji saya tadi pagi atau di postingan sebelumnya
tentang melanjutkan bahasan tentang Bahasa Pemrograman, kali ini saya
ingin membahas tentang Bahasa Pemrograman HTML dan CSS.
Sebelum kita masuk ke penjelasan mengenai topik kita kali ini, saya
ingin singgung sedikit beberapa kesalahan orang-orang yang baru belajar
web development. Hal ini saya jelaskan bukan untuk menjatuhkan,
melainkan sebagai koreksi untuk mendorong sobat-sobat semua agar lebih
maju dalam ber-webdevelopment, sehingga nantinya jadi tau arah ketika
akan belajar web development. Banyak orang yang bergelut dalam bidang
web development awalnya tidak melewati pembelajaran HTML terlebih
dahulu, sebagian besar menggunakan CMS (Content Management System),
ataupun karena kemudahan penggunaan software seperti Adobe Dreamweaver.
Sehingga dari sinilah orang menyangka untuk bisa membuat website, atau
mahir dalam web development itu harus menggunakan Adobe Dreamweaver,
jadi ngapain harus repot-repot belajar HTML? Sebetulnya pernyataan ini
tidak 100% benar, dan juga tidak 100% salah. Orang yang ketika pertama
kali menggunakan Dreamweaver merasakan teramat susahnya ketika belajar
sendiri tanpa bantuan buku atau tutorial. Bahkan meskipun ada buku
ataupun tutorial pun masih tetap saja kesulitan menggunakan Dreamweaver.
Sehingga koreksi dari penulis, agar dapat dengan mudah mengerti dalam
menggunakan software web development para web developer haruslah
memiliki dasar-dasar/basic yaitu HTML + CSS yang kuat, sehingga ketika
memakai aplikasi seperti Adobe Dreamweaver itu menjadi sangat mudah. Oke
yuk kita masuk ke topik pembahasan kita , Sebelumnya ada yang sudah tau
atau sudah kenal dengan bahasa pemrograman HTML dan CSS ? Mungkin
beberapa dari sobat visitor ada yang sudah kenal bahkan sudah menguasai
bahasa pemrograman dasar ini. Untuk yang belum kenal atau baru tau apa
itu HTML dan CSS yuk kita belajar sama-sama.
Apa itu HTML?
Hypertext Markup Language (HTML) adalah bahasa markup yang umum
digunakan untuk membuat halaman web. Sebenarnya HTML bukanlah sebuah
bahasa pemrograman. Apabila di tinjau dari namanya, HTML merupakan
bahasa markup atau penandaan terhadap sebuah dokumen teks. Tanda
tersebut di gunakan untuk menentukan format atau style dari teks yang di
tandai. HTML dibuat oleh Tim Berners-Lee ketika masih bekerja untuk
CERN dan dipopulerkan pertama kali oleh browser Mosaic. Selama awal
tahun 1990 HTML mengalami perkembangan yang sangat pesat. Setiap
pengembangan HTML pasti
akan menambahkan kemampuan dan fasilitas yang lebih baik dari versi sebelumnya.
Sebelum suatu HTML disahkan sebagai suatu dokumen HTML standar, ia harus
disetujui dulu oleh W3C untuk dievaluasi secara ketat. Setiap terjadi
perkembangan suatu versi HTML, maka mau tak mau browser pun harus
memperbaiki diri agar bisa mendukung kode-kode HTML yang baru tersebut.
Sebab jika tidak, browser tak akan bisa menampilkan HTML tersebut.
HTML versi 1.0
Kemampuan yang dimiliki versi 1.0 ini antara lain heading, paragraph,
hypertext, list, serta cetak tebal dan miring pada teks. Versi ini juga
mendukung peletakan image pada dokumennya tanpa memperbolehkan
meletakkan teks disekelilingnya (wrapping).
HTML versi 2.0
Pada versi ini, penambahan kualitas HTML terletak pada kemampuannya
untuk menampilkan suatu form pada dokumen. Dengan adanya form ini, maka
kita dapat memasukkan nama, alamat, serta saran/kritik. HTML versi 2.0
ini merupakan pionir dari adanya homepage interaktif.
HTML versi 3.0
HTML versi 3.0 menambahkan beberapa fasilitas baru seperti table. Versi
ini yang disebut juga sebagai HTML+ tidak bertahan lama dan segera
digantikan HTML versi 3.2.
HTML versi 4.0
HTML versi 4 adalah sebuah aplikasi SGML sesuai dengan ISO 8879 - SGML. April 1998: HTML 4.0 dikeluarkan kembali dengan suntingan kecil tanpa kenaikan nomor versi.
HTML versi 5.0
HTML versi 5.0 adalah sebuah bahasa markah untuk menstrukturkan dan
menampilkan isi dari Waring Wera Wanua, sebuah teknologi inti dari
Internet. HTML5 adalah revisi kelima dari HTML (yang pertama kali
diciptakan pada tahun 1990 dan versi keempatnya, HTML4, pada tahun 1997)
dan hingga bulan Juni 2011 masih dalam pengembangan. Tujuan utama
pengembangan HTML5 adalah untuk memperbaiki teknologi HTML agar
mendukung teknologi multimedia terbaru, mudah dibaca oleh manusia dan
juga mudah dimengerti oleh mesin.
HTML5 merupakan salah satu karya Konsortium Waring Wera Wanua (World Wide Web Consortium,
W3C) untuk mendefinisikan sebuah bahasa markah tunggal yang dapat
ditulis dengan cara HTML ataupun XHTML. HTML5 merupakan jawaban atas
pengembangan HTML 4.01 dan XHTML 1.1 yang selama ini berjalan terpisah,
dan diimplementasikan secara berbeda-beda oleh banyak perangkat lunak
pembuat web.
Pada HTML 5 diperkenalkan beberapa elemen baru dan atribut yang
merefleksikan tipikal penggunaan website modern. Beberapa diantaranya
adalah pergantian yang bersifat semantik pada blok yang umum digunakan:
yaitu elemen (<div>) dan inline (<span>), sebagai contoh (<span>) (sebagai blok navigasi website) dan <footer>
(biasanya dikaitkan pada bagian bawah suatu website atau baris
terakhir dari kode html). Banyak elemen lain yang memberikan kegunaan
baru melalui antar muka yang telah distandarkan, seperti elemen
multimedia <audio> dan <video>. Beberapa elemen yang telah ditinggalkan juga ditiadakan, termasuk elemen presentasi semata seperti <font> dan <center>, yang sebenarnya dapat dikerjakan menggunakan Cascading Style Sheet (CSS).
Untuk menambah keluwesan pemformatan, pada HTML5 telah dispesifikasikan
pengkodean Application Programming Interfaces (APIs). Antarmuka document
object model (DOM) yang ada dikembangkan dan fitur de facto
didokumentasikan. Beberapa APIs terbaru pada HTML5 antara lain :
- Elemen canvas, sebagai mode untuk menggambar object dua dimensi (2D). Lihat spesifikasi 1.0 untuk canvas 2D.
- Timed media playback
- Media penyimpanan luring (aplikasi web luring). Lihat Web Storage
- Penyuntingan dokumen
- Drag-and-Drop
- Cross-document messaging
- Manajemen sejarah kunjungan penjelajah web
- Tipe MIME dan penanggung jawab protokol registrasi.
- Geolocation
- Web SQL Database, media penyimpanan database lokal.
- API Database terindeks, mode penyimpanan hierarkis key-value (WebSimpleDB).
Fungsi HTML
HTML telah mengubah dunia internet, kurang lebih berikut adalah fungsi utama :
• Membuat, mendesain, dan mengontrol tampilan dari Web Page (Halaman Web) dan isinya.
• Mempublikasikan document secara online sehingga bisa diakses, dilihat dari keseluruh dunia.
• Membuat online form yang bisa di gunakan untuk menangani pendaftaran, transaksi secara online.
• Menambahkan object – object seperti image, audio, video dan juga java applet (aplikasi java seperti java game dll) dalam document HTML.
Lebih dalam mengenai Struktur HTML ?
Pada dasarnya elemen HTML ada 2 kategori:
1. Elemen berfungsi untuk memberikan informasi atau mendeklarasikan dokumen tersebut.
2. Elemen berfungsi untuk menentukan bagaimana isi suatu dokumen ditampilkan pada browser.
Sebelum kita mengakhiri semua teori ini, ada 2 tools (alat) yang dibutuhkan :
1. Browser
Browser merupakan software yang di install di mesin client (komputer kita sebagai pengguna website) yang berfungsi untuk menterjemahkan tag-tag HTML menjadi halaman web. Contoh browser Internet Explorer, Mozila, opera dan masih banyak yang lainya.
2. Editor
Editor adalah program yang bisa digunakan untuk membuat document HTML (Web page/Halaman Web), ada banyak HTML editor yang bisa anda gunakan diantaranya: Ms FrontPage, Dreamweaver, Notepad, dll.
fungsi css:
- Mempersingkat penulisan tag HTML Kita tidak perlu mendefinisikan setiap tag dengan properti dan nilai yang sama.
- Mempercepat proses rendering atau pembacaan HTML karena tidak terdapat pengulangan penulisan
- Mudah dan cepat dalam maintenance web Dikarenakan file CSS yang dibuat secara terpisah, maka anda tidak perlu merombak semua elemen atau properti dalam HTML, cukup mengedit file CSSnya saja.
- Melakukan apa yang tidak bisa dilakukan oleh HTML Misal : memberikan warna pada input box atau scrollbar
- Satu kali membuat perintah css atau file css, bisa dipakai oleh lebih dari satu halaman web site atau file HTML
Sintaks CSS terdiri dari tiga bagian: pemilih atau selektor (selector), sifat atau properti (property), dan nilai (value). “Selektor” biasanya adalah elemen atau tag HTML yang akan didefinisikan, “properti” adalah atribut yang akan diganti dengan “nilai” tertentu. Properti dan nilai dipisahkan dengan tanda titik dua (
:) dan keduanya diapit oleh tanda kurung kurawal ({).Jika suatu nilai mengandung spasi, nilai tersebut harus diapit dengan tanda petik (
").
Untuk memberikan lebih dari satu properti bagi suatu selektor,
pisahkan setiap kombinasi “properti:nilai” dengan tanda titik koma (;). Untuk membuat definisi gaya lebih mudah dibaca, definisi tiap properti dapat dilakukan per baris.Contoh:
p { color: black }
div { font-family: "sans serif" }
pre { text-align:center; color:red; }
blockquote {
text-align: center;
color: black;
font-family: arial
}
contoh:
a {
text-decoration:none; color:#048ece;
}
a:hover{
text-decoration:underline; color:#Of3167;
}
0 komentar:
Posting Komentar