Perancangan Applikasi Web


http://marissadewi.files.wordpress.com/2010/11/planning4.jpg

Technology-aware Web Application Design (Perancangan Applikasi Web)

diambil dari buku Web Engineering, edited by Gerti Kappel Birgit Proll cs

1. Pendahuluan

Awalnya World Wide Web (Web) dibuat pada tahun 1989 sebagai suatu lingkungan yang mengijinkan pembagian informasi (seperti laporan penelitian, basis data, dan panduan pengguna). Informasi berisi dokumen teks yang saling terhubung dengan antarmuka pengguna  (Web Browser). Sejak awal, Web memang telah berubah menjadi suatu lingkungan yang dipekerjakan untuk mengirimkan beberapa jenis aplikasi yang berbeda.

Pengembangan aplikasi web mempunyai beberapa karakteristik yang membedakan pengembangan ini dari berbagai jenis aplikasi. Pada suatu sisi, ada banyak jenis yang berbeda dari partisipasi stakeholder dalam proses pengembangan. Fitur utama dari sistem ini adalah struktur navigasional, antarmuka pengguna, dan kemampuan personalisasi.

Pada pengembangan aplikasi traditional (non-Web), baik praktisi maupun pakar telah memproses kebutuhan teknik, seperti fase yang paling penting di dalam proses pengembangan semenjak kesalahan yang paling umum dan penggunaan waktu yang penting diperbaiki

 

2. Desain Web dari Perspektif Evolusioner

2.1 Background

Salah satu karakteristik utama  aplikasi Web adalah pandangan pengguna terhadap data yang disajikan. Hal ini sangat penting karena kebanyakan manusia dapat menerima suatuinformasi dengan perangakt lunak yang konvensional. Programmer dan desainer sebaiknya saling berdiskusi dalam menentukan suatu perancangan desain aplikasi web. Diskusi dimulai dengan melihat aspek authoring kemudian melalui aspek software-technology menentukan fitur-fitur umum dan manfaat mengintegrasikan kedua aspek, dan akhirnya melihat permasalahan yang ada dari integrasi ini

 

2.2 Desain Informasi

Perkembangan Desain informasi tidak lepas dari perkembangan HTML.  Awal era HTML lebih terfokus pada authoring, hal ini mengakibatkan hanya dapat mendukung dokumen hypertext. Dalam perjalanan waktu, HTML yang didukung oleh media lain seperti gambar, video, audio, dll. Berkembangnya HTML membuat para ahli bingung tentang perbedaan HTML dan Hypetext, kemudia mereka mengadakan diskusi untuk mendalami perbedannya.

Konsep hypertext lebih tua dari HTM,  ide dasar yang dirumuskan oleh Vannevar Bush pada akhir Perang Dunia II dalam pandangannya bahwa kekayaan muncul oleh pembawaan informasi. Selain itu Ted Nelson menciptakan istilah itu sendiri pada 1960-an.

 

2.3 Pendekatan Struktural Komponen Web

Untuk mengingat tiga bagian, kami daftar di bawah ini, masing-masing komponen web

  • Desain Presentasi: Presentasi pada umunya akan menunjukkan halaman tunggal yang meliputi tata letak halaman, teks, multimedia, tautan dan form
  • Desain Interaksi: Bagian ini berkaitan dengan interaksi pengguna dengan aplikasi Web. Cara utama untuk penerapan interaksi adalah dengan menggunakan formulir seperti transparansi, pemulihan (pembatalan ketika sudah mengisi form), fasilitas catatan tambahan
  • Fungsionalitas; Sistem harus mencakup semua fitur-fitur penting untuk memenuhi kebutuhan tugas-tugas. Akurasi, kesesuaian, pemenuhan, interoperabilitas, dan keamanan.

3. Presentation Design

Kriteria presentasi berhubungan denga pengukuran keseluruhan situs dan presentasi halaman tunggal, presentasi dengan tepat menunjuk halaman tunggal mereka yang meliputi

