Thursday 23 March 2017

Belajar HTML : Introduce

HTML atau singkatan dari Hyper Text Markup Language adalah sebuah bahasa pemrograman sederhana untuk membuat sebuah halaman website. Halaman ini nantinya berguna sebagai interface antara user dan halaman browser dalam internet. HTML ini banyak digunakan sebagaian besar programer sebagai alat penunjang tampilan situs mereka. Ibaratnya ini sebagai sarana untuk menampilkan iformasi yang mereka punya kepada selluruh dunia melalui jaringan yang dinamakan Internet. HTML juga dapat digunakan sebagai link penghubung antar situs, misalkan saja yang kita tahu seperti facebook. Konon ceritanya dulunya facebook hanya sebatas jaringan web antar orang dalam satu organisasi. Karena pemiliknya Mark Zukerberg ingin situsnya ini berkembang, akhirnya ia membuka situs ini sebagai sebuah situs umum yang sudah memilki jutaan member di dunia. Dan menjadi sebuah situs popular sampai sekarang ini. 
Keberhasilan ini tentunya membuat banyak developer ingin membuat situs sendiri yang dapat diakses semua pengguna internet. Akhirnya untuk satu dekade ini banyak sekali situs bermunculan. Seiring dengan perkembangan jaman dengan kesuksesan facebook melahirkan jejaring social baru seperti instagram, path, dan lainnya. Di Indonesia pun juga tak kalah ketinggalan, perkembangan situs juga begitu pesat seperti kesuksesan KASKUS. Menurut saya pribadi perkembangan situs KASKUS ini juga tidak kalah dengan situs luar negeri. Berawal dari tempat sharing, hingga berubah jadi sebuah forum jual beli online yang keuntungannya fantastis.

Para pemilik perusahaan komersial di Indonesia akhirnya berlomba-lomba membangun sebuah situs/website untuk menunjang usaha mereka di dunia maya. Hingga mereka menyewa mahal seorang web master untuk membangun sebuah website yang dinamis dan menarik banyak orang.

Kita memang tidak bisa menyalahkan teknologi dan perkembangan jaman yang semakin maju dan cepat. Tapi kita harus belajar dan menyesuaikan perkembangan itu. Untuk itu saya mengajak para pembaca untuk lebih mengenal tentang dunia pemrograman. Karena saya juga masih banyak belajar tentang itu semua. Hal yang perlu saya tegaskan disini adalah tidak ada kata terlambat, karena semua orang belajar dari nol. Bahkan Thomas Alfa Edison beribu-ribu kali gagal dan bangkit hingga dapat berhasil membuat sebuah bola lampu yang sekarang kita nikmati hasilnya. Begitu pula dengan belajar pemrograman, tidak perlu berfikir saya tidak memiliki basic seorang IT atau seorang programmer. Hanya orang yang tidak mau keluar dari zona nyamannya saja yang berkata seperti itu. Bagi saya praktik itu 90% ketimbang teori. Contohnya belajar sepeda, apakah perlu belajar sepeda hanya dengan teori??? Pepatah mengatakan “Tak Jatuh Maka Tak Merasakan Kemenanga”. 

Jadi langkah awal agar kalian paham tentang dunia web adalah HTML. Menurut saya ini adlah modal awal kita belajar tentang dunia ini. Bila kalian tekun dan serius ingin mempelajari lebih dalam hingga database. Maka kalian akan bertemu dengan bahasa pemrograman PHP. Disini saya juga akan mengulas dasar-dasar penulisan PHP, tinggal bagaimana kalian nantinya dapat mengembangkanya.

Kembali ke tema awal HTML. Agar sebuah situs dapat menghasilkan tampilan wujud yang terintegrasi dengan baik, maka Performatan hiperteks sederhana ditulis dengan format ASCII. HTML awalnya dipakai dalam dunia percetakan dan penerbitan yang disebut Standard Generalized Markup Language (SGML).

Dalam web ada sebuah aturan/protocol yang digunakan untuk mengirim atau mentransfer data atau document yang berformat HTML. HTTP atau Hypertext Transfer Protokol merupakan protocol yang digunakan untuk mengirim data HTML dari web server ke web browser.

Dalam sebuah HTML terdapat tag yang fungsinya sebagai tanda yang menyatakan kode yang akan ditafsirkan atau dibaca oleh browser  menjadi sebuah halaman web yang benar. Jadi secara umum fungsi HTML untuk mengolah data sehingga dapat diakses dan ditampilkan di internet.  Secara spesifik fungsi HTML :
Menampilkan informasi yang sudah dirancang ke dalam sebuah web browser.
Membuat sebuah tampilan web yang dinamis.
Membuat hypertext yang digunakan sebagai link menuju ke web/situs lain.

