HTML dan PENGGUNAANYA Disusun Oleh : Remi Mahyuda Trio Saputra (18073303) Jurusan Manajemen Informatika Bina Sarana Informatika YOGYAKARTA 2009 KATA PENGANTAR Alhamdulillah, puji syukur penulis ucapkan kehadirat Allah SWT berkat limpahan rahmat dan karunia-Nya Penulis dapat menyelesaikan makalah yang membahas tentang logika dan algoritma looping dengan pemrograman php. Makalah ini dimaksudkan sebagai penjelasan ringkas dari looping dengan pemrograman php. Dengan membaca makalah ini, diharapkan pembaca dapat memahami dan mengerti tentang looping serta dapat memahami faktor dan halhal yang berhubungan dengan looping. Dengan sepenuh hati penulis menyadari dan merasakan betapa besar bantuan dari berbagai pihak manapun. Oleh karena itu, pada kesempatan ini penulis ingin menyampaikan rasa terima kasih yang setulus-tulusnya kepada yang terhormat. 1. Bpk. Ir Naba Aji Notoseputro, selaku direktur Bina Sarana Informatika. 2. Rianto,S.Kom, selaku dosen mata kuliah Logika dan Algoritma. 3. Seluruh staff dan karyawan Bina Sarana Informatika cabang Yogyakarta. 4. Orang tua penulis yang telah memberikan dorongan dan doanya dalam penyusunan makalah ini. 5. Serta semua pihak yang tidak dapat penulis sebutkan satu persatu yang telah memberikan bantuan kepada penulis sehingga terselesaikannya makalah ini. Dalam penulisan makalah ini, penulis menyadari masih banyak terdapat kesalahan dan kekurangan. Untuk itu penulis sangat mengharapkan masukan dan saran demi kesempurnaan makalah ini. Demikianlah makalah ini penulis buat, semoga makalah ini dapat bermanfaat bagi semua yang membaca. Yogyakarta, 1 Desember 2009 Penulis DAFTAR ISI Halaman HALAMAN JUDUL ............................................................................................. i KATA PENGANTAR..........................................................................................ii DAFTAR ISI........................................................................................................ii ABSTRAKSI ...................................................................................................... iv BAB I PENDAHULUAN .................................................................................... 1 1.1. Latar Belakang Masalah ......................................................................... 1 1.2. Tujuan .................................................................................................... 1 BAB II PEMBAHASAN ...................................................................................... 2 2.1. Pengertian HTML ................................................................................... 2 2.2. Perintah-perintah dasar HTML .............................................................. 4 2.3. Element-element pada Form ................................................................. 22 BAB III PENUTUP ............................................................................................ 30 3.1. Kesimpulan .......................................................................................... 30 DAFTAR PUSTAKA......................................................................................... 31 BAB I PENDAHULUAN 1.1. Latar Belakang Semakin berkembangnya zaman saat ini, banyak sekali bahasa pemrograman tinggkat tinggi yang digunakan ,salah satunya dengan menggunakan HTML. HTML adalah suatu bahasa pemrograman yang untuk mengaplikasikannya tidak memerlukan web server, atau bahasa pemrograman yang berjalan di sisi client. Dalam kesempatan ini penulis akan membahas tentang pemrograman dasar web dengan HTML. Tujuanya adalah agar pengguna bahasa pemrograman HTML lebih mengerti tentang dasar pemrograman web dengan HTML. Karena pentingnya dasar pemrograman web dengan bahasa pemrograman HTML, penulis merasa perlu menyampaikan makalah ini, agar pembaca lebih mengetahui secara mendasar dalam pembuatan web. 1.2. Tujuan Tujuan dari makalah ini adalah : 1. Untuk mempelajari lebih lanjut dari bahasa pemrograman web HTML 2. Untuk mengetahui cara pengaplikasian HTML dalam pemrogrman web 3. Untuk mengetahui pemrograman HTML perintah-perintah yang ada dalam bahasa BAB II PEMBAHASAN 2.1 HTML Hypertext Markup Language (HTML) adalah bahasa yang digunakan untuk membuat sebuah halaman web dan menampilkan berbagai informasi di dalam sebuah browser Internet seperti Mozilla Firefox, Google Crom, Internet Exploler, dan lain lain. HTML juga dapat dikenali oleh aplikasi pembuka email ataupun dari PDA dan program lain yang memiliki kemampuan browser. Bermula dari sebuah bahasa yang sebelumnya banyak digunakan di dunia penerbitan dan percetakan yang disebut dengan SGML, HTML adalah sebuah standar yang digunakan secara luas untuk menampilkan halaman web dan HTML kini merupakan standar Internet yang saat ini dikendalikan oleh World Wide Web Consortium (W3C). Versi terakhir dari HTML adalah HTML 4.01, meskipun saat ini telah berkembang XHTML yang merupakan pengembangan dari HTML. Ciri utama dokumen HTML adalah adanya tag dan elemen. Elemen dalam dokumen HTML dikategorikan menjadi dua yaitu elemen <HEAD> dan elemen <BODY>. Elemen <HEAD> adalah yang berfungsi memberikan informasi tentang dokumen tersebut .Elemen ini seperti halnya kepala surat dalam suratsurat resmi. Didalamnya anda dapat menemukan informasi seperti nama pemilik, judul, deskripsi tentang isi dokumen, Judul dokumen, dan lain-lain, sedangkan elemen <BODY> yang menentukan bagaimana isi suatu dokumen ditampilkan oleh browser, seperti paragraf, list(daftar), tabel ,serta elemen <BODY> biasanya digunakan sebagai penampung dari elemen-elemen yang langsung ditampilkan dalam halaman web. Sedangkan tag dinyatakan dengan tanda lebih kecil “ < “ ( tag awal ) dan tanda lebih besar “ > “ (tag akhir). Dalam penggunaannya sebagian besar kode HTML tersebut harus terletak di antara tag kontainer. Yaitu diawali dengan <namatag> dan diakhiri dengan </namatag> (terdapat tanda "/"). Dokumen HTML tersebut mirip dengan dokumen teks biasa, hanya dalam dokumen ini sebuah teks bisa memuat instruksi yang ditandai dengan kode atau lebih dikenal dengan TAG tertentu. Sebagai contoh jika ingin membuat teks ditampilkan menjadi tebal seperti: TAMPIL TEBAL, maka penulisannya dilakukan dengan cara: <b>TAMPIL TEBAL</b>. Tanda <b> digunakan untuk mengaktifkan instruksi cetak tebal, diikuti oleh teks yang ingin ditebalkan, dan diakhiri dengan tanda </b> untuk menonaktifkan cetak tebal tersebut. Dalam dokumen HTML mempunyai tiga buah tag utama yang membentuk struktur dari dokumen HTML yaitu HTML,HEAD dan BODY. Tag HTML berfungsi untuk menyatakan suatu dokumen HTML, tag HEAD berfungsi untuk memberikan informasi tentang dokumen HTML dan tag BODY berfungsi untuk menyimpan informasi atau data yang akan ditampilkan dalam dokumen HTML. Berikut ini adalah contoh sederhana dalam pembuatan pemrograman web dengan HTML html> <head> <title>Tutorial dreamweaver</title> </head> <body> <strong>Tinjauan <em>html</em></strong><font color=”#CC0000•> dasar secara <font size=”7•><strong>umum</strong></font> sekali </font> </body> </html> Dari contoh sederhana di atas dapat dilihat susunan bahasa HTML pada umumnya. Kita sebut setiap sintak yang berada dalam tanda “<” dan “>” sebagai elemen. Setiap elemen selalu ditutup dengan tag “</……>”. perhatikan elemen <BODY> di atas misalnya. Elemen tersebut diawali dengan tanda “<BODY>”, kemudian ditutup dengan “</BODY>”. Tag-tag yang ada dalam elemen tersebut berarti menjadi bagian dari elemen body. 2.2 Perintah-perintah dasar dengan HTML 1. <br> Perintah yang digunakan untuk membuat baris baru gunakan <br>, spasi lebih dari satu akan diabaikan. Contoh: 2. <p></p> Perintah yang digunakan untuk membuat paragraf, jika tanpa tag penutup hasilnya seperti menggunakan 2 kali <br> Atribut pada <p></p>: Align (perataan paragraf ) Contoh: 3. <hr> Perintah yang digunakan untuk membuat Horizontal Line (Garis horizontal) Atribut pada <hr>: a. Width b. Align Contoh: 4. <font></font> Perintah yang digunakan untuk mengatur ukuran, warna dan jenis huruf Atribut pada <font></font>: a) Size (pengukuran ukuran font) b) Color (pemilihan warna font) c) Face (pemilihan jenis font) Contoh: 5. <h1></h1> …. <h6></h6> Perintah yang memberikan baris baru digunakan untuk membuat heading yang Contoh: 6. <b></b> atau <strong></strong> Perintah yang digunakan untuk membuat huruf tebal. Contoh: 7. <i></i> atau <em></em> Perintah yang digunakan untuk membuat huruf menjadi miring Contoh: 8. <u></u> Perintah yang digunakan untuk membuat huruf dengan garis bawah Contoh: 9. <img> Perintah yang digunakan untuk menampilkan gambar Atribut: a) src (pengaturan letak file gambar) b) align (pengaturan perataan gambar) c) width (pengaturan lebar gambar dlm persen atau pixel) d) height (pengaturan tinggi gambar dlm persen atau pixel) e) alt (keterangan gambar) Contoh: 10. <table></table> Perintah yang digunakan untuk membuat table Atribut pada <table></table>: a) border b) align (pengaturan perataan table) c) width d) height e) bgcolor Atribut pada <tr></tr>: a) align b) bgcolor c) width d) height Atribut pada <td></td>: a) align b) bgcolor c) width d) height Contoh: 11. <a></a> Perintah yang digunakan untuk membuat link Atribut <a></a>: a) href b) name Contoh: Contoh Anchor: Klik link Ke atas Maka akan tampil bagian atas 12. <div></div> Perintah yang digunakan untuk membuat blok paragraph dengan baris baru pada akhir paragraf (pengganti <p>, digunakan pada css) Atribut <div></div> : align (pengaturan perataan paragraf) nilai left, right, center, justify Contoh: 13. <span></span> Perintah yang digunakan pada css untuk memberikan format pada teks yang diblok, tanpa membuat baris baru Contoh: 14. <ol></ol> Perintah yang digunakan untuk pembuatan Order list (biasa dikenal dengan numbering) Atribut <ol></ol>: Type (pemilihan jenis numbering), nilai: 1, A, a, I, i Contoh 15. <ul></ul> Perintah yang digunakan untuk pembuatan Unorder List (biasa kita kenal dengan Bullet) Atribut <ul></ul>: type (pemilihan jenis bullet), nilai: disc, square, circle Contoh: 16. <frameset></frameset> Perintah yang digunakan untuk membagi satu halaman web menjadi beberapa halaman, halaman yang dibagi masih bisa dibagi lagi. Contoh: - buat file dengan nama framset.html -buat file dengan nama halaman1.html - buat file dengan nama halaman2.html jalankan framset.html 17. <form></form> Form biasanya digunakan untuk mengumpulkan informasi dari user, sehingga memungkinkan suatu web server untuk menerima informasi dari pemakai melalui sejumlah elemen yang disebut kontrol. Kontrol ini bisa berupa suatu textbox, checkbox, radio button, push button, list menu dan lainnya.Perintah yang digunakan sebagai blok dari elemen-elemen form seperti text,texarea. Atribut <form></form>: a) name (nama form) b) action (file tujuan dimana form dikirim, digunakan pada server side) c) method (metode pengiriman, digunakan pada server side) nilai post,get 2.3 Element pada Form <input> Tag ini teletak didalam blok tag form Atribut <input> : a) Type (jenis input) nilai text, checkbox, radio, hidden, button, submit, reset, file, image b) Name (nama elemen) c) Value (nilai isian) Contoh: Radio Pada type Radio, user memilih salah satu pilihan yang tersedia, sehingga user tidak bisa memilih kurang atau lebih dari satu pilihan. Atribut Checked memberi tanda bahwa pilihan tersebut sedang diaktifkan Checkbox Checkbox digunakan untuk memberi beberapa pilihan kepada user. Dengan checkbox user dapat memilih salah satu, lebih dari satu pilihan atau tidak sama sekali memilih. Hidden Button Submit Submit digunakan ketika user mengisi formulir dan ingin mengirimkan ke server Reset Reset digunakan ketika user ingin menghapus semua masukan yang ditulis Textarea Select BAB III PENUTUP 3.1. Kesimpulan Hypertext Markup Language (HTML) adalah bahasa yang digunakan untuk membuat sebuah halaman web dan menampilkan berbagai informasi di dalam sebuah browser Internet seperti Mozilla Firefox, Google Crom, Internet Exploler, dan lain lain. HTML juga dapat dikenali oleh aplikasi pembuka email ataupun dari PDA dan program lain yang memiliki kemampuan browser. Adapun kelebihannya dalam menggunakan HTML adalah: 1. Bahasa pemrograman HTML lebih mudah di pelajari dibandingkan bahasa permrograman pascal maupun C++ 2. HTML sangat compatible diakses dalam web browser seperti Internet Exploler, Mozila Firefox, maupun web browser yang lainya. 3. Script dalam HTML mudah di pelajari oleh pengguna karena berupa tulisan-tulisan (tag) Adapun beberapa kelemahan kelemahan yang terjadi dalam bahasa pemrograman HTML antara lain: 1. Bila pada saat penulisan HTML terjadi kesalahan / kurang teliti, pengguna akan susah sekali dalam prose pencariannya bila script HTMLnya sangat panjang. 2. Karena bahasanya masih menggunakan script yang panjang, pengguna akan cepat merasa bosan karena tampilan HTML yang selalu monotone. 3. Dalam HTML sangat sulit sekali dalam mendesain suatu tampilan, karena selalu menulis script-scriptnya terlebih dahulu.