Hal-hal Sepele yang Sering Dilupakan oleh Web Developer (Bagian 1)

Author: · Published: October 23, 2014 · Category: Pemrograman PHP 

Ketika Anda sebagai Web Developer membangun Aplikasi Web dengan menggunakan bahasa pemrograman PHP, pernahkah Anda terbayang bahwa ternyata ada beberapa hal yang sering kali Anda lupakan meskipun kelihatan sangat sepele? Ya, biasanya hal tersebut terjadi karena tidak adanya pola pengembangan yang teratur, sehingga mengakibatkan tampilan Aplikasi Web yang dihasilkan pun menjadi tidak standar.

Mulai di artikel ini Penulis akan menyoroti beberapa hal yang sering kali dilupakan atau diabaikan oleh Web Developer. Mulai dari tampilan Aplikasi Web yang tidak konsisten, penggunaan kotak dialog yang tidak sinkron dengan tema Aplikasi Web, sampai kepada pola kerja Web Developer yang tidak disiplin.

Khusus di artikel ini, Penulis akan fokus kepada penggunaan kotak dialog (message box) yang berisi pesan informasi, peringatan, error, maupun konfirmasi pertanyaan yang harus direspon oleh Pengguna.

Banyak Aplikasi Web yang selama ini Penulis amati tidak mengikuti kaidah atau estetika tampilan kotak dialog. Yang paling sering adalah adanya pemakaian kotak dialog bawaan asli browser yang digunakan. Betul, Anda pasti sudah tahu dengan sintaks seperti ini:

alert("Isi pesan");

Ketika kode Javascript itu dijalankan, maka Anda akan melihat sebuah kotak dialog yang sangat membosankan dan kalau boleh saya bilang, sudah sangat ketinggalan jaman. Apalagi jika ketika kotak dialog itu ditampilkan, maka tampilan di belakangnya menjadi blank alias halaman berwarna putih polos tanpa konten sebelum kotak dialog tadi muncul. Pernah melihat kondisi ini? Saya sering! 😀

Yang lucunya lagi, penggunaan kotak dialog seperti itu digunakan pada sebuah Aplikasi Web yang memiliki tema atau tampilan relatif bagus. Artinya? Sangat kontradiktif antara tema Aplikasi Web yang bagus dengan tema kotak dialog yang sangat, maaf, kalau boleh saya bilang: jelek.

Web Developer yang cerdik/rajin tentu saja tidak akan rela membiarkan Aplikasi Web-nya yang sudah bagus menggunakan kotak dialog seperti itu. Dia pasti akan berusaha mencari pustaka Javascript atau jQuery yang mendukung, atau paling tidak, mendekati dengan tema dari Aplikasi Web-nya. Contoh, jika Aplikasi Web-nya menggunakan Twitter Bootstrap, maka dia akan berusaha mencari pustaka yang mendukung dengan tampilan Twitter Bootstrap.

Kira-kira seperti itulah makna dari kaidah atau estetika tampilan yang saya maksud. Bukankah sangat aneh terlihat jika tema Aplikasi Web yang Anda bangun menggunakan tema asli dari Twitter Bootstrap, sementara kotak dialog yang muncul menggunakan tema flat atau lainnya yang sangat jauh berbeda dengan tema Twitter Bootstrap?

Memang kelihatan sangat sepele, tapi percayalah, hal ini dapat membawa dampak psikologis bagi Pengguna Aplikasi Web Anda. Jika Pengguna sering menggunakan Aplikasi Web Anda, dan menemukan kondisi yang tidak kita harapkan di atas tadi, maka mereka menjadi tidak terlalu bersemangat bekerja menggunakan Aplikasi Web yang Anda bangun tersebut.

Biasanya, kondisi yang tidak diharapkan itu bisa terjadi karena Web Developer tidak memiliki pola kerja yang teratur dalam menghasilkan fitur kotak dialog tadi. Kalaupun mereka berhasil mengambil pustaka Javascript dari Internet, mereka kesulitan untuk mengkolaborasikan dengan metode pengembangan yang mereka lakukan. Akibatnya, hal ini sering menjadi diabaikan dan akhirnya dilupakan oleh Web Developer.

Anda sebagai Web Developer beruntung jika menggunakan Aplikasi Web yang dihasilkan dengan PHPMaker, karena Penulis telah berhasil membuat Extension yang dapat digunakan di project PHPMaker Anda untuk menampilkan kotak dialog yang tema-nya sama dengan tema Aplikasi Web yang Anda bangun; dalam hal ini menggunakan tema tampilan Twitter Bootstrap.

Kotak dialog yang dibuat Penulis ini bahkan dilengkapi dengan efek Transition yang variatif sehingga tidak membosankan ketika dilihat efek pemunculan dan penghilangannya oleh Pengguna. Anda bisa melihat demo-nya melalui halaman ini: http://demo11.ilovephpmaker.com. Anda bisa mencoba login dengan menggunakan username admin dan password master, lalu klik link Logout yang terdapat di bagian Header.

Di samping tampilan Aplikasi Web yang serasi antara tema utama dengan tema dari kotak dialog pesan tadi, waktu pengembangan pun menjadi dapat dihemat secara signifikan. Anda tidak perlu lagi repot-repot memikirkan bagaimana membuat kotak dialog yang tampilannya harus sinkron dengan tema Aplikasi Web Anda.

Related Articles

  1. Hal-hal Sepele yang Sering Dilupakan oleh Web Developer (Bagian 2)
  2. Mengenal Theme di Aplikasi Web yang Dihasilkan oleh PHPMaker
  3. Hal-hal Sepele yang Sering Dilupakan oleh Web Developer (Bagian 3)
  4. Seri-1 Bootstrap: Persiapkan Dirimu!
  5. Implementasi Twitter Bootstrap pada CodeIgniter
  6. PHPMaker = {PHP Code Generator + PHP Framework + CSS dan Javascript Framework}
  7. Hal-hal Sepele yang Sering Dilupakan oleh Web Developer (Bagian 5)
  8. Mengenal Fitur Sinkronisasi di PHPMaker
  9. Hal-hal Sepele yang Sering Dilupakan oleh Web Developer (Bagian 4)
  10. Seri-2b Bootstrap: Semudah Apa Bootstrap?
  11. Meng-override Style di Aplikasi Web yang Dihasilkan oleh PHPMaker
  12. Program Kolom Koran Otomatis di Microsoft Word dengan Visual Basic Editor
  13. Mengenal Pengaturan Delete pada Table Setup di PHPMaker
  14. Pengaturan Password di Aplikasi Web yang Dihasilkan oleh PHPMaker
  15. Meniadakan Daftar Aplikasi KDE
  16. Layer, Style dan Tema pada Oracle Map Viewer
  17. Mengenal Database Helper Class di PHPMaker
  18. Menyalin Tabel dan Field dari Dalam Project PHPMaker
  19. Mengenal Extensions di PHPMaker
  20. Infinite Scroll di Codeigniter: Seperti Paging Twitter dan Facebook