1) dasar dasar programan web
-
Upload
imam-fathur -
Category
Technology
-
view
235 -
download
1
Transcript of 1) dasar dasar programan web
![Page 1: 1) dasar dasar programan web](https://reader034.fdocuments.net/reader034/viewer/2022042908/58ee30791a28ab0d428b4593/html5/thumbnails/1.jpg)
Dasar-Dasar pemrograman web
Imam fathurrahman, M.Kom
![Page 2: 1) dasar dasar programan web](https://reader034.fdocuments.net/reader034/viewer/2022042908/58ee30791a28ab0d428b4593/html5/thumbnails/2.jpg)
Istilah-istilah Internet
• WWW – World Wide Web merupakan suatu bentuk
layanan Internet yang menggunakan konsep hypertext antar dokumen yang berkaitan, yang di dalamnya terdapat halaman web (web page). Untuk mengakses www digunakan protokol http (HyperText Transfer Protocol).
![Page 3: 1) dasar dasar programan web](https://reader034.fdocuments.net/reader034/viewer/2022042908/58ee30791a28ab0d428b4593/html5/thumbnails/3.jpg)
• TCP/IP • TCP/IP singkatan dari Transfer Control Protocol/Internet
Protocol merupakan jenis protocol yang memungkinkan komputer berkomunikasi dengan komputer lain melalui suatu jaringan yang di sebut dengan internet.
• Browser – Software yang digunakan untuk surfing atau
browsing Internet, seperti Internet Explorer, Opera, Netscape dll
![Page 4: 1) dasar dasar programan web](https://reader034.fdocuments.net/reader034/viewer/2022042908/58ee30791a28ab0d428b4593/html5/thumbnails/4.jpg)
• URL – URL (Uniform Resource Locator) digunakan
sebagai penunjuk lokasi pada internet. URL dapat dimisalkan dengan alamat yang menunjuk pada suatu lokasi.
![Page 5: 1) dasar dasar programan web](https://reader034.fdocuments.net/reader034/viewer/2022042908/58ee30791a28ab0d428b4593/html5/thumbnails/5.jpg)
• Homepage – Tampilan awal (halaman utama) suatu website
yang memuat informasi singkat tentang apa isi dari website tersebut
• Situs – Suatu alamat di dalam sebuah web
![Page 6: 1) dasar dasar programan web](https://reader034.fdocuments.net/reader034/viewer/2022042908/58ee30791a28ab0d428b4593/html5/thumbnails/6.jpg)
Nama Domain
• com = Commerce, komersial• net = Jaringan (Network)• Co = Company, perusahaan • org = Organization, organisasi • gov;go = Government, pemerintah• ac = Academic, akademik • edu = Education, pendidikan • Mil = Military, militer • Id = Indonesia• Us = United State , Amerika • Au = Australia• it = Italia
![Page 7: 1) dasar dasar programan web](https://reader034.fdocuments.net/reader034/viewer/2022042908/58ee30791a28ab0d428b4593/html5/thumbnails/7.jpg)
Teknologi web
• Web Statis – Contoh : web yang berisi profil perusahaan
• Web Dinamis – Contoh : portal berita dan jejaring sosial
![Page 8: 1) dasar dasar programan web](https://reader034.fdocuments.net/reader034/viewer/2022042908/58ee30791a28ab0d428b4593/html5/thumbnails/8.jpg)
Perbedaan Web Statis dan Web Dinamis
No Web Statis Web Dinamis1. Interaksi antara pengunjung dan
pemilik web Tidak bisa bisa
2. Bahasa Script yang digunakan HTML, CSS PHP, ASP dan JavaScript
3. Penggunaan Database Tidak ada MySQL, Oracle, dll
4. Konten Statis Dinamis
![Page 9: 1) dasar dasar programan web](https://reader034.fdocuments.net/reader034/viewer/2022042908/58ee30791a28ab0d428b4593/html5/thumbnails/9.jpg)
Kebutuhan pemrograman web
• Hardware: CPU• Sofware :– Notepad– adobe dreamweaver – Microsoft Visual Studio.Net – dll
![Page 10: 1) dasar dasar programan web](https://reader034.fdocuments.net/reader034/viewer/2022042908/58ee30791a28ab0d428b4593/html5/thumbnails/10.jpg)
Pengertian HTML
• HTML atau Hypertext Marksup Language merupakan salah satu format yang digunakan dalam pembuatan dokumen dan aplikasi yang berjalan dihalaman web.
• mengandung tanda (tag) tertentu yang digunakan untuk mengatur format tampilan suatu dokumen
• HTML ditandai dengan tanda lebih kecil ( < ) dan tanda lebih besar ( > ).
• HTTP atau Hypertext Transfer Protokol merupakan protokol yang digunakan untuk mentransfer data atau document yang berformat HTML dari web server ke browser
![Page 11: 1) dasar dasar programan web](https://reader034.fdocuments.net/reader034/viewer/2022042908/58ee30791a28ab0d428b4593/html5/thumbnails/11.jpg)
Membuat struktur dasar HTML
• ELEMEN DASAR HTML <html>
<head><title></title>
</head><body></body>
</html>
![Page 12: 1) dasar dasar programan web](https://reader034.fdocuments.net/reader034/viewer/2022042908/58ee30791a28ab0d428b4593/html5/thumbnails/12.jpg)
Memformat Dokumen HTML
• Tag <br>, Digunakan untuk pindah ke baris baru • Tidak memerlukan penutup </br> atau bisa di tulisa lagsung <br /> • Tag <p>, Digunakan untuk pindah alinea atau membuat paragraf
baru. Tag ini bisa diberi akhiran </P> tapi juga bisa tidak diberi. Dalam tag ini juga bisa digunakan untuk mengatur perataan kiri, tengah, kanan dan kiri-kanan, yaitu dengan attribut ALIGN. Attribut align mempunyai nilai: LEFT, RIGHT, CENTER dan JUSTIFY
• No Line Break: <nobr> Bila digunakan tag ini maka teks yang panjang tidak secara otomatis pindah baris bawahnya bila baris pertama sudah terlalu panjang.
• Tag <hr>, digunakan untuk membuat garis horisontal.
![Page 13: 1) dasar dasar programan web](https://reader034.fdocuments.net/reader034/viewer/2022042908/58ee30791a28ab0d428b4593/html5/thumbnails/13.jpg)
Contoh 1
<html><head>
<title>percobaan1</title></head><body>helo... slamat belajar membuat home page dengan Html
</body></html>
![Page 14: 1) dasar dasar programan web](https://reader034.fdocuments.net/reader034/viewer/2022042908/58ee30791a28ab0d428b4593/html5/thumbnails/14.jpg)
Contoh 2<html>
<head>
<title>:::background:::</title></head>
<body bgcolor=#808080>
sekarang warna latar menjadi abu-abu tua
</body></html>
![Page 15: 1) dasar dasar programan web](https://reader034.fdocuments.net/reader034/viewer/2022042908/58ee30791a28ab0d428b4593/html5/thumbnails/15.jpg)
Contoh 3<html>
<head>
<title>Untitled 5</title></head>
<body>
<h1><b><p align=center>:. 6 Tingkatan Heading :. </p></b></h1><br><br><h1> heading dengan tingkat 1</h1><h2> heading dengan tingkat 2</h2><h3> heading dengan tingkat 3</h3><h4> heading dengan tingkat 4</h4><h5> heading dengan tingkat 5</h5><h6> heading dengan tingkat 6</h6></body></html>
![Page 16: 1) dasar dasar programan web](https://reader034.fdocuments.net/reader034/viewer/2022042908/58ee30791a28ab0d428b4593/html5/thumbnails/16.jpg)
Contoh 4<html>
<head>
<title>bground image</title></head>
<body background="aLIEN.jpg"><font face="arial">sekarang latar belakang dengan gambar</font>
</body></html>