latihantabel1 dan 2

 nama file = tabel1.html

DEMO MEMBUAT TABEL

---

Daftar Riwayat Hidup

No.	Nama	Umur	Pekerjaan
1.	Anggun	15 th	Pelajar
2.	Laeli	20 th	Wiraswasta
3.	Yayang	30 th	PNS
4.	Dita	33 th	Pengusaha.

 tabel2.html.

modul format tabel

 MODUL

FORMAT TABEL, LIST, DAN SIMBOL

A. Tujuan

1. Menentukan penerapan format tabel dalam web

2. Menentukan prosedur pembuatan tabel dalam web

3. Merancang daftar tampilan dalam halaman web

4. Membuat program halaman web yang menampilkan teks dengan berbagai

format

5. Menguji program tampilan tabel dalam halaman web

6. Menguji hasil tampilan halaman web dengan berbagai format teks

B. Dasar Teori

Mengatur Warna Latar (Background) Sel Di Dalam Tabel

Masing-masing baris dan sel yang terdapat pada suatu tabel dapat dipercantik

dengan memberi warna latar belakang (background). Caranya sederhana, hanya

dengan memberi nilai pada atribut bgColor pada tag <tr> (untuk baris) maupun

<th> atau <td> (untuk sel). Nilai warna yang digunakan untuk mengisi atribut

bgColor dapat berupa red, green, blue, violet, aqua, skyblue, purple, pink, silver,

maroon, dsb (nama warna dalam Bahasa Inggris) atau halaman bentuk notasi

heksadesimal, seperti: #000000, #FFFFFF, #FF22AA, #00FF1112, dsb. Warna-

warna tersebut dapat kita peroleh dari internet maupun dari Adobe Photoshop.

Berikut ini cara mudah mendapatkan identitas warna menggunakan bentuk

notasi heksadesimal di dalam Adobe Photoshop:

Gambar 4.1 Bentuk Notasi Heksadesimal Warna

SMK SYAUM BANJARATMA 2

Contoh penerapan warna latar di dalam suatu tabel adalah pada saat kita ingin

memberi warna latar yang berbeda untuk baris ganjil dan genap. Harapannya adalah

agar tampilan tabel tampak lebih menarik dan mudah dibaca.

Menyertakan Gambar Ke Dalam Tabel

Visualisasi atau gambar yang terdapat pada suatu tabel digunakan untuk

memperjelas isi/informasi atau baris data yang disampaikan di dalam tabel. Dalam

HTML, kita diizinkan untuk memasukkan gambar ke dalam tabel. Caranya

sederhana, yaitu dengan menempatkan tag <img> di antara tag <td> dan </td>.

Mengatur Nilai Atribut CELLSPACING dan CELLPADDING

Tag <table> memiliki dua atribut yang cukup berguna dalam pembuatan tabel,

yaitu CELLSPACING dan CELLPADDING. Kedua atribut ini dapat digunakan secara

terpisah maupun bersama-sama.

Atribut CELLSPACING digunakan untuk mengatur jarak atau spasi antarsel

(dalam satuan piksel). Dalam keadaan default, nilai dari atribut ini dianggap 0 (nol).

Berbeda dengan CELLSPACING, atribut CELLPADDING digunakan untuk

menentukan jarak antara data atau teks yang ada dalam suatu sel dengan border

atau bingkai dari sel bersangkutan. Dalam keadaan default, atribut ini juga bernilai 0

(nol).

Pengertian List

List adalah bagian teks di dalam dokumen yang berisi daftar item dari suatu

kelompok atau grup tertentu. Sebagai contoh, dalam situs web yang bertema kuliner,

list bisa berupa daftar dari makanan dan minuman beserta harganya. List juga bisa

berupa prosedur (runtunan langkah) dari suatu pekerjaan tertentu, yang sifatnya

harus dilakukan secara berurutan mulai dari langkah pertama sampai langkah

terakhir.

HTML menyediakan beberapa tag khusus yang dapat digunakan untuk

menangani kasus pembuatan list dengan beraneka ragam bentuk, bahkan untuk

daftar bersarang (nested list).

SMK SYAUM BANJARATMA 3

Dalam dokumen HTML, tipe daftar dibedakan menjadi tiga, yaitu:

 Daftar terurut (ordered list)

Daftar yang terurut biasanya ditandai dengan penggunaan aturan penomoran

tertentu. Penomoran ini bisa menggunakan angka (1, 2, 3, ...) maupun

karakter alfabet tertentu (a, b, c, ... atau i, ii, iii, ...). Daftar yang terurut pada

umumnya digunakan untuk item-item yang saling berhubungan satu sama

lain, atau untuk menuliskan langkah-langkah atau prosedur dari kegiatan