HTML sering dikombinasikan dengan bahasa pemrograman lain seperti, PHP, JavaScript, CSS, dan lain-lain. Setiap web programmer mempunyai cara sendiri-sendiri dalam membuat suatu halaman web. Kemampuan mereka pastinya juga hasil jerih payah mereka belajar tentang bahasa pemrograman ini.

Lalu bagaimana dengan anda??? Ciri khas seperti apa yang kalian gunakan dalam membuat sebuah bahasa pemrograman ini?

Memang dalam hal ini kreatifitas sangat menunjang kemampuan seseorang web developer. Saya mempunyai keyakinan membuat halaman web mungkin adalah dasar dari semua ini sebelum menuju ke level berikutnya yaitu membuat sebuah aplikasi. Jadi menurut saya ini adalah suatu hal yang luar biasa. Kalian akan temukan sesuatu yang menarik ketika kalian masuk ke dunia. Itu lah kesan awal saya ketika belajar bahaa ini. Walaupun awalnya begitu pusing dengan banyaknya kode-kode yang berbeda dan mempunyai fungsi yang berbeda-beda pula.

Secara umum HTML mempunyai aturan penulisan seperti berikut.
<!DOCTYPE html>
<html>
<head>
            <title> Belajar HTML </title>
</head>
<body> </body>
</html>

Pada awal baris terdapat DOCTYPE html artinya halaman yang sedang kita buat ini adalah halaman HTML. Tag ini harus ada agar web browser dapat mengenali text tersebut adalah halaman HTML. Ada juga tag <head> dan diakhiri dengan </head>, pada bagian inilah biasanya kita tuliskan judul sebuah halaman. Selain itu kita juga bisa menempelkan kode CSS. CSS adalah kode yang nantinya membangun tampilan halaman lebih menarik, Ibarat motor, CSS ini adalah design atau modifnya. Inilah bagian seru menurut saya dalam membuat sebuah web. CSS ini dapat membedakan dari seorang web desainer satu dengan yang lain. Kalian dapat menampilkan suatu yang unik dengan ini dalam website kalian. Mulai dari warna, ukuran halaman, jenis tulisan, dan lain-lain. Baca artikel tentang pembalajaran CSS di Belajar CSS (Cascading Style Sheets).

Dokumen HTML memang berisi banyak tag. Tag inilah yang akan membangun sebuah web. Ada tag <p> </p>. Tag ini akan memunculkan tulisan yang akan dimasukan dalam sebuah halaman. Misalkan:

<p> Saya sedang belajar HTML </p>

Maka web browser akan menampikan “Saya sedang belajar HTML”.
Ada juga tag <b> </b> yang berfungsi membuat tebal tulisan. Contoh:

<b> Saya sedang belajar HTML </b>

Maka web browser akan menampikan “Saya sedang belajar HTML”.

Dan masih banyak lagi tag-tag lainya yang nantinya saya akan bahas disini. Bila dalam sebuah statement tidak terdapat tag, maka web browser tidak akan bisa membaca teks tersebut dalam browser.

HTML lebih menekankan pada penggambaran komponen-komponen struktur dan format di dalam halaman web daripada penampilannya. Misalkan kita dapat membuat sebuah form interaktif untuk kegunaan komersial seperti pendaftaran member baru. Saya bisa mengatakan ini sebagai cover halaman depan sebelum masuk ke database perusahaan.

Secara garis besar ada 4 jenis elemen HTML :
1. Struktural
Tanda yang menentukan level atau tingkatan dari sebuah tulisan. Antara <h1> hingga <h6>. Semakin kecil angkanya semakin besar level tulisannya.

2. Presentasional
Tanda ini menentukan sebuah tampilan dari tulisan yang tidak memerlukan level atau tingkatan. Contohnya seperti yang diatas <b> </b> yang akan menampilkan Bold pada tulisan.

3. Hiperteks
Tanda ini menunjuka pranala ke bagian dari dokumen HTML. Atau mungkin bisa saya gambaran sebagai penghubung link ke link yang lain yang disebut hyperlink. Contohnya saya ingin hubungkan ke website saya.
<a href=http://www.phoenix-bay.web.id/> Phoenix-Bay</a>
Pranala link ini dibagi menjadi 3 pranala :
  • Pranala yang berfungsi mengarahkan ke bagian lain dalam page.
  • Pranala yang mengarah ke page lain dalam satu website.
  • Pranala yang mengarah ke page lain yang berbeda website.


4. Elemen Widget
Elemen ini adalah pembangun untuk membuat objek-objek seperti tombol <button>, baris <br>, daftar <li>, dan lain-lain.


Nah demikian penjelasan awal tentang HTML (Hyper Text Markup Language). Kalian dapat mengikuti artikel saya untuk belajar lebih lanjut tentang HTML.


1 comment: