Presentation 1 - Desain dan pemrograman web 2
Download as PPTX, PDF0 likes1,299 views
Dokumen ini menjelaskan dasar-dasar HTML, termasuk struktur dokumen, penggunaan tag dan atribut untuk elemen seperti judul, paragraf, gambar, dan daftar. Terdapat penjelasan tentang bagaimana menambahkan format teks dan membuat link, serta penggunaan simbol khusus dalam HTML. Selain itu, dokumen ini juga menjelaskan berbagai format gambar dan cara mengatur tampilan elemen dalam halaman web.
Presentation 1 - Desain dan pemrograman web 2
- 2. HTML = HyperText Markup Language merupakan standar bahasa yang digunakan untuk menampilkan dokumen web Untuk membuat dokumen web yang bisa ditampilkan di browser, perlu menuliskan kode HTML baik secara langsung misal pada editor text (Notepad), maupun secara tidak langsung misal melalui software Frontpage
- 3. Kode khusus yang merupakan komponen fundamental pada dokumen web dan akan dikenali oleh browser Nama TAG ditulis di dalam tanda < dan > dan untuk TAG penutup ditambakan tanda / Boleh dituliskan dengan huruf besar maupun kecil Digunakan sepasang, contoh: <H1> dan </H1>
- 4. Beberapa tag mengandung atribut didalamnya, contoh: <p align=“center”> Pada contoh di atas, p adalah nama tag, sedangkan align adalah nama atribut Atribut pada umumnya melibatkan value, seperti pada contoh, “center” adalah value untuk atribut align
- 5. Tag utama adalah HTML, HEAD, dan BODY Fungsi tag HTML adalah untuk menyatakan bahwa dokumen tersebut adalah dokumen HTML Fungsi tag HEAD adalah untuk memberikan informasi tentang dokumen HTML itu sendiri Fungsi tag BODY adalah untuk menyimpan informasi atau data yang akan ditampilkan dalam dokumen HTML
- 6. Struktur dokumen: <HTML> <HEAD> bagian head </HEAD> <BODY> bagian body </BODY> </HTML>
- 7. Untuk membuat judul pada suatu dokumen web, digunakan tag <TITLE> .. </TITLE> TITLE bukanlah suatu bagian dari teks dokumen dan hanya berada pada bagian HEAD TITLE biasanya ditampilkan pada browser pada title bar dari jendela browser dan biasanya berfungsi sebagai label dari jendela browser tersebut
- 8. HTML menyediakan 6 (enam) buah tag yang digunakan untuk mengatur ukuran teks yang dijadikan sebagai judul dalam badan dokumen Tag-tag judul ini berupa: <H1> .. </H1> sampai dengan <H6> .. </H6> Dapat ditambahkan atribut, misal align dengan value: left, right, justify
- 9. Tag <P> digunakan untuk membuat paragraf, dapat ditambahkan atribut semisal align Contoh: <P align=“center”> ..isi paragraf.. </P> Untuk membuat garis baru atau berpindah baris digunakan tag <BR> Untuk memberikan komentar yang nantinya statement tersebut akan diabaikan oleh browser, digunakan tanda <!- dan diakhiri dengan -->
- 10. Untuk membuat garis horizontal pada dokumen web digunakan tag <HR> Atribut pada tag <HR> Size : Menentukan ketebalan garis Width : Menentukan lebar garis Align : Menentukan peletakan teks dalam baris Noshade : Mengatur agar baris tidak disertai bayangan
- 11. Digunakan untuk melakukan format teks Tag yang digunakan: <b> : Menebalkan teks <i> : Memiringkan teks <u> : Menggarisbawahi teks <s> : Memberi coretan teks <tt> : Membuat teks font courier (mesin ketik) <sup> : Membuat superscript <sub> : Membuat subscript <big> : Membesarkan teks <small> : Mengecilkan teks
- 12. Digunakan untuk menentukan jenis, warna, mau pun ukuran huruf Tag yang digunakan <font> Dapat menambah atribut: Size : Ukuran huruf Face : Jenis huruf Color : Warna huruf
- 14. BLOCKQUOTE • Digunakan untuk membuat kutipan yaitu teks yang menjorok ke dalam dan baris kosong • Tag yang digunakan <blockquote> PREFORMATTED • Memerintahkan browser untuk menampilkan teks tepat seperti yang diketikkan dalam dokumen HTML • Tag yang digunakan <pre>
- 15. HTML menyediakan sejumlah simbol yang berguna untuk menampilkan makna khusus bagi browser Kode HTML yang digunakan: Simbol HTML Simbol HTML Ä Ä ä ä Ë Ë ë ë Ï Ï ï ï Ö Ö ö ö Ü Ü ü ü β ß ¼ ¼ © © < < ® ® > > ™ ™ » » Spasi « « & & ÷ ÷ x ×
- 16. <ul> adalah tag untuk membuat daftar item tidak berurut <li> adalah tag untuk membuat item dari daftar urutan Tag list tersebut dapat ditambahkan atribut TYPE dengan nilai: Disc : Bulatan hitam (●) Square : Kotak (■) Circle : Bulatan kosong (○)
- 17. <ol> adalah tag untuk membuat daftar item berurut <li> adalah tag untuk membuat item dari daftar urutan Tag list tersebut dapat ditambahkan atribut TYPE dengan nilai: 1 : Angka latin A : Huruf A a : Huruf a I : Angka romawi
- 18. Pada daftar item tidak berurut maupun daftar item berurut dapat bersifat berkalang Dimana suatu daftar item dapat berada di dalam daftar item yang lain
- 19. GIF : Graphics Interchanger Format, hanya mendukung 256 warna JPEG : Joint Photographics Expert Group, menggunakan 24 bit untuk setiap warna PNG : Portable Network Graphics, dirancang oleh W3C dengan format yang tidak tergantung jenis komputer dan OS yang digunakan TIFF/TIF : Tangged Image File Format
- 20. Untuk membuat latar belakang pada halaman web, digunakan atribut background pada tag <body ..> Contoh : <body background=“image_file”> Tag yang digunakan <img src=“image_file”> Atribut pada tag <img> Align : Mengatur perataan gambar Alt : Menyediakan teks pengganti gambar
- 21. Height : Menentukan tinggi gambar Width : Menentukan lebar gambar Border : Memberi bingkai pada gambar Hspace : Menentukan spasi horizontal suatu gambar dengan objek sekitarnya Vspace : Menentukan spasi vertikal suatu gambar dengan objek sekitarnya Membuat link dengan gambar, digunakan tag <a href=“link_tujuan”><img src=“image_file”>Teks disini</a>
- 22. Bottom : Meratakan bagian bawah teks dengan bagian bawah gambar Top : Meratakan bagian atas gambar dengan bagian paling atas suatu item pada baris saat ini Middle : Meratakan bagian tengah gambar dengan bagian bawah teks Left : Meletakkan gambar di sebelah kiri teks Right : Meletakkan gambar di sebelah kanan teks
- 23. Penghubung ke halaman-halaman web/file yang lain Tag yang digunakan adalah anchor tag, contoh: <a href=“URL”>LABEL DISINI</a> Untuk menentukan warna hyperlink, dapat digunakan atribut pada tag <body ..> Link : Menentukan warna link Alink : Menentukan warna link aktif Vlink : menentukan warna link sesudah dikunjungi
- 25. http:// Web ftp:// Server ftp File:// Berkas ftp News:// Newsgroup UseNet mailto:// E-mail telnet:// Telnet