Hypermedia dan World Wide Web

dokumen-dokumen yang mirip
HYPERMEDIA DAN WORLD WIDE WEB

Identifikasi Pengguna dan Tujuan Mengorganisasikan Isi Website Analisis Website. User Behavior

Perkembangan dunia kepustakawanan. Pertemuan ke 2

Interaksi Manusia dan Komputer. Materi 1

BAB II LANDASAN TEORI

BAB II LANDASAN TEORI

BAB II LANDASAN TEORI

BAB 1 PENGANTAR WEB DESIGN

Internet dan WWW. Pertemuan - II

Mengelola Proses Perancangan. Interaksi Manusia dan Komputer Sesi 3

Konsep Pembuatan Website

BAB II LANDASAN TEORI

Rancangan Situs e-commerce. E-Commerce dan Internet Ekonomi

BAB II LANDASAN TEORI. sistem komputer tersusun atas tiga elemen, yaitu. 1. Hardware (Perangkat Keras), merupakan rangkaian elektronika

BAB II TINJAUAN PUSTAKA. Multimedia dapat diartikan sebagai penggunaan beberapa media

TIPS MEMBUAT WEBSITE PROFESSIONAL

Lima (5) Langkah Membangun Website : 1. Merumuskan Tujuan Membuat Website

BAB II LANDASAN TEORI. di jaman sekarang, namun apakah Anda mengetahui sejarah nya itu?. Mungkin,

Teori, Prinsip, dan Pedoman. Interaksi Manusia dan Komputer Sesi 2

BAB II LANDASAN TEORI

BAB II LANDASAN TEORI

Pert 11 DASAR-DASAR WEB DESIGN

Technologies of Information: HCI and the Digital Library

memilih apa yang akan dikerjakan selanjutnya, bertanya dan memberikan jawaban

BAB II ANALISIS MASALAH

DASAR-DASAR WEB DESIGN

Panduan Mulai Cepat. Menampilkan atau beralih antara akun online Klik ID akun Anda untuk mengubah pengaturan atau beralih akun.

BAB 4 IMPLEMENTASI DAN EVALUASI. majalah, maka dirancang satu aplikasi yang dapat membantu mereka untuk

Pertemuan 5 PEDOMAN, PRINSIP DAN TEORI SISTEM INTERAKSI

PERANCANGAN WEB SEBAGAI MEDIA PROMOSI PENERBITAN BUKU MENGGUNAKAN WATERFALL PADA PT. AKASIA PRIMA

1 PENDAHULUAN 1.1 Latar Belakang

BAB II LANDASAN TEORI

Panduan Penggunaan dan Akses

BAB 2 LANDASAN TEORI

Memulai saluran dengan cepat

Computer- Supported Cooperative Work

Managing Design Process. Ratna Wardani Pertemuan #6

pembuatan animasi ini adalah

BAB IV IMPLEMENTASI DAN PENGUJIAN

BAB 4 HASIL DAN PEMBAHASAN Spesifikasi Perangkat Keras (Hardware)

Panduan Mulai Cepat. Membuka peluncur kotak dialog Klik untuk menggunakan fitur tambahan yang tersedia untuk grup.

BAB 4 IMPLEMENTASI DAN EVALUASI. perangkat keras yang disarankan sebagai berikut: Tabel 4.1 Spesifikasi Game

RENCANA PEMBELAJARAN SEMESTER (RPS) TEKNOLOGI INFORMASI. - Dosen memberikan uraian. - Dosen membagikan fotocopy garis besar

BAB 1 PENDAHULUAN. Perangkat lunak adalah istilah umum untuk data yang diformat dan disimpan secara

BAB 2 LANDASAN TEORI

BROWSER INTERNET UHRIA. Abstrak. Pendahuluan. Pembahasan.

Model Interaksi Manusia dengan Komputer. model interaksi antara manusia dan komputer (ragam dialog/antarmuka)

KKN SISDAMAS Panduan Penggunaan Blog KKN ( UIN SGD BANDUNG) UIN Sunan Gunung Djati Bandung. Pusat Teknologi Informasi dan Pangkalan Data

7 KONSEP DASAR WEB DESIGN

Interaksi Manusia dan Komputer

PENGABDIAN MASYRAKAT PELATIHAN PEMBUATAN WEB UNTUK USTADZ DAN PENGELOLA PONDOK PESANTREN SEBAGAI MEDIA INFORMASI DI KABUPATEN/KOTA KEDIRI

APA ITU WEBSITE :: mengenal Definisi dan Pengertian Situs Web Diposting oleh Cara Membuat Blog Gratis Di: Daftar Istilah, Web Hosting

Link Categories, digunakan untuk mengelompokkan link ke dalam kategorikategori

DASAR-DASAR MACROMEDIA FLASH

