Makalah HTML

HTML
O L E H

Nama : reza rahmad Nim T3111056 Kelas E

FAKULTAS ILMU KOMPUTER UNIVERSITAS ICHSAN GORONTALO 2013

HyperText Markup Language (HTML) adalah sebuah bahasa markah yang digunakan untuk membuat sebuah halaman web, menampilkan berbagai informasi di dalam sebuah penjelajah web Internet dan pemformatan hiperteks sederhana yang ditulis dalam berkas format ASCII agar dapat menghasilkan tampilan wujud yang terintegerasi. Dengan kata lain, berkas yang dibuat dalam perangkat lunak pengolah kata dan disimpan dalam format ASCII normal sehingga menjadi halaman web dengan perintah-perintah HTML. Bermula dari sebuah bahasa yang sebelumnya banyak digunakan di dunia penerbitan dan percetakan yang disebut denganSGML (Standard Generalized Markup Language), HTML adalah sebuah standar yang digunakan secara luas untuk menampilkan halaman web. HTML saat ini merupakan standar Internet yang didefinisikan dan dikendalikan penggunaannya oleh World Wide Web Consortium (W3C). HTML dibuat oleh kolaborasi Caillau TIM dengan Berners-lee Robert ketika mereka bekerja di CERN pada tahun 1989 (CERN adalah lembaga penelitian fisika energi tinggi di Jenewa). [1] Perkembangan Tahun 1980, IBM memikirkan pembuatan suatu dokumen yang akan mengenali setiap elemen dari dokumen dengan suatu tanda tertentu. IBM kemudian mengembangkan suatu jenis bahasa yang menggabungkan teks dengan perintah-perintah pemformatan dokumen. Bahasa ini dinamakan Markup Language, sebuah bahasa yang menggunakan tanda-tanda sebagai basisnya. IBM menamakan sistemnya ini sebagai Generalized Markup Language atau GML. Tahun 1986, ISO menyatakan bahwa IBM memiliki suatu konsep tentang dokumen yang sangat baik, dan kemudian mengeluarkan suatu publikasi (ISO 8879) yang menyatakan markup language sebagai standar untuk pembuatan dokumen-dokumen. ISO membuat bahasa ini dari GML milik IBM, tetapi memberinya nama lain, yaitu SGML (Standard Generalized Markup Language). ISO dalam publikasinya meyakini bahwa SGML akan sangat berguna untuk pemrosesan informasi teks dan sistem-sistem perkantoran. Tetapi diluar perkiraan ISO, SGML dan terutama subset dari SGML, yaitu HTML juga berguna untuk menjelajahi internet. Khususnya bagi mereka yang menggunakan World Wide Web. Versi terakhir dari HTML saat ini adalah HTML5. Sejarah dari standar HTML

HTML 2.0 (RFC 1866) disetujui sebagai standar 22 September 1995, HTML 3.2 14 Januari 1996, HTML 4.0 18 Desember 1997, HTML 4.01 (minor fixes) 24 Desember 1999, ISO/IEC 15445:2000 ("ISO HTML", berdasar pada HTML 4.01 Strict) 15 Mei 2000. HTML 5 masih dalam draft pengerjaan Januari 2008.

Kegunaan

Mengintegerasikan gambar dengan tulisan. Membuat Pranala. Mengintegerasikan berkas suara dan rekaman gambar hidup.

Membuat form interaktif.[2]

HTML dokumen tersebut mirip dengan dokumen tulisan biasa, hanya dalam dokumen ini sebuah tulisan bisa memuat instruksi yang ditandai dengan kode atau lebih dikenal dengan TAG tertentu. Sebagai contoh jika ingin membuat tulisan 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 tulisan yang ingin ditebalkan, dan diakhiri dengan tanda </b> untuk menonaktifkan cetak tebal tersebut. HTML lebih menekankan pada penggambaran komponen-komponen struktur dan format di dalam halaman web daripada menentukan penampilannya. Sedangkan penjelajah web digunakan untuk menginterpretasikan susunan halaman ke gaya built-in penjelajah web dengan menggunakan jenis tulisan, tab, warna, garis, dan perataan text yang dikehendaki ke komputer yang menampilkan halaman web. Salah satu hal Penting tentang eksistensi HTML adalah tersedianya Lingua franca (bahasa Komunikasi) antar komputer dengan kemampuan berbeda. Pengguna Macintosh tidak dapat melihat tampilan yang sama sebagaimana tampilan yang terlihat dalam pc berbasis Windows. PenggunaMicrosoft Windows pun tidak akan dapat melihat tampilan yang sama sebagaimana tampilan yang terlihat pada pengguna yang menggunakan Produk-produk Sun Microsystems. namun demikian pengguna-pengguna tersebut dapat melihat semua halaman web yang telah diformat dan berisi Grafika dan Pranala.[3] Menyunting format tulisan HTML memungkinkan seseorang untuk menyunting tampilan atau format berkas yang akan dikirimkan melalui media daring. Beberapa hal yang dapat dilakukan dalam menentukan format berkas adalah:

