Minggu, 28 Oktober 2012

Frame dan Iframe

DEFINISI FRAME
• Frame adalah bingkai yang membagi jendela browser sesuai keinginan kita.
• Dengan Frame, kita bisa menampilkan beberapa file html sekaligus didalam satu halaman browser.
• Frame jarang sekali digunakan karena banyak browser yang tidak dapat menampilkan Frame.

DEFINISI IFRAME
• Fungsi Iframe tidak berbeda jauh dari Frame, fungsinya adalah untuk menampilkan beberapa halaman web dalam satu halaman browser
• Perbedaannya adalah Iframe tidak muncul pada seluruh tampilan layar, ukuran Iframe dapat dibatasi sesuai  dengan kebutuhan

KELEBIHAN FRAME/IFRAME
Kelebihan frame/iframe adalah memungkinkan bagian dari suatu halaman tidak bergerak ketika bagian yang berada di jendela lain di scroll kebawah/keatas.Frame/iframe tidak ikut me-reload ketika halaman utama direfresh untuk mendapatkan update yang terbaru.Contohnya digunakan sebagai penempatan menu,
sidebar, iklan, dll.

KEKURANGAN FRAME/IFRAME
Kekurangan frame/iframe adalah tidak semua frame/iframe dapat berjalan pada semua halaman browser.
frame/iframe mempersulit Bookmarking karena terdapat lebih dari 1 alamat url untuk di simpan.Frame/iframe yang tidak dapat diakses akan mengurangi tampilan desain pada halaman web.

PENGGUNAAN FRAME COLOM
<frameset cols cols="25%,75%">
<frame src="html_frame1.htm" scrolling="yes"/>
<frame src="html_frame2.htm" />
<noframes>
<body>
Maaf, browser tidak mendukung Frame
</body>
</noframes>
</frameset>

PENGGUNAAN FRAME ROWS
<frameset rows rows="25%,75%">
<frame src="html_frame1.htm" scrolling="yes"/>
<frame src="html_frame2.htm" />
<noframes>
<body>
Maaf, browser tidak mendukung Frame
</body>
</noframes>
</frameset>

PENGGUNAAN IFRAME
<iframe src=“iframe.htm"></iframe>
<body>
<p>Contoh penggunaan Iframe Default</p>
</body>
</html>
<iframe src="iframe.htm“ name="frame frame"></iframe>
<a href="http://www.ubm.ac.id" target="frame frame">
Universitas Bunda Mulia
</a>

Selasa, 23 Oktober 2012

Gambar dan Table

PERANAN GAMBAR DALAM WEB
• Menyampaikan Informasi kepada pengunjung
• Memberikan kontribusi pada keseluruhan tampilan dan nuansa dari Web
• Gambar merupakan salah satu elemen kunci dari desain halaman


FORMAT GAMBAR
BMP (Bitmap)
   • Cocok Untuk :
      – Desktop background di windows.
      – Sebagai gambar sementara yang mau diedit ulang tanpa menurunkan kualitasnya.
   • Tidak cocok digunakan untuk :
      – Web atau blog, perlu dikonversi menjadi JPG, GIF, atau PNG.
      – Disimpan di harddisk/flashdisk tanpa di ZIP/RAR,
JPG/JPEG (Joint Photographic Experts Group)
   • Cocok Untuk :
      – Gambar yang memiliki banyak warna, misalnya foto wajah dan pemandangan.
      – Gambar yang memiliki gradien, misalnya perubahan warna yang perlahan-lahan dari merah ke biru.
   • Tidak cocok digunakan untuk:
      – Gambar yang hanya memiliki warna sedikit seperti kartun atau komik.
      – Gambar yang memerlukan ketegasan garis seperti logo.
GIF (Graphics Interchange Format)
   • Cocok Untuk :
      – Gambar dengan jumlah warna sedikit (dibawah 256).
      – Gambar yang memerlukan perbedaan warna yang tegas seperti logo tanpa gradien.
      – Gambar animasi sederhana seperti banner iklan, header, dsb.
      – Print shoot (hasil dari print screen) dari program-program simple  dengan jumlah warna sedikit.
   • Tidak cocok digunakan untuk:
      – Gambar yang memiliki banyak warna seperti pemandangan.
      – Gambar yang didalamnya terdapat warna gradien
PNG (Portable Network Graphics)
   • Cocok Untuk :
      – Gambar yang memiliki warna banyak.
      – Gambar yang mau diedit ulang tanpa menurunkan kualitas.
   • Tidak cocok digunakan untuk:
      – Gambar yang jika dikompress dengan JPG hampir-hampir tidak terlihat penurunan kualitasnya


PENGGUNAAN GAMBAR
• Gambar
– Untuk menarik perhatian, dapat digunakan sebagai gambar produk, gambar header, dll
• Latar Belakang Web
– Dapat digunakan sebagai latar belakang web
• Navigasi Web
– Dapat digunakan sebagai navigasi web

