web statis - STKIP PGRI Tulungagung
advertisement
WEB STATIS Sabian Pamungkas Pengertian • Web yang konten atau isinya tidak dapat diubah • Web yang konten atau isinya tetap • Web yang kode atau scriptnya tidak mendukung pengubahan konten atau isi secara langsung • Pengubahan konten atau isi tersebut mengharuskan kita untuk mengubah filenya Bahasa Pemrograman • HyperText Mark-up Language (HTML) • Cascading Style Sheet (CSS) • Java Script (JS) Elemen Dasar HTML • Tag • Attribute • Entity Tag • Merupakan kata kunci yang digunakan untuk membentuk suatu kode HTML • Tag diapit oleh tanda < dan > • Tag pada HTML biasanya terdiri dari 2 macam: • Tag pembuka <> • Tag penutup </> Contoh Tag • <b>Pendidikan Teknologi Informasi</b> • Tag untuk mencetak kalimat menjadi tebal (bold) • <i>Pendidikan Teknologi Informasi</i> • Tag untuk mencetak kalimat menjadi miring (italic) • <u>Pendidikan Teknologi Informasi</u> • Tag untuk mencetak kalimat menjadi bergaris bawah (underline) Attribute • Merupakan informasi tambahan yang disertakan di dalam tag • Attribute disertakan pada tag pembuka (bukan pada tag penutup) • Ditulis dengan format sebagai berikut: • nama=“nilai” Contoh Attribute • <a href=“http://tes.com”>Tes Link</a> • href adalah attribute untuk informasi alamat link • <p align=“center”>Contoh Paragraf</p> • align adalah attribute untuk informasi tata letak kalimat • <img src=“image.jpg” width=“200px” height=“100px”> • src adalah attribute untuk informasi sumber (source) file • width adalah attribute untuk informasi panjang • height adalah attribute untuk informasi tinggi Entity • Merupakan kode tambahan pada HTML untuk memunculkan karakter tertentu • Bukan elemen utama pada kode HTML, hanya sebagai pelengkap saja • Entity pada HTML diawali oleh & dan diakhiri oleh ; Contoh Entity • &copy; • Untuk mencetak karakter © (copyright) • &trade; • Untuk mencetak karakter ™ (trade mark) • &larr; • Untuk mencetak karakter ← (left arrow) Struktur Dasar HTML <!DOCTYPE html> <html> <head> //tempat kita menulis tag pendukung </head> <body> //tempat kita menulis dokumen utama </body> </html> Membuat Kode HTML • Buka aplikasi Notepad atau aplikasi sejenis • Tulis kode berikut (di halaman selanjutnya) • Simpan sebagai: index.html • Atau nama apapun yang penting ekstensinya adalah .html • Jalankan dengan browser (Firefox, Chrome, atau aplikasi sejenis) Contoh Kode HTML <!DOCTYPE> <html> <head> <title>Website Saya</title> </head> <body> <h1>Selamat Datang</h1> Ini adalah website pertama saya.<br> Klik <a href=“http://google.com”>di sini</a> untuk informasi lebih lanjut. </body> </html> Tugas Minggu Depan • Buat ringkasan mengenai: • • • • Heading Paragraph Link Image • Ringkasan dibuat dalam bentuk slide TERIMA KASIH Sabian Pamungkas