Menampilkan suatu kelompok kata dalam beberapa ukuran yang dapat digunakan untuk judul, heading dan sebagainya. Menampilkan tulisan dalam bentuk cetakan tebal Menampilkan sekelompok kata dalam bentuk miring Menampilkan naskah dalam bentuk huruf yang mirip dengan hasil ketikan mesin ketik Mengubah-ubah ukuran tulisan untuk suatu karakter tertentu.

Markah/Tanda Secara garis besar, terdapat 4 jenis elemen dari HTML:

Struktural. Tanda yang menentukan level atau tingkatan dari sebuah tulisan (contoh, <h1>Golf</h1> akan memerintahkan peramban untuk menampilkan "Golf" sebagai tulisan tebal besar yang menunjukkan sebagai Heading 1 Presentasional. Tanda yang menentukan tampilan dari sebuah tulisan tidak peduli dengan level dari tulisan tersebut (contoh, <b>boldface</b> akan menampilkan bold. Tanda presentasional saat ini sudah mulai digantikan oleh CSS dan tidak direkomendasikan untuk mengatur tampilan tulisan, Hiperteks. Tanda yang menunjukkan pranala ke bagian dari dokumen tersebut atau pranala ke dokumen lain (contoh, <a href="http://www.wikipedia.org/">Wikipedia</a> akan menampilkan Wikipedia sebagai sebuah hyperlink ke URL tertentu),

Elemen widget yang membuat objek-objek lain seperti tombol (<button>), list (<li>), dan garis horizontal (<hr>). Konsep hypertext pada HTML memungkinkan pembuatan link pada suatu kelompok kata atau frasa untuk menuju ke bagian manapun dalam World Wide Web,

Ada tiga macam pranala (link) yang dapat digunakan :

Pranala menuju bagian lain dari page. Pranala menuju page lain dalam satu web site. Pranala menuju resource atau web site yang berbeda.[4]

Selain markup presentasional , markup yang lain tidak menentukan bagaimana tampilan dari sebuah tulisan. Namun untuk saat ini, penggunaan tag HTML untuk menentukan tampilan telah dianjurkan untuk mulai ditinggalkan, dan sebagai gantinya digunakan Cascading Style Sheets. Contoh dokumen HTML sederhana <!DOCTYPE html> <html> <head bgcolor=black text=white> <title>'''Selamat Datang''' HTML</title> </head> <body> <p>Nama saya Adrianus!</p> </body> </html> Head Dokumen HTML diapit oleh tag <HEAD></HEAD>. Di dalam bagian ini biasanya dimuat tag TITLE yang menampilkan judul halaman pada titlenya browser. Selain itu Bookmark juga menggunakan tag TITLE untuk memberi mark suatu web site. Browser menyimpan title sebagai bookmark dan juga untuk keperluan pencarian (searching) biasanya title digunakan sebagai keyword. Header juga memuat tag META yang biasanya digunakan untuk menentukan informasi tertentu mengenai document HTML. Anda bisa menentukan author name, keywords, dan lainnya pada tag META. Contoh: <meta name="author" content="ubuntu-online"> Elemen Body Bagian BODY, yang dinyatakan dengan tag <BODY></BODY>, merupakan tubuh atau isi dari dokumen HTML dimana anda meletakan informasi yang akan ditampilkan pada browser.

Tag HTML tidak membedakan penggunaan huruf besar ataupun huruf kecil dari suatu elemen. Suatu elemen HTML terdiri dari tag-tag beserta teks yang ada dalam tag-tag tersebut. Tag ini dinyatakan dengan tanda lebih kecil (<) dan tanda lebih besar (>). Tag biasanya merupakan suatu pasangan yang disebut dengan :

Tag awal, dinyatakan dalam bentuk <nama tag> Tag akhir, dinyatakan dalam bentuk </nama tag>

Formatnya: <nama tag> teks yang ditampilkan </nama tag>. Contoh : untuk menampilkan teks dalam format teks miring Teks ini terlihat miring di browser anda dengan perintah HTML <i>Teks ini terlihat miring di browser Anda</i> Atribut Tag awal bisa memiliki beberapa buah atribut yang menyatakan karakteristik dari tag tersebut. Misalnya, <P ALIGN=left> digunakan untuk membuat rata kiri suatu paragraf. Tag yang digunakan adalah <P> dan atribut yang menyertainya adalah ALIGN dengan nilai left. Nilai atribut ALIGN hanya bisa berupa center, left, right atau justify.

Kumpulan Tag HTML 1(!-- --) Memberi komentar atau keterangan. Kalimat yang terletak pada tag kontiner ini tidak akan terlihat pada browser 2(a href) Membuat link ke halaman lain atau ke bagian lain dari halaman tersebut 3(a name) Membuat nama bagian yang didefinisikan pada link pada halaman yang sama 4(applet) Sebagai awal dari Java applets 5(area) Mendefinisikan daerah yang dapat diklik (link) pada image map 6(b) Membuat teks tebal 7(basefont) Membuat atribut teks default seperti jenis, ukuran dan warna font 8(bgsound) Memberi (suara latar) background sound pada halaman web 9(big) Memperbesar ukuran teks sebesar satu point dari defaultnya 10(blink) Membuat teks berkedip 11(body) Tag awal untuk melakukan berbagai pengaturan terhadap text, warna link & visited link 12(br) Pindah baris 13(caption) Membuat caption pada tabel 14(center) Untuk perataan tengah terhadap teks atau gambar 15(comment) Meletakkan komentar pada halaman web tidak tidak akan nampak pada browser 16(dd) Indents teks 17(div) Represents different sections of text. 18(embed) Menambahkan sound or file avi ke halaman web 19(fn) Seperti tag (a name) 20(font) Mengganti jenis, ukuran, warna huruf yang akan digunakan utk teks 21(form) Mendefinisikan input form 22(frame) Mendefinisikan frame 23(frameset) Mendefinisikan attribut halaman yang akan menggunakan frame 24(h1 ... h6) Ukuran font 25(head) Mendefinisikan head document. 26(hr) Membuat garis horizontal 27(html) Bararti dokumen html 28(i) Membuat teks miring 29(img) Image, imagemap atau an animation 30(input) Mendefinisikan input field pada form 31(li) Membuat bullet point atau baris baru pada list (berpasangan dengan tag (dir), (menu) (ol) and (ul) 32(map) Mendefinisikan client-side map 33(marquee) Membuat scrolling teks (teks berjalan) - hanya pada MS IE 34(nobr) Mencegah ganti baris pada teks atau images 35(noframes) Jika browser user tidak mendukung frame 36(ol) Mendefinisikan awal dan akhir list 37(p) Ganti paragraf 38(pre) Membuat teks dengan ukuran huruf yg sama 39(script) Mendefinisikan awal script 40(table) Membuat tabel 41(td) Kolom pada tabel 42(title) Mendefinisikan title 43(tr) Baris pada tabel 44(u) Membuat teks bergaris bawah

Kode Warna HTML Full Lengkap Kode Warna HTMLTips Blogging

Warna adalah sebuah elemen penting pada suatu website maupun blog , warna juga memiliki nilai lebih untuk urusan menarik minat pengunjung agar betah berlama-lama dalam blog atau website kita, untuk keperluan merubah warna background, dan juga warna widget dan elemen-elemen penting yang terdapat dalam suatu blog maupun pada halaman postingan tentu kita membutuhkan sebuah kode warna baik dalam Hexa RGB maupun Decimal RGB, berikut adalah kumpulan kode warna lengkap yang dapat anda manfaatkan.

Color Name

Hexa Code Decimal Code RGB RGB

Reds IndianRed LightCoral Salmon DarkSalmon #CD5C5C 2059292 #F08080 #FA8072 #E9967A 240128128 250128114 233150122

LightSalmon Crimson Red FireBrick DarkRed Pinks Pink LightPink HotPink DeepPink MediumVioletRed PaleVioletRed Oranges LightSalmon Coral Tomato OrangeRed DarkOrange Orange Yellows Gold Yellow LightYellow LemonChiffon

#FFA07A 255160122 #DC143C 2202060 #FF0000 #B22222 #8B0000 25500 1783434 13900

#FFC0CB 255192203 #FFB6C1 #FF69B4 #FF1493 #C71585 #DB7093 255182193 255105180 25520147 19921133 219112147

#FFA07A 255160122 #FF7F50 #FF6347 #FF4500 #FF8C00 #FFA500 25512780 2559971 255690 2551400 2551650

#FFD700 #FFFF00 #FFFFE0

2552150 2552550 255255224

#FFFACD 255250205

LightGoldenrodYellow #FAFAD2 250250210 PapayaWhip Moccasin PeachPuff PaleGoldenrod Khaki DarkKhaki Purples Lavender Thistle Plum Violet Orchid Fuchsia Magenta MediumOrchid MediumPurple Amethyst BlueViolet DarkViolet DarkOrchid DarkMagenta Purple Indigo #E6E6FA 230230250 #D8BFD8 216191216 #DDA0DD 221160221 #EE82EE 238130238 #FFEFD5 255239213 #FFE4B5 255228181

#FFDAB9 255218185 #EEE8AA 238232170 #F0E68C 240230140

#BDB76B 189183107

#DA70D6 218112214 #FF00FF #FF00FF 2550255 2550255

#BA55D3 18685211 #9370DB #9966CC 147112219 153102204

#8A2BE2 13843226 #9400D3 #9932CC #8B008B #800080 #4B0082 1480211 15350204 1390139 1280128 750130

SlateBlue DarkSlateBlue MediumSlateBlue Greens GreenYellow Chartreuse LawnGreen Lime LimeGreen PaleGreen LightGreen MediumSpringGreen SpringGreen MediumSeaGreen SeaGreen ForestGreen Green DarkGreen YellowGreen OliveDrab Olive DarkOliveGreen MediumAquamarine DarkSeaGreen

#6A5ACD 10690205 #483D8B #7B68EE 7261139 123104238

#ADFF2F 17325547 #7FFF00 #7CFC00 #00FF00 #32CD32 #98FB98 #90EE90 1272550 1242520 02550 5020550 152251152 144238144

#00FA9A 0250154 #00FF7F #3CB371 #2E8B57 #228B22 #008000 #006400 0255127 60179113 4613987 3413934 01280 01000

#9ACD32 15420550 #6B8E23 #808000 #556B2F 10714235 1281280 8510747

#66CDAA 102205170 #8FBC8F 143188143

LightSeaGreen DarkCyan Teal Blues/Cyans Aqua Cyan LightCyan PaleTurquoise Aquamarine Turquoise MediumTurquoise DarkTurquoise CadetBlue SteelBlue LightSteelBlue PowderBlue LightBlue SkyBlue LightSkyBlue DeepSkyBlue DodgerBlue CornflowerBlue MediumSlateBlue RoyalBlue

#20B2AA 32178170 #008B8B #008080 0139139 0128128

#00FFFF #00FFFF #E0FFFF

0255255 0255255 224255255

#AFEEEE 175238238 #7FFFD4 #40E0D0 127255212 64224208

#48D1CC 72209204 #00CED1 0206209 #5F9EA0 #4682B4 95158160 70130180

#B0C4DE 176196222 #B0E0E6 176224230

#ADD8E6 173216230 #87CEEB 135206235 #87CEFA 135206250 #00BFFF #1E90FF #6495ED #7B68EE #4169E1 0191255 30144255 100149237 123104238 65105225

Blue MediumBlue DarkBlue Navy MidnightBlue Browns Cornsilk BlanchedAlmond Bisque NavajoWhite Wheat BurlyWood Tan RosyBrown SandyBrown Goldenrod DarkGoldenrod Peru Chocolate SaddleBrown Sienna Brown Maroon Whites

#0000FF #0000CD #00008B #000080 #191970

00255 00205 00139 00128 2525112

#FFF8DC 255248220 #FFEBCD 255235205 #FFE4C4 255228196

#FFDEAD 255222173 #F5DEB3 245222179 #DEB887 222184135 #D2B48C 210180140 #BC8F8F #F4A460 188143143 24416496

#DAA520 21816532 #B8860B #CD853F #D2691E #8B4513 #A0522D 18413411 20513363 21010530 1396919 1608245

#A52A2A 1654242 #800000 12800

White Snow Honeydew MintCream Azure AliceBlue GhostWhite WhiteSmoke Seashell Beige OldLace FloralWhite Ivory AntiqueWhite Linen LavenderBlush MistyRose Greys Gainsboro LightGrey Silver DarkGray Gray DimGray

#FFFFFF

255255255

#FFFAFA 255250250 #F0FFF0 #F5FFFA #F0FFFF #F0F8FF #F8F8FF #F5F5F5 #FFF5EE 240255240 245255250 240255255 240248255 248248255 245245245 255245238

#F5F5DC 245245220 #FDF5E6 #FFFAF0 #FFFFF0 253245230 255250240 255255240

#FAEBD7 250235215 #FAF0E6 #FFF0F5 FFE4E1 250240230 255240245 255228225

#DCDCDC 220220220 #D3D3D3 211211211 #C0C0C0 192192192 #A9A9A9 169169169 #808080 #696969 128128128 105105105

LightSlateGray SlateGray DarkSlateGray Black

#778899 #708090 #2F4F4F #000000

119136153 112128144 477979 00