DESAIN WEB DAN PERENCANAAN SITUS Retno Ires Devina

DESAIN WEB DAN PERENCANAAN SITUS Retno Ires Devina Yolanti, SST

Desain Web mencakup berbagai keterampilan disiplin dalam produksi dan pemeliharaan website Berbagai bidang dalam desain web termasuk : web desain grafis, desain interface, authoring, termasuk standaridasi kode, user experience design, dan optimasi mesin pencari. Kebanyakan orang akan bekerja dalam tim yang meliputi berbagai aspek dari proses desain. beberapa desainer mengerjakan

Dasar Perancangan Definisikan Tujuan Perencanaan yang matang dan tujuan yang jelas [adalah kunci keberhasilan dalam membangun situs web, terutama ketika Anda bekerja sebagai bagian dari tim pengembangan. ]

2 Proses Penting Kumpulkan tim pengembangan Anda, analisis kebutuhan dan tujuan, dan bekerja melalui proses perancangan diuraikan di sini untuk memperbaiki rencana. membuat dokumen proyek yang detail apa yang ingin di lakukan dan mengapa, apa teknologi dan konten yang di perlukan, berapa lama Proses nya, apa yang Anda akan lakukan untuk melakukan itu, dan bagaimana Anda akan menilai hasil nya.

Keterampilan inti yang dibutuhkan dalam tim pengembangan web Strategi dan perencanaan proyek manajemen Informasi arsitektur dan pengguna desain antarmuka grafis untuk web teknologi Web tempat produksi

Project stakeholder atau sponsor orang atau kelompok yang bertanggung jawab untuk memulai situs proyek web Dalam kebanyakan kasus sponsor adalah klien atau pelanggan untuk pekerjaan pengembangan situs web Sponsor memberikan visi strategis secara keseluruhan dan tujuan untuk proyek pengembangan situs, menyetujui kontrak atau rencana kerja, yang bertanggung jawab atas jadwal anggaran dan proyek, dan menyediakan sumber daya untuk mendukung pekerjaan dari tim pengembangan situs

Manajer Proyek Web Mengkoordinasikan dan mengkomunikasikan sehari-hari taktis pelaksanaan proyek situs web Bertindak dalam batasan proyek piagam dan tujuan, anggaran proyek, pengembangan jadwal, dan kualitas tujuan yang dipaparkan dalam perencanaan tahap Menciptakan dan memelihara perencanaan proyek dan Strategi dokumen, spreadsheet anggaran, proyek jadwal dan grafik Gantt, pertemuan catatan, catatan penagihan, dan proyek lainnya dokumentasi yang rinci tim kegiatan

Information Engineering mengatur dan mengkategorikan struktur situs web. paling aktif di awal desain dan perencanaan tahapan proyek, pengembangan konten kategorisasi skema, situs yang konsisten terminologi struktur, konten di seluruh situs, dan situs arsitektur diagram yang menjelaskan keseluruhan situs berencana untuk kedua sponsor dan web anggota tim

Awal Perencanaan Memahami dan mengkomunikasikan 3 tujuan utama Pahami audiens Analisa Web (sebagai alat perencanaan) Contents

Pahami audiens Identifikasi potensi pemirsa untuk situs web Anda sehingga Anda dapat mendesain situs untuk memenuhi kebutuhan dan harapan mereka. Identifikasi audiens yang menjadi sasaran situs anda akan membantu menentukan tema dari situs web yang akan di buat. Tema yang meliputi warna, gambar, layout, pemilihan dan penempatan konten, dll.

Sebuah sistem yang dirancang dengan baik harus mengakomodasi berbagai keterampilan dan minat. Misalnya, jika tujuan dari situs web Anda adalah untuk memberikan Informasi internal perusahaan, sumber daya manusia, atau informasi lainnya sebelum diterbitkan, maka anda harus mengerti kebutuhan audiens Anda yang akan sering mendatangi situs anda dibandingkan yang jarang berkunjung.

Website toko pakaian wanita, di pilih warna 2 feminin, pastel

