HTML

HTML (HyperText Mark up Language) merupakan suatu metode uks dan bukan sebagai program.

Berikut kepanjangan dari HTML :

Hypertext

Link hypertext adalah kata atau frase yang dapat menunjukkan hubungntuk mengimplementasikankonsep hypertext dalam suatu naskah atau dokumen. HTML sendiri bukan tergolong pada suatubahasa pemrograman karena sifatnya yang hanya memberikan tanda (marking up) pada suatu naskahtean suatu naskah dokumendengan naskah-naskah lainnya. Jika kita klik pada kata atau frase untuk mengikuti link ini maka webbrowser akan memindahkan tampilan pada bagian lain dari naskah atau dokumen yang kita tuju.

Markup
Pada pengertiannya di sini markup menunjukkan bahwa pada file HTML berisi suatu intruksi tertentu yang dapat memberikan suatu format pada dokumen yang akan ditampilkan pada World Wide Web.

Language

Meski HTML sendiri bukan merupakan bahasa pemrograman, HTML merupakan kumpulan dari beberapa instruksi yang dapat digunakan untuk mengubah-ubah format suatu naskah atau dokumen.

Apa yang dapat dilakukan dengan HTML ?

· Menentukan format suatu teks
· Membuat list tentang sekelompok hal
· Membuat link ke dokumen lain atau bagian lain dari dokumen yang sama.
· Menyisipkan citra atau gambar.
· Menampilkan informasi dalam bentuk table
· Membuat form

Struktur dasar dokumen HTML

Struktur dasar dokumen HTML berisi elemen-elemen atau tag, seperti

pada gambar berikut :

Dari struktur dasar HTML di atas dapat dijelaskan sebagai berikut:

a. Tag

Adalah teks khusus (markup) berupa dua karakter "<" dan ">", sebagai

contoh <body> adalah tag dengan nama body. Tag harus ditulis secara berpasangan, yang terdiri atas tag pembuka dan tag

penutup (ditambahkan karakter "/" setelah karakter "<"),

b. Element

Element terdiri atas tiga bagian, yaitu tag pembuka, isi, dan tag penutup.

Contoh

<title> ini adalah tag pembuka judul dokumen HTML

Judul Dokumen HTML ini adalah isi judul dari dokumen HTML

</title> ini adalah tag penutup judul dokumen HTML

c. Attribute

Attribute mendefinisikan property dari suatu element HTML, yang terdiri atas

nama dan nilai.

Sebagai contoh, untuk membuat warna teks menjadi kuning dan latarbelakang

halaman web menjadi hitam, penulisannya adalah <body bgcolor="black"

text="yellow">

Gunakanlah teks editor (notepad), tuliskan kode dibawah ini :

<HTML>

<HEAD>

<TITLE> contoh 1 </TITLE>

</HEAD>

<BODY>

SMKN 4 Garut Jurusan Multimedia

</BODY>

</HTML>

Dengan tag <BODY>
Tag <BODY> digunakan menampilkan desain layout halaman web. Tab <BODY> sendiri memiliki kelengkapan atribut di antaranya:

BGCOLOR, berfungsi untuk menampilkan warna latar halaman

Contoh pemakaian :

BACKGROUND, berfungsi untuk menentukan file gambar/image dijadikan sebagai background halaman.

Contoh :

LINK, berfungsi untuk menentukan warna link dalam dokumen yang belum pernah dikunjungi (belum pernah diklik)
ALINK, berfungsi untuk menentukan warna link dalam dokumen yang aktif.
VLINK, berfungsi untuk menentukan warna link dalam dokumen yang telah terkunjungi.

Memformat Dokumen, Karakter dan FONT

Memformat Dokumen

· Tag <BR>

<HTML>

<HEAD>

<TITLE> Format Dokumen HTML </TITLE>

</HEAD>

<BODY>

Ini Website buatan kami<BR>

Siswa SMK 4 Garut <br>

multimedia

</body>

</HTML>

· Tag <P>

<HTML>

<HEAD>

<TITLE> Format Dokumen HTML </TITLE>

</HEAD>

<BODY>

Ini Website buatan kami Siswa SMK 4 Garut <br>

multimedia<P>

Saya belajar web di SMK NEGRI 4 GARUT

</body>

</HTML>

· Tag <PRE>

Tag <PRE>, membuat tampilan dokumen HTML pada browser sama dengan tampilan pada teks editor. Dengan tag <PRE>, maka tag <P> dan tag <BR> jadi tidak diperlukan lagi.

