BAB 6 – Standarisasi Layout Halaman Web

6.1 Pengimplementasian Style

  • Untuk melihat dan merasakan halaman Web tergantung dari penampilan dan urutan dari komponen UI yang ada didalamnya
  • Style digunakan untuk mendefinisikan gabungan dari opsi format, yang mana dapat digunakan kembali ke format penampilan dan urutan dari komponen UI pada single atau multiple halaman Web
  • Kita dapat menggunakan style dalam berbagai cara:

-Menggunakan inline style

-Menggunakan embedded style sheet

-Menggunakan external style sheet

  • Inline style adalah style yang secara spesifik menggunakan properti style pada bagian komponen UI
  • Inline style diletakkan langsung didalam komponen UI yang akan diimplementasi
  • Untuk menggunakan inline style pada halaman Web, kita perlu menggunakan atribut style pada komponen UI yang bersangkutan
  • Embedded style sheet memungkinkan kita untuk mendefinisi semua style untuk halaman Web pada satu tempat
  • External style sheet adalah file terpisah yang memiliki ekstensi .css

6.2 Pengimplementasian Template

  • Template pada aplikasi JSF dibentuk oleh Facelets
  • Namespace untuk menggunakan tag pendukung oleh Facelets adalah http://xmlns.jcp.org/jsf/facelets
  • File template dapat ditentukan sebagai halaman Web dengan area edit lebih banyak
  • Tag <ui:insert> digunakan untuk membuat area edit pada file template
  • Tag <ui:include> digunakan untuk memasukkan konten halaman Web yang satu pada halaman lain
  • Halaman dari aplikasi Web yang menggunakan file template sebagai base layout mereka adalah merupakan template clients
  • Tag <ui:composition> digunakan untuk memasukkan konten dari file template pada file template client
  • Isi dari area edit dibuat didalam file template yang disediakan menggunakan tag <ui:define> pada file template client
  • Tag <ui:decorate> memungkinkan template client untuk memasukkan konten pada area edit dari file template sebagus menyediakan informasi tambahan pada halaman Web

Be the first to comment

Leave a Reply

Your email address will not be published.


*


Skip to toolbar