5. WORLD WIDEWEB(WWW)
• Biasa disebut dengan Web saja.
• Layanan Internet yang memungkinkan pengaksesan dan pengolahan
informasi melalui pendekatan hypertext.
• Menggunakan protokol yang disebut HTTP (HyperText Transport
Protocol) yang berjalan pada TCP/IP.
5
6. WORLDWIDEWEB(WWW)
Dokumen web ditulis dalam format HTML (HyperText Markup Language) yang
diletakkan dalam web server dan diakses oleh client melalui browser.
Internet
Browser HTML
`
Client Web Server
6
7. ISTILAH-ISTILAHPADAWEB
• Halaman web (web page)
Halaman yang digunakan untuk menampilkan informasi-informasi yang
terdapat di web.
• Situs web (web site)
Sekumpulan halaman web milik seseorang, perusahaan atau instansi yang
dikumpulkan dan diletakkan dalam web server.
• Homepage
Istilah untuk menyebut halaman pertama yang akan muncul jika sebuah
situs web diakses.
7
8. ISTILAH-ISTILAHPADAWEB
• Hyperlink atau Link adalah penghubung antar halaman web.
• URL (Uniform Resource Locator) adalah alamat suatu dokumen atau situs
web yang bersifat unik dan khas, contoh :
• http://www.ilmukomputer.com
• http://64.233.167.99
• http://www.lampung.go.id/profil/sejarah.php
8
9. WEBBROWSER
• Biasa disebut dengan browser saja.
• Adalah sebuah program yang digunakan untuk menampilkan halaman web.
• Contoh browser :
• Internet Explorer
• Netscape
• Opera
• Mozilla
• Firefox
• dll.
9
12. WEBSTATIS
• Dibentuk dengan menggunakan HTML saja.
• Kekurangan aplikasi ini terletak pada keharusan untuk memelihara program
secara terus-menerus untuk mengikuti setiap perubahan yang terjadi.
12
14. WEB DINAMIS
• Tidak hanya dibentuk dengan menggunakan HTML saja tetapi menggunakan
perangkat lunak tambahan (middleware).
• Perubahan informasi dalam halaman-halaman web dapat ditangani melalui
perubahan data, bukan melalui perubahan program.
14
16. HTML (Hypertext Markup Languages)
UNIVERSITAS TEKNOKRAT INDONESIA
FAKULTAS TEKNIK DAN ILMU KOMPUTER
YUSRA FERNANDO, S.KOM., M.KOM
by:
16
17. PENGENALANHTML
• Merupakan bahasa standard yang digunakan untuk membuat dokumen
web .
• Yang bisa dilakukan dengan HTML adalah :
• Mengontrol tampilan dari halaman web dan content-nya.
• Membuat online form yang bisa di gunakan untuk menangani pendaftaran dan
transaksi secara online.
• Menambahkan objek-objek seperti gambar, audio, video, animasi dan juga java
applet dalam dokumen HTML.
17
18. TAG
• Tag adalah kode-kode yang digunakan untuk men-setting dokumen web.
• Nama tag ditulis di dalam tanda “<” dan “>” dan untuk tag penutup
ditambahkan tanda “/”.
• Boleh ditulis dengan huruf besar maupun kecil.
• Digunakan sepasang, contoh : <form> dan </form>.
• Ada tag yang tidak perlu ditutup, contoh : <br>, <hr>, <img>, dll.
18
20. STRUKTUR DASAR DOKUMEN HTML
• Tag <html>…</html> berfungsi untuk menyatakan bahwa dokumen
tersebut adalah dokumen HTML.
• Tag <head>…</head> berisi kode-kode untuk menuliskan
keterangan/informasi tentang dokumen HTML tersebut.
• Tag <title>…</title> digunakan untuk membuat judul halaman Web
(web page).
• Tag <body>…</body> berisi tag-tag untuk isi atau layout tampilan
halaman web.
20
21. STRUKTUR DASAR DOKUMEN HTML
• Penulikan kode HTML :
• Secara langsung, misal pada editor Notepad atau EditPlus.
• Secara tidak langsung, misal pada Macromedia Dreamweaver
atau Microsoft FrontPage.
• Dokumen HTML harus disimpan dengan ekstensi “.htm” atau “.html”.
21
23. BERPINDAH KEBARIS BERIKUTNYA
Digunakan tag <br>, contoh penggunaan :
<html>
<head>
<title>:: Teknokrat Online ::</title>
</head>
<body>
UNIVERSITAS<br>
TEKNOKRAT<br>
INDONESIA
</body>
</html>
23
24. MENGATURPELETAKKAN TEKS
• Digunakan tag <div> dan atribut align.
• Nilai yang dapat disikan adalah sebagai berikut :
• Left, untuk mengatur teks rata kiri terhadap halaman.
• Center, untuk mengatur teks diletakkan di tengah-tengah halaman.
• Right, untuk mengatur teks rata kanan terhadap halaman
• Justify, untuk mengatur teks rata kiri dan rata kanan terhadap halaman.
24
27. MENGATURJENIS FONT
• Digunakan atribut face.
• Jenis huruf standar yang digunakan pada Web adalah :
• Times New Roman
• Verdana
• Arial
• Helvetica
• Sans-serif.
27
29. MENGATURUKURAN FONT
Digunakan atribut size. Contoh penggunaan :
......
<div align="center">
<font face="arial" size="6">UNIVERSITAS</font>
<br>
<font face="verdana" size="7">TEKNOKRAT</font>
<br>
<font face="arial" size="5">INDONESIA</font>
</div>
......
29
30. MENGATURWARNAFONT
• Digunakan atribut color.
• Nilai yang diberikan pada atribut color tersebut dapat berupa :
1. Nama warna dalam bahasa inggris.
Contoh : “red”, “blue”, dll.
2. Nilai RGB (Red-Green-Blue) yang dinyatakan dengan
“#RRGGBB”.
Contoh : “#CC66AA”, “#FF1144”, dll.
30
31. MENGATURWARNAFONT
• Contoh nama warna dan nilai RGB-nya :
• Black = “#000000”
• Silver = “#C0C0C0”
• Gray = “#808080”
• White = “#FFFFFF”
• Maroon = “#800000”
• Red = “#FF0000”
• Purple = “#800080”
31
33. MENGATUR WARNA LATAR BELAKANG
Digunakan atribut bgcolor pada tag <body>, contoh penggunaan :
......
<body bgcolor="#FFFF99">
......
33
34. MEMFORMATTEKS
• Tag <b> atau <strong> agar text ditampilkan dalam keadaan ditebalkan.
• Tag <i> atau <em> agar teks ditampilkan dalam keadaan miring.
34
36. MEMBUAT GARISHORIZONTAL
• Digunakan tag <hr>.
• Atribut-atribut pada tag <hr> adalah :
• size : untuk menentukan ketebalan garis.
• width : untuk menentukan lebar garis.
• align : untuk mengatur peletekan garis pada halaman web.
• color : untuk menentukan warna garis.
• noshade : untuk mengatur agar garis tidak disertai bayangan.
36
37. MEMBUAT GARISHORIZONTAL
• Contoh penggunaan :
......
<br>
<hr color="#000000">
<font face="verdana" color="blue">
Selamat Datang di Website Universitas Teknokrat Indonesia
</font>
<hr color="#000000">
......
37
38. MEMBUAT ANIMASI TEKSBERJALAN
Digunakan pasangan tag <marquee>…</marquee>. Contoh penggunaan :
......
<hr color="#000000">
<font face="verdana" size="2" color="blue">
<marquee>Selamat Datang di Website Universitas Teknokrat
Indonesia</marquee>
</font>
<hr color="#000000">
......
38
39. MEMBUAT ANIMASI TEKSBERJALAN
• Untuk mengubah arah pergerakkan teks, digunakan atribut direction.
• Nilai atribut direction :
• Right, teks berjalan dari kiri ke kanan.
• Up, teks berjalan dari bawah ke atas.
• Down, teks berjalan dari atas ke bawah.
39
40. MEMBUAT ANIMASI TEKSBERJALAN
• Contoh penggunaan :
......
<hr color="#000000">
<font face="verdana" size="2" color="blue">
<marquee direction="right">
<b>Selamat Datang di Website Universitas Teknokrat Indonesia</b>
</marquee>
</font>
<hr color="#000000">
......
40
41. MEMBUAT ANIMASI TEKSBERJALAN
Atribut behavior dengan nilai alternate dapat digunakan jika ingin arah teks
bolak-balik dari kanan ke kiri dan sebaliknya, contoh penggunaan :
......
<hr color="#000000">
<font face="verdana" size="2" color="blue">
<marquee behavior="alternate">
<b>Selamat Datang di Website Universitas Teknokrat Indonesia</b>
</marquee>
</font>
<hr color="#000000">
......
41
42. MEMBUAT ANIMASI TEKSBERJALAN
Jika ingin mengatur warna latar belakang teks yang dibuat animasi,
digunakan atribut bgcolor, contoh penggunaan :
......
<hr color="#000000">
<font face="verdana" size="2" color="white">
<marquee behavior="alternate" bgcolor="blue">
<b>Selamat Datang di Website Universitas Teknokrat Indonesia</b>
</marquee>
</font>
<hr color="#000000">
......
42