HTML (2)

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)

Sejarah HTML

HTML?? ada yang tau HTML?? HTML adalah bahasa pemrograman web yang sering digunakan.. nah situs situs yang suah banyak anda kunjungi sebagian besar menggunakan bahasa pemrograman HTML…
Untuk mempublikasikan informasi untuk distribusi global, orang perlu dipahami secara universal bahasa, penerbitan semacam bahasa ibu bahwa semua komputer dapat berpotensi memahami. Penerbitan bahasa yang digunakan oleh World Wide Web adalah HTML (dari HyperText Markup Language).

HTML penulis memberikan cara untuk:

Ø Menerbitkan dokumen online dengan judul, teks, tabel, daftar, foto, dll Mengambil informasi online melalui hypertext link, di klik tombol.

Ø Desain formulir untuk melakukan transaksi dengan layanan jarak jauh, untuk digunakan dalam mencari informasi, membuat reservasi, memesan produk, dll

Ø Sertakan menyebar-lembaran, klip video, klip suara, dan aplikasi lainnya secara langsung di dokumen mereka.

Sejarah singkat HTML 
            HTML pada awalnya dikembangkan oleh Tim Berners-Lee sementara di CERN, dan dipopulerkan oleh browser Mosaic dikembangkan di NCSA. Selama tahun 1990-an telah berkembang dengan pertumbuhan eksplosif Web. Selama waktu ini, HTML telah diperpanjang dalam beberapa cara. Web tergantung pada halaman Web penulis dan vendor berbagi konvensi yang sama untuk HTML. Hal ini telah termotivasi bekerja bersama spesifikasi untuk HTML.
HTML 2.0 (November 1995, lihat [RFC1866] [p.356]) telah dikembangkan di bawah perlindungan dari Internet Engineering Task Force (IETF) untuk mengkodifikasi praktik umum di akhir tahun 1994. HTML + (1993) dan HTML 3.0 (1995, lihat [HTML30] [p.355]) mengusulkan jauh lebih kaya versi HTML. Meskipun tidak pernah menerima konsensus dalam standar diskusi, konsep ini mengarah pada adopsi berbagai fitur baru. Upaya dari World Wide Web Consortium’s HTML Working Group untuk menata Common praktek pada tahun 1996 menghasilkan HTML 3.2 (Januari 1997, lihat [HTML32] [p.356]). Perubahan dari HTML 3.2 dirangkum dalam Lampiran A [p.311] 21 24 Desember 1999 18:26 Pengenalan HTML 4
            Kebanyakan orang setuju bahwa dokumen HTML harus bekerja dengan baik di berbagai browser dan platform. Mencapai interoperabilitas menurunkan biaya untuk penyedia konten karena mereka harus mengembangkan hanya satu versi dokumen. Jika upaya ini tidak dilakukan, ada risiko yang lebih besar bahwa Web akan berpindah ke dalam dunia perangkat lunak berpemilik
format tidak sesuai, akhirnya mengurangi potensi komersial Web untuk semua peserta.
Setiap versi HTML telah berupaya untuk merefleksikan konsensus di antara industri yang lebih besar pemain sehingga investasi yang dilakukan oleh penyedia konten tidak akan sia-sia dan bahwa dokumen mereka tidak akan menjadi tak terbaca dalam waktu singkat.
HTML telah dikembangkan dengan visi bahwa segala macam perangkat tersebut harus berada dapat menggunakan informasi di Web: PC dengan tampilan grafis dengan berbagai resolusi dan kedalaman warna, telepon selular, perangkat tangan manusia, perangkat untuk pidato untuk output dan input, komputer dengan bandwidth yang tinggi atau rendah, dan seterusnya.

HTML penulis memberikan cara untuk:

Ø  Menerbitkan dokumen online dengan judul, teks, tabel, daftar, foto, dll Mengambil informasi online melalui hypertext link, di klik tombol.

Ø  Desain formulir untuk melakukan transaksi dengan layanan jarak jauh, untuk digunakan dalam mencari informasi, membuat reservasi, memesan produk, dll

