ohfuiohfohfohoifhcfgjuyj

7
LAPORAN PENGENALAN WEB PERTEMUAN KE-2 Struktur Dokumen HTML5 dan Tag Dasar Disusun Oleh : Nama : Asmuni Nim : 135610004 LABORATORIUM TERPADU SEKOLAM TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTER

Upload: bern-adz-manchunian

Post on 22-Dec-2015

212 views

Category:

Documents


0 download

DESCRIPTION

hggoohsvshvisohgghuigtfigbnvjniugfihtolnfvouhgosdghb;oigfsgfkusglghfsosuyhohlsib;lghps9yshsuhlih';hgs;glsghsd;t

TRANSCRIPT

Page 1: ohfuiohfohfohoifhcfgjuyj

LAPORAN PENGENALAN WEB

PERTEMUAN KE-2

Struktur Dokumen HTML5 dan Tag Dasar

Disusun Oleh :

Nama : Asmuni

Nim : 135610004

LABORATORIUM TERPADU

SEKOLAM TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTER

AKAKOM

YOGYAKARTA

2015

Page 2: ohfuiohfohfohoifhcfgjuyj

A.MAKSUD DAN TUJUAN

Agar mahasiswa dapat membuat halaman web dengan menggunakan kode HTML Agar mahasiswa dapat menuliskan kode HTML secara benar sesuai aturan pada kode XHTML.

B.PEMBAHASAN

Pada praktikum kali ini dimana kita akan mempelajari tentang HTML yang merupakan suatu bahasa pemrograman yang digunakan untuk membuat suatu aplikasi yang berbasis Web. Maka untuk membangun sebuah Web dan mengakses halaman Web tersebut diperlukan sebuah Editor yang digunakan untuk menuliskan kode-kode HTML lalu Web Server yaitu sebagai server untuk melayani permintaan Klien. dan Web Browser untuk mengakases halaman Web. Maka dalam dokumen HTML mempunyai tag utama yang menandai awal dan akhir dari suatu dokumen tersebut yaitu <html> dan </html>. Tag <html> merupakan tag pembuka dan tag </html> merupakan tag penutup. Maka langkah selanjutnya yaitu dimana kita akan membuat sebuah halaman  Web dengan menggunakan HTML yang menggunakan tag Editor ( Notepad / texped) yang ada dalam sistem operasi Windows maka setelah simpan dokumen teks tersebut dengan menggunakan ekstensi html/htm. ( praktik1.htm ) dan untuk lebih jelasnya di bawah ini merupakan contoh dokumen HTML yang terdapat di modul sbb:

PRAKTIKUM :

Praktik 1

Tag <p> (page).berguna untuk membuat paragraph baru atau pindah alinea,Tag ini tidak bisa di beri akhiran <p/>tapi juga tidak di beri.Tag<BR>(line break) di gunakan untuk pindah ke baris baru, sedangkan tag <NOBR> (on line breaks), jika di gunakan teks ini maka teks yang di gunakan sangat panjang tidak secara otomatis pindah ke baris bawahnya.Perbedaan tag <p> dengan tag <BR> adalah tag <p> akan memberi ruang spasi setiap kali di ganti paragraph, sedangkan tag <br> tanpa memberikan ruang spasi setiap kali ganti baris .Contoh : gantibaris .html

<HTML><HEAD><TITLE> perbedaan ganti baris dan paragraph </TITLE></HEAD><BODY>Belajar HTML <p>Sangat menyenangkan belajar html <BR>Kita akan menjadi mahir bila kita belajar sungguh <BR>Dan terus berlatih dengan tekun <p>Selamat mencoba dan sukses <BR></BODY></HTML>

Page 3: ohfuiohfohfohoifhcfgjuyj

Elemen adalah isi dari tag yang berada diantara tag pembuka dan tag penutup. Element terdiri atas tiga bagian, yaitu tag pembuka, isi, dan tag penutup. Sebagai contoh untuk menampilkan judul dokumen HTML pada web browser digunakan element title.

Merujuk pada contoh script diatas, maka <title> ini adalah tag pembuka judul dokumen HTML. Kata-kata Judul Dokumen HTML merupakan isi judul dokumen HTML dan </title> adalah tag penutup judul dokumen HTML. Penulisan lengkapnya seperti ini <title>Judul Dokumen HTML</title>

Harus diingat, saat menulis elemen HTML jangan sampai saling tumpang tindih. Misal :

<p>    <b>        ................    </b></p>

