Saturday, July 21, 2018

Cara Membuat Frame,Menu Menggunakan HTML

Cara Membuat Frame Menggunakan HTML

Fungsionalitas bukanlah satu-satunya faktor penting terhadap baik atau tidaknya sebuah web. Tampilan adalah faktor lain yang juga penting agar sebuah website mudah dan nyaman di gunakan serta membuat pengunjung berkunjung lagi lain kali. Oleh karena itu, website harus terdesain tampilan nya dengan baik.

Di dalam HTML ada dua buah cara dasar untuk mendesain layout sebuah website yaitu frame dan tagdiv. Keduanya memiliki kelebihan dan kelemahan masing-masing. Frame mudah di gunakan tapi dari sisi tampilan nya kurang begitu indah. Tag div agak ribet penggunaan nya tapi tampilan nya lebih rapih.

Frame di gunakan untuk membagi jendela browser menjadi beberapa bagian terpisah. Masing-masing bagian terdiri dari dokumen HTML tersendiri. Ini adalah mekanisme paling sederhana dalam me-layout sebuah halaman web. Namun di HTML, tag <frame> sudah tidak lagi digunakan.

Untuk membuat sebuah frame,tag yang digunakan adalah:
  • Tag <FRAMESET>
  • Tag <FRAME>
  • Tag <NOFRAME>, digunakan untuk menampilkan sebuah alternatif dokumen atau menampilkan pesan jika browser tidak mendukung penggunaan frame.


 A. Tag Frameset

<FRAMESET> mempunyai beberapa atribut:


Untuk mendefinisikan lebar frame pada atribut ROWS dan COLS ada tiga cara yang dapat digunakan, yaitu dengan nilai tetap (fix), nilai presentase, dan nilai proposional. Contoh nya saja kita ingin dibuat empat buah frame, makan penggunaan nya bisa sebagai berikut:

Dengan nialai tetap
     <FRAME ROWS="20%,140%,400,50">

Dengan nilai presentase
      <FRAMESET COLS="20%,40%,20%,20%>

Dengan nilai proposional
      <FRAMESER ROWS="*,2*,*,*">

Dengan niali tetap, setiap frame didefinisikan dalam ukuran pixel. Cara ini kurang disarankan karena jika resolusi monitor user tidak sama dengan resolusi monitor pada saat perancangan frame, maka frame yang terbentuk akan menjadi tidak beraturan. dengan nilai presentase, lebar setiap frame didefinisikan sebagai presentase dari lebar jendela browser sehingga resolusi monitor tidak akan berpengaruh.

Dengan nilai proposional, Lebar setiap frame juga didefinisikan sebagai presentase dari lebar jendela browser, hanya saja pembacaan nya sedikit berbeda. Misalnya nilai proposional adalah "*,2*,*", jumblah bintang seluruhnya adalah 1+2+1=4, frame pertama akan memiliki lebar 1/5 dari jendela browser, frame ke2 2/5 dan frame ke3 serta ke4 sama dengan frame pertama.


B. Tag Frame
Tag <FRAME> mempunya atribut sebagai berikut:


Contoh:
1. Bukalah Notepad, kemudian tuliskan kode-kode berikut



Simpan dengan nama framekanan.html










Simpan dengan nama framekiri.html











Simpan ke dalam frame.html Bukalah frame.html menggunakan broser

Tampilan Frame.html

2.Bukalah Notepad, Kemudian tuliskan kode berikut:

Simpan kedalam menu.html bukalah menu.html di browser.

Add caption
Add caption
Tampilan Menu.html
3.Bukalah Notepad, Kemudian tuliskan kode berikut:


















Simpan kedalam menu2.html bukalah menu2.html di browser.



Tampilan menu2.html


4.Bukalah Notepad, Kemudian tuliskan kode berikut:
















Simpan kedalam menu3.html bukalah menu3.html di browser.
Tampilan menu3.html
5.Bukalah Notepad, Kemudian tuliskan kode berikut:




Simpan ke dalam homepage.html Bukalah homepage.html di browser.

Tampilan homepage.html

No comments:

Post a Comment