Ø  Sertakan menyebar-lembaran, klip video, klip suara, dan aplikasi lainnya secara langsung di dokumen mereka.

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.

Kegunaan

Ø  Mengintegerasikan gambar dengan tulisan.

Ø  Membuat Pranala.

Ø  Mengintegerasikan berkas suara dan rekaman gambar hidup.

Ø  Membuat form interaktif.

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.

Ø  I. CARA MEMASUKKAN GAMBAR

kode :

<img src="http:// neltariously.blogspot.com/gambar.gif" border="0" height="17" width="90">

Ø 
keterangan :

height="17" width="90" adalah ukuran lebar dan tinggi gambar

II. CARA MEMBUAT LINK

Kode :

<a href="http://www. neltariously.blogspot.com" > Neltariously.com </a>

Ø 
Keterangan :

Text warna biru adalah link yang dituju.

Tulisan " neltariously.com" adalah tulisan yang ditampilkan.

Jika konten yang dikasih link bukan tulisan melainkan gambar maka ganti tulisan tersebut dengan kode gambar seperti diatas, sehinga kodenya akan seperti ini :

<a href="http://www.neltariously.blogspot.com" target="_blank"><img src="http://www.neltariously.blogspot.com /gambar.jpg" border="0" height="17" width="90"> </a>

Ø 
Jika pengin link yang dituju dibuka dalam window baru maka tambahkan kodetarget="_blank" setelah kode " http://www. neltariously.blogspot.com "

III. CARA MENGETENGAHKAN TEXT/GAMBAR

Kode :

<center>text</center>

Ø  Keterangan :

Ganti tulisan "text" dengan tulisan yana kamu inginkan, tau bisa juga diganti dengan gambar

IV. CARA MEMBUAT BARIS BARU 

Kode :

<br>

Ø  Keterangan :

Tambahkan kode tersebut sebelum objek (text/gambar) yang dinginkan


V. MEMBUAT HURUF TEBAL, MIRING DAN BERGARIS BAWAH

Kode :

<b>text</b> <i>text</i> <u>text</u>

VI. MEMBERI WARNA TEXT

<font color="#FF0000"> Merah </font> <font color="#0000FF"> Biru </font>

VII. KODE-KODE WARNA

Warna	Kode
Hitam	#000000
Abu-abu	#999999
Putih	#FFFFFF
Merah	#FF0000
Hijau	#00FF00
Biru	#0000FF
Kuning	#FFFF00
BiruMuda	#00FFFF
Pink	#FF00FF
Ungu	#9900FF
Orange	#FF6600

            VIII. PENULISAN KARAKTER-KARAKTER KHUSUS

Ada beberapa karakter yang tidak bisa ditulis secara langsung, jika ditulis maka akan hilang atau berubah, jadi untuk menuliskanya harus menggunakan kode-kode tertentu, berikut ini contoh karakter-karakter tersebut :

Karakter	Kode
>	>
<	&lt;
&	&amp;
"	&quot;
(spasi)	&nbsp;

HTML (Hypertext Markup Language)

Sejarah HTML

Hypertext Markup Language atau yang biasa disingkat HTML pertama kali diciptakan dan dikembangkan oleh Tim Berners-Lee pada awal tahun 1990-an yang pada saat itu masih bekerja di CERN. HTML diciptakan dengan tujuan sebagai cara sederhana namun efektif untuk mengkodekan dokumen elektronik. HTML pertama kali dipopulerkan  dengan menggunakan browser Mosaic.

Perkembangan HTML

·      HTML versi 1.0 adalah versi pertama sejak lahirnya nama html tersebut. Versi ini memiliki kemampuan untuk heading, paragraph, hypertext, bold dan italic text, wrapping serta memiliki dukungan dalam peletakkan sebuah gambar.

·      HTML versi 2.0 ( 14 Januari 1996 ). Pada versi ini ada beberapa tambahan kemampuan diantaranya penambahan form comment, hal ini menyebabkan adanya sebuah interaktif dan mulai dari versi ini yang menjadikan sebuah pionner dalam perkembangan homepage interaktif.

