#3 MB KMB Web Programming - WWW

Confidential Customized for Lorem Ipsum LLC Version 1.
Pemrograman
Website
Word Wide Web (WWW)
3
Ir. Purwono, S.Kom., M.Kom.
S1 - STIKOM Yos Sudarso
S2 - Universitas Ahmad Dahlan
Ir - Universitas Lambung Mangkurat
0821-1394-0427
ipungofficial@gmail.com
Ir. Purwono, S.Kom.,M.Kom
Researcher, Lecturer
Education
Profesi - Universitas Lambung Mangkurat
S3 - IPB (otw)
Hello, I’m Ipung
Interest Experiences
IOS Development Hotma Sitompoel Associates (IT Manager)
Blockchain Pool2Deal Indonesia (Project Manager) ipungdevcenter
Machine Learning Hardisc Consultant (Web Programmer)
Internet of Things STIKOM Yos Sudarso (Lecturer) 082113940427
Community :
Facebook Developer Community, PHP Indonesia, Microsoft User Group ID
Penilaian Kuliah
No Penilaian Persentase
1 Kehadiran, Teamwork, Keaktifan 20%
2 Sikap dan Kesopanan 10%
3 Tugas Terstruktur 10%
4 UTS 30%
5 UAS 30%
Total 100%
Skala Nilai
No Range Grade Nilai E termasuk:
1 85 - 100 A 1. Tidak pernah mengikuti kuliah lebih

dari 60% tanpa alasan logis.
2 75 - 84,99 B 2. Tidak mengikuti UTS dan UAS
3. Tidak pernah mengumpulkan tugas
3 65 - 74,99 C 4. Melanggar nilai kesopanan
4 45 - 64,99 D
5 0 - 44,99 E
Sumber Bacaan
Buku WWW
03
Teori Pemrograman Website ● WWW

● Web Component
● HTML
● CSS
WWW
Web pada awalnya merupakan ruang informasi dalam internet, dengan menggunakan teknologi hyperteks,
terdiri dari link-link yang disediakan dalam dokumen web untuk menemukan informasi yang dibutuhkan oleh
pengguna, ditampilkan melalui browser. Internet identik dengan web karena kepopuleran web sebagai standar
interface pada layanan-layanan yang ada di Internet. Web digunakan juga untuk melayani komunikasi e-mail
sampai dengan chatting, juga transaksi bisnis (e-commerce)
WWW
Beberapa alasan web telah diadopsi oleh perusahaan sebagai bagian dari strategi teknologi informasinya, yaitu:
● Akses informasi mudah

