Tugas produktif
1. Jelaskan apa yang dimaksud dengan HTML
HTML (Hyper Text Markup Language) adalah sebuah bahasa
markup yang digunakan untuk membuat sebuah halaman web dan menampilkan
berbagai informasi di dalam sebuah browser Internet. Bermula dari sebuah bahasa
yang sebelumnya banyak digunakan di dunia penerbitan dan percetakan yang
disebut dengan SGML (Standard Generalized Markup Language), HTML
adalah sebuah standar yang digunakan secara luas untuk menampilkan halaman web.
HTML saat ini merupakan standar Internet yang didefinisikan dan dikendalikan
penggunaannya oleh World Wide Web Consortium (W3C).
HTML berupa
kode-kode tag yang menginstruksikan browser untuk menghasilkan tampilan sesuai
dengan yang diinginkan. Sebuah file yang merupakan file HTML dapat dibuka
dengan menggunakan browser web seperti Mozilla Firefox atau Microsoft Internet
Explorer. HTML juga dapat dikenali oleh aplikasi pembuka email ataupun dari PDA
dan program lain yang memiliki kemampuan browser.
HTML dokumen
tersebut mirip dengan dokumen teks biasa, hanya dalam dokumen ini sebuah teks
bisa memuat instruksi yang ditandai dengan kode atau lebih dikenal dengan TAG
tertentu. Sebagai contoh jika ingin membuat teks ditampilkan menjadi tebal
seperti: TAMPIL TEBAL, maka penulisannya dilakukan dengan
cara: <b>TAMPIL TEBAL</b>. Tanda <b> digunakan
untuk mengaktifkan instruksi cetak tebal, diikuti oleh teks yang ingin
ditebalkan, dan diakhiri dengan tanda </b> untuk menonaktifkan
cetak tebal tersebut.
Secara garis
besar, terdapat 4 jenis elemen dari HTML :
- Structural
Tanda yang menentukan level atau tingkatan dari sebuah teks (contoh,<h1>Golf</h1> akan memerintahkan browser untuk menampilkan “Golf” sebagai teks tebal besar yang menunjukkan sebagai Heading 1) - Presentational
Tanda yang menentukan tampilan dari sebuah teks tidak peduli dengan level dari teks tersebut (contoh, <b>boldface</b> akan menampilkan bold. Tanda presentational saat ini sudah mulai digantikan oleh CSS dan tidak direkomendasikan untuk mengatur tampilan teks - HyperText
Tanda yang menunjukkan pranala ke bagian dari dokumen tersebut atau pranala ke dokumen lain (contoh, <a href="http://www.ilmukita.com/">IlmuKita</a> akan menampilkan IlmuKita sebagai sebuah hyperlink ke URL tertentu) - Elemen Widget
Yang membuat objek-objek lain seperti tombol (<button>), list (<li>), dan garis horizontal (<hr>)
Selain
markup presentational , markup yang lain tidak menentukan bagaimana
tampilan dari sebuah teks. Namun untuk saat ini, penggunaan tag HTML untuk
menentukan tampilan telah dianjurkan untuk mulai ditinggalkan dan sebagai
gantinya digunakan Cascading Style Sheets.
2. Bagaimana
struktur HTML ? Buatlah Contohnya.
Struktur HTML (Hyper Text Markup Language) ini merupakan susunan dalam sebuah
script HTML yang wajib ada didalamnya. Struktur HTML ini wajib ada, sebab
bila tidak ada struktur dasar HTML, mustahil sebuah script bisa bekerja.
Contoh
Struktur Dasar HTML :
<html>
<head>
<title> hai </title>
</head>
<body>
saya sedang belajar html disini
</body>
</html>
<head>
<title> hai </title>
</head>
<body>
saya sedang belajar html disini
</body>
</html>
Keterangan !
<html> Merupakan kode pembuka dalam sebuah HTML
<head> Bagian kepala pada sebuah HTML
<title> HAI </title> Bagian judul sebuah untuk HTML
</head> Merupakan Penutup dari sebuah script HTML
</body> Merupakan kode untuk pembuka sebuah isi script yang ada didalam HTML
SAYA SEDANG BELAJAR HTML DISINI Merupakan isi pada sebuah HTML
</body> Merupakan kode untuk penutup sebuah isi script yang ada didalam HTML
</html> Merupakan kode penutup dalam sebuah HTML
<html> Merupakan kode pembuka dalam sebuah HTML
<head> Bagian kepala pada sebuah HTML
<title> HAI </title> Bagian judul sebuah untuk HTML
</head> Merupakan Penutup dari sebuah script HTML
</body> Merupakan kode untuk pembuka sebuah isi script yang ada didalam HTML
SAYA SEDANG BELAJAR HTML DISINI Merupakan isi pada sebuah HTML
</body> Merupakan kode untuk penutup sebuah isi script yang ada didalam HTML
</html> Merupakan kode penutup dalam sebuah HTML
3. Tag HTML
apa saja yang anda ketahui ?
ΓΌ
Berikut
merupakan tag dasar HTML :
<HTML> </HTML> : menandai awal dan akhir dokumen HTML
<HEAD> </HEAD> : menandai bagian header dokumen HTML
<TITLE>Juduldokumen</TITLE> : memberi judul pada dokumen HTML
<BODY>Isidokumen</BODY> : menandai awal dan akhir isi dokumen
<HTML> </HTML> : menandai awal dan akhir dokumen HTML
<HEAD> </HEAD> : menandai bagian header dokumen HTML
<TITLE>Juduldokumen</TITLE> : memberi judul pada dokumen HTML
<BODY>Isidokumen</BODY> : menandai awal dan akhir isi dokumen
Beberapa tag-tag yang sering dipakai dalam pembuatan file HTML.
1.
Tag Judul (Heading) : Biasanya
digunakan untuk menuliskan judul suatu paragraf.
<hn>Judulparagraf</hn>
<hn>Judulparagraf</hn>
n = 1,2,3,4,5,6 (tingkat judul)
2. Tag
Paragraf (Paragraph) : Untuk
menandai suatu paragraf. Suatu paragraf akan terlihat dibatasi oleh satu baris kosong
sebelum dan sesudahnya.
<p>paragraf</p>
<p>paragraf</p>
3. Tag
Atribut1 (Bold, Italic, Underline) : Untuk menandai bagian kalimat agar
dicetak tebal, miring, dan atau digaris bawahi.
<b>Kalimat yang dicetak tebal</b>
<i>Kalimat yang dicetak miring</i>
<u>Kalimat yang digaris bawahi</u>
<b>Kalimat yang dicetak tebal</b>
<i>Kalimat yang dicetak miring</i>
<u>Kalimat yang digaris bawahi</u>
4. Tag Atribut2 (Superscript,
Subscript) : Untuk
menandai bagian karakter agar dicetak tinggi atau rendah, biasanya untuk
rumus matematika atau kimia.
<sup>bagian yang dicetak tinggi</sup>
<sub>bagian yang dicetak rendah</sub>
<sup>bagian yang dicetak tinggi</sup>
<sub>bagian yang dicetak rendah</sub>
5. Tag Ganti Baris(Break line) : Untuk pindah ke baris
berikutnya.
<br>
<br>
6. Tag Font (size) : Memformat suatu bagian kalimat
dengan ukuran, jenis huruf, atau warna tertentu.
Tag : font
Parameter : size, face, color
<font size="n">kalimat</font> , n= ukuran huruf
<font color="#RRGGBB>kalimat</font>
RR = 00-FF (intensitas warna merah dalam heksadesimal)
GG = 00-FF (intensitas warna hijau dalam heksadesimal)
BB = 00-FF (intensitas warna biru dalam heksadesimal)
Tag : font
Parameter : size, face, color
<font size="n">kalimat</font> , n= ukuran huruf
<font color="#RRGGBB>kalimat</font>
RR = 00-FF (intensitas warna merah dalam heksadesimal)
GG = 00-FF (intensitas warna hijau dalam heksadesimal)
BB = 00-FF (intensitas warna biru dalam heksadesimal)
7. Tag Enumerasi (List,
Unnumbered List, Ordered List) : Untuk menandai suatu item dari daftar
(enumerasi), diawali dengan simbol buller (•). Kelompok item harus
diapit oleh tag <ul> </ul> dalam daftar
bertingkat. Untuk me-nomori enumerasi dengan nomor urut (1,2,3), apitlah
dengan tag <ol> </ol>
<li>item</li>
<li>item</li>
8. Tag Garis Mendatar (Horizontal
Line) : Membentuk
garis pemisah mendatar.
<hr>
<hr>
9. Tag Gambar(Image) : Untuk menampilkan sebuah
file gambar.
<imgsrc="Nama File Gambar"/>
Nama File Gambar = file gambar yang mempunyai ekstensi .GIF, .JPG, atau .PNG.
<imgsrc="Nama File Gambar"/>
Nama File Gambar = file gambar yang mempunyai ekstensi .GIF, .JPG, atau .PNG.
10. Tag Link (Anchor) : membentuk link ke
URL/file/bagian dokumen lain.
<a href="Link">Kata yang di-click</a>
<a name="#Acuan">Kata yang dituju</a>
Link = Alamat URL atau nama file dan/atau acuan yang dituju
Acuan= Kata sembarang sebagai penanda.
<a href="Link">Kata yang di-click</a>
<a name="#Acuan">Kata yang dituju</a>
Link = Alamat URL atau nama file dan/atau acuan yang dituju
Acuan= Kata sembarang sebagai penanda.
11. Tag Tabel(Table) : Menampilkan data dalam bentuk
tabel. Tabel didefinisikan dengan cara menyatakan baris-baris dan
kolom-kolom.
<table>definisitabel</table>
Tag untuk penanda baris adalah <tr>definisi baris</tr>
Tag untuk penanda kolom adalah <td>data</td>
<table>definisitabel</table>
Tag untuk penanda baris adalah <tr>definisi baris</tr>
Tag untuk penanda kolom adalah <td>data</td>
4. Apa saja atribut-atribut
dari Tag HTML tersebut ?
HTML Attributes atau Atribut HTML adalah suatu informasi tambahan yang bisa disertakan pada suatu elemen HTML. Suatu elemen dapat memiliki atribut. Atribut ini memberikan informasi tambahan tentang elemen yang bersangkutan. Atribut selalu digunakan pada awal tag / start tag. Cara mendefinisikan atribut dengan memberikan informasi name dan value dari suatu elemen, seperti name=”value”. Contoh Atribut :
Link HTML atau HTML Links didefinisikan dengan tag <a>. Alamat link inilah yang merupakan atribut.
<a
href="http://www.pemrograman.org/">Pemrograman</a>
Jadi <a> merupakan
elemen html, href adalah name atau nama atribut sedang Pemrograman
adalah value atau nilai atribut.
Berikut adalah beberapa atribut standar yang hampir dipakai semua elemen:
Atribut
|
Nilai
|
Keterangan
|
Class
|
class_rule ataustyle_rule
|
Kelas
elemen
|
Id
|
id_name
|
Nomor
unik suatu elemen
|
Style
|
style_definition
|
Definisi
gaya atau style
|
Title
|
tooltip_text
|
Tulisan
yang akan tertampil pada tool tip
|
Nilai
suatu atribut harus selalu dimulai dan diakhiri dengan tanda petik. Biasanya
menggunakan tanda petik (“…”). Tanda petik ini mengapit petikan langsung dari
suatu nilai elemen. Tanda petik tunggal juga diperlehkan untuk digunakan
walaupun dalam keadaan tertentu nilai suatu atribut bisa berisi tanda kutip,
untuk itu di pergunakan tanda kutip tunggal yang mengapit petikan yang tersusun
di dalam petikan lain. Contoh :
name=’Komunitas “Programmer” Indonesia’
Sangat disarankan untuk penulisan atribut dan nilainya tetap menggunakan huruf kecil karena pada versi HTML yang lebih baru (X)HTML meminta penulisan menggunakan huruf kecil.
name=’Komunitas “Programmer” Indonesia’
Sangat disarankan untuk penulisan atribut dan nilainya tetap menggunakan huruf kecil karena pada versi HTML yang lebih baru (X)HTML meminta penulisan menggunakan huruf kecil.
5. Buat
1 file sederhana dengan menggunakan tag-tag atau atribut HTML yang anda
ketahui!
1. Struktur Penulisan HTMLElemen dasar untuk penulisan HTML antara lain sebagai berikut.
a. <HTML> …</HTML>, terdapat pada awal dan akhir dari file HTML.
b. <TITLE> … <lTITLE>, terdapat pada mukadimah.
c. <HEAD> …</HEAD>, berisi keterangan umum seperti judul.
d. <BODY> …</BODY>, merupakan isi dari halaman Web.
Bentuk format penulisannya adalah sebagai berikut.
<HTML>
<HEAD>
<TITLE>
………
</TITLE>
</HEAD>
<BODY>
</BODY>
</HTML>
{<HTML> ….. </HEAD> } Tempat mendeskripsikan halaman HTML seperti judul, pembuat, tanggal dibuat, hubungan antardokumen, dan lain-lain.
{ </HEAD> …. </HTML> }Tempat pengetikan informasi-informasi yang dimunculkan pada halaman Web.
Command atau perintah dalam HTML biasanya disebut tag. Tag merupakan kode HTML yang digunakan untuk menunjukkan jenis teks, link, grafik, atau elemen HTML lainnya. Tag bisa ditulis dalam huruf besar atau huruf kecil. Sebagai contoh, misalnya tag <head> dan <HEAD>, kedua tag tersebut mempunyai arti yang sama.
Untuk mengatur format huruf atau pengolahan font dalam mengetik informasi, ada beberapa macam tanda (tag) antara lain sebagai berikut.
Untuk memberi baris pemisah di muka baris yang satu dengan baris yang lain bisa menggunakan elemen tag <HR> dan atribut yang menyertainya, yaitu sebagai berikut.
Berikut ini adalah contoh sederhana dari penulisan program HTML
<HTML>
<HEAD>
<TITLE> Teknologi Informasi dan Komunikasi </TITLE>
</HEAD>
<BODY>
<H1 ALIGN = “Center”> INTERNET </H1>
<HR WIDTH = “800″ SIZE = “3″ COLOR = “Green”> <Br>
<H2 ALIGN =”)ustify”> Internet merupakan sebuah sistem komunikasi global yang
menghubungkan komputer-komputer dengan jaringan-jaringan komputer di seluruh
dunia. Kegunaan dari Internet selain untuk mendapatkan berbagai macam informasi secara cepat dan murah juga sebagai media untuk melakukan promosi dan penawaran barang dan jasa.
<html>
<head>
<title> hello </title>
<body>
<B>Saya
sedang mengerjakan tugas dari guru </b>
<BR>
<i>saya masih
tahap belajar html </i>
</body>
</html>
6.
Sebutkan software-software animasi yang anda ketahui !
1. Software Animasi 2 Dimensi
Adalah software yang digunakan untuk
membuat animasi tradisional (flat animation), umumnya mempunyai kemampuan untuk
menggambar, mengatur gerak, mengatur waktu, beberapa dapat mengimpor suara.
Contoh dari software Animasi 2 D ini, antara lain :
- Macromedia Flash
- Macromedia Director
- ToonBoom Studio
- Adobe ImageReady
- Corel Rave
- Swish Max
- Adobe After Effect
2. Software Animasi 3 Dimensi
Software Animasi 3D mempunyai fasilitas
yang canggih untuk membuat animasi 3D. Fasilitas dan kemampuan tersebut antara
lain membuat obyek 3D, pengaturan gerak kamera, pemberian efek, import vidio
dan suara, serta masih banyak lagi. Beberapa software animasi 3 D mempunyai
kemampuan khusus misalnya untuk animasi figurel (manusia), animasi landscape
(pemandangan) dll
Contoh Software 3D antara lain :
- 3D Studio Max
- Poser ( Figurel Animation)
- Vue
- Blender
Contoh Software 4D antara lain :
- Blender
- Daz3D
7.
Sebutkan software-software Web Editor yang anda ketahui !
- Adobe Dreamweaver
- SeaMonkey
- KompoZer
- Notepad++
- Bluefish Editor
- Quanta Plus
- Amaya
- Open BEXI HTML Builder
- jEdit
s
8. Sebutkan software-software Web
Programming !
- Adobe Dreamweaver
- Serif WebPlus X6
- Site Spinner
- Xara Web Designer