Dasar HTML
HTML merupakan akronim dari Hyper Text Markup Language. Html tidak termasuk dalam bahasa pemograman, melainkan bahasa markah (markup language). Bahasa markah adalah bahasa yang deklaratif dan menggunakan berbagai tags dan atribut untuk menggambarkan tampilan dari sebuah dokumen.
Misalkan saja terdapat dokumen dengan teks
contoh dokumen html
untuk membuat teks tersebut tampil dengan huruf yang tebal, maka ditambahkan tag <b> di antara teks yang akan ditebalkan. Misal
contoh <b>dokumen</b> html
akan tampil di browser menjadi
contoh dokumen html
teks ‘<b>’ disebut dengan opening tag, sedangkan ‘</b>’ disebut sebagai closing tag. Setiap end tag, selalu dimulai dengan garis miring (slash, / ). Namun ada juga jenis tag yang lain, yang disebut dengan self-closing tag. Yaitu tag yang berdiri sendiri dan tidak membutuh kan closing tag. Tag seperti langsung menggunakan slash di akhir kode tagnya. Misalkan ‘<br />’ untuk ganti baris, atau ‘<hr />’ untuk membuat garis horisontal.
Membuat Dokumen HTML Pertama
HTML merupakan bahasa yang berbasis pada teks. Kita dapat menggunakan berbagai teks editor untuk membuat dokumen HTML. Namun, saya menyarankan untuk menggunakan Bluefish. Selain karena open source, bluefish juga bersifat gratis dan multiplatform. Bluefish memang editor yang dirancang khusus untuk progammer dan web developer. Bluefish mendukung banyak bahasa pemograman dan bahasa markup.
Buat sebuah dokumen baru menggunakan bluefish, lalu copy paste baris kode berikut :
<!DOCTYPE html>
<html>
<body>
<h1>Hallo, HTML</h1>
<p>Ini adalah contoh halaman HTML</p></body>
</html>
Lalu simpan dokumen tersebut dengan format .html. Maka tampilan dari dokumen yang telah disimpan akan menjadi seperti ini :
Dengan menggunakan bluefish, file html yang telah disimpan dengan format .html, akan berwarna berbeda pada setiap tag nya. Hal ini karena secara otomatis bluefish bekerja dengan Language Mode Generic HTML.
Sekarang kita coba buka file HTML yang telah kita simpan dengan menggunakan browser. Dan inilah yang akan terlihat:
Teks yang muncul pada browser, memiliki ukuran yang berbeda. Tag ‘<h1>’ merupakan tag untuk style Header 1. Sedangakan tag ‘<p>’ merupakan tag untuk style Paragraf. Teks yang diapit dengan tag Header 1 akan berukuran sesuai dengan standar ukuran Header pada browser, begitupula dengan teks yang diapit tag Paragraf.
Baris pertama pada dokumen html kita menjelaskan tipe dari dokumen tersebut.
<!DOCTYPE html>
Browser yang digunakan untuk membuka dokumen kita membutuhkan informasi ini untuk mengetahui jenis dokumen yang dibuka.
Selanjutnya yaitu baris opening tag
<html>
Tag ini merupakan tag utama. Setiap dokumen html dimulai dengan tag ini, dan kemudian diakhiri dengan tag ‘</html>’.
Begitu pula dengan tag ‘<body>’. Setiap hal yang akan ditampilkan kedalam browser, diletakkan di dalam tag ini.
Salam,
Afief Yona Ramadhana
let’s start again from scratch
Wah, udah lama gak nulis di blog ini. Kalau ditanya alesan, da pasti banyak. 🙂
Oke, kali ini saya akan coba mulai tulisan berseri lagi. Berhubung akhir – akhir ini sering dapet kerjaan yang berhubungan dengan website, jadi saya akan mulai menulis tutorial – tutorial pemograman website. Dan akan saya mulai dari hal yang sangat sederhana. Ada beberapa bahasa yang akan digunakan ketika membuat website.
- HTML
- CSS
- Javascript
- PHP
- SQL
HTML (HyperText Markup Language) adalah sebuah bahasa markah yang digunakan untuk menampilkan informasi yang terkandung didalamnya yang juga telah di tambahkan kode – kode markah sehingga menciptakan tampilan yang dikehendaki. Bahasa Markah sendiri adalah bahasa yang mengkombinasikan kode dan informasi sehingga informasi yang ditampilan dapat mempunyai bentuk yang berbeda – beda sesuai dengan kode yang ditambahkan.
HTML merupakan bahasa Client Side, yang artinya, kode – kode HTML akan di terjemahkan langsung oleh browser dari komputer pengguna menjadi tampilan yang memuat informasi di dalamnya. Untuk melihat kode – kode HTML dari tampilan website kalian, tinggal klik kanan, lalu pilih ‘view page source‘.
CSS (Cascading Style Scheets) merupakan bahasa pemograman yang digunakan untuk mengatur komponen – komponen pada HTML sehingga tampil lebih rapi dan menarik. CSS tidak dapat dipisahkan dari HTML, meskipun HTML dapat berdiri sendiri tanpa CSS. CSS bersifat melengkapi HTML.
Javascript merupakan bahasa pemograman client side yang dapat bekerja di hampir semua browser. Javascript di dalam web digunakan untuk membuat tampilan website menjadi lebih dinamis dan interaktif. Berbagai animasi interaktif yang menarik dapat dibuat dengan menggunakan javascript. Salah satu library (kumpulan fungsi) dari javascript yang paling terkenal adalah jQuery.
PHP (PHP Hypertext Prepocessor) adalah bahasa pemograman yang bersifat server side. Itu artinya, instruksi – instruksi dalam PHP akan dijalankan sepenuhnya di server lalu hasilkan akan dikirimkan ke browser. Karna bersifat server side, maka kita tidak dapat melihat kode sumber PHP dari sebuah halaman website.
SQL (Structured Query Language) merupakan bahasa yang digunakan untuk mengakses dan mengatur database. Perangkat lunak yang dimanage oleh bahasa ini adalah MySQL. Database sangat penting dalam pembuatan website, karna ini merupakan tempat menyimpan data – data yang diperlukan untuk website tersebut.