● Setup server lebih mudah
● Informasi mudah didistribusikan
● Bebas platform; informasi dapat disampaikan oleh browser web pada sistem operasi mana saja karena
adanya standar dokumen berbagai tipe data disajikan
WWW
World Wide Web Consortium-W3C dibentuk pada Oktober 1994, dengan jumlah anggota lebih dari 400
organisasi anggota dari seluruh dunia, telah menghasilkan pengakuan internasional untuk kontribusinya pada
perkembangan Web. W3C meletakkan gabungan spesifikasi dalam standar web, yaitu:
● Standar web yang paling mendasar adalah HTML, CSS, dan XML
● Standar HTML yang terakhir adalah HTML 5.2
Bagaimana WWW Bekerja?
● Informasi web disimpan dalam dokumen yang disebut dengan halaman-halaman web
● Web page adalah file-file yang disimpan dalam komputer yang disebut dengan server-server web
● Komputer-komputer membaca web page disebut sebagai web client
● Web client menampilkan page dengan menggunakan aplikasi yang disebut dengan browser web (web
browser)
● Browser web yang populer adalah Google Chrome, Mozilla Firefox.
Skema WWW Bekerja
Web
Component
Web Basic Components:
Component ●
●
Header (Logo)
Navigation
● Banner (Billboard)
● Main content area
● Footer
Secondary Components:
● Sub Navigation (Quick Links)
● Search Area
● Subscription Area
● Latest News, Offers or Products
● And a many more
Responsive
Layout
HTML
HTML adalah bahasa markup standar untuk membuat halaman Web.
● HTML adalah singkatan dari Hyper Text Markup Language
● HTML adalah bahasa markup standar untuk membuat halaman Web
● HTML menjelaskan struktur halaman Web
● HTML terdiri dari serangkaian elemen
● Elemen HTML memberi tahu browser cara menampilkan konten
● Elemen HTML memberi label bagian konten seperti "ini adalah judul", "ini adalah paragraf", "ini
adalah tautan", dll.
● Deklarasi <! DOCTYPE html> mendefinisikan bahwa dokumen ini
<!DOCTYPE html>
<html> adalah dokumen HTML5
<head> ● Elemen <html> adalah elemen root dari halaman HTML
<title>Page Title</title> ● Elemen <head> berisi informasi meta tentang halaman HTML
</head> ● Elemen <title> menentukan judul untuk halaman HTML (yang
<body>
ditampilkan di bilah judul browser atau di tab halaman)
<h1>My First Heading</h1> ● Elemen <body> mendefinisikan badan dokumen, dan merupakan
<p>My first paragraph.</p> wadah untuk semua konten yang terlihat, seperti judul, paragraf,
gambar, hyperlink, tabel, daftar, dll.
</body> ● Elemen <h1> mendefinisikan heading besar
</html>
● Elemen <p> mendefinisikan sebuah paragraf
HTML PAGE
STRUCTURE
CSS
● CSS adalah bahasa yang kami
gunakan untuk mendesain
dokumen HTML.
● CSS menjelaskan bagaimana
elemen HTML harus
ditampilkan.
<!DOCTYPE html>
<html>
<head>
<style>
body {
background-color: lightblue;
}
h1 {
color: white;
text-align: center;
}
p {
font-family: verdana;
font-size: 20px;
}
</style>
</head>
<body>
<h1>My First CSS Example</h1>

<p>This is a paragraph.</p>
</body>
</html>
Inline vs Internal vs External CSS
<link href="style.css" rel="stylesheet" type="text/css">
<h1 style="color:red;margin-left:20px;">Today’s Update</h1>
<head>
<style type="text/css">
h1 {
color:#fff
margin-left: 20px;
}
p {
font-family: Arial, Helvetica, Sans Serif;
}
</style>
</head>
ID vs Class Selector
ID is are unique Classes are not unique
● Each element can have only one ID ● You can use the same class on multiple
● Each page can have only one element elements.
with that ID ● You can use multiple classes on the same
● Use # symbol in CSS element.
● Use . (dot) in CSS
ID vs Class Selector
#top {
background-color: #ccc; <div id="top">
padding: 20px
} <h1>Chocolate curry</h1>
<p class="intro">This is my recipe for
.intro { making curry purely with chocolate</p>
color: red; <p class="intro">Mmm mm mmmmm</p>
font-weight: bold;
</div>
}
Thank you.
3
Purwono, S.Kom., M.Kom.
0821-1394-0427
ipungofficial@gmail.com

#3 MB KMB Web Programming - WWW

Diunggah oleh

Informasi Dokumen

Judul Asli

Hak Cipta

Format Tersedia

Bagikan dokumen Ini

Bagikan atau Tanam Dokumen

Opsi Berbagi

Apakah menurut Anda dokumen ini bermanfaat?

Apakah konten ini tidak pantas?

Hak Cipta:

Format Tersedia

#3 MB KMB Web Programming - WWW

Diunggah oleh

Hak Cipta:

Format Tersedia

Conﬁdential Customized for Lorem Ipsum LLC Version 1.

1 Kehadiran, Teamwork, Keaktifan 20%

2 Sikap dan Kesopanan 10%

3 Tugas Terstruktur 10%

1 85 - 100 A 1. Tidak pernah mengikuti kuliah lebih

Teori Pemrograman Website ● WWW

● Akses informasi mudah

<h1>My First CSS Example</h1>

<h1 style="color:red;margin-left:20px;">Today’s Update</h1>

Anda mungkin juga menyukai