NAMA	1.Entheny 2.Dimas Permana	Kompetensi	Nilai Skill	Nilai KNOWLEDGE
Kelas	X TKJ 1	Web Desain Dan Pemrograman Web
Tanggal	Senin,14-05-2018
JOB	1
Kerjakan Soal Di bawah ini dengan menggunakan Wifi 1.      Jelaskan  perbedaan dari web statis dan dinamis dan sebutkan contohnya ? 2.      apa yang kalian ketahui tentang Jelaskan Pemrograman Web: A.     HTML?. B.     CSS?. C.     PHP?. D.     Jquery?. E.      Javascript?. F.      VBScript?. 3.      Butlah tabel perbedaan antara pemrograman Web yang bersifat Client Side dengan Server Side?.. 4.      Jelaskan apa yang kalian ketahui tentang FTP? 5.      Jika kalian ingin menggabungkan Desain & Pemrograman Web software apa yang kalian gunakan jelaskan ?.. 6.      Jelaskan pengertian tentang hosting dan domain? 7.      Jelaskan yang dimaksud dengan web server dan jenis jenis web server ?(6) 8.      Jelaskan tang dimaksud dengan web browser dan jenis jenis Web Browser ?(5) 9.      Jelaskan apa yang di maksud dengan web programming dan macamnya 10.  Jelaskan apa yg dimaksud dengan HTML dan sebutkan macam-macam tag dalam penulisan HTML ? 11.  Tuliskan script HTML untuk memasukkan suara/musik ke dalam file HTML ? 12.  Tuliskan script HTML untuk membuat hyperlink antar dokumen HTML ?

JAWABAN

1.       Web Statis
Web statis adalah website yang mana pengguna tidak bisa mengubah konten dari web tersebut secara langsung menggunakan browser. Interaksi yang terjadi antara pengguna dan server hanyalah seputar pemrosesan link saja. Halaman-halaman web tersebut tidak memliki database, data dan informasi yang ada pada web statis tidak berubah-ubah kecuali diubah sintaksnya. Dokumen web yang dikirim kepada client akan sama isinya dengan apa yang ada di web server.

Contoh dari web statis adalah web yang berisi profil perusahaan. Di sana hanya ada beberapa halaman saja dan kontennya hampir tidak pernah berubah karena konten langsung diletakan dalam file HTML saja.

Web Dinamis
Dalam web dinamis, interaksi yang terjadi antara pengguna dan server sangat kompleks. Seseorang bisa mengubah konten dari halaman tertentu dengan menggunakan browser. Request (permintaan) dari pengguna dapat diproses oleh server yang kemudian ditampilkan dalam isi yang berbeda-beda menurut alur programnya. Halaman-halaman web tersebut memiliki database. Web dinamis, memiliki data dan informasi yang berbeda-beda tergantung input apa yang disampaikan client. Dokumen yang sampai di client akan berbeda dengan dokumen yang ada di web server.

Contoh dari web dinamis adalah portal berita dan jejaring sosial. Lihat saja web tersebut, isinya sering diperbaharui (di-update) oleh pemilik atau penggunanya. Bahkan untuk jejaring sosial sangat sering di-update setiap harinya.

Perbedaan Web Statis dan Web Dinamis

1. Interaksi antara pengunjung dan pemilik web
   Dalam web statis tidak dimungkinkan terjadinya interaksi antara pengunjung dengan pemilik web. Sementara dalam web dinamis terdapat interaksi antara pengunjung dengan pemilik web seperti memberikan komentar, transaksi online, forum, dll.

2. Bahasa Script yang digunakan
   Web statis hanya menggunakan HTML saja, atau paling tidak bisa ditambah dengan CSS. Sedangkan web dinamis menggunakan bahasa pemrograman web yang lebih kompleks seperti PHP, ASP dan JavaScript.

3.  Penggunaan Database
   Web statis tidak menggunakan database karena tidak ada data yang perlu disimpan dan diproses. Sedangkan web dinamis menggunakan database seperti MySQL, Oracle, dll untuk menyimpan dan memroses data.

4. Konten
   Konten dalam web statis hanya diberikan oleh pemilik web dan jarang di-update, sementara konten dalam web dinamis bisa berasal dari pengunjung dan lebih sering di-update. Konten dalam web dinamis bisa diambil dari database sehingga isinya pun bisa berbeda-beda walaupun kita membuka web yang sama.