Dengan mayorotas audience adalah pria, website di atas juga memilih warna-warna gelap dan tegas.

Setiap jenis aplikasi yang di buat dengan sasaran audiense yang telah di tentukan akan menambah fokus desain website. Hal yang sama juga berlaku pada layout. Contoh anda bandingkan beberapa website berikut, apa yang anda lihat dari penataan konten gambar pada halaman - halamannya

Setiap halaman di atas dengan jenis website yang berbeda akan menampilkan layout dengan tatanan yang berbeda pula. Konten dalam website portofolio (gambar 1) lebih bersifat ke showcase (pameran) dari proyek – proyek atau pekerjaan yang telah di kerjakan untuk menarik minat audience yang akan berkerja sama dengan mereka

Sedang dalam website e-commerce (gambar 2) menampilkan barang – barang yang mereka jual beserta data – data secara rinci juga untuk meraih atensi konsumen yang akan membeli. Komposisi dan pengaturan dalam website personal lebih santai dengan pemilihan warna yang lebih bebas sesuai dengan karakteristik pemilik website tersebut.

SITE MAP Adalah sebuah daftar dari halaman – halaman dari sebuah website yang dapat di akses oleh crawler ataupun user. Site map dapat berupa sebuah dokumen dalam berbagai bentuk sebagai alat perencanaan website. Biasanya berbentuk hierarki,

Jangan membuat link yang membingungkan, desainer situs bukan satu-satunya yang membuat model dari sebuah situs. User juga mencoba membayangkan struktur dari sebuah web.

Struktur Web Sequences Hierarchies Webs

7 hal yang harus dihindari Berdasarkan Kiss-Metrics ada 2 hal yang tidak perlu anda lakukan dalam membangun sebuah website : Font yang terlalu kecil Sliding image Low Contrast Font Baris terlalu panjang Tidak ada Point Of Interest Melanggar prinsip desain yang sudah umum

FONT Font yang terlalu kecil sulit untuk dibaca. Standart minimal font 14 px untuk font body Untuk menarik minat viewers : Menulis Headline yang menarik Menulis konten yang menarik Gunakan ukuran font yang cukup besar untuk menulis headline Gunakan font untuk body dengan ukuran cukup besar agar user tidak lelah.

Sliding image Banyak website menggunakan sliding image Sliding image tidak selalu menjadi cara yang tepat Survey dari University of Notre Dame menunjukkan bahwa hanya 1% user yang melakukan klik pada sliding image, dan dari 1 % tersebut 84% user mengabaikan gambar lain dalam sliding image dan hanya melakukan klik pada gambar pertama… We have tested rotating offers many times and have found it to be a poor way of presenting home page content. -Chris Goward

Low Contrast Font Contoh kontras font yang buruk Font dan background harus kontras, jika background gelap, maka font harus terang. Begitu juga sebaliknya.

Contoh website dengan kontras font yang baik

Baris yang terlalu panjang Jangan membuat baris yang terlalu panjang Untuk paragraf dengan banyak teks akan membuat halaman terasa penuh Panjang karakter yang disarankan adalah 50 – 6 karakter, dan 75 karakter maksimal.

Tidak ada Point Of Interest Mata manusia akan secara otomatis melihat sesuatu yang paling menarik perhatian. Point of interest digunakan untuk meraih perhatian viewers pada suatu area Point of interest bisa di raih dengan metode Font-size Warna yang kontras

Kontras button

Melanggar prinsip desain pada umumnya Jangan membingungkan pengunjung dengan desain yang ekstrim. Terkadang kita sebaiknya mengikuti aturan desain pada umumnya untuk menghindari kebingungan pengunjung.

TUGAS (perancangan Tugas Proyek) Buat kelompok terdiri dari maks. 3 orang untuk mengerjakan tugas berikut sampai dengan membuat Tugas Proyek UAS Tentukan tema yang akan di pilih untuk pengerjaan tugas proyek Cari referensi website di internet yang sesuai dengna tema tugas proyek anda, (min. 3) Analisis desain dari website yang anda pilih