Kamis, 30 Juni 2011

Pengenalan HTML (Bagian 1)

Beberapa hari nggak bisa nulis artikel gara-gara kesibukan kuliah sama kerjaan akhirnya bisa menuangkan lagi sebuah sumbangsi lagi untuk diskusinet ku tercinta. Selama beberapa minggu juga lagi Booming banget HTML di kampus, karna pelajaran pengenalan internet (Sebenarnya agak bingung kok Pengenalan internet malah pengenalan HTML, bukannya beda pembahasan lagi xixixixiixixi).



HTML (Hypertext Markup Language) adalah sebuah dasar bagaimana sebuah Website terbentuk. HTML bukanlah suatu bahasa Pemrograman, tetapi HTML adalah markup languange. Kita bayangkan sebuah Website itu sebagai sebuah document yang anda akan tampilkan didalam sebuah Browser (Internet Explorer, Mozilla, Opera, Dll). Di dalam document tentunya ada sebuah tulisan dengan Judul (Header), isi (Paragraf), dan juga penggayaan (Seperti Bold, italic, Underline). Jadi bisa kita simpulkan HTML itu cara bagaimana pengcodean kita dalam menyusun sebuah document di dalam browser. Jika anda ingin melihat bagaimana suatu Website tersusun, anda dapat melihatnya dengan mengklik kanan di website nya lalu View Source.


Saat pertama kali mempelajari HTML apa saja yang dibutuhkan?



  • Kita tidak membutuhkan banyak tool saat belajar HTML.

  • Kita tidak membutuhkan HTML Edito apapun (Macromedia, Frontpage, dll)

  • Tidak membutuhkan Web server (Karna ini akan lebih lanjut lagi dibahas saat kita sudah mempelajari Web Programing)

  • Kita tidak perlu Hosting.

  • Di tutorial ini kita hanya menggunakan text editor seperti Notepad untuk mengedit HTML, karna saya percaya ini jalan yang terbaik untuk mengerti HTML



Kenapa saya menganjurkan memakai text editor seperti notepad, tetapi tidak menganjurkan memakai Program seperti Dreamweaver ataupun Frontpage yang sudah WYSIWIG (What You See Is What You Get). Kalau Memakai program ini sudah sangat membantu kita lebih cepat membuat sebuah website, tetapi program ini akan membuat anda kurang memahami HTML bagi yang baru mempelajari HTML.


Buka Notepad kalian, lalu ketikan kalimat berikut :


Hello World


1.gif


Setelah itu simpan notepad dengan extension htm, caranya sewaktu kita mengesave document HTML kita berikan nama filenya Belajar HTML.htm, lalu di Save as Type kita pilih All Files.


2.gif



Jika anda benar sewaktu mengesave nya file anda akan berextensi htm dan file typenya HTML document seperti dibawah ini, jika tidak akan berekstensi txt, text document. Dan File Type menjadi HTML Document.





Setelah itu coba buka filenya.




Setelah itu coba kita edit lagi code yang kita buat tadi di notepad menjadi


Hello <b>World</b>



Lalu save kembali, lihat apa yang terjadi


Dari kata Hello World tadi setelah kita beri tag pada kata World menjadi bold.





Sekarang tuliskan barisan dari kata-kata dibawah ini :




Lalu Save lagi, lalu buka kembali dan perhatikan …


maybe i not prefect, but mylove having u 4ever






Jadi apa maksud dari “<b>” dan “</b>” ??


Itu adalah suatu tag yang membuat kata yang di dalamnya atau kata di antara tag <b> dan </b> itu menjadi huruf tebal. Dan juga seperti contoh yang kedua.


Di kata “sempurna” dia di apit oleh tag <b> </b> dan kata memilikimu di apit oleh tag <em></em>, sehingga menjadi tulisan miring (Italic).



Yang Perlu di perhatikan, harus selalu ada tag awal dan tag akhir.


























Tag AwalIsi ElementTag Penutup
<p>This is a paragraph</p>
<font>Isi dari elemetnnya</font>
<em >This is a link</em>

Stand alone Tag


Selain itu ada juga beberapa tag yang memang standalone, yang artinya tidak memerlukan tag penutup. Misalnya tag untuk membuat garis baru di dalam penulisan seperti <br> (didalam MS. Word biasanya kita menekan Enter untuk membuat garis baru itu), atau membuat garis lurus (<hr>).



Atribut


Didalam Tag pembuka kita dapat menambahkan sebuat atribut atau fungsi tambahan. Misalnya di Tag <font> kita ingin menambahkan attribut agar huruf di dalam tag dapat berwarna biru dan besarnya 12. <font color=”blue” size=”12?> .















Tag Awal Yang Diberi AttributIsi ElementTag Penutup
<font size=”5?>Isi dari elemetnnya</font>


Dari beberapa contoh di atas bisa kita sedikit kesimpulan, bahwa html dapat kita gunakan untuk mengatur bagaimana penulisan atau penggayaan terhadapat document yang ingin kita tampilkan di browser.



Setelah Dasar kita sudah mencoba baru kita melangkah ke struktur HTML yang sesungguhnya.. Lets Do it.. Tapi Di artikel selanjutnya ajah ya.. Nguantuk Bet xixixixi :D

0 komentar:

Posting Komentar

Twitter Delicious Facebook Digg Stumbleupon Favorites More