2.A. HTML= Hypertext Markup Language (HTML) adalah sebuah bahasa markah yang digunakan untuk membuat sebuah halaman web,

B. CSS= Cascading Style Sheet (CSS) merupakan aturan untuk mengendalikan beberapa komponen dalam sebuah web sehingga akan lebih terstruktur dan seragam. CSS bukan merupakan bahasa pemograman
C. PHP= Hypertext Preprocessor (PHP) adalah bahasa skrip yang dapat ditanamkan atau disisipkan ke dalam HTML. PHP banyak dipakai untuk memrogram situs web dinamis. PHP dapat digunakan untuk membangun sebuah CMS.

D. Jquery= jQuery adalah pustaka JavaScript kecil bersumber terbuka yang menekankan pada interaksi antara JavaScript dan HTML. Pustaka ini dirilis pada Januari 2006 di BarCamp NYC oleh John Resig dan berlisensi ganda di bawah MIT dan GPL.

E. Javascript= JavaScript adalah bahasa skrip yang populer di internet dan dapat bekerja di sebagian besar penjelajah web populer seperti Internet Explorer (IE), Mozilla Firefox, Netscape dan Opera. Kode JavaScript dapat disisipkan dalam halaman web menggunakan tag SCRIPT.

F. VBScript= VBScript atau lengkapnya Visual Basic Scripting Edition adalah sebuah bahasa skrip yang diinterpretasikan saat dieksekusi yang dikembangkan oleh Microsoft Corporation pada tahun 1996 yang seringnya digunakan dalam penjelajah web Internet Explorer (dapat digunakan mulai versi Internet Explorer 3.0).

3.

Client Side	Server Side
Client Side merupakan teknologi webpage yang menerapkan jenis pemrograman web dimana semua sintaks dan perintah program dijalankan di web browser sehingga ketika client meminta dokumen yang mengandung script, script tersebut akan diambil dari web server kemudian dijalankan di web browser yang bersangkutan.	Server Side merupakan teknologi webpage yang menerapkan jenis pemrograman web dimana semua sintaks dan perintah program yang diberikan akan dijalankan/diproses di webserver, kemudian hasilnya dikirimkan ke browser pengguna dalam bentuk HTML biasa. Sehingga pengguna tidak dapat melihat kode asli yang ditulis dalam bentuk server side programming.

4. FTP  adalah singkatan "File Transfer Protocol" yaitu sebuah protocol internet yang berjalan di dalam lapisan aplikasi yang merupakan standar untuk pertransferan berkas (file) computer antar mesin-mesin dalam sebuah inter jaringan.

5. ♦ Software untuk membuat desain

Untuk membuat desain suatu website biasanya para desainer web dimulai dengan software ini sebagai tampilan sementara atau dalam membuat layout website.

• Adobe Photoshop : Desain berbasis titik (bitmap), dan dapat memotong gambar-gambar ke dalam format html.
• Adobe Fireworks : Desain berbasis titik (bitmap), vector, dan dapat memotong gambar-gambar ke dalam format html.
• Adobe Image Ready : Memotong gambar-gambar ke dalam format html.
• Adobe Illustrator : Desain berbasis vector
• CorelDraw : Desain berbasis vector
• Adobe Freehand : Desain berbasis vektor
• Software untuk menambahkan efek desain.

Menambahkan efek dilakukan untuk menghidupkan desain yang telah Anda rancang. Seperti menambah efek cahaya, tekstur dan manipulasi teks.

• Adobe Fireworks : Efek teks
• Painter : Memberikan efek lukisan
• Ulead Photo Impact : Efek frame dan perancangan ikon yang cantik.
• Plugins Photoshop: Seperti Andromeda, Alien Skin, Eye Candy, Kai’s Power Tool, dan Xenofex juga sangat mendukung untuk memberi efek desain sewaktu Anda mendesain layout website di Photoshop.
• Software pembuat animasi

6. Hosting adalah tempat menyimpan segala file website yang kita kunjungi.domain adalah nama/ alamat website kita sendiri

-Domain adalah sebuah nama unik yang digunakan untuk mempermudah pengguna mengakses informasi pada server komputer yang ada di jaringan internet