3.1   Tata letak halaman

Tata letak halaman adalah karakteristik yang paling prinsipel yang dirasakan oleh pengguna. Tata letak harur bersih dan keseluruhan konten harus tertata dan tersusun dengan baik. Hal tersebut bisa membantu orang-orang yang lemah (buta atau cacat). Sebagai teknologi bantu, heading paragraf (h2>,… tag) dan struktur paragraf sebaiknya membuat konten lebih dapat dimengerti. Dengan sangat jelas. Tag <hn> harus digunakan di urutan yang benar. Tidak hanya untuk mendapatkan efek grafis. Pemakaian yang benar dari tag ini dapat secara otomatis dibuktikan

Tata letak harus dapat menyesuaikan diri pada alat yang berbeda. Kemampuan ini menyiratkan bahwa halaman harus menghindari pembuatan referensi pada pengaturan perangkat spesifik, seperti resolusi layar atau menetapkan ukuran komponen halaman.

3.2   Teks

Ada beberapa isu yang harus dipertimbangkan tentang presentasi teks. Huruf yang digunakan harus dapat dicocokkan untuk kemudahan pembacaan. Berikut ini adalah beberapa aturan tentang warna dan ukuran.

3.3   Multimedia

Mutimedia adalah suatu komponen penting dari situs Web. Bagaimanapun juga, kita harus membedakan komponen multimedia sebagai hal-hal yang perlu karena dapat menyampaikan suatu pesan penting dari kasus-kasus dengan citra atau suara yang dapat memperkaya halaman untuk membuat situs Web menjadi lebih aktraktif.

3.4   Tautan

Tautan merupakan suatu komponen yang penting. Pertimbangan di bagian ini hanyalah aspek-aspek dari penyajiannya. Isu pertimbangannya adalah

a. Sejumlah tautan

b. Sejumlah tautan yang rusak

c. Sejumlaht tautan harus secara hati-hati dievaluasi, seperti beberapa di antara mereka yang           hanya bisa menjadi tautan menu, dan harus dipertimbangkan kelompoknya, dan

d. Terakhir, tujuan halaman mungkin memerlurkan sejumlah tautan rendah atau tinggi

3.5   Form

Pada tingkat presentasi, form harus dievaluasi dengan mempertimbangkan fitur-fitur aksesibilitinya (label, pengisian field dengan data default, urutan sesuai field, dan kemungkinan untuk berpindah dengan tombol tab)

 

4. Interaction Design

Cara yang utama untuk penerapan interaksi adalah dengan menggunakan formulir. Isu untuk pertimbangannya adalah sebagai berikut:

  • Transparasi (pengguna diberi tahu mengenai pengisian, tambalan, format dan peluncuran)
  • Pemulihan (pembatalan tersedia pada formulir halaman atau setelah pengguna mengisi formulit isian dan kemudian sistem memberitahukan aksi yang diselesaikan dan kemungkinan untuk dapat dibatalkan), dan
  • fasilitas catatan tambahan (jika pengguna dapat berperan untuk konten situs web)

5. Functional Design

Kita dapat mengintegrasikan sistem pada tiga tingkatan, yang harus ditafsirkan sebagai sub-tingkat dari desain fungsional: tingkat data, tingkat aplikasi, dan tingkat proses.

Dalam integrasi pada tingkat data, kami memastikan bahwa data antara representasi berbagai aplikasi yang berubah dan disalin. Contohnya termasuk transformasi primitif langkah-langkah antara ekspor data dari satu aplikasi dan mengimpor data ke dalam aplikasi lain, atau penggunaan JDBC untuk menghubungkan database. Pendekatan ini tidak melibatkan aplikasi sendiri, dan tidak membiarkan kita memvalidasi data.