tertentu yang tidak dapat dilakukan secara acak.

Contoh daftar yang terurut adalah seperti pada cara membuat dokumen

HTML, misalnya:

Langkah-langkah membuat dokumen HTML:

1. Jalankan aplikasi Text Editor

2. Isikan kode HTML ke dalam Text Editor

3. Simpan file dengan ekstensi .htm atau .html

4. Jalankan file HTML menggunakan aplikasi web browser untuk

menampilkan hasilnya

 Daftar tidak terurut (unordered list)

Daftar yang tidak terurut adalah daftar yang item-item-nya dapat diubah

posisinya secara acak. Daftar seperti ini tidak menggunakan penomoran

seperti di atas, melainkan hanya dengan menggunakan tanda atau simbol

tertentu, misalnya gambar kotak atau bulat (bullet).

Contoh:

Daftar Produsen Mobil:

 BMW

 Chevrolet

 Daihatsu

 Ford

 Hyundai

 Mazda

 Mercedes Benz

SMK SYAUM BANJARATMA 4

 Daftar definisi (definition list)

Daftar definisi adalah suatu daftar yang berisi kumpulan definisi dari suatu

istilah (term) tertentu, misalnya daftar definisi dari kumpulan kata mutiara

atau peribahasa tertentu.

Contoh:

Ada gula ada semut

Di mana ada tempat yang bagus, biasanya banyak dikunjungi orang

Berakit-rakit ke hulu berenang-renang ke tepian

Bersusah-susah dahulu, bersenang-senang kemudian

Besar pasak daripada tiang

Pengeluaran (uang) lebih besar daripada penghasilan; boros

Menampilkan Karakter Khusus (Simbol)

Pada saat-saat tertentu mungkin Anda perlu untuk menampilkan karakter-

karakter khusus atau simbol seperti &, <, >, ®, ©, ±, dan lain-lain ke dalam halaman

web. Untuk melakukan hal tersebut, Anda perlu menggunakan entitas karakter yang

sudah disediakan oleh HTML.

Berikut ini adalah daftar entitas karakter yang sering dijumpai dalam halaman

web:

Simbol Entitas Karakter Keterangan

& &amp; Ampersand

< &lt; Lebih kecil

> &gt; Lebih besar

® &reg; Registered trademark

© &copy; Copyright

± &plusmn; Plus-minus

o &deg; Derajat

TM &trade; Trademark

1⁄4 &frac14; Seperempat

1⁄2 &frac12; Setengah

3⁄4 &frac34; Tiga Perempat

÷ &divide; Tanda bagi

SMK SYAUM BANJARATMA 5

C. Latihan

Latihan 4.1 (Memberi Warna Latar Baris)

SMK SYAUM BANJARATMA 6

Latihan 4.2 (Memasukkan Gambar ke dalam Tabel)

SMK SYAUM BANJARATMA 7

Latihan 4.3 (Mengatur Nilai CELLSPACING dalam Tabel)

SMK SYAUM BANJARATMA 8

Latihan 4.4 (Mengatur Nilai CELLPADDING dalam Tabel)

SMK SYAUM BANJARATMA 9

Latihan 4.5 (Penomoran dalam Daftar Terurut)

SMK SYAUM BANJARATMA 10

Latihan 4.6 (Daftar Tidak Terurut)

SMK SYAUM BANJARATMA 11

Latihan 4.7 (Daftar Definisi)

SMK SYAUM BANJARATMA 12

Latihan 4.8 (Menampilkan Karakter Khusus)

SMK SYAUM BANJARATMA 13

D. Tugas Mandiri

1. Buatlah sebuah halaman website yang berisikan beberapa resep makanan

ringan (brownis), makanan berat (nasi pecel goreng) dan minuman !

(Resep makanan atau minuman tidak boleh sama satu sama lain)

2. Halaman website resep makanan berisi: langkah-langkah dari resepnya dan

juga terdapat gambar hasil makanannya.

3. Dalam pembuatan website resep makanan boleh memanfaatkan modul-

modul sebelumnya sampai modul sekarang.

4. Desain yang menarik akan menjadi prioritas penilaian.

E. Tugas Berkelompok

1. Gabungkan dari tugas mandiri di atas dalam anggota kelompok yang sudah

ditentukan menjadi satu yang dapat di-link-an satu sama lain !

2. Desain yang menarik akan menjadi prioritas penilaian.

Mutiara Kehidupan :

Tantangan terbesar bukan saat kita menghadapi kesulitan tetapi saat

kita melawan kemalasan diri kita sendiri

### SELAMAT MENGERJAKAN

latihan soal dan jawaban pwpb kelas XI RPL

 LATIHAN SOAL 

PEMROGRAMAN WEB DAN PERANGKAT BERGERAK  KELAS XI RPL