BAB II TINJAUAN PUSTAKA DAN LANDASAN TEORI. Penerapan Model Human Computer Interaction (HCI) dalam Analisis Sistem

STRATEGI BANYAK WINDOW

BAB 2 LANDASAN TEORI. Interactive Multimedia System Design and Development (IMSDD)

Menu, Formulir, dan Kotak Dialog. Interaksi Manusia dan Komputer Sesi 6

MICROSOFT OFFICE POWERPOINT

BAB IV IMPLEMENTASI DAN PENGUJIAN

Perancangan Multimedia untuk World Wide Web Pertemuan 12

Di Internet tersimpan berjuta-juta informasi yang dapat. Mencari dan Mengelola Informasi BAB VII. Tujuan Pembelajaran. Kata kunci

BAB III INTERNET LABORATORIUM MANAJEMEN MENENGAH 30

APLIKASI MANAJEMEN PERPUSTAKAAN BERBASIS WEB MENGGUNAKAN PHP DAN MYSQL PADA SMA NEGERI 5 BINJAI TUGAS AKHIR FATIMAH

BAB II LANDASAN TEORI

Pembuatan Website Download Software Gratis dengan menggunakan Joomla!

BAB 4 IMPLEMENTASI DAN EVALUASI

Oleh: Herman D. Surjono, Ph.D.

SEARCH ENGINE OPTIMIZATION (MESIN PENCARI)

lebih memilih internet sebagai sumber informasinya. Dengan alasan bahwa informasi yang disajikan akurat dan selalu baru. Salah satu bentuk pelayanan d

Panduan Dasar Membuat Website

BAB XII Perancangan Antarmuka untuk Pencarian

ARTIKEL WEBSITE A. PENGERTIAN WEBSITE ATAU SITUS.

BERITA DAERAH KABUPATEN KULON PROGO

BAB 4 IMPLEMENTASI DAN EVALUASI

Bab 2 Tinjuan Pustaka 2.1 Penelitian Sebelumnya

BAB III LANDASAN TEORI

Komunikasi Multimedia

BAB 4 IMPLEMENTASI DAN EVALUASI. Menggunakan server dengan spesifikasi sebagai berikut : - Processor 1.2 GHz 2007 Opteron or 2007 Xeon processor

MODUL 1 MENGOPERASIKAN WEB BROWSER

Lampiran 1 : Information Architecture for The Web. 1. Evaluation Criteria : Background Information. Universitas Sumatera Utara

PERANCANGAN WEBSITE PENJUALAN SECARA ONLINE MENGGUNAKAN PHP DAN MYSQL TUGAS AKHIR MIRA RIZKY S TANJUNG

BAB 2 LANDASAN TEORI. Kata sistem berasal dari bahasa Yunani yaitu Systema yang mengandung arti kesatuan

BAB V IMPLEMENTASI KARYA

BAB II TINJAUAN PUSTAKA. terhadap kinerja suatu produk dan harapan-harapannya. Persaingan semakin

SIMBOL DAN LIBRARIES

PROSES PERANCANGAN INTERAKSI (MODEL SIKLUS HIDUP DAN PROSES) Mengapa perancangan interaksi menghasilkan interface yang buruk?

FERNANDYA RISKI HARTANTRI / F DASAR-DASAR HTML

BAB 4 KONSEP DESAIN. 4.1 Landasan Teori Teori Website

Bab 4. Implementasi dan Evaluasi. Seperti yang sudah dibahas pada bagian sebelumnya, aplikasi yang dibuat

PANDUAN DASAR MEMBUAT WEBSITE

BAB 4 IMPLEMENTASI DAN EVALUASI. pengunjung yang membutuhkan informasi-informasi yang terdapat di dalam Mal

Interaksi Manusia dan Komputer MODEL INTERAKSI MANUSIA KOMPUTER

II. TINJAUAN PUSTAKA. grafik, animasi, dan video. Beberapa definisi menurut beberapa ahli: 1. Kombinasi dari komputer dan video (Rosch, 1996).

BAB II LANDASAN TEORI

Transkripsi:

Hypermedia dan World Wide Web Topik Bahasan Pengantar Sistem hypertext bersejarah Fitur-fitur alat bantu pembuatan situs Web Membuat dokumen untuk hypertext Genre dan tujuan bagi perancang 2 1

Pengantar Hypertext pertama kali diperkenalkan oleh Vannevar Bush, Juli 1945, pada artikel berjudul As We May Think. Bush mengemukakan: Akan adanya masalah luapan informasi. Perlu dibuat piranti yang memungkinkan acuan silang dalam dokumen dan antardokumen dengan mudah. Usulan piranti eksplorasi informasi yang diberi nama Memex. 3 Pengantar (Lanj.) Hypertext dan hypermedia adalah: Dokumen nonsekuensial dan nonlinear. Jaringan simpul (artikel, dokumen, file, kartu, halaman, frame, layar) yang dihubungkan dengan link (acuan silang atau citation). Hypertext: digunakan untuk menyebut aplikasi berisi hanya teks. Hypermedia: untuk menyampaikan keterlibatan media lain: suara dan video. 4 2