<HTML>

<HEAD>

<TITLE> Format Dokumen HTML </TITLE>

</HEAD>

<body>

<pre>

|,-----.,-----.,---.\

|| || || \\

|`-----'|-----||-----\`----.

[ | -||- _| (|

[ ,--. |_____||___/.--. |

=-(( `))-----------(( `))-==

</body>

</HTML>

Tag <UL> dan <OL>

Ada dua macam list yang bisa anda tambahkan ke document HTMLyaitu Unordered List (Bullet) dan Ordered List (Numbering)

1. Unordered List (Bullet) :

<HTML>

<HEAD>

<TITLE>Tag OL dengan TYPE</TITLE>

</HEAD>

<BODY>

<h4>Square bullets list:</h4>

<li>Apples</li>

<li>Bananas</li>

<li>Lemons</li>

<li>Oranges</li>

</ul>

</BODY>

</HTML

2. Ordered List (Numbering)

<HTML>

<HEAD>

<TITLE>Tag OL dengan TYPE</TITLE>

</HEAD>

<BODY>

<B>Dengan huruf kapital:</B>

<LI>Yogya<BR>

</OL>

<HR>

<B>Dengan angka romawi:</B>

<LI>Yogya<BR>

<LI>Magelang<BR>

</OL>

</BODY>

</HTML>

· Tag <Hn>,

Heading, html mengenal 6 level heading, mulai 1 (terbesar)sampai 6.

<HTML>

<HEAD>

<title> contoh Heading</title>

</HEAD>

<BODY>

<h1>SMK NEGRI 4 GARUT </h1>

<h2>SMK NEGRI 4 GARUT </h2>

<h3>SMK NEGRI 4 GARUT </h3>

<h4>SMK NEGRI 4 GARUT </h4>

<h5>SMK NEGRI 4 GARUT </h5>

<h6>SMK NEGRI 4 GARUT </h6>

</BODY>

</HTML>

· Tag <HR>

<HTML>

<HEAD>

<TITLE> Format Dokumen HTML </TITLE>

</HEAD>

<BODY>

Ini Website buatan kami<BR>

Siswa SMK 4 Garut <hr>

multimedia<P>

Saya belajar web di SMK NEGRI 4 GARUT

</body>

</HTML>

Memformat Karakter

Untuk memformat karakter dapat digunakan koleksi tag-tag berikut ini :

· Tag <B>

Tag ini berfungsi untuk menentukan teks yang tampil tercetak tebal.

· Tag <I>

Tag ini berfungsi untuk menentukan teks yang tampil tercetak miring

· Tag <U>

Tag ini berfungsi untuk menentukan teks yang tampil tercetak garis bawah.

· Tag <STRIKE>

Tag ini berfungsi untuk menentukan teks yang tampil tercetak garis tengah.

· Tag <TT>

Tag ini berfungsi untuk menentukan teks yang tampil tercetak seperti huruf mesin ketik.

· Tag <SMALL>

Tag ini berfungsi untuk menentukan teks yang tampil tercetak lebih kecil dibanding biasanya.

· Tag <BIG>

Tag ini berfungsi untuk menentukan teks yang tampil tercetak lebih besar disbanding biasanya.

· Tag <SUB>

Tag ini berfungsi untuk menentukan teks yang tampil tercetak sebagai teks subskrip

· Tag <SUP>

Tag ini berfungsi untuk menentukan teks yang tampil tercetak sebagai teks superskrip

<html>

<head>

<title>Memformat Karakter</title>

</head>

<body>

<H2>Memformat Karakter</H2><HR>

Teks cetak <B>Tebal</B><BR>

Teks cetak <I>Miring</I><BR>

Teks cetak <U>Garis Bawah</U><BR>

Teks cetak <STRIKE>Tebal</STRIKE><BR>

Teks cetak <TT>Huruf Mesin Ketik</TT><BR>

Teks cetak <SMALL>Lebih Kecil</SMALL><BR>

Teks cetak <BIG>Lebih Besar</BIG><BR>

Teks cetak H<SUB>2</SUB>SO<SUB>4</SUB><BR>

Teks cetak X<SUP>3</SUP>+Y<SUP>2</SUP>=0

</body>

</html>

Memformat FONT

Untuk memformat font digunakan tag <FONT>, adapun yang dipengaruhi oleh tag ini meliputi ukuran, jenis dan warna font. Atribut-atribut yang dapat dipakai untuk mengatur ketiga hal tersebut yaitu :

· SIZE, digunakan untuk menentukan ukuran font.

· COLOR, digunakan untuk menentukan warna font.

· FACE, digunakan untuk menentukan jenis atau bentuk font. Misal jenis font dapat dipakai yaitu : Arial, Verdana, Times New Romans, Courier dll.

<HTML>

<HEAD><TITLE>Memformat FONT</TITLE></HEAD>

<BODY>

<H2 ALIGN="CENTER">Memformat FONT</H2>

<HR>

<FONT FACE="Arial Black" SIZE="5" COLOR="BLUE">Jenis FONT Arial Black dengan warna Biru dan Ukuran Font

5</FONT><BR>

<FONT SIZE=4 FACE="Monotype Corsiva">Teks dengan FONT Monotype Corsiva dengan Ukuran Font 7</FONT>

<BR>

<FONT FACE="Verdana" COLOR="RED">Teks dengan FONT VERDANA dengan Ukuran Font default</FONT>

</BODY>

</HTML>

MENERAPKAN MULTIMEDIA DALAM WEB

Multimedia merupakan teknologi yang memadukan antara teks, gambar diam, animasi gambar, suara, dan bahkan video. Sebuah web juga dapat menyertakan multimedia didalamnya. Tipe suara dan video yang dapat disertakan dalam halaman web antara lain :

Format	Kategori	Ekstensi
AVI	Video	avi
MPEG	Video	mpg, mpeg
Quick Time	Video	qt, mov
AIFF	Audio	aif, aiff
AU	Audio	au
MIDI	Audio	mid, midi
WAV	Audio	wav

Perlu diketahui bahwa tidak semua browser menyediakan fasilitas untuk memainkan berkas-berkas yang disebutkan diatas. Sebagai gantinya, diperlukan perangkat lunak eksternal; misalnya WinAmp untuk memainkan suara atau Windows Media Player untuk memainkan film ataupun suara.

Link ke Suara , Video dan Youtube

Sebuah halaman web dapat mengandung link yang menghubungkan ke suara atau video. Sebagai contoh ditunjukkan pada kode berikut:

<html>

<head>

<title>Suara</title>

</head>

<body>

Jika anda ingin mendengarkan suara klik pada salah satu link berikut:<br>

<a href=”lagu.mid”>Lagu bagus</a><br>

<a href=”nyanyi.wav”>Suara drum</a><br>

</body>

</html>

Tag <BGSOUND>

Tag ini berfungsi untuk memainkan suara sebagai latar belakang. Atribut yang digunakan dalam tag <BGSOUND> yaitu :

Atribut	Kegunaan
SRC	Menentukan nama berkas yang akan dimainkan
LOOP	Diisi dengan nilai yang menyatakan berapa kali berkas akan dimainkan. Jika diisi dengan nilai INFINITIVE maka suara akan dimainkan terus menerus

Tag <EMBED>

Tag ini digunakan untuk memainkan berkas yang berupa suara ataupun film. Beberapa atribut yang digunakan dalam tag <EMBED> antara lain:

Atribut	Kegunaan
SRC	Menentukan sumber berkas suara atau video
WIDTH	Menentukan lebar video
HEIGHT	Menentukan tinggi video
UNITS	Menentukan satuan untuk video
HIDDEN	Menyembunyikan control
AUTOSTART	Diisi dengan nilai TRUE atau FALSE untuk menentukan berkasa akan dimainkan secara otomatis atau tidak
LOOP	Jika diisi dengan TRUE, maka berkas akan dimainkan berulang-ulang.

Memasukan Youtube ke HTML

Contoh halaman Youtube seperti di bawah ini

Aturan nya:

1. Hilangkan tulisan watch?

2. Ganti = dengan tanda /

Sehingga URL nya menjadi seperti ini http://www.youtube.com/v/YV3gxkXpkno

<html>

<head>

<title>Halaman Web diiringi Musik</title>

</head>

<body>

</body>

</html>

A. PRAKTIK

1. Ketikkan script berikut dan simpan dalam file musik.htm .

<html>

<head>

<title>Halaman Web diiringi Musik</title>

</head>

<body>

Selamat Mendengarkan Musik

</body>

</html>

Jalankan di Web browser. Dengarkan suara yang menyertai web tersebut. Berapa kali berkas suara tersebut diputar?

2. Ketikkan script berikut dan simpan dengan nama video.htm

<html>

<head>

<title>Menonton video di Web</title>

</head>

<body>

Selamat menikmati klip video berikut.

height="400" width="400" units="pixels" autostart="true" loop="false">

</embed>

</body>

</html>

Jalankan di web browser.

3. Untuk menyertakan multimedia, dapat juga dengan membuat link untuk menghubungkan ke suara atau video. Ketiklah script berikut dan simpan dengan nama link_multimedia.htm

<html>

<head>

<title>Link Multimedia</title>

</head>

<body>

Untuk mendengarkan musik klik link berikut ini :<br>

<a href="lagu.wav">Musik Daerah</a><br><br>

Jika ingin menonton video, klik link berikut :<br>

<a href="hands.avi">Video</a>

</body>

</html>

Jika dijalankan di web browser, maka hasilnya sebagai berikut:

B. LATIHAN

1. Buatlah sebuah halaman web yang menyertakan file suara sebagai background. Berkas suara tersebut hanya dimainkan sekali (tidak diulang).

2. Cobalah memasukkan berkas video ataupun audio dengan menggunakan format-format yang lain. (misalnya untuk berkas suara menggunakan file yang berekstensi .mid, .mpeg)

Link

Link adalah sebuah teks atau gambar yang menghubungkan antara satu halaman web dengan halaman web yang lainnya. Untuk mendefinisikan link digunakan tag <A>. Sedangkan atribut-atributnya adalah :

· HREF, digunakan untuk menentukan lokasi tujuan dari yang ditunjuk oleh link.

· NAME, digunakan untuk mendefinisikan anchor (Keterangan: Anchor adalah satu bagian dari dokumen yang ditandai untuk dijadikan sebagai tujuan dari link).

Ada tiga jenis link yaitu : Link relatif, Link absolute,Link dalam dokumen yang sama

Link Relatif

Digunakan jika membuat suatu link pada page anda ke page lain pada komputer yang sama.Bila dua page berada pada direktori sama, anda dapat menuliskan nama file html seperti berikut :

Link Absolut

Digunaka apabila anda membuat link ke page web lain yang berada pada web site lain di internet. Contoh:

<A HREF = “http://www.mangosoft.com”>Click here if you want to see my home page</A>

Link ke bagian lain dalam dokumen

Link ini dibuat untuk dokumen yang panjang sekali, sehingga apabila ditampilkan dalam

browser web akan mengharuskan kita melakukan scroll layar berulang-ulang.

<A NAME=”atas”>Bagian Atas</A>

sehingga dapat dibuat link sbb:

<HTML>

<HEAD><TITLE>LINK dan ANCHOR</TITLE></HEAD>

<BODY>

<H2 ALIGN="CENTER">Memanfaatkan Anchor</H2>

<HR>

<A NAME="atas"><H3>Bagian Atas</H3></A>

Ini adalah bagian atas dari dokumen! Untuk menuju ke bagan bawah dokumen silakan klik <A HREF="#bawah">ke

bawah</A>

<A NAME="bawah"><H3>Bagian Bawah</H3></A>

Ini adalah bagian bawah dokumen, untuk kembali ke atas silakan klik <A HREF="#atas">ke atas</A>

</BODY>

</HTML>

TABLE

Format tabel di html memiliki banyak manfaat salah satunya untuk menampilkan data dalam bentuk baris dan kolom, kemudian juga untuk mengatur layout dokumen web sehingga peletakan teks maupun gambar lebih mudah diatur. Untuk memformat tabel digunakan serangkaian tag meliputi <TABLE>, <TR>, <TH>, dan <TD>.

Pengaturan Tabel

Tabel adalah bagian dari struktur HTML yang paling banyak digunakan dalam pembuatan web sites (95%). Penggunaan Tabel ini dimaksudkan untuk mempermudah pengguna menyerap informasi yang disampaikan, karena informasi disajikan dalam segmentasi-segmentasi yang terstruktur berupa baris dan kolom. Tag-Tag yang digunakan untuk membuat tabel dalam dokumen HTML adalah:

a. Table : <table></table> Tag untuk membuat tabel.

b. Table Row : <tr></tr> menyatakan baris dalam suatu tabel

c. Table Data : <td></td> menyatakan kolom dalam suatu tabel/tempat meletakkan data

d. Table Header : <th></th> menyatakan judul tabel dalam kolom(optional)

e. Caption : <caption></caption> menyatakan judul tabel yang terletak diluar tabel

Elemen Tabel memiliki atribut-atribut dengan value tertentu yang berguna untuk mempercantik bentuk tabel, yaitu:

a. Border : untuk membuat batas tepi dari suatu tabel.

b. Width : untuk mengatur lebar tabel

c. Align : untuk mengatur bentuk perataan horisontal dalam tabel

d. Valign : untuk mengatur bentuk perataan vertical dalam tabel

e. Cellspacing : untuk mengatur spasi antar sel / kotak data

f. Cellpadding : untuk mengatur spasi didalam sel / kotak data

g. Rowspan : menyatakan gabungan sel-sel dalam satu baris

h. Colspan : menyatakan gabungan sel-sel dalam satu kolom

b. Bgcolor : untuk mengatur warna suatu sel

Value yang dimiliki oleh atribut Align dan Valign (Vertical Align) adalah:

a. Align : Center | Justify | Left | Right

b. Valign : Baseline | Top | Bottom | Middle

Contoh 1

<html>

<body>

<TR>

</TR>

<TR>

</TR>

</TABLE>

</body>

</html>

Contoh Penggunaan Colspan, Rowspan

Contoh :colspan

<html>

<body>

<TR>

<TH COLSPAN=2>Telephone</TH>

</TR>

<TR>

<TD>asep nasrudin</TD>

</TR>

</TABLE>

</body>

</html>

Contoh :rowspan

<html>

<body>

<TR>

<TD>asep nasrudin</TD>

</TR>

<TR>

<TH ROWSPAN=2>Telephone</TH>

</TR>

<TR>

</TR>

</TABLE>

</body>

</html>

<html>

<body>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

</TABLE>

</body>

</html>

Menggunakan Form

Form adalah sebuah daftar isian. Daftar isian ini untuk meminta informasi dari user untukkemudian diolah.

Untuk membuat sebuah form, tag-tag yang diperlukan adalah :

· Tag <FORM>

· Tag <TEXTAREA>

· Tag <SELECT>

· Tag <INPUT>

Tag <FORM>

Tag <FORM> merupakan tag yang digunakan untuk mendefinisikan sebuah form. Tag ini

mempunyai dua atribut, yaitu METHOD dan ACTION.

Tag <TEXTAREA>

Tag <TEXTAREA> digunakan untuk membuat sebuah kotak teks multi baris. Tag ini mempunyai

beberapa atribut, yaitu :

contoh

<html>

<body>

<PRE>

NAMA :<input type="text" name="teks1">

KOMENTAR :<textarea name="textarea" cols=20 rows=10></textarea>

</form>

</body>

</html>

Tag <SELECT>

Tag <SELECT> digunakan untuk membuat sebuah daftar pilihan. Tag ini memiliki beberapa

atribut, yaitu :

<html>

<head>

<body>

<PRE>

<OPTION VALUE=”MENIKAH”>MENIKAH

<OPTION VALUE=”BELUM MENIKAH”>BELUM MENIKAH

<OPTION VALUE=”CERAI”>CERAI

</SELECT>

</form>

</body>

</html>

Tag <INPUT>

Tag <INPUT> digunakan untuk membuat komponen-komponen yang digunakan untuk meminta

informasi dari user, misalnya kotak teks, kotak pilihan, tombol dan lain-lain. Tag ini tidak

memerlukan tag penutup. Tag ini mempunyai beberapa atribut, yaitu :

Tipe input yang dapat dibuat adalah :

1. Text, digunakan untuk membuat kotak teks

2. Password,digunakan untuk membuat kotak teks,tetapi semua karakter akan ditampilkan dengan tanda *.

3. Check Box, digunakan untuk membuat suatu daftar pilihan yang dapat dipilih lebih dari satu.

4. Radio, digunakan untuk membuat suatu daftar pilihan yang hanya dapat dipilih satu saja.

5. Reset, digunakan untuk membuat tombol yang fungsinya untuk menghapus semua isian form yang telah diberikan.

6. Submit, digunakan untuk membuat tombol yang fungsinya untuk mengirimkan data form agar diolah.

1. CONTOH TEXT

<html>

<body>

<PRE>

<form>

Nama : <input type="text" name="teks1">

Kelas: <input type="text" name="teks2" maxlength="5" size="10">

No : <input type="text" name="teks3" maxlength="5"size="5">

</form>

</body>

</html>

2. CONTOH PASSWORD

<html>

<head>

<title> PASSWORD </title>

</head>

<body>

<PRE>

<form>

USER NAME : <input type="text" name="teks1">

PASSWORD : <input type="PASSWORD" >

</form>

</body>

</html>

3. CONTOH checkbox

<html>

<head>

<body>

<PRE>

HOBY SISWA

<input type="checkbox" name="H1"> BASKET

<input type="checkbox" name="H1"> VOLLY

<input type="checkbox" name="H1"> PUTSAL

</form>

</body>

</html>

4. CONTOH RADIO

<html>

<head>

<body>

<PRE>

JENIS KELAMIN

<input type="radio" name="r1"> LAKI LAKI

<input type="radio" name="r1"> PEREMPUAN

</form>

</body>

</html>

5. CONTOH SUBMIT DAN RISET

<html>

<body>

<PRE>

<form>

Nama : <input type="text" name="teks1">

PASSWORD : <input type="PASSWORD" >

</form>

</body>

</html>

Frame

Frame digunakan untuk membagi jendela browser menjadi beberapa bagian dan masing-masingbagian terdiri dari dokumen HTML tersendiri. Frame pertama kali diperkenalkan oleh Netscape Navigator 2.0. Untuk membuat sebuah frame, tag yang digunakan adalah :

· Tag <FRAMESET>

· Tag <FRAME>

· Tag <NOFRAME>,

digunakan untuk menampilkan sebuah alternatif dokumen jika

browser tidak mendukung penggunaan frame. Sebuah frame dapat didefinisikan di

dalam frame lain. Tag <FRAMESET> mempunyai beberapa atribut :

Tag <FRAME> mempunyai atribut : Untuk mendefinisikan lebar frame pada atribut ROWS dan COLS ada tiga cara yang dapatdigunakan, yaitu dengan nilai tetap, nilai persentase, dan nilai proporsional. Misalnya ingindibuat tiga buah frame, maka penggunaannya adalah sebagai berikut :

. Dengan nilai tetap
<FRAMESET ROWS=”100,240,400”>
· Dengan nilai persentase
<FRAMESET COLS=”30%,40%,30%”>
· Dengan nilai proporsional
<FRAMESET ROWS=” *,2*,3*”>

Menggunakan FRAME Kolom
<html>
<frameset cols="25%,50%,25%">
<frame src="frame_a.htm" />
<frame src="frame_b.htm" />
<frame src="frame_c.htm" />
</frameset>
</html>

Menggunakan FRAME Baris

<html>

</frameset>

</html>

Menggunakan FRAME Baris & Kolom

<html>

</frameset>

</html>

Contoh frame

<html>

</frameset>

</html>

simpan dengan nama frame.html

halaman kiri

<html>

<body>

<marquee> selamat datang di web ku </marquee> <br>

<a href=" Home.html "target="showframe" > home</a> <a href=" Profil.html " target="showframe"> profil </a> <a href=" download.html "target="showframe"> download </a>

</body>

</html>

simpan dengan nama kiri.html

<html>

<body>

<marquee> halaman utama </marquee>

</body>
</html>
simpan dengan nama Home.html

<html>

<body>

<pre>

<marquee> halaman Profil </marquee>

Profil Pribadi ku

Nama :…………………….

Kelas :……………………..

Alamat:………………………..

</body>
</html>
simpan dengan nama Profil.html

<html>

<body>

<pre>

<marquee> halaman download lagu</marquee>

Kumpulan lagu lagu baru

Lagu A

Lagu b

Lagu c

Lagu d
</body>
</html>
simpan dengan nama download.html

Membuat Layout Halaman menggunakan Tag DIV dan CSS

Sobat dapat menggunakan Dreamweaver untuk membuat tata letak halaman umum (dalam template) baik menggunakan tabel atau css. Keuntungan dan kerugian dari kedua pendekatan ini diuraikan di bawah ini:

Tabel Layouts: Keuntungan

Mudah untuk merancang
Bekerja dengan baik pada browser lama

Tabel Layouts: Kekurangan

Loads hanya sekali semua elemen dalam tabel telah dimuat - biasanya lebih lambat dari layout css
Perubahan tabel perlu dibuat pada setiap halaman dan semua halaman perlu upload ke server lagi

CSS Layouts: Keuntungan

cepat Loads - file css hanya perlu dimuat sekali
Dapat dengan mudah mengubah tata letak seluruh situs dengan mengutak-atik file. css sebagai elemen desain dipisahkan dari konten

CSS Layouts: Kekurangan

Lebih menantang untuk merancang
Mungkin tidak bekerja pada beberapa browser lama

Top Informasi16

HTML

Memformat Karakter

0 comments:

Post a Comment

Total Pageviews

About

Find Us On Facebook

Advertisement

About Me

Popular Posts

Blog Archive

Get In Touch

Category

About us

Flickr Photostream

Twitter Updates

Meet The Author