SEMESTER 1

1.   sebuah bahasa markup yang digunakan untuk membuat sebuah halaman web adalah

a.  Html

b.  Notepad

c.  Bahasa Visual

d.  XML

e.   Web design Jawaban : A

 

2.  W3C adalah singkatan dari............

a.  Web Wide World Consortium

b.  World Wide Web Consortium

c.  World Wide Web Connection

d.  Web 3 Connection

e.   World Wide Web Comunication Jawaban : B

 

3.   Sebuah perangkat lunak aplikasi yang memungkinkan pengguna mengakses Web atau Server di jaringan adalah...........

a.  Web page

b.  Isp

c.  HTML

d.  Web Browser

e.   Server Provider Jawaban : D

 

4.   Berikut yang termasuk aplikasi browser dalam windows kecuali....

a.  Opera

b.  Firefox

c.  Safari

d.  Opera

e.   RIM Jawaban : E

 

5.   Sebuah aplikasi FTP memungkinkan untuk mengunggah dan mengunduh file antara komputer kita dan komputer yang akan

menjadi tempat halaman web/web server, FTP adalah Singkatan dari....

a.   File Transfer Protokol

b.  File Transisi Port

c.   Field transfer Port

d.  Field transfer Protokol

e.   File transmision protokol Jawaban : A

 

6.   Protokol yang digunakan untuk mentransfer data antara web server ke web browser adalah...

a.   FTP

b.  HTTP

c.  WWW

d.  W3C

e.   HTML Jawaban : B

 

7.   HTML merupakan salah satu bahasa yang digunakan untuk membuat sebuah halaman web, HTML merupakan kependekan dari...............

a.  Hypertext Markup Language

b.  Hypertext Mobile language

c.  Hypertext transfer protokol

d.  Hypertext markup league

e.   Host mobile language Jawaban : A

 

8.   Berikut merupakan fitur dari HTML5 kecuali.............

a.  Canvas

b.  Header

c.  Audio

d.  Animation

e.   Video Jawaban : D

9.   Secara prinsip, fitur pada HTML dapat dikelompokkan ke dalam 4 bagian, kecuali...

a.  Struktur Halaman

b.  Presentasi Visual

c.  Peranti Penyaji Gambar

d.  Struktur Body

e.   Pendukung Media Jawaban : D

 

10.   Tag HTML di tandai dengan simbol berikut ini kecuali

a.  < dan >

b.  <? dan ?>

c.  !

d.  >=

e.   () Jawaban : A

 

11.   Pasangan dari sebuah tag Html selalu di tandai dengan..........

a.  \

b.  /

c.  ?

d.  > 

e.   ) Jawaban : B

 

12.   Dalam penulisan tag HTML tidaklah case sensitive artinya.......

a.   penggunaan huruf kecil ataupun capital menjadi masalah

b.   penggunaan huruf kecil ataupun capital tidaklah menjadi masalah

c.   penggunaan tag harus menggunakan huruf kecil

d.  penggunaan tag harus menggunakan huruf besar

e.   penggunaan huruf harus bertipe times new roman

Jawaban : B

 

13.   Tag <body> pada html digunakan untuk...........

a.  Menampilkan isi halaman

b.  Membuat huruf tebal

c.  Membuat tampilan bergerak

d.  Membuat background halaman menjadi merah

e.   Menjadi penutup HTML Jawaban : A

14.  Tag <HTML> selalu ditutup dengan tag...

a.  <html>

b.  <HTML>

c.  </html>

d.  </body>

e.   </head> Jawaban : C

 

15.   Agar File html bisa di baca langsung oleh browser file tersebut harus disimpan dalam extensi........

a.  .txt

b.  .JPG

c.  .Html

d.  .Exe

e.   ./html Jawaban : C

 

16.   Berikut kode warna dari sebuah html menggunakan Hexadecimal untuk warna blue adalah...

a. #FF0000

b. #FFFFFF

c. #FF00FF

d. #0000FF

e. #000000

Jawaban : D

 

17.   Yang termasuk kedalam element body kecuali...........

a.  Text

b.  Vlink

c.  Ulink

d.  Alink

e.   BGColor Jawaban : C

 

18.   Warna default / standard untuk sebuah Link adalah........

a.  Putih

b.  Merah

c.  Biru

d.  Hijau

e.   Hitam Jawaban : C

 

19.   Tag heading berfungsi untuk memformat heading (judul dan sub-judul) dari suatu halam web. Element heading di tandai dengan tag.....

a.  < HR >

b.  < H1 >

c.  <HD>

d.  <H>

e.   <BR > Jawaban : B

 

20.   Untuk ganti baris dalam HTML menggunakan tag sebagai berikut, kecuali...........

a.  < HR >