·      HTML versi 3.0 ( 18 Desember 1997 ). HTML versi 3.0 juga disebut-sebut HTML+ yang mempunyai kemampuan dalam beberapa fasilitas diantaranya adalah penambahan fitur table dalam paragraph, akan tetapi versi ini tidaj bertahan lama.

·      HTML versi 3.2 ( 14 Januari 1997 ). HTML versi ini adalah penyempurnaan dari HTML versi 3.0. keluarnya versi ini dikarenakan adanya beberapa kasus yang timbul pada pengembang browser yang telah melakukan pendekatan dengan cara lain yang justru hal tersebut menjadi popular. Maka dibakukan versi 3.2 untuk mengakomodasi praktek  yang banyak digunakan oleh pengembang browser dan diterima secara umum. Dapat dikatakan versi 3.2 ini merupakan versi 3.2 yang dikembangkan oleh beberapa pengembang browser seperti Netscape dan Microsoft.

·      HTML versi 4.0 ( 18 Desember 1997). Versi ini sudah terdapat penambahan pada link, meta, image dan lain-lain sebagai penyempurnaan versi 3.2.

·      HTML versi 4.01 ( 24 Desember 1999 ). HTML versi 4.01 menjadi rekomendasi W3C. HTML 4.01 adalah minor update-koreksi dan perbaikan bug dari HTML 4.0.

·      XHTML versi 1.0 ( 20 Januari 2000 ). XHTML 1.0 merumuskan HTML 4.0 dalam XML.

·      HTML 5 ( 22 Januari 2008 ). HTML 5 meningkatkan interoperabilitas dan mengurangi biaya pengembangan dengan membuat aturan yang tepat tentang bagaiman untuk menangani semua elemen HTML, dan bagaimana memulihakan dari kesalahan. Beberapa fitur dalam HTML 5 adalah fungsi untuk audio embedding, video, grafik, sisi penyimpanan data klien, dan dokumen interaktif. HTML 5 juga mengandung unsur-unsur baru seperti <nav>, <header><footer>, dan <figure>. Yang termasuk kelompok kerja diantaranya AOL, Apple, Google, IBM, Microsoft, Mozilla, Nokia, Opera dan banyak lagi vendor lainnya.

Pengertian HTML

,  HTML ( Hyper Text Markup Language ) didefiniskan sebagai sebuah bahasa markup yang digunakan untuk membuat sebuah halaman web dan menampilkan berbagai informasi dalam sebuah browser internet. Bermula dari sebuah bahasa yang sebelumnya banyak digunakan didunia penerbitan dan percetakan yang disebut dengan SGML ( Standard generalized Markup Language ), HTML adalah sebuah standard yang digunakan secara luas untuk menampilkan halaman web. HTML saat ini merupakan standard internet yang didefinisikan dan dikendalikan penggunaannya oleh World Wide Web Consortium (W3C).

HTML berupa kode-kode tag yang menginstrusikan browser untuk menghasilkan tampilan sesuai yang diinginkan. Sebuah file yang merupakan file HTML dapat dibuka dengan menggunakan browser web seperti Mozilla firefox atau aplikasi pembuka email ataupun dari PDA dan program lain yang memiliki kemampuan browser.

HTML dokumen tersebut mirip dengan dokumen teks biasa, hanya dalam dokumen ini sebuah teks biasa memuat instruksi yang ditandai dengan kode atau lebih dikenal dengan TAG tertentu.

HTML (HyperText Markup Language)adalah bahasa dengan tanda-tanda khusus yang digunakan di awal era web untuk menyajikan informasi. HTMLmerupakan script yang digunakan untuk menyusun/membuat dokumen web yang apabila kita melakukan desain terhadap html berarti kita telah melakukan tindakan pemograman. Namun HTML bukanlah sebuah bahasa pemograman karena hanya berisikan perintah-perintah tertentu agar dapat diakses atau diterjemahkan oleh browser. Jika kita ingin membuat suatu website atau blog maka pengetahuan tentang html ini sangat penting sebagai dasar utama. Secara mendasar, dokumen html mempunyai susunan sebagai berikut:

<html>
<head>
<title>Judul</title>
</head>
<body>
.
.
.
</body>
</html>

Kode HTML diawali dengan <html> dan diakhiri dengan </html>. Beberapa hal penting dalam kode html :
- Tanda <> menyatakan sebuah tag
- Pada umumnya tag berpasangan. Contohnya <html> dengan </html>, <head> dengan </head> dan <body> dengan </body>.
- Tag yang tidak berpasangan antara lain adalah <br> dan <hr>.
- Pada tag yang berpasangan, tag yang berkedudukan sebagai tag penutup mempunyai bentuk berupa </>.
Contoh: Ketiklah script di bawah ini kemudian simpan dengan nama lat1.html.

<head>
<title>Belajar HTML</title>
</head>
<body>
Ini adalah web pertama saya.
</body>
</html>

Untuk melihat hasilnya, silakan jalankan browser favorit Anda, dengan cara membuka file lat1.html yang sudah Anda buat tadi dengan menggunakan browser seperti contoh tampilan dibawah ini saya menggunakan browser Mozila Firefox :

Keterangan:

Tag <TITLE> digunakan untuk memberi judul dokumen HTML. Judul ini dapat Anda lihat pada pojok kiri atas (title bar) browser. Ketika orang akan mem-bookmark web Anda, maka judul inilah yang akan disimpan. Pada contoh di atas judul dokument html yaitu "Belajar HTML"

<BODY> adalah isi dokumen yang akan ditampilkan dibrowser Anda. Isi dokumen pada contoh di atas adalah " Ini adalah web pertama saya."

Terdapat dua pilihan dalam mendesain html :

Menuliskan secara manual tag-tag html ke dalam dokumen html. Bagi para pemula pilihan ini dirasa lebih tepat karena dengan menuliskan tag-tag html satu persatu maka akan menambah pemahaman mengenai cara kerja dan perintah-perintah dalam HTML, meskipun cara ini akan menguras banyak waktu tetapi segala sesuatu tidak ada yang instan oleh karenanya berusaha lebih keras akan lebih baik dan akan terasa hasilnya ketika kita sudah mampu mengusai html. Cara manual ini dapat dilakukan dengan menuliskan kode-kode html pada program editor seperti notepad.

Menggunakan editor praktis yaitu sebuah program khusus yg didesain untuk membuat, melakukan editing bahkan mempublishnya ke internet. Adobe dreamweaver merupakan salah satu program yang banyak digunakan oleh para desainer web dalam mendesain html. Para pemula yang malas untuk belajar kebanyakan memilih pilihan yang kedua ini karena praktis dan tidak menguras waktu.

Struktur Dasar HTML

Struktur dasar html secara umum terbagi menjadi 2 bagian yaitu header dan body. Komponen penyusun dari html meliputi tag, elemen, dan atribut.

Tag

Tag adalah suatu teks khusus (markup) yang terdiri dari dua karakter yaitu < dan >. 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 biasanya merupakan suatu pasangan yang disebut dengan : 1. Tag awal, dinyatakan dalam bentuk <nama tag> 2. Tag akhir, dinyatakan dalam bentuk </nama tag>. Format : <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>
Contoh ketiklah kode berikut lalu simpan dengan nama tag.html

<<html>
<head>
<title>Belajar HTML</title>
</head>
<body>
Ini adalah web pertama saya.
<h1>Ini adalah heading 1</h1>
<h2>Ini adalah heading 2</h2>
<h3>Ini adalah heading 3</h3>
<h4>Ini adalah heading 4</h4>
<h5>Ini adalah heading 5</h5>
<i>tulisan ini terlihat miring</i>
<b>tulisan ini terlihat tebal</b>
<u>tulisan ini bergaris bawah</u>

Maka setelah dokumen tag.html dibuka dengan menggunakan mozilla firefox maka tampilannya akan seperti gambar di bawah ini.

Element