7. Web server adalah sejenis perangkat lunak yang mampu memberikan layanan atau service untuk menerima request HTTP maupun HTTPS dari klien yang dikenal. Adapun klien yang dimaksud disini adalah web browser yang digunakan untuk menghubungkan pengguna ke internet, misalnya Google Chrome, Mozilla Firefox, UC Browser, dan lain sebagainya.

1. Apache                                                           4. Lighttpd

2. Nginx                                                              5. Zeus Web Server

3.IIS (Internet Information Services)      6. Sun Java System Web Server

8. Web Browser merupakan sebuah aplikasi perangkat lunak untuk melintasi, mengambil, dan menyajikan sumber informasi di World Wide Web. Sumber informasi diidentifikasikan dengan Uniform Resource Identifier (URI) termasuk sebuah Halaman web, gambar, video, atau bagian lain dari konten web.

          1. Internet Explorer             

          2. Mozilla Firefox

          3. Konqueror

          4. Camino

          5. Flock

9. Apa yang dimaksud sebagai web programming? Kita sering mendengar istilah itu sebagai sesuatu yang berkaitan dengan internet dan website. Memang tak ada yang salah. Sebab berdasarkan namanya, web programming merupakan proses atau cara membuat program/web untuk kebutuhan akses internet.

• Penguasaan HTML dan CSS
• Penguasaan PHP
• Penguasaan Javascript

10. Fungsi Tag HTML adalah untuk membuat tampilan WEB yg kita buat menjadi lebih menarik, kebayangkan jika kita mendesign web tanpa menggunakan tag html, pasti akan keliatan membosankan, tulisan dimana-mana

<acronym>	Mendefinisikan akronim / fungsi tag ini kurang lebih sama dengan tag <abbr>
<address>	Mendefinisikan informasi kontak untuk penulis/pemilik dokumen
<applet>	Digunakan untuk memasukan file java kedalam dokumen HTML
<area />	Mendefinisikan daerah yang dapat diklik (link) pada peta gambar
<b>	Membuat teks tebal

11. Langkah-Langkah:

1) Jalankan aplikasi text editor seperti 'notepad' untuk menulis sebuah dokumen HTML.

2) simpan dokumen HTML dengan format 'Nama_File.html' tanpa tanda kutip, kemudian pada 'Save as type' Anda pilih 'All files' agar dokumen yang Anda simpan menjadi dokumen HTML bukan dokumen text biasa.

3)Sekarang mari kita mulai untuk membuat playlist lagu pada dokumen HTML seperti pada kotak di bawah ini.

<!DOCTYPE html>

<html>

<head>

<title> Cara Memasukkan Playlist Lagu Pada Dokumen HTML </title>

</head>

<body>

<audio controls>

<source src="Nama Lagu.mp3" type="audio/mpeg">

</audio>

</body>

</html>

1) Kemudian Simpan Script di atas yg sudah di Copy Paste di Notepad .

2) Buat folder kosong terlebih dahulu sebelum di Save.Kemudian Masukkan File HTML yg sudah kalian buat.3) Anda bisa mengganti "Nama Lagu.mp3" diatas dengan judul musik yang ingin dimasukkannya tetapi tanpa menghilangkan ".mp3" nya.

4) Satukan/Masukkan juga File Musiknya yang kalian inginkan di Folder tadi (jangan lupa edit skrip di Notepad kembali jika kalian mau mengganti File Musiknya).

5) Terakhir, buka File HTML yang sudah kalian buat dengan Browser yg kalian inginkan.

12. <!DOCTYPE html>

<html>

<head>

<title>Belajar HTML di Duniailkom</title>

</head>

<body>

<h3 id="judul1">Saya sedang belajar HTML di Duniailkom.com</h3>

<p id="paragraf1">HTML adalah singkatan dari Hypertext Markup Language.

Disebut hypertext karena di dalam HTML sebuah text biasa dapat

berfungsi lain, kita dapat membuatnya menjadi link yang dapat

berpindah dari satu halaman ke halaman lainnya dengan

hanya meng-klik text tersebut.</p>

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<a href="#judul1">Kembali ke judul pertama</a>

<br />

<a href="#paragraf1">Kembali ke paragraf pertama</a>

</body>

</html>