Sistem Hypertext Bersejarah Memex (1945) oleh Bush, berbasis mikrofilm dan eyetracking, hanya konsep. Augment/NLS (1962-1976) oleh Doug Engelbart. Xanadu (1965) oleh Ted Nelson. Pertama kali istilah hypertext diperkenalkan. Aspen Movie Map (1978) oleh Andrew Lippman dan MIT Architecture Machine Group: sistem hypermedia pertama. Hyperties (1983) oleh Ben Shneiderman, kemudian dipasarkan dan diperluas oleh Cognetics Corp. HyperCard (1987) oleh Bill Atkinson, diberikan gratis dari komputer Apple. World Wide Web (1993) oleh Tim Berners Lee et al. di CERN, Geneva, Switzerland menandai awal perkembangan pesat hypertext di Internet. 5 Hypertext dan Hypermedia Hypertext memperluas teks linear tradisional dengan: Kesempatan melompat ke berbagai artikel yang berhubungan. Backtracking yang memudahkan. Indeks dan daftar isi yang bisa diklik. Pencarian string. Bookmarks (favorites). Alat bantu navigasi lainnya. 6 3

Hypertext dan Hypermedia (Lanj.) Langkah pertama dalam membentuk hypertext yang efektif adalah memilih proyek yang memenuhi Aturan Emas Hypertext (The Golden Rules of Hypertext): Ada badan informasi besar yang diorganisasikan menjadi beberapa fragmen. Fragmen-fragmen tersebut saling berhubungan. Pemakai hanya memerlukan sebagian kecil dari fragmen pada suatu waktu. 7 Hypertext dan Hypermedia (Lanj.) Perancangan buruk hypertext yang sering ditemui (Rivlin et al.): Terlalu banyak link. Rantai link yang panjang untuk mencapai materi yang relevan. Terlalu banyak artikel panjang yang membosankan. 8 4

Hypertext dan Hypermedia (Lanj.) Fitur-fitur yang perlu didukung oleh alat bantu pembuatan hypertext: Aksi Import Edit Export Print Search Objek An article or node A link Collections of articles or nodes Webs of links Entire hypertext 9 Fitur-fitur Alat Bantu Pembuatan Situs Web Fitur-fitur yang perlu dipertimbangkan dalam alat bantu pembuatan situs Web: Macam fungsi edit yang tersedia. Ketersediaan daftar link. Verifikasi link. Macam perintah pemformatan tampilan. Ketersediaan fungsi search and replace. Kendali atas warna. Kemampuan untuk berpindah dengan mudah dari mode author ke browser. 10 5

Fitur-fitur Alat Bantu Pembuatan Situs Web (Lanj.) Ketersediaan fasilitas grafik dan video. Kemungkinan kolaborasi. Kompresi data. Kontrol keamanan. Enkripsi. Kehandalan. Kemungkinan untuk integrasi dengan software dan hardware lain. Impor dan ekspor format pertukaran standar. 11 Membuat Dokumen untuk Hypertext Dalam membuat dokumen untuk hypertext perlu diperhatikan: Kenali pemakai dan tugasnya. Pastikan struktur yang berarti terpenting. Dasari pada presentasi informasi dan bukan teknologi. Terapkan keterampilan yang beraneka ragam: spesialis informasi, spesialis isi, dan teknologis. Hargai pemilahan. Atur informasi menjadi bongkahbongkah yang membahas satu topik, tema, atau ide. 12 6

Membuat Dokumen untuk Hypertext (Lanj.) Tunjukkan hubungan yang ada. Terlalu sedikit link membosankan; terlalu banyak membuat kewalahan. Pastikan penjelajahan sederhana. Rancang setiap layar dengan hati-hati. Fokus perhatian jelas, judul memandu, link menjadi panduan yang berguna. Gunakan beban kognitif yang rendah. Minimalkan beban ingatan jangka pendek. 13 World Wide Web Banyaknya halaman Web menghasilkan: Komentar distopian tentang banjir informasi. Visi utopian tentang memanfaatkan banjir informasi itu untuk hal-hal yang membangun. Desain untuk situs Web yang baik 10 kesalahan utama desain Web 10 pedoman terpenting usability homepage 14 7