Jangan sampai ditulis :<p>    <b>        ................    </p></b>

Lihat barisan elemen <p> yang pertama, pasangan akhirnya adalah <b>. Jika pola yang Anda gunakan seperti itu, maka yakin dan percaya, script yang Anda buat sampai kiamat tidak akan berfungsi.

<!DOCTYPE html><html><head><title>”’Selamat Malam”’ HTML</title></head><body><p>Nama saya Adrianus!</p></body></html>

Bagian header dari document HTML di apit oleh tag <HEAD></HEAD> di dalam bagian ini biasanya dimuat tag TITLE yang menampilkan judul dari halaman pada titlenya browser. Selain itu Bookmark juga megunakan tag TITLE untuk memberi mark suatu web site. Browser menyimpan “titile” sebagai bookmark dan juga untuk keperluan pencarian (searching) biasanya title di gunakan sebagai keyword. Header juga memuat tag META yang biasanya di gunakan untuk menentukan informasi tertentu mengenai document HTML, anda bisa menentukan author name, keywords, dan lainyan pada tag META.

Page 4: ohfuiohfohfohoifhcfgjuyj

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 : 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>

Atribute

Tag awal bisa memiliki beberapa buah atribut yang menyatakan karakteristik dari tag tersebut. Misalnya :

digunakan untuk membuat rata kiri suatu paragraf. Tag yang digunakan adalah

dan atribut yang menyertainya adalah ALIGN dengan nilai left. Nilai atribut ALIGN hanya bisa berupa center, left, right atau justify.

Praktik 2

Pada praktik dua berfungsi sebagai untuk membaca isi dokument HTML Dan menampilkannya sebagai halaman web.Browser tidak di tamplkan tag HTML, tetapi menggunakan tag untuk menerjemahkannya sehingga mengghasilkan tampilan tertentuWeb ini dibuat dengan standar HTML yang merupakan standar baru dari W3C yaitu lembaga yang menangani pembuatan standar aturan di web.

Praktik 3

Perbedaan ini adalah penulisannya tidak menggunakan dokument tanpa tag pre, seharusnya dokument ini harus menggunakan tag pre.

C. TUGAS

Page 5: ohfuiohfohfohoifhcfgjuyj

1. Untuk penulisan kode program pada XHTML disarankan menggunakan huruf kecil dan tidak melupakan tag penutup elemen pada setiap tag program, Semua elemen XHTML harus memiliki penutup,  Persyaratan lain dari XHTML adalah adanya pernyataan dari deklarasi DOCTYPE yang menentukan .

2. Atribut dalam HTML adalah perintah yang disisipkan/ditempelkan pada TAG utama yang tujuanya adalah mengatur bentuk/gaya tampilan sebuah objek. Contoh:penggunaan atribut yang ditempelkan pada H1 :<h1 align="center">Saya Belajar Tag HTML</h1>

Anda lihat diatas, kita membuat tulisan dengan tampilan heading 1 (judul) dan kemudian ditempelkan atribut align yang fungsinya mengatur letak horizontal di layar.Sebuah TAG boleh menggunakan lebih dari 1 atribut yang relevan. Contoh :<font size="3" face="arial" color="red">Merdeka atau Mati</font>

Contoh :TAG font diatas menggunakan atribut size (ukuran) dan face(jenis huruf) dan color(warna tulisan).Yang saya maksud relevan adalah, sebuah TAG tidak bisa diberikan atribut diluar kemampuanya. Contoh : TAG font tidak bisa ditempelkan atribut align, karena : font adalah bentuk huruf bukan format tulisan, sebaliknya seperti itu, h1 tidak bisa diberi atribut face karena h1 adalah format tulisan bukan bentuk huruf. Trus bagaimana jika ingin menggabung keduanya?? Biasanya dituliskan dengan cara :<h1><font face="arial">Saya belajar Tag</font></h1>

D.KESIMPULAN

HTML merupakan bahasa pemrograman yang digunakan untuk membangun suatu aplikasi web. HTML hanya digunakan untuk membentuk web statis saja. Untuk embuat sebuah halamam web dengan menggunakan HTML, kita dapat menuliskan kodenya secara langsung melalui editor teks seperti Notepad jika sistem operasi yang kita gunakan adalah Windows.dan pada dokumen HTML mempunyai tag utama yang menandai awal dan akhir dari suatu dokumen tersebut maka Tag tersebut adalah <html> dan </html>. Tag <html> merupakan tag pembuka dan tag </html> merupakan tag penutup.

E.LISTING (Terlampir)