Berbagai Tools Penguji Kompatibilitas Web untuk Handphone

Ditulis oleh Joddie Palgunadi, pada tanggal 28 Sep 2010, di kategori Tips dan Tutorial.

Tampilan dan performa website di handphone dan berbagai mobile device lainnya tidak bisa dipungkiri harus mulai diperhatikan. Hal ini karena makin maraknya penggunaan gadget untuk mengakses web. Sering kita lihat bahwa web design yang terlihat sempurna saat diakses lewat komputer ternyata berantakan saat diakses lewat HP. Untuk web berbasis CMS seperti WordPress – hal ini tampaknya aman-aman saja karena telah ada Mobile Template Plugin untuk WordPress (lihat artikel terdahulu).

Lalu bagaimana cara menguji performance serta tampilan design web saat dibuka lewat mobile device? Mungkin berbagai aplikasi dan situs di bawah ini bisa dipakai sebagai acuan:

1. iPhoney (http://www.marketcircle.com/iphoney/)

Web tool ini berguna untuk menguji tampilan web jika dibuka lewat iPhone yang (umumnya) memiliki dimensi layar 320×480 piksel. iPhoney sangat efektif untuk mengetahui bagaimana performa situs di Apple-Safari-powered environment, baik secara portrait, landscape, zoom, dan full screen.

2. W3C mobileOK Checker (http://validator.w3.org/mobile/)

Web tool ini berguna untuk menguji seberapa device-friendly-kah web atau blog Anda.

3. Modify Headers Add-on for Firefox (https://addons.mozilla.org/en-US/firefox/addon/967/)

Tools ini meruapkan Add on yang bisa diinstall pada browser Mozzila Firefox. Add-on ini berguna untuk merubah User Agent Mozzila menjadi user agent yang lain (termasuk user agent mobile device).Setelah diinstal, di bagian menu tools Mozzila akan terdapat terdapat menu baru, yaitu “Tools > Default User Agent” untuk membiarkan user agent apa adanya (default), dan “Tools > Modify Headers” untuk merubah user agent firefox menjadi user agent yang lain (termasuk mobile device mode). Sehingga, saat add on ini diaktifkan, jika web atau blog yang diakses menggunakan fasilitas mobile auto-template dengan mode deteksi user agent, maka yang tampil di monitor adalah versi mobile-nya.

4. Adobe Device Central CS5

Software ini masih satu paket dengan Adobe Creative Suite CS5. DenganAdobe Device Central CS5, user bisa menguji tampilan web saat diakses lewat handphone. Caranya: Pilih menu “Device Profiles > Browse Devices”, kemudian klik kanan dan pilih “Add To Test Devices”. Lalu klik menu “File > Open” (jika web masih offline) atau “File > Open URL” (jika web sudah online).

5. Gomez (http://www.gomez.com/mobile-readiness-instant-test)

Gomes adalah sebuah web based application yang berguna untuk menguji seberapa performa web saat diakses melalui mobile devices. Gomez memberikan nilai bagi web atau blog Anda serta memberikan perincian tentang kekurangan dan kelebihan web. Gomes juga akan memberikan berbagai saran yang bisa digunakan untuk mengoptimisasi web agar lebih optimal saat diakses lewat mobile devices.

6. MobiReady (http://ready.mobi/launch.jsp?locale=en_EN)

Hampir sama dengan Gomez, web application ini juga memberikan pengujian seberapa siapkah web/blog Anda saat diakses melalui mobile devices.

7. DotMobi Emulator (http://mtld.mobi/emulator.php)

Web application ini adalah emulator site. DotMobi Emulator mampu memperlihatkan bagaimana tampilan web / blog Anda saat diakses melalui HP.

8. Opera Mini Simulator (http://www.opera.com/mobile/demo/)

Sama seperti DotMobi Emulator, web application ini memperlihatkan bagaimana tampilan web/blog Anda saat diakses melalui Opera Mini di handphone.

Lalu bagaimana cara menguji performance serta tampilan design web saat dibuka lewat mobile device? Mungkin berbagai aplikasi dan situs di bawah ini bisa dipakai sebagai acuan: