Ragam Layout, Konsep Tipografi dan Format Gambar Pada Website

 

Resume Tugas Kelompok 9
3IA07
Gunadarma


Layout Website

Layout website adalah desain dasar untuk membuat tampilan suatu website terutama pada penataan elemen sebuah website.

Elemen website umumnya terdiri dari header, navigation, sidebar, content,  serta footer.

 

Macam - Macam Layout Desain Web:

  • Static
  • Layout static pada web desain memiliki ukuran tetap pada semua resolusi browser.

  • Fluid
  • Layout fluid memiliki kemampuan untuk menyesuaikan lebar layout sesuai dengan resolusi browser.

  • Responsive
  • Layout responsive memiliki kemampuan untuk berganti layout pada resolusi tertentu. Layout bisa berganti ini berkat kehadiran CSS3 dengan sintax media queries nya.


Konsep Dan Teknik Untuk Membuat Tipografi Yang Baik :

1. Komposisi Font

Penggunaan font dalam website tidak boleh terdiri lebih dari 3 jenis font. Komposisi font yang baik adalah menggunakan 2 jenis font saja. Gunakan font serif untuk judul, dan gunakan sans - serif untuk konten. Kombinasi ini sudah menjadi hal umum yang bisa anda lihat di kebanyakan website-website besar di dunia

 

2. Styling Teks dan Paragraf

Macam – macam Styling Teks dan Paragraf

  • Leading
  • Leading adalah istilah yang biasa digunakan untuk jarak baris tiap baris sebuah paragraf.

  • Ketebalan Teks
  • Ketebalan teks juga mempengaruhi tipografi. Dalam web design, bisa menentukannya dengan styling css melalui properti font-weight.

  • Warna
  • Secara default, warna teks yang ditampilkan di web adalah warna hitam pekat (#000). Sebenarnya ini kurang baik. Hitam pekat akan terlalu kontras dengan warna-warna yang ada di web, apalagi jika webnya mengusung desain flat. Warna yang bagus untuk teks pada desain web era modern adalah hitam keabu-abuan, dari interval #333 – #999.

3. Padding dan Margin

Margin dan Padding adalah properti dari CSS yang digunakan untuk mengatur sisi tiap elemen para HTML. Biasanya, kedua properti ini juga paling banyak digunakan dalam sebuah proyek website.
 

4. Hirarki Dan Ukuran Font

Secara default, browser yang menentukan ukuran setiap tag heading (<h1>,<h2>,<h3>,<h4>,<h5>,<h6>), tag paragraf (<p>), tag small (<small>), dan sebagainya.


Format Gambar Untuk Website :

  • PNG
  • PNG sangat baik untuk dipergunakan pada kebanyakan web browser (IE6+ butuh sedikit sentuhan CSS untuk pengaturan transparansi). Format jenis ini sangat tepat untuk menyimpan grafik (ilustration) atau foto (kualitas tinggi)

  • JPG
  • JPG adalah pilihan terbaik untuk menampilkan foto secara online, walau kualitasnya tidak sebagus PNG tetapi cukup bisa diterima mata manusia.

  • GIF
  • GIF sangat baik untuk menampilkan gambar bergerak.

  • BMP
  • BMP yaitu gambar yang tidak terkompresi, tidak disarankan untuk penggunaan pada blog (menghabiskan bandwidth saja).


Komentar

Posting Komentar