Desain untuk Situs Web yang Baik Menurut Patrick Lynch, 1995 Menyeimbangkan struktur dan hubungan dari menu atau home page dengan halaman isi atau grafik dan dokumen yang di-link. Tujuannya membangun hierarki menu dan halaman yang berasa alami dan terstuktur dengan baik bagi pemakai, dan tidak mengganggu pemakaian situs Web atau menyesatkan mereka. 15 10 Kesalahan Utama Desain Web Top Ten Mistakes of Web Design (Jakob Nielsen, 1996) Penggunaan frame. Penggunaan teknologi baru dengan serampangan. Gerakan teks dan animasi yang berjalan terus. URL yang kompleks. Halaman yatim. 16 8

10 Kesalahan Utama Desain Web (Lanj.) Halaman yang terlalu panjang gulungannya. Isi terpenting dan navigasi harus tampak di bagian atas. Kurangnya dukungan navigasi.. Warna link yang tidak standar. Informasi yang basi. Waktu download yang terlalu lama. Pemakai kehilangan minat dalam 10-15 detik. 17 10 Pedoman Terpenting Usability Homepage Top Ten Guidelines of Homepage Usability (Jakob Nielsen, 2002) Buat maksud homepage jelas: Siapa Anda dan apa yang Anda lakukan. Sertakan tagline satu kalimat. Tulis judul window dengan ketertampakan yang baik pada search engine dan bookmark. Kelompokkan informasi perusahaan dalam tempat yang dapat dibedakan. 18 9

10 Pedoman Terpenting Usability Homepage (Lanj.) Bantu pemakai menemukan yang dibutuhkan. Tegaskan tugas prioritas tertinggi situs. Sertakan kotak input pencarian. Singkapkan isi situs. Tampilkan contoh isi situs. Awali nama link dengan kata kunci terpenting. Tawarkan akses yang mudah untuk fitur homepage terbaru. 19 10 Pedoman Terpenting Usability Homepage (Lanj.) Gunakan desain visual untuk meningkatkan desain interaksi, bukan mendefinisikan. Jangan memformat isi kritis secara berlebihan, misalnya area navigasi. Gunakan gambar yang berarti. 20 10

Genre(kelompok/gaya/format) dan Tujuan bagi Perancang Cara mengategorikan situs Web: Berdasarkan pendiri: individu, kelompok, universitas, perusahaan, organisasi nirlaba, badan pemerintah. Berdasarkan tujuan pendiri: menjual produk, mengiklankan produk, memberi informasi dan pengumuman, menyediakan akses, menawarkan jasa, membuat diskusi, mendidik masyarakat. 21 Genre dan Tujuan bagi Perancang (Lanj.) Berdasarkan jumlah halaman atau informasi yang tersedia. Mis.: 1-10: biografi, ringkasan proyek. 5-50: makalah ilmiah, konferensi. 50-500: buku, laporan tahunan. Berdasarkan ukuran keberhasilan. Bagi individu: mencari pekerjaan, mencari teman. Bagi perusahaan: jumlah pengunjung per hari. Bagi penyedia akses: jumlah waktu pemakaian. Bagi lainnya: promosi. 22 11

Model Antarmuka Objek-Aksi untuk Perancangan Situs Web Model OAI mendorong perancang situs web memfokuskan empat komponen dalam dua bidang: Tugas Objek informasi terstruktur (hierarki, jaringan). Aksi informasi (pencarian, linking). Antarmuka Metafora untuk objek informasi (rak buku, ensiklopedia). Penanganan aksi (query, zoom). 23 Model Antarmuka Objek-Aksi untuk Perancangan Situs Web (Lanj.) Strategi agregasi informasi Hal-hal yang mempengaruhi kepuasan subjektif awal pemakai Pengujian dan pemeliharaan situs web 24 12

Strategi Agregasi Informasi Daftar pendek tak terstruktur: fitur pedoman kota, divisi organisasi, proyek terbaru. Struktur linear: kalender peristiwa. Larik atau tabel: jadual penerbangan. Hierarki, tree: benua-negara-kota. Multitree, faceted retrieval: foto diurutkan berdasarkan tanggal, jurufoto, lokasi, topik. Jaringan: World Wide Web, kutipan jurnal. 25 Hal-hal yang Mempengaruhi Kepuasan Subjektif Awal Pemakai Kepuasan subjektif awal pemakai sangat kuat ditentukan oleh hal-hal berikut (Horton et al., 1996): Kekompakan dan faktor percabangan. Panjang halaman dan jumlah link. Pengurutan, pengelompokan, dan penegasan. Dukungan akses universal. Desain grafis yang baik. Dukungan navigasi. 26 13

Pengujian dan Pemeliharaan Situs Web Disarankan uji usability. Uji pada lingkungan yang realistik. Uji in-house dini dengan jumlah pemakai terbatas. Uji medan yang intensif. Proses peluncuran bertahap. Log pemakaian berguna. Umpan balik pemakai. Ekspektasi pemakai dan kebijakan organisasi memandu tingkat perubahan. 27 28 14

29 15