Element terdiri atas tiga bagian, yaitu tag pembuka, isi, dan tag penutup. Tag-tag yang ditulis secara berpasangan pada suatu element HTML, tidak boleh saling tumpang tindih dengan pasangan tag-tag lainnya.Contoh untuk menampilkan judul dokumen pada browser digunakan element title yaitu:
<title> merupakan tag pembuka,
Diisi dengan judul (isi)
</title> merupakan tag penutup
Berikut ini contoh beberapa macam element:

Element HTML

Merupakan kepala dari dokumen HTML. Tag <head> dan tag </head> terletak di antara tag <html> dan tag </html>.

Sintaks:

<html>
...........
</html>

Element title

Merupakan judul dari dokumen HTML yang ditampilkan pada judul jendela browser. Tag <title> dan tag </title> terletak di antara tag <head> dan tag </head>.
Sintaks:

<title>
.........
</title>

Element head

Elemen <head> merupakan elemen yang berisikan informasi mengenai halaman web yang tengah dibuka, yang tidak akan ditampilkan secara visual di halaman browser. Sintaks

<head>
.....
</head>

Pada halaman web modern, umumnya elemen mengandung:

elemen title, yang menunjukkan judul dari halaman yang tengah dibuka dan muncul pada toolbar browser.

elemen meta, yang menunjukan informasi meta data mengenai halaman web yang tengah diakses.

elemen link, yang menunjukan hubungan antara halaman web yang dibuka dan file lain. Umumnya digunakan untuk “memasukkan” file CSS ke halaman web yang bersangkutan.

elemen script, digunakan untuk memasukkan script yang bekerja pada sisi klien seperti JavaScript.

Selain keempat elemen di atas, terdapat juga elemen style yang digunakan untuk memasukkan perintah stylesheet dan base untuk menetapkan alamat dan target dari semua link yang berada di dalam halaman web. Bagaimanapun, elemen base jarang dijumpai penggunaannya dan elemen style jarang digunakan karena paradigma saat ini untuk memisahkan stylesheet dengan halaman web agar mudah dalam pengorganisasiannya.

Element body

Element ini untuk menampilkan isi dokumen HTML. Tag <body> dan tag </body> terletak di bawah tag <head> dan tag </head>.
Element BODY mempunyai atribut-atribut yang menspesifikasikan khususnya warna dan latar belakang dokumen yang akan ditampilkan pada browser.

Sintaks:

<body text="v" bgcolor="w" background="uri" link="x" alink="y" vlink="z">
..............
</body>

Pada dasarnya, elemen yang diletakkan diantara tag <body> terdiri dari tiga jenis:

Markup struktural: menunjukan tujuan dari text. contoh, tag heading <h2></h2>

Markup presentasional: menunjukan tampilan dari informasi, terlepas dari fungsinya. contoh: <strong></strong>

Markup hypertext: markup yang membuat bagian dari dokumen menghubungkan ke dokumen yang lain. contoh: <a href=""></a>

Atribut

Atribut text memberikan warna pada teks, bgcolor memberikan warna pada latar belakang dokumen HTML, background memberikan latar belakang dokumen HTML dalam bentuk gambar, link memberikan nilai warna untuk link, alink memberikan warna untuk link yang sedang aktif, vlink memberikan warna untuk link yang telah dikunjungi. Jika atribut bgcolor dan background keduanya dispesifikasikan maka atribut background yang akan digunakan, akan tetapi jika nilai atribut background (gambar) tidak ditemukan pada dokumen HTML maka atribut bgcolor yang akan digunakan.

Atribut mendefinisikan property dari suatu element HTML, yang terdiri atas nama dan nilai. Penulisannya adalah sebagai berikut:

<TAG>
nama-attr="nilai-attr"
nama-attr="nilai-attr"
.................
>
.................
</TAG>

Secara umum nilai atribut harus berada dalam tanda petik satu atau dua. Sebagai contoh, untuk membuat warna teks menjadi kuning dan latar belakang halaman web menjadi hitam, penulisannya adalah <body bgcolor="black" text="yellow">