Web Design Architecture
ARSITEKTUR
WEB DESAIN
Presented by Zeembry
Menentukan Pengunjung dan Konten apa yang ingin Diberikan
TARGET PENGUNJUNG & KONTEN
Menentukan Jenis Pengunjung dan Konten apa yang ingin diberikan di
halaman beranda dan dalam sebuah website.
Contoh Pengunjung: Stakeholder
•
•
•
•
•
•
•
•
•
•
Lembaga Legislatif (Pusat dan Daerah)
Dewan Perwakilan Daerah (DPD)
Departemen/LPND/BUMN/BUMD
Badan Pemeriksa Keuangan (BPK)
Aparat Pengawasan Internal Pemerintah (APIP)
Aparat Penegak Hukum (Kejaksaan Agung, Kepolisian, Komisi
Pemberantasan Korupsi)
Mahkahmah Konstitusi dan Komisi Yudisial
Pemberi Pinjaman/Hibah (Lenders)
Publik/Masyarakat/LSM
Media Massa
Contoh Pengunjung:
Publik/Masyarakt
•
•
•
•
•
Umum
Pengusaha
Profesional
Siswa/Mahasiswa
Akademisi/Peneliti
Contoh Konten untuk Masyarakat
• Layanan Online : Pendaftaran, Perizinan, Sertifikasi,
Pengecekan, Pengaduan
• Layanan Offline: Petunjuk dengan Flowchart yang mudah
dipahami.
• Kinerja & Publikasi : Buku & Majalah Online, Laporan,
Regulasi, Hasil Penelitian, Jurnal, Tutorial, dll.
• Fasilitas : Perpustakaan, Auditorium, Dll.
• Berita : Internal dan Eksternal (Umum, Pusat, Daerah, Siaran
Pers).
• Artikel : Opini Ahli/Tokoh.
• Pengumuman & Agenda
Contoh Konten untuk Frequently
Asked Quetion (FAQ)
1.
2.
3.
4.
Mengapa Investasi di daerah anda?
Kisah Sukses
Peluang Investasi SDM, SDA
Aturan dan Peraturan yang berkaitan dan masuk dan
beroperasinya Investor Asing
5. Perlakuan standar antara Perusahaan Asing dengan Nasional
6. Fungsi dan Efisiensi Pasar Lokal
7. Kebijakan Perdagangan dan Privatisasi
8. Fasilitas yang didapat seperti promosi, insentif, perbaikan fasilitas,
dan langkah untuk mengurangi biaya melakukan bisnis
9. Pembatasan apa saja yang ada
10. Profil Daerah (Biasanya ini untuk Investor Lokal/Daerah)
Pemilihan Jenis Design
• Bila fokus kepada berita dan artikel lebih
cocok ke Design Portal.
• Bila fokus kepada Kinerja dan Layanan lebih
cocok ke Design Gallery.
• Bila fokus ke banyak tautan aplikasi dan
website lebih cocok ke Design Directory.
• Atau bisa juga gabungan dari dua trend design
tersebut tergantung fokus yang akan dipilih
nantinya.
Pengantar Arsitektur Web Desain
ARSITEKTUR WEB DESAIN
Membuat konten yang dicari cepat dan mudah ditemukan dengan
membuat optimasi tombol navigasi, menu, fokus konten, tulisan, dll.
UNTUK MEMBUAT DAN
MENGELOLA SEBUAH WEBSITE
BUKAN HANYA PEKERJAAN
SEORANG WEBMASTER SAJA.
TETAPI MELIBATKAN SEMUA PIHAK
YANG TERKAIT KONTEN DI
WEBSITE TERSEBUT.
Tanpa Arsitektur Informasi, semuanya diletakkan di HALAMAN DEPAN
http://www.iprospect.com.au/heat-map-usability-tracking.html
Tujuan Arsitektur Web Desain
1. Menentukan Target & Prioritas Pengunjung.
2. Menentukan Konten yang ingin diberikan kepada
Pengunjung secara Detil, Akurat dan Lengkap.
3. Membuat Navigasi Situs agar pengunjung dapat
– Menemukan Konten dengan Mudah dan Cepat.
– Memahami Konten dengan Mudah dan Cepat.
4. Menentukan Tim Pengelola Website untuk mengelola
ruang-ruang di dalam website tersebut.
Ini harus melibatkan seluruh pihak yang terkait termasuk
pimpinan, penanggungjawab dan pengelola konten web.
Jenis Informasi & Peletakkan
• Prioritas : Informasi yang diletakkan di
halaman depan website (pada lokasi prioritas)
untuk target pengunjung prioritas.
• Non Prioritas : Informasi yang diletakkan di
halaman depan website (pada lokasi non
prioritas) untuk target pengunjung non
prioritas.
BERANDA PRIORITAS
•
•
Lokasi Prioritas adalah lokasi di mana setelah pengunjung membuka halaman depan website, maka TANPA PERLU SCROLL, informasi tersebut langsung
terlihat.
Segita Emas adalah terletak di lokasi prioritas seperti yang terlihat pada gambar segitiga berwarna merah. Itu yang akan di SCAN (bukan dibaca) oleh
pengunjung terlebih dahulu. Setiap masuk ke halaman website atau scroll ke bawah, segitiga emas selalu ada.
BERANDA NON PRIORITAS
Lokasi Non Prioritas (Lihat Kotak Merah) adalah lokasi peletakan informasi non prioritas seperti di Menu,
Sub Menu, Header.
BERANDA NON PRIORITAS
Lokasi Non Prioritas (Lihat Kotak Merah) adalah lokasi peletakan informasi non prioritas seperti di Halaman
Depan Bawah setelah di Scroll dan FOOTER.
Target Pengunjung & Prioritas
01
02
03
• Pelaku Usaha
& Bisnis
• Umum
• Pelaku Usaha
& Bisnis
• Umum
Media
Elemen-Elemen yang ada di Halaman Beranda Website
HALAMAN BERANDA WEBSITE
Header
Image Slider
Fitur
1
Fitur
2
Fitur
3
Footer
Copyright
Fitur
4
Fitur
5
HEADER
PRIORITAS
(Tanpa Perlu Scroll)
NON PRIORITAS
FOOTER
HEADER
HEADER
HEADER
Hot News / Breaking
News / News Ticker /
Running Text
Menu Utama (Sitemap)
FOOTER
FOOTER
FOOTER
BERBAGAI
TAUTAN
ALAMAT
BERANDA PRIORITAS
CONTOH SLIDER
Menampilkan Prestasi/Kinerja
CONTOH FOTO PIMPINAN YANG “MENJUAL”
SOSIALISASI FOKUS KEMENTERIAN KELAUTAN SAAT INI
CONTOH FOTO PIMPINAN YANG “MENJUAL”
PIMPINAN MENUNJUKAN PRESTASI
BERANDA NON PRIORITAS
BERANDA NON PRIORITAS
www.pramuka.or.id
LAYANAN /
PROGRAM
BERITA / ARTIKEL /
AGENDA / SIARA PERS
TIPS & TRIK /
VIDEO
BERANDA NON PRIORITAS
www.kpk.go.id/id
BANNER
CONTOH ARSITEKTUR WEB
HALAMAN BERANDA
TUGAS KELOMPOK
Tugas
1. Sebutkan Tujuan Anda membuat Website.
2. Siapa Target Pengunjung Website Anda?
3. Sebutkan Konten Prioritas untuk diletakkan di Halaman
Prioritas.
4. Sebutkan Konten Non Prioritas lainnya.
5. Buat Arsitektur Halaman Beranda. Gunakan Powerpoint
atau Photoshop (Bagi yang bisa).
6. Buat Tagline untuk Website Anda
7. Buat Presentasi untuk Mempresentasikan Hasil Karya Anda.
WEB DESAIN
Presented by Zeembry
Menentukan Pengunjung dan Konten apa yang ingin Diberikan
TARGET PENGUNJUNG & KONTEN
Menentukan Jenis Pengunjung dan Konten apa yang ingin diberikan di
halaman beranda dan dalam sebuah website.
Contoh Pengunjung: Stakeholder
•
•
•
•
•
•
•
•
•
•
Lembaga Legislatif (Pusat dan Daerah)
Dewan Perwakilan Daerah (DPD)
Departemen/LPND/BUMN/BUMD
Badan Pemeriksa Keuangan (BPK)
Aparat Pengawasan Internal Pemerintah (APIP)
Aparat Penegak Hukum (Kejaksaan Agung, Kepolisian, Komisi
Pemberantasan Korupsi)
Mahkahmah Konstitusi dan Komisi Yudisial
Pemberi Pinjaman/Hibah (Lenders)
Publik/Masyarakat/LSM
Media Massa
Contoh Pengunjung:
Publik/Masyarakt
•
•
•
•
•
Umum
Pengusaha
Profesional
Siswa/Mahasiswa
Akademisi/Peneliti
Contoh Konten untuk Masyarakat
• Layanan Online : Pendaftaran, Perizinan, Sertifikasi,
Pengecekan, Pengaduan
• Layanan Offline: Petunjuk dengan Flowchart yang mudah
dipahami.
• Kinerja & Publikasi : Buku & Majalah Online, Laporan,
Regulasi, Hasil Penelitian, Jurnal, Tutorial, dll.
• Fasilitas : Perpustakaan, Auditorium, Dll.
• Berita : Internal dan Eksternal (Umum, Pusat, Daerah, Siaran
Pers).
• Artikel : Opini Ahli/Tokoh.
• Pengumuman & Agenda
Contoh Konten untuk Frequently
Asked Quetion (FAQ)
1.
2.
3.
4.
Mengapa Investasi di daerah anda?
Kisah Sukses
Peluang Investasi SDM, SDA
Aturan dan Peraturan yang berkaitan dan masuk dan
beroperasinya Investor Asing
5. Perlakuan standar antara Perusahaan Asing dengan Nasional
6. Fungsi dan Efisiensi Pasar Lokal
7. Kebijakan Perdagangan dan Privatisasi
8. Fasilitas yang didapat seperti promosi, insentif, perbaikan fasilitas,
dan langkah untuk mengurangi biaya melakukan bisnis
9. Pembatasan apa saja yang ada
10. Profil Daerah (Biasanya ini untuk Investor Lokal/Daerah)
Pemilihan Jenis Design
• Bila fokus kepada berita dan artikel lebih
cocok ke Design Portal.
• Bila fokus kepada Kinerja dan Layanan lebih
cocok ke Design Gallery.
• Bila fokus ke banyak tautan aplikasi dan
website lebih cocok ke Design Directory.
• Atau bisa juga gabungan dari dua trend design
tersebut tergantung fokus yang akan dipilih
nantinya.
Pengantar Arsitektur Web Desain
ARSITEKTUR WEB DESAIN
Membuat konten yang dicari cepat dan mudah ditemukan dengan
membuat optimasi tombol navigasi, menu, fokus konten, tulisan, dll.
UNTUK MEMBUAT DAN
MENGELOLA SEBUAH WEBSITE
BUKAN HANYA PEKERJAAN
SEORANG WEBMASTER SAJA.
TETAPI MELIBATKAN SEMUA PIHAK
YANG TERKAIT KONTEN DI
WEBSITE TERSEBUT.
Tanpa Arsitektur Informasi, semuanya diletakkan di HALAMAN DEPAN
http://www.iprospect.com.au/heat-map-usability-tracking.html
Tujuan Arsitektur Web Desain
1. Menentukan Target & Prioritas Pengunjung.
2. Menentukan Konten yang ingin diberikan kepada
Pengunjung secara Detil, Akurat dan Lengkap.
3. Membuat Navigasi Situs agar pengunjung dapat
– Menemukan Konten dengan Mudah dan Cepat.
– Memahami Konten dengan Mudah dan Cepat.
4. Menentukan Tim Pengelola Website untuk mengelola
ruang-ruang di dalam website tersebut.
Ini harus melibatkan seluruh pihak yang terkait termasuk
pimpinan, penanggungjawab dan pengelola konten web.
Jenis Informasi & Peletakkan
• Prioritas : Informasi yang diletakkan di
halaman depan website (pada lokasi prioritas)
untuk target pengunjung prioritas.
• Non Prioritas : Informasi yang diletakkan di
halaman depan website (pada lokasi non
prioritas) untuk target pengunjung non
prioritas.
BERANDA PRIORITAS
•
•
Lokasi Prioritas adalah lokasi di mana setelah pengunjung membuka halaman depan website, maka TANPA PERLU SCROLL, informasi tersebut langsung
terlihat.
Segita Emas adalah terletak di lokasi prioritas seperti yang terlihat pada gambar segitiga berwarna merah. Itu yang akan di SCAN (bukan dibaca) oleh
pengunjung terlebih dahulu. Setiap masuk ke halaman website atau scroll ke bawah, segitiga emas selalu ada.
BERANDA NON PRIORITAS
Lokasi Non Prioritas (Lihat Kotak Merah) adalah lokasi peletakan informasi non prioritas seperti di Menu,
Sub Menu, Header.
BERANDA NON PRIORITAS
Lokasi Non Prioritas (Lihat Kotak Merah) adalah lokasi peletakan informasi non prioritas seperti di Halaman
Depan Bawah setelah di Scroll dan FOOTER.
Target Pengunjung & Prioritas
01
02
03
• Pelaku Usaha
& Bisnis
• Umum
• Pelaku Usaha
& Bisnis
• Umum
Media
Elemen-Elemen yang ada di Halaman Beranda Website
HALAMAN BERANDA WEBSITE
Header
Image Slider
Fitur
1
Fitur
2
Fitur
3
Footer
Copyright
Fitur
4
Fitur
5
HEADER
PRIORITAS
(Tanpa Perlu Scroll)
NON PRIORITAS
FOOTER
HEADER
HEADER
HEADER
Hot News / Breaking
News / News Ticker /
Running Text
Menu Utama (Sitemap)
FOOTER
FOOTER
FOOTER
BERBAGAI
TAUTAN
ALAMAT
BERANDA PRIORITAS
CONTOH SLIDER
Menampilkan Prestasi/Kinerja
CONTOH FOTO PIMPINAN YANG “MENJUAL”
SOSIALISASI FOKUS KEMENTERIAN KELAUTAN SAAT INI
CONTOH FOTO PIMPINAN YANG “MENJUAL”
PIMPINAN MENUNJUKAN PRESTASI
BERANDA NON PRIORITAS
BERANDA NON PRIORITAS
www.pramuka.or.id
LAYANAN /
PROGRAM
BERITA / ARTIKEL /
AGENDA / SIARA PERS
TIPS & TRIK /
VIDEO
BERANDA NON PRIORITAS
www.kpk.go.id/id
BANNER
CONTOH ARSITEKTUR WEB
HALAMAN BERANDA
TUGAS KELOMPOK
Tugas
1. Sebutkan Tujuan Anda membuat Website.
2. Siapa Target Pengunjung Website Anda?
3. Sebutkan Konten Prioritas untuk diletakkan di Halaman
Prioritas.
4. Sebutkan Konten Non Prioritas lainnya.
5. Buat Arsitektur Halaman Beranda. Gunakan Powerpoint
atau Photoshop (Bagi yang bisa).
6. Buat Tagline untuk Website Anda
7. Buat Presentasi untuk Mempresentasikan Hasil Karya Anda.