Selain itu sistem harus mencakup semua fitur-fitur penting untuk memenuhi kebutuhan tugas-tugas. Akurasi, kesesuaian, pemenuhan, interoperabilitasm dan keamanan adalah isu yang harus diselidiki dalam perancangan suatu sisetm aplikasi web untuk menyakinkan bahwa sistem akan melaksanakannya seperti yang diharapkan. Aplikasi web harus mempunyai kemampuan pencarian dan pengambilan kembali, navigasi, dan fitur-fitur browsing dan fitur-fitur aplikasi berkaitan dengan domain.

 

6. Outlook/Pandangan

◦   Aplikasi Context-aware

Sebuah aplikasi context-aware adalah sebuah aplikasi yang membutuhkan pengetahuan khusus bagi para  pengguna – pengguna. Untuk menyesuaikan secara optimal baik interaksi maupun fungsinya. Selain itu, konteks kesadaran mengarah pada jenis baru dari aplikasi, misalnya, Location-Based Services (LBSs) yang bergantung pada lokasi tepat kita berada.

Misalnya, menampilkan informasi suatu restoran, sistem ini akan disesuaikan dengan restoran yang ada di lingkungan pengguna.Sebuah kekayaan yang hampir tak terbatas dan lebih canggih, misalnya, menampilkan preferensi kuliner pengguna, atau informasi lalu lintas setempat secara elektronik.

Sejumlah masalah harus dipecahkan supaya jenis aplikasi canggih ini dapat diperkenalkan secara luas. Masalah-masalah ini tidak hanya bersifat teknis, misalnya, sehubungan dengan membuat informasi dan konteks yang diperlukan. Operator ISP di daerah setempat. Mengingat potensi penjualan besar, operator telekomunikasi tampaknya tertarik menawarkan layanan context-aware sendiri atau melalui mitra yang dipilih. Kurangnya kompetisi dan, akibatnya, rendahnya kualitas layanan yang saat ini ditawarkan membuat model bisnis ini muncul diragukan.

Selain itu hambatan utama untuk pengenalan aplikasi Web context-aware adalah privasi  pengguna. LBSs khususnya telah dibahas oleh berdebat apakah atau tidak ketiga pihak dapat merekonstruksi dan penyalahgunaan lokasi pengguna.

 

◦   Reusability

Konsep memainkan peranan penting dalam desain dapat dilihat dalam pemrograman berorientasi objek atau design-object. Bagian-bagian berikut ini akan membahas secara singkat tiga bidang penelitian dan pembangunan yang menjanjikan untuk substansial mempromosikan reusability sebagai contoh representatif. Dan pembangunan yang menjanjikan untuk substansial mempromosikan reusability sebagai contoh representatif.

 

Konsep untuk Meshes

Dukungan terhadap konsep yang memungkinkan untuk merancang meshes dengan elegan terdiri dari unsur-unsur dan link kecil, tetapi tidak cukup untuk desain perangkat lunak dan untuk desain informasi Web aplikasi.

 

Konsep Mature Type

Jenis unsur dan link serupa dengan yang diperkenalkan secara umum di desain informasi selama era HTML, dan mereka sekarang mengalami kebangkitan dengan XML (Meskipun belum populer). Dalam desain perangkat lunak (lihat UML), kelas dari unsur-unsur yang didukung memuaskan, dan mereka juga didukung oleh hierarki kelas dan komponen konsep modern di berorientasi objek perangkat teknologi

 

Konsep Komposisi Alternatif

Meshes dibahas di sini merupakan grafik diarahkan. Mengingat konsep-konsep pemrograman tingkat lanjut, misalnya komunikasi, event-based dan konsep hypertext maju seperti link  (yang

sebagian didukung dalam standar berbasis XML), diasumsikan bahwa konsep “mesh” seperti itu

harus ditingkatkan. Namun, tidak bekerja saat ini di arah ini diketahui oleh penulis.

7. Kesimpulan

Rekayasa Web adalah sebuah aplikasi yang menggunakan pendekatan sistematis, disiplin, dan terukur untuk pengembangan, operasi dan pemeliharaan aplikasi berbasis web (Web-based Applications) .

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s