b.  < BR >

c.  <B>

d.  <LI>

e.   < TH > Jawaban : B

 

21.  Elament <OL> digunakan untuk............

a.  Membuat List Berurutan

b.  Membuat List tidak berurutan

c.  Membuat Garis bawah

d.  Membuat List Kombinasi

e.   Mengganti Baris Jawaban : A

 

22.   Didalam tag <OL> terdapat tag <LI> yang merupakan isi dari daftar tersebut, LI adalah

a.   List Index

b.  List Interval

c.  Order List

d.  List Item

e.   List i Jawaban : D

 

23.   Untuk membuat list tidak berurutan dalam html menggunakan tag.....

a.  < html >

b.  < LB>

c.  < OL >

d.  < UL >

e.   < LI > Jawaban : D

 

24.   Berikut merupakan tag HTML kecuali.........

a.  <b>

b.  <hr>

c.  <br>

d.  <\html> e.<p> Jawaban : D

 

25.   Berikut Software yang bisa digunakan untuk membuat file html adalah............

a.  C++

b.  Notepad ++

c.  Coreldraw

d.  Microsoft Word

e.   Google Chrome Jawaban : B

 

26.   Sebuah software / aplikasi bawaan windows yang bisa digunakan untuk membuat file html adalah....

a.  Notepad ++

b.  Pain

c.  Notepad

d.  Wordpad

e.   Microsoft Word Jawaban : C

 

27.   Tag Untuk membuat tampilan dibawah ini adalah......

“ ini latihan Html Pertamaku “

a.  <b>ini latihan Html Pertamaku</b>

b.  <b><i>ini latihan Html Pertamaku<i></b>

c.  <u>ini latihan Html Pertamaku</u>

d.  <b><u>ini latihan Html Pertamaku</u></b>

e.   <b><u>ini latihan Html Pertamaku</b></u> Jawaban : D

 

28.   Berikut yang termasuk kedalam element tabel adalah............

a.  <hr>

b.  <br>

c.  <tr>

d.  <li>

e.   <ol> Jawaban : C

 

29.   Untuk membuat garis dalam tabel perlu penambahan atribut.........

a.  <tr>

b.  <td>

c.  Bgcolor

d.  Border

e.   Colspacing Jawaban : D

 

30.   Berikut yang termasuk kedalam profesi pengembang web, kecuali..

a.  Web designer

b.  Web master

c.  Web Administrator

d.  Web Server

e.  Web Programmer

Jawaban : D

 

31.   Alamat yang digunakan untuk menemukan file disebut....

a.  Web

b.  UTP

c.  URL

d.  FTP

e.   Alamat web Jawaban : C

 

32.  URL adalah singkatan dari........

a.  Universal Web Locators

b.  Universal Remote Location

c.  Universal Resource Locators

d.  Uniform Resource Locators

e.   Uniform Resouce Local Jawaban : D

 

33.   Berikut aplikasi yang tidak bersifat WYSIWYG ( What you see is what you get ) kecuali........

a.  Adobe Dreamever

b.  Textpad

c.  Text Sublime

d.  Coda

e.   BBedit Jawaban : A

 

34.  www adalah singkatan dari

a.  word wide web

b.  world wide web

c.  Web word web

d.  Wide wan web

e.   Windows web world Jawaban : B

 

35.  Pengertian dari web statis adalah........

a.   Web yang memiliki konten atau isi yang selalu berubah-ubah

b.   Web yang kontent atau isinya tetap atau tidak berubah-ubah

c.  Web yang tidak ada animasinya

d.  Web yang tidak bisa dijual

e.   Web yang mempunyai background hitam Jawaban : B

 

36.   Perintah marquee pada html berfungsi untuk......

a.  Tulisan berwarna biru

b.  Tulisan berjalan

c.  Tulisan tebal

d.  Tampilan mengikuti tulisan

e.   Tulisan menjadi lebih besar Jawaban : B

 

37.   orang yang bertugas mengimplementasikan rancangan system analis adalah.....

a.  Web analysis

b.  Web Designer

c.  Web Programmer

d.  Web Administrator

e.   Web Server Jawaban : C

 

38.   Team Pengembangan dari sebuah kegiatan pembuatan web secara keseluruhan disebut..

a.  Web master

b.  Web Programmer

c.  Web Server

d.  Web Developer

e.   Web Administrator Jawaban : D

 

39.   www adalah suatu program yang ditemukan oleh.........

a.  Team berners-lee

b.  Team Microsoft

c.  Mark

d.  Steve Job

e.   W3C. Jawaban : A

 

40.   www secara resmi digunakan secara luas pada jaringan internet pada tahun...........

a. 1990

b. 1991

c. 1992

d. 1993

e. 1994

Jawaban : B