1 / 13

Pramita Firnanda

Pramita Firnanda. 2 D3 Teknik Informatika A 7411030004. Website. Website adalah halaman informasi yang tersedia di internet. Tujuan kita membuat website adalah menyediakan informasi. Membuat informasi tersebut dapat diakses dengan baik oleh user. Membuat informasi yang bermanfaat bagi user.

elijah-mills
Download Presentation

Pramita Firnanda

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Pramita Firnanda 2 D3 Teknik Informatika A 7411030004

  2. Website • Website adalah halaman informasi yang tersedia di internet. • Tujuan kita membuat website adalah menyediakan informasi. • Membuat informasi tersebut dapat diakses dengan baik oleh user. • Membuat informasi yang bermanfaat bagi user. • User yang menentukan apakah website tersebut mau dibaca atau di tutup

  3. Design web yang baik • DESAIN SECARA UMUM - Loading halaman cepat - Halaman index atau home pas di ukuran minimal 800 x 600 pixel - Gunakan elemen grafis (foto, gambar, dsb.) untuk mengisi jeda antara paragraf dalam sebuah tulisan berukuran sangat panjang - Buat setiap halaman tampak sebagai bagian dari situs tersebut;. - tampilkan elemen tertentu secara berulang yang akan mengingatkan pengunjung bahwa ia masih berada dalam situs yang sama.

  4. Design web yang baik • TEKS - Warna latar belakang tidak bertabrakan dengan warna teks - Teks cukup besar untuk dibaca, tetapi jangan terlalu besar - Hirarki informasi jelas - Kolom teks lebih kecil dari kolom di buku untuk memudahkan membaca di layar • NAVIGASI - Tombol dan bar navigasi mudah dipahami penggunaannya - Navigasi konsisten di seluruh situs - Tombol dan bar navigasi memberi petunjuk kepada pengunjung dimana mereka berada sekarang, dan halaman apa yang mereka lihat sekarang - Frame, jika digunakan, tidak menggangu - Situs berukuran besar memiliki index atau peta situs

  5. Design web yang baik • LINK - Warna link disesuaikan dengan warna halaman - Link selalu bergaris bawah sehingga jelas bagi pengunjung • GAMBAR - Tombol-tombol berukuran secukupnya - Setiap gambar ada keterangan - Setiap link gambar memiliki link teks yang sesuai - Gambar dan latar belakang menggunakan warna yang mampu ditampilkan browser (browser-safe colors)

  6. Design web yang buruk • DESAIN SECARA UMUM • Loading makan waktu lama • Frame yang harus discroll menyamping • Tak ada fokus tema pada halaman itu • Tombol navigasi menjadi satu-satunya daya tarik - Peletakan elemen (teks, paragraf, gambar, dsb.) berantakan - Warna tidak cocok satu sama lain • Halaman bagus jika dibuka di satu browser, tetapi hancur jika dibuka di browser lain • Latar belakang terlalu ramai dan menyakitkan mata (misalnya menggunakan gambar gif animasi) yang membuat tulisan tidak jelas

  7. Design web yang buruk • TEKS - Teks terlalu kecil sehingga sulit dibaca - Teks terlalu panjang dan menembus batas kanan halaman - Seluruh paragraf ditulis dengan HURUF BESAR - Seluruh paragraf ditulis dengan huruf cetak tebal - Seluruh paragraf ditulis dengan huruf miring - Memberi garis bawah pada teks yang bukan link, akan membingungkan pengunjung • LINK - Ada border link di seputar gambar - Link yang tidak jelas akan membawa pengunjung kemana - Link tanpa tujuan (broken link) - Teks link yang tidak bergaris bawah atau tidak berubah warna ketika ditunjuk

  8. Design web yang buruk GAMBAR - Gambar yang sangat besar sehingga loadingnya lama - Gambar yang tidak ada hubungannya dengan tema situs - Gambar thumbnail yang ukurannya sama dengan gambar aslinya - Gambar tanpa label alt - Gambarnya hilang (muncul tanda x kecil warna merah) • Gambar yang terlalu besar dan tidak muat di layar (anggap ukuran resolusi layar 800×600 pixel)

  9. Design web yang buruk • TABEL - Ada bordernya - Tabel digunakan sebagai hiasan dengan border yang sangat tebal OBJEK BLINKING (BERKEDIP) DAN ANIMASI - Apa saja yang berkedip, khususnya teks - Garis berwarna pelangi - Tulisan “Under construction”, apalagi ditambahi gambar pekerja konstruksi jalan raya - Animasi gambar “under construction” - Animasi gambar e-mail - Animasi yang tidak pernah berhenti

  10. Design web yang buruk • SPAM - Iklan sampah - Pengunjung harus melakukan scroll menyamping (kiri-kanan) • Scroll bar frame di tengah-tengah halaman • NAVIGASI - Menu navigasi yang tidak jelas atau terlalu kompleks - Terlalu banyak frame - Frame terlalu kompleks - Scroll bar yang tidak perlu pada frame - Halaman yatim-piatu (tak memiliki link untuk kembali ataupun maju, serta tak ada keterangan apapun) - Title halaman yang tidak ada hubungannya dengan tema atau isi halaman tersebut

  11. Bad Design VS Good Design

  12. Contoh web yang buruk 5 Web dibawah ini adalah contoh web yang buruk : 1. Ada yang buruk dari segi pengambilan warna, http://phat.distort.org/ 2. Background yang merusak mata, http://www.dokimos.org/ajff/ 3. Background yang bisa membuat mata anda pusing, http://aferai.multiply.com/journal/item/9 4. Penempatan posisi yang acak-acakan, http://ronoslund.com/ 5. Hampir sama dengan yang diatas, masalah penempatan, http://anselme.homestead.com/AFPHAITI.html

  13. Contoh web yang baik • http://awkward-art.com/ • www.detik.com • http://pramitananda.wordpress.com/ • http://www.themesbase.com/ • http://www.brusheezy.com/

More Related