PERANAN TABLE DALAM WEB
Digunakan untuk menampilkan data yang berbentuk kolom-kolom. Sehingga desain tampilan menjadi lebih menarik.Sebelum adanya CSS, table juga digunakan untuk membuat layout website.Namun saat ini sudah jarang dipakai sebagai layout karena faktor file yang cenderung lebih besar sehingga mempengaruhi waktu akses yang  lebih lama.


PENGGUNAAN TABEL
tag-tag dasar yang sering digunakan dalam table:

<table></table>
Tag untuk membuat tabel

<tr></tr>
Tag untuk membuat baris (Row)

<td></td>
td : Tag untuk membuat kolom (Column)

Senin, 22 Oktober 2012

Navigasi Web

DEFINISI

  • Sebuah petunjuk jalan atau peta
  • Perencanaan dari umum ke khusus(Konsep Tree-view)
  • Singkat Tepat dan Jelas (The Three-Click Rule)
  • Posisi Yang Konsisten
  • Tampilan Navigasi Yang Mencolok
  • Tunjukan Dimana Pengunjung Berada 

  • ATURAN NAVIGASI WEB (The Three-Click Rule)

  • Aturan desain web resmi mengenai desain navigasi website
  • Pengguna dari sebuah website harus dapat menemukan informasi apapun dengan tidak lebih dari    tiga klik mouse
  • Hal ini didasarkan pada keyakinan bahwa pengguna situs akan menjadi frustasi dan sering pergi jika mereka tidak dapat menemukan informasi dalam tiga klik

  • JENIS NAVIGASI WEB

  • Inline Navigation
  • Navigasi yang menjadi bagian dari konten utama, umumnya berupa link dan bentuknya sederhana
  • Site Navigation
  • Navigasi yang letaknya terpisah dari konten utama, Umumnya terletak di bagian kiri atau kanan

    Jumat, 12 Oktober 2012

    Teori Web Design

    TIPOGRAFI
    Ilmu dalam memilih dan menata huruf dengan pengaturan penyebarannya pada ruang-ruang yang tersedia,Untuk menciptakan kesan tertentu, sehingga dapat menolong pembaca untuk mendapatkan kenyamanan membaca semaksimal mungkin.
    LEGIBILITY
    Kejelasan bentuk huruf adalah tingkat kemudahan mata mengenali suatu tulisan tanpa harus bersusah payah.
    Hal ini bisa ditentukan oleh:
    • Kerumitan desain huruf, seperti penggunaan siripan, kontras goresan, dan sebagainya.
    • Penggunaan warna
    • Frekuensi pengamat menemui huruf tersebut dalam kehidupan sehari-hari
    READABILITY
    Keterbacaan adalah tingkat kenyamanan suatu susunan huruf saat dibaca, yang dipengaruhi oleh:
    • Jenis huruf
    • Ukuran
    • Pengaturan, termasuk di dalamnya alur, spasi,kerning, perataan, dan sebagainya
    • Kontras warna terhadap latar belakang

    Sabtu, 06 Oktober 2012

    Pengantar HTML, XHTML, CSS dan Web

    HTML(Hyper Text Markup Language)
    merupakan suatu metode untuk mengimplementasikan konsep hypertext dalam suatu naskah atau dokumen. HTML sendiri bukan tergolong pada suatu bahasa pemrograman karena sifatnya yang hanya memberikan tanda (marking up) pada suatu naskah teks dan bukan sebagai program.
    Berdasarkan kata-kata penyusunnya HTML dapat diartikan lebih dalam lagi menjadi :

    Hypertext
    Link hypertext adalah kata atau frase yang dapat menunjukkan hubungan suatu naskah dokumen dengan naskah-naskah lainnya. Jika kita klik pada kata atau frase untuk mengikuti link ini maka web browser akan memindahkan tampilan pada bagian lain dari naskah atau dokumen yang kita tuju.

    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

     

    XHTML(Extensible Hypertext Markup Language)
    XHTML adalah Gabungan dari XML (Extensible Markup Language) dan HTML (HyperText Markup Languang), jadi dapat di artikan Extensible HyperText Markup Language (XHTML) bentuk HTML dikombinasikan dengan aturan XML. Secara umum dalam penulisannya hampir sama dengan HTML, hanya memiliki aturan yang ketat.

    CSS(Cascading Style Set)
    suatu teknologi yang digunakan untuk memperindah tampilan halaman website (situs). Singkatnya dengan menggunakan Methode CSS ini anda dengan mudah mengubah secara keseluruhan warna dan tampilan yang ada di situs anda, sekaligus memformat ulang situs anda (merubah secara cepat). CSS juga memungkinkan si pembuat web untuk memodifikasi HTML untuk membentuk tampilan sebuah website.

    Selasa, 07 Juni 2011

    Cheese Omelette


    omelette adalah western food yang cocok dinikmati ketika sarapan, rasanya yang lezat dan yummy akan membuat harimu semangat :)

    Rabu, 01 Juni 2011

    Membuat Fu Yung Hai


    Kita pasti sudah mengenal masakan satu ini, cara membuatnya mudah dan rasanya tidak perlu dipertanyakan lagi :)