PEMROGRAMAN WEB 1

11
PEMROGRAMAN WEB 1 PEMROGRAMAN WEB 1 BY: BY: ASIH WINANTU ASIH WINANTU

description

PEMROGRAMAN WEB 1. BY: ASIH WINANTU. PENGENALAN HTML. HTML >> hypertext markup language. HTML. Dokumen HTML adalah adalah file teks murni yang dapat dibuat dengan sembarang teks editor. Disebut juga sebagai web page. - PowerPoint PPT Presentation

Transcript of PEMROGRAMAN WEB 1

Page 1: PEMROGRAMAN WEB 1

PEMROGRAMAN WEB 1PEMROGRAMAN WEB 1

BY:BY:

ASIH WINANTUASIH WINANTU

Page 2: PEMROGRAMAN WEB 1

PENGENALAN HTMLPENGENALAN HTML

HTML >>HTML >>

hypertext markup languagehypertext markup language

Page 3: PEMROGRAMAN WEB 1

HTMLHTML

Dokumen HTML adalah adalah file teks murni Dokumen HTML adalah adalah file teks murni yang dapat dibuat dengan sembarang teks yang dapat dibuat dengan sembarang teks editor. editor. Disebut juga sebagai web page. Disebut juga sebagai web page. Dokumen HTML/web page adalah dokumen Dokumen HTML/web page adalah dokumen yang disajikan dalam browser,umumnya berisi yang disajikan dalam browser,umumnya berisi informasi ataupun interface aplikasi dalam informasi ataupun interface aplikasi dalam internet. internet. Dokumen ini mempunyai ekstensi file “htm” atau Dokumen ini mempunyai ekstensi file “htm” atau “html”.“html”.

Page 4: PEMROGRAMAN WEB 1

CARA MEMBUAT DOKUMEN CARA MEMBUAT DOKUMEN HTMLHTML

dengan text editor (notepad,editplus,dll)dengan text editor (notepad,editplus,dll)

HTML editor (frontpage,dreamweaver, HTML editor (frontpage,dreamweaver, publisher, webpagemaker,dll)publisher, webpagemaker,dll)

Page 5: PEMROGRAMAN WEB 1

ELEMEN HTMLELEMEN HTMLSuatu elemen HTML terdiri dari tag-tag dan atributnya.

Tag : Sewaktu browser menampilkan halaman web. Browser akan membaca teks pada dokumen HTML dan mencari kode khusus yang disebut tag. Tag biasanya merupakan suatu pasangan tag awal <…> dan tag akhir </…>.Tag yang mengandung tag lain didalamnya disebut sebagai nested tag.

Atribut : Tag awal biasanya memiliki beberapa buah atribut yang menyatakan karakteristiknya. Misal :

<p align =”left”>

Page 6: PEMROGRAMAN WEB 1

Aturan penulisan tag :Aturan penulisan tag :

tag HTML diapit dengan dua karakter kurung bersudut < tag HTML diapit dengan dua karakter kurung bersudut < dan >dan >tag HTML secara normal selalu berpasangan seperti tag HTML secara normal selalu berpasangan seperti <b> dan >/b><b> dan >/b>tag pertama dalam suatu pasangan adalah tag awal,dan tag pertama dalam suatu pasangan adalah tag awal,dan tag yang kedua merupakan tag akhir.tag yang kedua merupakan tag akhir.Bebas (huruf kapital atau kecil atau campuran huruf Bebas (huruf kapital atau kecil atau campuran huruf besar –kecil) dan tidak sensitif case artinya tag <b> besar –kecil) dan tidak sensitif case artinya tag <b> berarti sama dengan <B>.berarti sama dengan <B>.jika dalam suatu tag ada tag lagi,maka penulisan tag jika dalam suatu tag ada tag lagi,maka penulisan tag akhir tidak boleh bersilang,harus berurut. Misalnya akhir tidak boleh bersilang,harus berurut. Misalnya <b><I> maka akhirnya harus </I></b>.<b><I> maka akhirnya harus </I></b>.

Page 7: PEMROGRAMAN WEB 1

Pola dasar penulisan dokumen Pola dasar penulisan dokumen HTML :HTML :

<HTML ><HTML ><HEAD><HEAD> ………….informasi tentang dokumen HTML.informasi tentang dokumen HTML</HEAD></HEAD><BODY><BODY>

…………Informasi yang ditampilkan dalam browser Informasi yang ditampilkan dalam browser webweb

</BODY></BODY></HTML></HTML>

Page 8: PEMROGRAMAN WEB 1

Bagian Head :Bagian Head :

Kepala dokumen dinyatakan dengan pasangan Kepala dokumen dinyatakan dengan pasangan tag <HEAD>…</HEAD> yang merupakan tag <HEAD>…</HEAD> yang merupakan pembuka dari dokumen HTML. HEAD berisi pembuka dari dokumen HTML. HEAD berisi informasi-informasi yang menjelaskan tentang informasi-informasi yang menjelaskan tentang dokumen HTML,seperti judul dokumen, basis dokumen HTML,seperti judul dokumen, basis URL suatu dokumen, hubungan antar dokumen URL suatu dokumen, hubungan antar dokumen dalam HTML, dan indeks suatu dokumen. dalam HTML, dan indeks suatu dokumen. Informasi yang ada di bagian HEAD tidak akan Informasi yang ada di bagian HEAD tidak akan terlihat ketika dokumen tersebut dibuka pada terlihat ketika dokumen tersebut dibuka pada suatu browser.suatu browser.

Page 9: PEMROGRAMAN WEB 1

Bagian Body :Bagian Body :

Section BODY yang dinyatakan dengan Section BODY yang dinyatakan dengan tag <BODY>…</BODY> merupakan tag <BODY>…</BODY> merupakan elemen terbesar di dalam dokumen HTML. elemen terbesar di dalam dokumen HTML. Bagian ini bukan hanya untuk Bagian ini bukan hanya untuk memasukkan informasi atau isi dokumen memasukkan informasi atau isi dokumen tetapi juga bisa memberikan format tetapi juga bisa memberikan format tertentu pada suatu kelompok teks, tertentu pada suatu kelompok teks, membuat tabel, form dan lain sebagainya.membuat tabel, form dan lain sebagainya.

Page 10: PEMROGRAMAN WEB 1

LATIHAN 1LATIHAN 1<HTML><HTML><HEAD><HEAD><TITLE> Judul Dokumen HTML</TITLE><TITLE> Judul Dokumen HTML</TITLE></HEAD></HEAD><BODY><BODY>masukkan teks dan isi tampilan halaman HTML disinimasukkan teks dan isi tampilan halaman HTML disini</BODY></BODY></HTML></HTML>

Simpan dengan ekstensi .htm atau .html. dan buka Simpan dengan ekstensi .htm atau .html. dan buka dengan program web browser yang ada, dengan program web browser yang ada, Internet Internet ExplorerExplorer, , mozzilamozzila, , operaopera atau atau konquerorkonqueror. Browser akan . Browser akan mengenali file teks tersebut sebagai suatu dokumen mengenali file teks tersebut sebagai suatu dokumen HTML dan akan menampilkan isinya sebagai suatu HTML dan akan menampilkan isinya sebagai suatu halaman web. halaman web.

Page 11: PEMROGRAMAN WEB 1

LATIHAN 2LATIHAN 2

<HTML><HTML><HEAD><HEAD><TITLE> World Wide Web</TITLE><TITLE> World Wide Web</TITLE><BODY><BODY><CENTER><H1>Definisi World Wide Web</H1></CENTER><CENTER><H1>Definisi World Wide Web</H1></CENTER><P ALIGN=”LEFT”><P ALIGN=”LEFT”>WWW adalah layanan yang paling sering digunakan dan memiliki WWW adalah layanan yang paling sering digunakan dan memiliki

perkembangan yang sangat cepat karena dengan layanan ini kita perkembangan yang sangat cepat karena dengan layanan ini kita bisa menerima informasi dalam berbagai format (multimedia). bisa menerima informasi dalam berbagai format (multimedia).

<P ALIGN=”RIGHT”><P ALIGN=”RIGHT”>SurfingSurfing merupakan istilah umum yang digunakan bila menjelajahi dunia merupakan istilah umum yang digunakan bila menjelajahi dunia

maya atau web. </BODY>maya atau web. </BODY></HTML></HTML>