PENGGUNAAN WURFL (WIRELESS UNIVERSAL RESOURCE FILE) UNTUK DETEKSI PERANGKAT KLIEN DAN CMS (CONTENT MANAGEMENT SYSTEM) PADA PEMBANGUNAN M-LEARNING

(1)

PENGGUNAAN WURFL (WIRELESS UNIVERSAL RESOURCE FILE)

UNTUK DETEKSI PERANGKAT KLIEN DAN CMS (CONTENT

MANAGEMENT SYSTEM) PADA PEMBANGUNAN M-LEARNING

JEFFRY PIANOV

DEPARTEMEN ILMU KOMPUTER

(2)

PENGGUNAAN WURFL (WIRELESS UNIVERSAL RESOURCE FILE)

UNTUK DETEKSI PERANGKAT KLIEN DAN CMS (CONTENT

MANAGEMENT SYSTEM) PADA PEMBANGUNAN M-LEARNING

JEFFRY PIANOV

Skripsi

Sebagai salah satu syarat untuk memeroleh gelar Sarjana Komputer pada Fakultas Matematika dan Ilmu Pengetahuan Alam

Institut Pertanian Bogor

DEPARTEMEN ILMU KOMPUTER

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM

INSTITUT PERTANIAN BOGOR

BOGOR

2009

(3)

ABSTRACT

JEFFRY PIANOV. Using WURFL (Wireless Universal Resource File) for client device detection and CMS (Content Management System) on m-learning development. Guided by Sri Wahjuni.

Nowdays, most of the existing learning content has been designed for desktop computers and is not suitable for mobile devices with limited resources and computing capabilities. The main problem is that the screen size of mobile devices (cell phone, smart phone or PDA) is smaller than the screen size of desktop devices (personal computer or laptop). Therefore, we need to create a customized presentation for both types of devices to make learner feel comfortable when they learn. This paper presents an architecture to provide a good adaptation results for both types of devices. The architecture consists of two parts, the detection engine and the adaptation engine. The detection engine is responsible for detecting the client device based on devices capabilities provided by WURFL (user-agent, screen size, etc) and the adaptation engine is responsible for providing layout adaptation based on the results of detection and the requested content. The adapted content will be sent to the client by the server. Finally, the architecture has been successfully implemented in a website called KSB (Kasih Sayang Bunda) and also the CMS for managing articles. The system can also be continually updated to provide a good adaptation in the future.

(4)

Judul : Penggunaan WURFL (Wireless Universal Resource File) untuk Deteksi Perangkat Klien dan CMS (Content Management System) pada Pembangunan M-learning Nama : Jeffry Pianov

NIM : G64066016

Menyetujui:

Pembimbing

Ir. Sri Wahjuni, M.T. NIP. 196805012005012001

Mengetahui:

Dekan Fakultas Matematika dan Ilmu Pengetahuan Alam Institut Pertanian Bogor

Dr. drh. Hasim, DEA. NIP. 196103281986011002

(5)

RIWAYAT HIDUP

Penulis lahir di Medan pada tanggal 22 Nopember 1984 sebagai anak pertama dari empat bersaudara, putra dari pasangan Ir. Bahtera Peranginangin dan Rante Malem Purba.

Pada tahun 2002 penulis menyelesaikan pendidikan menengah umum di SMU Cahaya Medan dan pada tahun yang sama lulus seleksi masuk D3 IPB melalui jalur Undangan Seleksi Masuk IPB (USMI). Penulis diterima sebagai mahasiswa pada program studi Diploma 3 Instrumentasi dan Teknologi Komputer, Departemen Fisika IPB. Selanjutnya pada tahun 2005 penulis lulus dari D3 IPB dan melanjutkan ke program S1 Penyelenggaraan Khusus Ilmu Komputer IPB pada tahun 2007.

(6)

PRAKATA

Puji dan syukur penulis panjatkan kepada Tuhan Yang Maha Esa atas kasih karunia-Nya sehingga penulis dapat menyelesaikan tugas akhir berupa skripsi ini.

Penghargaan dan ucapan terima kasih penulis sampaikan kepada dosen pembimbing, Ibu Ir. Sri Wahjuni, M.T., atas bimbingan dan arahan beliau penulis dapat menyelesaikan skripsi ini. Ucapan terima kasih juga penulis sampaikan kepada dosen penguji Bapak Endang Purnama Giri, S.Kom.,M.Kom., dan Bapak Hendra Rahmawan, S.Kom.,M.T., atas waktu dan masukan yang berarti dalam penyempurnaan skripsi ini, juga kepada seluruh staf pengajar yang telah mendidik penulis selama menuntut ilmu di Departemen Ilmu Komputer IPB.

Penulis mengucapkan terima kasih kepada Cahyadi Bagus Hendrawan dan Dwi Annisanur Salamah, S.Kom., yang telah memberikan waktu dan bantuannya selama proses penelitian berlangsung.

Ucapan terima kasih juga penulis sampaikan kepada orang tua dan adik-adik penulis, Siska, Leo dan Adi, yang selalu mendoakan penulis dan kepada Shanty Rosdiana, SP., yang selalu memberikan dukungan dan motivasi dalam pengerjaan skripsi ini.

Terakhir penulis mengucapkan terima kasih kepada seluruh mahasiswa Ilmu Komputer Penyelenggaraan Khusus angkatan 1, Sukma, Eka, Rico, Dimas, Weni dan teman-teman lainnya atas kebersamaan yang indah selama ini, dan kepada pimpinan PT. Jawa Soft, Ewan Makepeace, serta rekan-rekan sekerja yang selalu memberikan dukungan kepada penulis.

(7)

DAFTAR ISI Halaman DAFTAR ISI...iv DAFTAR TABEL ... v DAFTAR GAMBAR ... v DAFTAR LAMPIRAN ... v PENDAHULUAN... 1 Latar Belakang ... 1 Tujuan Penelitian... 1

Ruang Lingkup Penelitian ... 1

Manfaat Penelitian... 1 TINJAUAN PUSTAKA... 1 E-learning... 1 M-learning... 1 Perangkat Mobile... 1 User-Agent String... 2 WURFL... 2 CMS ... 2 PHP similar_text() Function... 3 METODE PENELITIAN ... 3 Analisis Sistem ... 3 Perancangan Sistem... 3 Implementasi Sistem ... 6 Pengujian Sistem ... 6

HASIL DAN PEMBAHASAN ... 7

Arsitektur Sistem ... 7

Implementasi Database Server... 7

Proses Pendeteksian Perangkat Klien... 7

Hasil Mesin Deteksi ... 8

Proses Adaptasi Layout ... 9

Hasil Mesin Adaptasi ... 9

Fungsionalitas CMS ... 10

Proses Pemeliharaan Repositori User-Agent ... 10

Hasil Pengujian... 11

KESIMPULAN DAN SARAN ... 12

Kesimpulan... 12

Saran... 13

(8)

v

DAFTAR TABEL

Halaman

Informasi user-agent yang terdapat pada Internet Explorer 8 ... 2

Rancangan tabel-tabel MySQL ... 4

Rancangan fungsionalitas CMS ... 5

Hasil implementasi MySQL... 7

Contoh user-agent klien ... 7

Contoh hasil penyaringan pada tabel wurfl ... 8

Contoh hasil penyaringan pada tabel user_agent_desktop ... 8

Contoh nilai kemiripan pada tabel wurfl ... 8

Contoh nilai kemiripan pada tabel user_agent_desktop ... 8

Contoh hasil perbandingan A dan B... 8

Kombinasi hasil mesin deteksi ... 8

Kelas-kelas yang digunakan pada proses adaptasi layout ... 9

Jenis-jenis perangkat mobile ... 11

Jenis-jenis perangkat desktop ... 12

DAFTAR GAMBAR Halaman Linear sequential model ... 3

Arsitektur sistem ... 3

Sub proses pendeteksian perangkat klien ... 4

Sub proses adaptasi layout ... 5

Sub proses pembaharuan repositori user-agent mobile ... 5

Sub proses pembaharuan repositori user-agent desktop... 6

Hasil adaptasi desktop pada browser Firefox ... 9

Hasil adaptasi mobile pada BlackBerry Storm ... 9

Hasil adaptasi desktop (CMS) pada browser Firefox... 10

Hasil adaptasi mobile (CMS) pada BlackBerry Storm... 10

Browser Google Chrome yang memeroleh adaptasi mobile ... 10

Browser Google Chrome yang memeroleh adaptasi desktop ... 10

Pesan yang ditampilkan setelah proses pengecekan update WURFL ... 11

Pesan yang ditampilkan setelah proses update WURFL berhasil ... 11

Rata-rata waktu deteksi perangkat mobile... 11

Rata-rata waktu adaptasi perangkat mobile ... 12

Rata-rata waktu deteksi perangkat desktop ... 12

Rata-rata waktu adaptasi perangkat desktop... 12

DAFTAR LAMPIRAN Halaman Jenis-jenis perangkat mobile yang digunakan pada uji adaptasi ... 14

Jenis-jenis perangkat desktop yang digunakan pada uji adaptasi ... 14

Hasil uji navigasi website KSB menggunakan browser Google Chrome ... 15

Hasil uji navigasi website KSB menggunakan Apple iPhone ... 16

Hasil uji navigasi CMS menggunakan browser Google Chrome... 17

(9)

PENDAHULUAN Latar Belakang

Dewasa ini perkembangan teknologi komunikasi dan informasi berkembang sangat pesat. Teknologi membuat segala aktifitas manusia menjadi lebih mudah, praktis dan cepat. Informasi dapat diperoleh dengan mudahnya melalui berbagai media salah satunya Internet. Melalui Internet tidak ada lagi batasan waktu, jarak dan tempat bagi manusia untuk mendapatkan informasi yang mereka butuhkan.

Kombinasi teknologi telekomunikasi dan Internet memungkinkan pengembangan sebuah sistem baru dalam pembelajaran yaitu mobile learning (m-learning). M-learning merupakan konsep pembelajaran secara mobile menggunakan perangkat mobile seperti PDA (Personal Digital Assistance) atau telepon selular yang memungkinkan adanya proses pembelajaran “kapanpun di manapun” (Krämer 2005).

Pada tahun 2008 seorang mahasiswi Ilmu Komputer Institut Pertanian Bogor, telah mengembangkan sebuah website m-learning yang berisikan pengetahuan dan informasi tentang ‘Kesehatan dan Tumbuh Kembang Anak’ dengan tujuan dapat bermanfaat bagi masyarakat dan pelajar, khususnya para pengguna perangkat mobile yang membutuhkan pembelajaran praktis tentang anak (Nursalamah 2008).

Akan tetapi masih terdapat beberapa kekurangan pada sistem tersebut seperti: masih terdapat kegagalan dalam pendeteksian perangkat klien, adaptasi hanya dilakukan pada halaman indeks, artikel website masih bersifat statis, tidak terdapat fasilitas untuk memerbarui sistem pendeteksian dan tidak terdapat CMS (Content Management System). Oleh sebab itu pada penelitian ini penulis mencoba untuk membangun sebuah sistem m-learning yang mampu mengatasi semua masalah tersebut.

Tujuan Penelitian

Penelitian ini bertujuan untuk mengimplementasikan WURFL (Wireless Universal Resource File) pada pembangunan m-learning dengan harapan semakin banyak jumlah perangkat klien yang dapat dideteksi dengan benar dan mengimplementasikan CMS untuk memberikan kemudahan dalam pengelolaan serta pemeliharaan sistem m-learning.

Ruang Lingkup Penelitian

Ruang lingkup penelitian ini adalah: 1 Adaptasi hanya dilakukan pada sisi server. 2 Adaptasi pada perangkat mobile tidak dirancang untuk sebuah perangkat tertentu melainkan dirancang sama untuk semua jenis dan ukuran perangkat moblie. 3 Perangkat mobile dan perangkat desktop

yang dimaksud haruslah memiliki browser dan koneksi Internet.

4 Nama domain dan alamat server bersifat sementara dan hanya bertujuan sebagai alat bantu dalam penelitian ini.

5 CMS hanya dirancang untuk mengelola artikel dan memerbarui repositori user-agent.

6 Algoritme fungsi similar_text() yang digunakan tidak menjadi topik bahasan khusus dalam penelitian ini.

Manfaat Penelitian

Hasil penelitian ini diharapkan dapat bermanfaat bagi penelitian selanjutnya untuk menghasilkan website m-learning yang paling efisien, terutama dalam metode pendeteksian perangkat klien. Selain itu hasil penelitian ini juga diharapkan dapat mendorong penyebaran pengetahuan tentang kesehatan dan tumbuh kembang anak kepada masyarakat luas.

TINJAUAN PUSTAKA E-learning

Electronic learning merupakan suatu jenis belajar mengajar yang memungkinkan tersampaikannya bahan ajar ke siswa dengan menggunakan media Internet, Intranet atau media jaringan komputer lain (Hartley 2001). M-learning

Mobile learning merupakan konsep pembelajaran secara mobile menggunakan perangkat mobile seperti PDA (Personal Digital Assistance) dan telepon selular yang memungkinkan adanya proses pembelajaran “kapanpun di manapun” (Krämer 2005). Pada implementasinya m-learning mengambil pembelajaran dari konten e-learning (Cobcroft 2006).

Perangkat Mobile

Perangkat mobile merupakan perangkat bergerak yang digunakan sebagai alat komunikasi dan komputasi seperti PDA (Personal Digital Assistance), smart phone

(10)

2

dan cell phone. Berbagai perangkat mobile ini

dibedakan berdasarkan spesifikasi perangkat keras dan perangkat lunaknya seperti prosesor, ukuran memori, screen resolution, sistem operasi, web browser, dan sebagainya (Georgieva & Georgiev 2007).

User-Agent String

User-agent string adalah program yang digunakan untuk mengidentifikasi diri ke HTTP (Hypertext Transfer Protocol), server mail dan berita, untuk penggunaan pelacakan dan tujuan lainnya (MSDN 2009). Ketika kita mengunjungi halaman web, browser akan mengirimkan user-agent string ke server hosting situs yang kita kunjungi. String ini menunjukkan jenis browser yang kita gunakan, sistem operasi yang digunakan dan lain sebagainya. Pada Tabel 1 dicantumkan penjelasan dari user-agent string berikut ini:

Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; .NET CLR 2.0.50727).

Tabel 1 Informasi user-agent yang terdapat pada Internet Explorer 8

Informasi Keterangan

Mozilla Secara historis Internet Explorer mengidentifikasikan dirinya sebagai browser Mozilla

4.0 Versi Mozilla

compatible Menunjukkan bahwa browser ini kompatibel dengan fitur umum yang ditetapkan MSIE 8.0 Nama browser dan versinya Windows

NT 5.1

Sistem operasi Windows XP

Trident Mesin (enggine) yang digunakan Internet Explorer 4.0 Versi mesin

.NET CLR 2.0.50727

Menggunakan .NET dan versinya

WURFL

Wireless Universal Resource File adalah database yang menyimpan kapabilitas-kapabilitas dari berbagai jenis perangkat mobile dalam bentuk XML (eXtensible Stylesheet Language). Kapabilitas tersebut dikumpulkan dalam beberapa grup seperti: product_info, display, image_format, sound_format dan lain sebagainya. Setiap grup menyimpan berbagai kapabilitas, seperti

pada grup product_info terdapat kapabilitas: brand_name, is_wireless_device, uaprof, device_os, mobile_browser dan lain sebagainya. Kapabilitas-kapabilitas tersebut memiliki nama yang unik dan selalu memiliki nilai. Nilai tersebut dapat direpresentasikan dengan menggunakan boolean, nomor atau string. Di bawah ini dapat dilihat contoh kapabilitas dari Sony Ericsson K770i yang terdapat pada WURFL:

Tujuan utama dari WURFL adalah untuk mengumpulkan sebanyak mungkin informasi mengenai semua perangkat mobile yang ada sehingga pengembang akan mampu membangun aplikasi dan layanan yang lebih baik bagi para pengguna. WURFL bersifat open-source dan dikelola sepenuhnya oleh Luca Passani dan beberapa kontributor lainnya. Tidak ada jaminan apapun bahwa setiap informasi yang terdapat pada WURFL adalah benar. Semua informasi diperoleh dengan mengumpulkan laporan dari pengguna dan pengembang di seluruh dunia (Passani 2008).

CMS

Content Management System adalah serangkaian pekerjaan dan proses untuk mengelola seluruh konten mulai dari pembuatan sampai pengarsipan konten tersebut. Dalam kenyataanya CMS adalah sebuah konsep daripada sebuah produk. Konsep ini meliputi sejumlah proses yang menjadi pondasi website untuk generasi berikutnya dimana penulis konten akan memiliki hak, kewajiban dan tanggung jawab yang lebih dari pembuat atau pengembangnya. Tujuan utama dari CMS adalah meningkatkan integrasi dan memberikan proses otomasisasi yang efisien untuk memberikan kontribusi penyebaran informasi dalam Internet (Burlaca 2003).

(11)

PHP similar_text() Function

Fungsi ini menghitung kesamaan di antara dua string seperti yang dijelaskan dalam Oliver [1993]. Perlu diketahui bahwa pelaksanaannya tidak menggunakan susunan pseudo kode seperti pada Oliver. Perhatikan juga bahwa kompleksitas dari algoritme ini adalah O (N ** 3) dimana N merupakan panjang dari simbol yang sama dan berurutan (Achour et al. 2009).

METODE PENELITIAN

Metode penelitian yang digunakan untuk pengembangan sistem ini mengacu pada metode pengembangan rekayasa perangkat lunak oleh Pressman yaitu linear sequential model (Pressman 2001). Tahapannya dapat dilihat pada Gambar1.

Perancangan Sistem Analisis Sistem

Implementasi Sistem

Pengujian Sistem

Gambar 1 Linear sequential model Pemilihan metode ini berdasarkan pertimbangan bahwa requirement dalam pembangunan m-learning sudah sangat jelas dan dipahami dengan baik.

Analisis Sistem

Pada tahap ini terlebih dahulu dilakukan analisis terhadap sistem sebelumnya dan dari hasil analisis tersebut akan dibangun sebuah sistem yang baru dengan spesifikasi sebagai berikut:

1 Sistem mampu mengenali perangkat klien berdasarkan kelompoknya yaitu kelompok perangkat mobile dan kelompok perangkat desktop.

2 Sistem mampu memberikan adaptasi layout yang sesuai dengan kelompok perangkatnya. Hasil adaptasinya adalah website m-learning untuk perangkat mobile dan website e-learning untuk perangkat desktop.

3 Menyediakan fasilitas CMS untuk memberikan kemudahan dalam pengelolaan artikel website.

4 Menyediakan fasilitas pemeliharaan repositori user-agent.

Berbeda dengan penelitian sebelumnya, penelitian ini menggunakan WURFL sebagai sumber data perangkat mobile sedangkan sumber data perangkat desktop akan diperoleh dari berbagai jenis browser desktop seperti Firefox, Internet Explorer, Opera, dan lain sebagainya. WURFL yang digunakan pada penelitian ini adalah WURFL 2.0.8 dengan tanggal update 16 Juli 2009. Adapun data artikel yang akan digunakan masih bersumber pada artikel website sebelumnya.

Perancangan Sistem

Sistem yang dibangun bertujuan agar dapat memberikan hasil adaptasi untuk perangkat mobile dan perangkat desktop. Arsitektur sistem yang akan dibangun dapat dilihat pada Gambar 2.

Server Mesin Deteksi Mesin Adaptasi Repositori User-Agent Jenis-jenis Template Repositori Artikel Client Browser _request response merging checking result

Gambar 2 Arsitektur sistem

Komponen inti dari arsitektur tersebut adalah mesin deteksi dan mesin adaptasi. Mesin deteksi bertujuan untuk mendeteksi perangkat klien berdasarkan repositori user-agent yang ada. Di lain pihak mesin adaptasi bertugas untuk memilih jenis template yang dibutuhkan dan menggabungkannya dengan repositori artikel. Kedua mesin tersebut diharapkan mampu menghasilkan adaptasi yang sesuai dengan perangkat klien.

Berdasarkan hasil analisis dan arsitektur sistem di atas, dibentuklah beberapa rancangan pembangunan sistem yang akan di

(12)

4

implementasikan. Secara umum

rancangan-rancangan tersebut adalah sebagai berikut: 1 Rancangan Arsitektur Sistem

Untuk menjalankan sistem diperlukan sebuah web server yaitu Apache HTTP Server. Web server tersebut bertanggung jawab untuk menerima dan melayani permintaan dari klien. Selain itu dibutuhkan juga sebuah database server untuk menyimpan data yang akan digunakan oleh sistem yaitu: data user-agent dan data artikel. 2 Rancangan Data

Berbeda dengan sistem sebelumnya yang tidak menggunakan database, pada penelitian ini sistem akan dibangun dengan sebuah database yaitu MySQL. MySQL terdiri atas server SQL, program klien untuk mengakses server, tools untuk administrasi, dan interface untuk menulis program. Pada Tabel 2 dapat dilihat rancangan tabel-tabel MySQL yang diperlukan dalam pembangunan sistem. Tabel 2 Rancangan tabel-tabel MySQL

Nama tabel Fungsi tabel

Content Menyimpan seluruh data artikel

Content_cate gories

Menyimpan data untuk kategori artikel

Wurfl Menyimpan user-agent dan beberapa kapabilitas perangkat mobile yang diperoleh dari WURFL Desktop_user

_agent

Menyimpan user-agent dari berbagai jenis browser desktop seperti: Firefox, Opera, Google Chrome dll

3 Rancangan Proses Pendeteksian Perangkat Klien

Pendeteksian perangkat klien dilakukan dengan cara mendeteksi user-agent yang terdapat pada HTTP header. Informasi tersebut diberikan oleh browser pada saat klien melakukan request ke server. Mesin deteksi akan mencocokkan informasi tersebut dengan user-agent yang terdapat pada repositori. Oleh sebab itu, repositori user-agent akan dibagi ke dalam 2 kelompok. yaitu: kelompok user-agent mobile dan kelompok user-agent desktop. Pengelompokan ini bertujuan agar mesin deteksi dapat membandingkan nilai kemiripan maksimum dari masing-masing kelompok. Pada tahap implementasinya mesin deteksi

akan menggunakan sebuah fungsi untuk menghitung nilai kemiripan di antara 2 buah kalimat (string). Rancangan sub proses pendeteksian perangkat klien dapat dilihat pada Gambar 3. User-Agent String Filtering Table Desktop_user_a gent Found? Cut The String Until

Found Symbol ‘/’

Calculate Similarity For All Records, Then Get The Maximum Value

Filtering Table Wurfl Found? Filtered User-Agent Filtered User-Agent A = X NO YES YES A = 0 NO Get Data A ≥ B? YES Start

Calculate Similarity For All Records, Then Get The Maximum Value

B = 0 B = Y NO C User-Agent Mobile User-Agent Desktop Get Data Get Data String For Filter Get Data Compare A & B Get Data

Gambar 3 Sub proses pendeteksian perangkat klien

4 Rancangan Proses Adaptasi Layout Oleh karena ukuran layar pada perangkat mobile jauh lebih kecil dibanding perangkat desktop maka tampilan website (design) juga harus disesuaikan dengan kedua perangkat tersebut. Adaptasi layout yang dimaksud adalah menyediakan 2 jenis template yang

(13)

berbeda yaitu: jenis desktop template dan jenis mobile template. Untuk memeroleh hasil adaptasi layout yang baik pada kedua jenis template, diterapkan aturan-aturan sebagai berikut:

• Mengubah DTD (Document Type Definition) pada HTML. Desktop template menggunakan DTD XHTML 1.0 Transitional, sedangkan pada mobile template menggunakan DTD XHTML Mobile 1.0.

• Menyesuaikan penggunaan CSS (Cascading Style Sheets) seperti mengubah pengunaan layout 2 kolom untuk desktop template menjadi layout 1 kolom untuk mobile template, penggunaan nilai padding yang berbeda dan lain sebagainya. • Meminimalkan penggunaan gambar pada mobile template seperti: icon dan banner yang dapat direpresentasikan dengan teks. Rancangan sub proses adaptasi layout dapat dilihat pada Gambar 4.

C Process Content Manager Is User-Agent Mobile? Load Mobile Template Load Desktop Template End YES NO Mobile Template Desktop Template Send Adoption to Client Browser Get Data

Gambar 4 Sub proses adaptasi layout 5 Rancangan CMS

Pada penelitian ini CMS dirancang untuk dapat menjalankan seluruh fitur-fitur CMS, baik pada perangkat mobile dan juga desktop. CMS bertujuan untuk memberikan kemudahan dalam pengelolaan artikel website. Pada CMS akan terdapat sebuah editor untuk memformat teks dan paragraf dengan baik.

Selain itu pada CMS juga akan diintegrasikan fasilitas pemeliharaan repositori user-agent. Pada Tabel 3 dapat dilihat rancangan fungsionalitas CMS.

Tabel 3 Rancangan fungsionalitas CMS

Fungsi Fitur-fitur yang tersedia Menambahkan artikel Mengedit artikel Menghapus artikel Pengolahan artikel website CMS Editor Mengecek dan memerbarui WURFL (user-agent mobile) Pemeliharaan repositori user-agent Menambahkan browser baru (user-agent desktop)

6 Rancangan Pemeliharaan Repositori User-Agent

Jenis dan jumlah perangkat mobile akan terus bertambah begitu juga dengan perangkat desktop dengan versi/jenis browser baru. Oleh sebab itu agar sistem dapat terus berjalan dengan baik, maka data yang terdapat pada repositori user-agent harus dapat terus diperbaharui. Rancangan proses pembaharuan repositori user-agent mobile dapat dilihat pada Gambar 5.

Gambar 5 Sub proses pembaharuan repositori user-agent mobile

(14)

6

Hal yang sama juga dilakukan untuk

repositori user-agent desktop akan tetapi, proses pembaharuannya akan dilakukan secara terpisah. Rancangan proses pembaharuan repositori user-agent desktop dapat dilihat pada Gambar 6.

Authentication Checking Is Login Page For Mobile? YES NO Username, Password & User-Agent Is True? Authentication Checking Is True? NO NO Is UA for Desktop? Home Page CMS YES YES NO YES Saving UA to Database C Content Adaptation Login Page Content Adaptation End Username & Password

Get Data Get Data

Gambar 6 Sub proses pembaharuan repositori user-agent desktop

Implementasi Sistem

Secara garis besar langkah-langkah yang akan dilakukan pada tahap implementasi sistem adalah:

1 Instalasi web server dan database server untuk dapat menjalankan sistem.

2 Membuat database beserta tabel-tabelnya. 3 Mengunduh WURFL dan melakukan

parsing dokumen XML (eXtensible Markup Language) ke dalam database. 4 Membuat desktop template dan mobile

template.

5 Membuat kode program sesuai dengan perancangan sistem.

Lingkungan implementasi yang digunakan adalah:

1 Perangkat keras: MacBook Pro 2.4 GHz, memori 4 GB dan hard disk 200 GB. 2 Perangkat lunak: OS X Leopard 10.5,

Windows XP SP3, MAMP 1.7, iPhone SDK 3.0, Android SDK 1.1, RIM BlackBerry 4.7.0, Windows Mobile SDK 6.0, Openwave Simulator 7.0, VirtualBox 2.2, FileZilla 3.2, Coda 1.6 dan Notepad++ 5.3.

Pengujian Sistem

Sistem akan diuji pada 24 jenis perangkat mobile, 6 jenis browser pada sistem operasi Windows, 5 jenis browser pada sistem operasi Mac OS dan 3 jenis browser pada sistem operasi Linux. Langkah-langkah pengujian yang akan dilakukan adalah sebagai berikut: 1 Uji adaptasi

Melakukan akses ke website dan CMS dengan beberapa perangkat mobile dan perangkat desktop, kemudian akan dilihat apakah hasil adaptasinya sesuai atau tidak. 2 Uji navigasi

Menguji navigasi untuk hasil adaptasi dekstop dan hasil adaptasi mobile, apakah seluruh navigasi berfungsi dengan baik atau tidak.

3 Uji kinerja

Mencatat waktu yang diperlukan oleh server untuk mendeteksi perangkat klien dan waktu yang dibutuhkan oleh server untuk melakukan proses adaptasi. Pengujian juga akan dilakukan terhadap CMS untuk melihat kinerja fungsionalitasnya.

(15)

HASIL DAN PEMBAHASAN Arsitektur Sistem

Aplikasi sistem yang telah dibangun bersumber pada beberapa teknologi perangkat lunak seperti berikut:

• HTML, sebagai program yang digunakan untuk pembuatan template website.

• CSS, sebagai presentasi (tampilan dan pemformatan) dari template website. • MySQL, sebagai program yang

digunakan dalam pembuatan database. • PHP, sebagai program yang digunakan

dalam pembuatan kinerja sistem. Hasil implementasi sistem ditempatkan pada jasa server berikut ini:

1 Server http://www.co.cc

Server ini sebagai jasa penyedia nama domain yang digunakan yaitu ksbweb.co.cc dengan batas masa hingga 10 Juni 2010.

2 Serverhttp://www.freehostia.com Server ini sebagai jasa penyedia web server dan database server. Batas masa aktifnya hingga 10 Juni 2010. Untuk dapat menjalankan sistem, konfigurasi web server yang harus dipenuhi adalah sebagai berikut:

• Dapat menjalankan skrip PHP yang ditulis menggunakan PHP 5.

• Tersedia fungsi-fungsi untuk pemrosesan XML.

• Dapat melakukan koneksi ke server WURFL.

• Tersedia fungsi-fungsi untuk pemrosesan berkas berbentuk ZIP. Implementasi Database Server

Sesuai dengan racangan tabel-tabel MySQL pada Tabel 2, hasil implementasinya dapat dilihat pada Tabel 4, dimana hasil tersebut adalah hasil pada saat pengujian. Tabel 4 Hasil implementasi MySQL

No Nama tabel Jumlah record

1 content 14

2 content_categories 3 3 desktop_user_agent 5

4 wurfl 3.931

Pada Tabel 4, baris ke 1 berisi data artikel website yang bersifat dinamis karena dapat diolah melalui CMS, sedangkan pada baris ke 2 berisi data kategori artikel yang bersifat statis karena pada CMS tidak diberikan fitur untuk mengolahnya. Kategori artikel hanya digunakan pada adaptasi desktop untuk memermudah navigasi sedangkan pada adaptasi mobile data tersebut tidak digunakan. Pada baris ke 3 dan baris ke 4 berisi data user-agent yang digunakan pada proses pendeteksian dimana keduanya dapat diperbaharui melalui fitur-fitur yang tersedia pada CMS.

Proses Pendeteksian Perangkat Klien WURFL menyediakan user-agent dari berbagai jenis perangkat mobile dalam jumlah yang sangat banyak, akan tetapi pada kenyataannya terdapat beberapa user-agent yang tidak sama dengan user-agent yang sesungguhnya. Oleh karena itu proses pendeteksian user-agent tersebut dilakukan dengan cara membandingkan nilai kemiripan antara user-agent klien dengan user-agent yang terdapat pada database server. Perhitungan tingkat kemiripan tersebut menggunakan fungsi yang telah tersedia pada PHP 5.

Dari hasil implementasi yang dilakukan, proses pendeteksian perangkat klien akan dijalankan oleh kelas DeviceManager.php. Kelas ini berfungsi sebagai mesin deteksi pada sistem. Berikut akan dijelaskan langkah-langkah proses pendeteksian perangkat klien.

Pada saat klien mengakses server, browser klien akan memberikan informasi user-agent melalui HTTP Header dan informasi tersebut akan diambil mesin deteksi.

Mula-mula mesin deteksi akan memotong user-agent tersebut dari simbol awal sampai menemukan simbol ‘/’. Contoh user-agent yang diperoleh dapat dilihat pada Tabel 5. Tabel 5 Contoh user-agent klien

ID User-agent klien

S Mozilla/5.0 (SymbianOS/9.1; U; en-us) AppleWebKit/413 (KHTML, like Gecko) Safari/413

Hasil pemotongannya adalah ‘Mozilla’. Selanjutnya hasil tersebut (string) akan digunakan untuk menyaring 2 jenis tabel yang terdapat pada database server yaitu: tabel wurfl dan tabel desktop_user_agent sehingga diperoleh beberapa user-agent yang kata

(16)

8

depannya sama dengan user-agent klien.

Proses ini bertujuan untuk membatasi jumlah user-agent yang akan dihitung tingkat kemiripannya. Berikut contoh hasil saringannya yang dapat dilihat pada Tabel 6 dan Tabel 7.

Tabel 6 Contoh hasil penyaringan pada tabel wurfl

ID User-agent mobile

M1 Mozilla/2.0 (compatible; MSIE 3.02; Windows CE; Smartphone; 176x220) M2 Mozilla/4.0 (compatible; MSIE 4.01;

Windows CE; PPC; 240x320) M3 Mozilla/4.0 (compatible; MSIE 6.0;

Windows CE; IEMobile 6.12) T-Mobile_Atlas M4 Mozilla/5.0 (SymbianOS/9.2; U; Series60/3.1 NokiaN81-1/1.00 Profile/MIDP-2.0 Configuration/CLDC-1.1) AppleWebKit/413 (KHTML, like Gecko) Safari/413 M5 Mozilla/SMB3(Z100)/Samsung Dst.. Keterangan:

Terdapat 372 hasil penyaringan dari 3931jumlah user-agent

Tabel 7 Contoh hasil penyaringan pada tabel user_agent_desktop

ID User-agent desktop

D1 Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10_5_7; en-us)

AppleWebKit/530.18 (KHTML, like Gecko) Version/4.0.1 Safari/530.18 D2 Mozilla/5.0 (Macintosh; U; Intel Mac

OS X; en; rv:1.8.1.22)

Gecko/20090615 Camino/1.6.8 (like Firefox/2.0.0.22)

D3 Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; .NET CLR 2.0.50727)

Keterangan:

Terdapat 3 hasil penyaringan dari 5 jumlah user-agent

Setelah hasil saringan diperoleh, langkah selanjutnya adalah menghitung tingkat kemiripannya, yaitu dengan membandingkan user-agent klien dengan user-agent hasil penyaringan di atas dan nilai tertinggi pada kedua tabel akan disimpan. Berikut contoh

hasil perhitungannya pada Tabel 8 dan Tabel 9.

Pada contoh kasus yang berbeda, jika tidak terdapat hasil saringan pada salah satu tabel di atas maka mesin deteksi akan memberi nilai 0 (A=0 atau B=0) dan jika tidak terdapat hasil saringan pada kedua tabel di atas maka keduanya sama-sama diberi nilai 0 (A=B=0). Tabel 8 Contoh nilai kemiripan pada tabel wurfl

Hitung Kemiripan (ID Tabel 5, ID Tabel 6) A (%) Hitung Kemiripan (S,M1) 25.00 Hitung Kemiripan (S,M2) 28.96 Hitung Kemiripan (S,M3) 21.25 Hitung Kemiripan (S,M4) 68.39 Hitung Kemiripan (S,M5) 23.63

Tabel 9 Contoh nilai kemiripan pada tabel user_agent_desktop

Hitung Kemiripan (ID Tabel 5, ID Tabel 7)

B (%)

Hitung Kemiripan (S,D1) 29.95 Hitung Kemiripan (S,D2) 24.61 Hitung Kemiripan (S,D3) 30.35

Dari hasil perhitungan di atas, nilai A maksimum dan B maksimum akan dibandingkan. Hasil dari perbandingan kedua nilai tersebutlah yang akan menentukan apakah user-agent klien adalah user-agent mobile atau user-agent desktop. Contohnya dapat dilihat pada Tabel 10.

Tabel 10 Contoh hasil perbandingan A dan B

A (%) B (%) Hasil Perbandingan 68.39 30.35 A > B A Hasil Mesin Deteksi

Melalui tahapan-tahapan proses di atas maka diperoleh beberapa kombinasi hasil mesin deteksi seperti pada Tabel 11.

Tabel 11 Kombinasi hasil mesin deteksi

A (%) B (%) Hasil Perbandingan 10 5 A > B A

5 10 A < B B 0 0 A = B A Jika hasil perbandingan yang diperoleh adalah ‘A’ maka mesin deteksi menyatakan

(17)

user-agent klien berasal dari perangkat mobile dan sebaliknya jika hasil perbandingan yang diperoleh adalah ‘B’ maka mesin deteksi menyatakan user-agent klien berasal dari perangkat desktop.

Proses Adaptasi Layout

Seperti pada perancangannya, sistem memiliki 2 jenis template yaitu mobile template dan desktop template. Kedua jenis template tersebut memiliki beberapa halaman HTML berdasarkan fungsinya seperti: halaman beranda, halaman arsip artikel dan lain sebagainya. Dari hasil implementasi yang dilakukan terdapat 9 halaman HTML untuk jenis mobile template dan 9 halaman HTML untuk jenis desktop template. Pada halaman HTML tersebut, di dalamnya terdapat sintak-sintak PHP untuk menempatkan konten/artikel yang diambil dari database. Konten yang diambil akan digabungkan dengan salah satu halaman HTML tersebut, dimana proses pemilihan halaman berdasarkan hasil mesin deteksi dan pengambilan konten berdasarkan alamat (link) yang diminta oleh klien. Proses-proses tersebut dikerjakan oleh 2 buah kelas yang dibangun dengan bahasa PHP. Fungsi masing-masing kelas dapat dilihat pada Tabel 12.

Tabel 12 Kelas-kelas yang digunakan pada proses adaptasi layout

Nama kelas Fungsi

Bertugas untuk mengambil (load) artikel, judul artikel dan kategori artikel Bertugas untuk menghapus (delete) artikel Content Manager.php Bertugas untuk menyimpan (save) artikel View.php Bertugas untuk

menggabungkan artikel dengan template dan memberikan hasil adaptasinya kepada server untuk dikirimkan kepada klien

Hasil Mesin Adaptasi

Setelah proses adaptasi layout selesai, server akan mengirimkan hasilnya melalui HTTP response kepada klien. Hasil adaptasi yang diterima oleh klien bergantung dari hasil mesin deteksi. Hanya terdapat 2 kemungkinan

hasil deteksi dan juga hasil adaptasinya. Jika hasil deteksi yang diperoleh adalah perangkat mobile maka sistem akan memberikan adaptasi mobile dan juga sebaliknya jika hasil deteksi yang diperoleh adalah perangkat desktop maka sistem akan memberikan adaptasi desktop.

Website yang dibangun diberi nama Kasih Sayang Bunda (KSB) dengan topik ‘Kesehatan dan Tumbuh Kembang Anak’. Pada Gambar 7 dapat dilihat hasil adaptasi layout untuk perangkat desktop menggunakan browser Firefox dan pada Gambar 8 dapat dilihat hasil adaptasi layout untuk perangkat mobile menggunakan BlackBerry Storm.

Gambar 7 Hasil adaptasi desktop pada browser Firefox

Gambar 8 Hasil adaptasi mobile pada BlackBerry Storm

Seperti halnya dengan website KSB, ketika klien mengakses alamat CMS, server terlebih

(18)

10

dahulu menjalankan proses pendeteksian

perangkat klien kemudian menjalankan sub proses adaptasinya. Pada Gambar 9 dapat dilihat hasil adaptasi layout CMS untuk perangskat desktop menggunakan browser Firefox dan pada Gambar 10 dapat dilihat hasil adaptasi layout CMS untuk perangkat mobile menggunakan BlackBerry Storm.

Gambar 9 Hasil adaptasi desktop (CMS) pada browser Firefox

Gambar 10 Hasil adaptasi mobile (CMS) pada BlackBerry Storm

Fungsionalitas CMS

Dari hasil implementasi yang dilakukan, CMS telah dapat berjalan sesuai dengan rancangan fungsionalitasnya. Pada halaman ‘Home’ akan ditampilkan 10 judul artikel terbaru berdasarkan tanggal pembuatannya dan terdapat pagging untuk melihat artikel-artikel sebelumya. Dengan mengklik judul artikel pengelola dapat mengedit atau menghapus artikel. Penambahan artikel dapat dilakukan melalui menu ‘New Article’ dimana pemformatan teks dan paragraf dilakukan dengan menggunakan tag-tag HTML tertentu seperti ‘<p>’ untuk paragraf, ‘<br>’ untuk baris baru dan lain sebagainya. Daftar dan contoh penggunaan tag-tag tersebut dapat

dilihat pada halaman ‘Tags’. Selain itu pada CMS terdapat juga menu ‘Check WURFL’ untuk mengecek dan memerbarui repositori WURFL.

Proses Pemeliharaan Repositori User-Agent 1 Proses Pemeliharaan User-Agent Desktop

Jika ditemukan perangkat desktop yang memeroleh hasil adaptasi mobile, maka pengelola dapat memerbaiki hasil adaptasinya melalui halaman login CMS. Pada Gambar 11 dapat dilihat browser Google Chrome yang memeroleh adaptasi mobile.

Gambar 11 Browser Google Chrome yang memeroleh adaptasi mobile

Pada Gambar 11, user-agent Google Chrome belum terdapat pada tabel user_agent_desktop sehingga server akan mendeteksinya sebagai perangkat mobile. Selanjutnya pengelola akan memilih opsi dari pertanyaan ‘Apakah Anda menggunakan perangkat desktop?’, dan apabila pengelola memilih pilihan ‘Benar’, maka bersamaan dengan proses autentikasi, user-agent tersebut akan ditambahkan ke dalam database dan untuk seterusnya browser Google Chrome akan mendapatkan hasil adaptasi desktop. Hasil dari penambahan user-agent tersebut dapat dilihat pada Gambar 12.

Gambar 12 Browser Google Chrome yang memeroleh adaptasi desktop

(19)

2. Proses Pemeliharaan User-Agent Mobile Adapun proses pembaharuan user-agent mobile (WURFL) dilakukan pada halaman ‘Home’ CMS. Pada awalnya pengelola akan mengecek apakah terdapat update atau tidak dengan mengklik menu ‘Check WURFL’ dan sistem akan memberikan pesan dari hasil pengecekannya. Pada Gambar 13 dapat dilihat hasil pengecekan yang dilakukan melalui perangkat mobile. Proses ini juga dapat dilakukan pada perangkat desktop.

Gambar 13 Pesan yang ditampilkan setelah proses pengecekan update WURFL Jika terdapat update, maka pengelola dapat melanjutkan prosesnya dengan mengklik link ‘Click Here’ pada pesan tersebut. Selanjutnya server akan mengunduh berkas wurfl-latest.zip dari server repositori WURFL hingga selesai, selanjutnya berkas tersebut akan diekstraksi untuk memeroleh wurfl.xml, kemudian tabel wurfl pada database server akan dihapus dan terakhir server akan melakukan parsing wurfl.xml ke dalam tabel tersebut. Pada Gambar 14 dapat dilihat pesan yang diberikan oleh sistem jika seluruh proses dapat dijalankan server dengan baik.

Gambar 14 Pesan yang ditampilkan setelah proses update WURFL berhasil Hasil Pengujian

Berikut beberapa hasil pengujian yang dilakukan terhadap sistem yang telah dibangun (website dan CMS):

1 Hasil Uji Adaptasi

Hasil uji adaptasi yang dilakukan terhadap 24 jenis perangkat mobile dan 14 jenis perangkat desktop seluruhnya berhasil. Hasil dan jenis-jenis perangkat yang diujikan dapat dilihat pada Lampiran 1.

2 Hasil Uji Navigasi

Hasil uji navigasi yang dilakukan terhadap Apple iPhone dan Google Chrome menunjukkan seluruh navigasi (link) berjalan dengan baik sesuai dengan fungsinya. Hasil pengujian navigasi website KSB dapat dilihat pada Lampiran 3 dan Lampiran 4 dan hasil pengujian navigasi CMS dapat dilihat pada Lampiran 5 dan Lampiran 6.

3 Hasil Uji Kinerja

Pada tahap ini ditambahkan skrip pada kode program sebagai stopwatch.

• Uji kinerja deteksi dan adaptasi

Pengujian ini dilakukan dengan mengakses website KSB, kemudian mengklik beberapa link secara acak sebanyak 8 kali dan hasilnya akan dicatat oleh server pada sebuah file. Pada Tabel 13 dan Tabel 14 dapat dilihat jenis-jenis perangkat yang diujikan.

Tabel 13 Jenis-jenis perangkat mobile No Jenis perangkat 1 Samsung D900 2 Samsung Omnia 3 Nokia 5300 4 SonyEricsson W810 5 SonyEricsson W660

Rata-rata waktu deteksi perangkat mobile adalah 0.00238909 detik dan waktu adaptasinya adalah 0.07887593 detik. Grafiknya dapat dilihat pada Gambar 15 dan Gambar 16.

Waktu Deteksi Rata-Rata

0.000 0.001 0.002 0.003 0.004 0.005 1 2 3 4 5

Jenis Perangkat Mobile

D e ti k a

Gambar 15 Rata-rata waktu deteksi perangkat mobile

(20)

12

Waktu Adaptasi Rata-Rata

0.00 0.02 0.04 0.06 0.08 0.10 1 2 3 4 5

Jenis Perangkat Mobile

D e ti k a

Gambar 16 Rata-rata waktu adaptasi perangkat mobile

Tabel 14 Jenis-jenis perangkat desktop No Jenis browser 1 Safari 4.0 2 Google Chrome 2.0 3 Internet Explorer 8.0 4 Opera 9.6 5 Firefox 3.5

Rata-rata waktu deteksi perangkat desktop adalah 0.03711168 detik dan waktu adaptasinya adalah 0.03242051 detik. Grafiknya dapat dilihat pada Gambar 17 dan Gambar 18.

Waktu Deteksi Rata-Rata

0.00 0.01 0.02 0.03 0.04 0.05 0.06 1 2 3 4 5

Jenis Perangkat Desktop

D e ti k a

Gambar 17 Rata-rata waktu deteksi perangkat desktop

Waktu Adaptasi Rata-Rata

0.00 0.01 0.02 0.03 0.04 0.05 1 2 3 4 5

Jenis Perangkat Desktop

D e ti k a

Gambar 18 Rata-rata waktu adaptasi perangkat desktop

• Uji kinerja CMS

Uji kinerja CMS dilakukan untuk melihat apakah terdapat perbedaan kinerja pada perangkat desktop dengan perangkat mobile. Adapun kinerja yang dimaksud adalah lamanya waktu yang dibutuhkan CMS untuk melakukan pemrosesan ke database server. Pada penelitian ini uji kinerja CMS dilakukan terhadap menu ‘New Article’ yaitu dengan mencatat waktu yang dibutuhkan web server untuk meyimpan artikel kedalam database server melalui masing-masing perangkat.

Dari hasil pengujian yang dilakukan terhadap fungsi menyimpan artikel, rata-rata waktu penyimpanan artikel melalui perangkat mobile adalah 0.000441988 detik dan rata-rata waktu penyimpanan artikel melalui perangkat desktop adalah 0.000502904 detik.

KESIMPULAN DAN SARAN Kesimpulan

Penggunaan WURFL untuk deteksi perangkat klien pada pembangunan m-learning dan e-m-learning memberikan manfaat yang sangat baik. Manfaat tersebut diperoleh bukan hanya dari penggunaan WURFL saja melainkan juga dari algoritme pemrosesan WURFL. Hal ini dilihat dari hasil uji adaptasi dimana seluruh perangkat mobile dan perangkat desktop yang diujikan memeroleh hasil adaptasi yang benar. Selain itu, pada Gambar 15 dan Gambar 17 dapat dilihat waktu deteksi rata-rata perangkat mobile (0.002 detik) jauh lebih cepat dibandingkan dengan waktu deteksi rata-rata perangkat desktop (0.04 detik) dan pada Gambar 16 dan Gambar 18 dapat dilihat proses adaptasi perangkat mobile (0.08 detik) sedikit lebih lambat dibandingkan dengan proses adaptasi perangkat desktop (0.03 detik). Akan tetapi, total waktu yang dibutuhkan server dalam menjalankan keseluruhan prosesnya tidak jauh berbeda (berselisih 0.01 detik). Hal ini membuktikan bahwa kinerja sistem berjalan dengan baik dan sama pada perangkat mobile dan perangkat desktop.

Implementasi CMS juga berhasil diterapkan, dimana artikel website dapat dikelola dengan mudah kapan saja dan dimana saja. Dari hasil waktu uji kinerja CMS dapat disimpulkan bahwa kinerja fungsionalitas CMS berjalan dengan baik dan sama pada kedua jenis perangkat.

(21)

Saran

1 Menambahkan fitur caching pada proses deteksi dan proses adaptasi.

2 Menambahkan fitur pada CMS Editor agar mampu memasukkan konten berupa gambar dari perangkat klien.

3 Menambahkan fitur agar CMS dapat mengolah artikel yang bersumber pada dokumen seperti: teks biasa dan Microsoft Word.

DAFTAR PUSTAKA

Achour M et al. 2009. PHP Manual. [terhubung berkala]. http://www.php.net/manual/en

Burlaca O. 2003. NeoSite: A simple Content Management. Computer Science Journal of Moldova.

Cobcroft R. 2006. Literature Review Into Mobile Learning In The University Context. Creative Industries Faculty, Queensland University Of Technology. Georgieva E, Georgiev T. 2007. Methodology for Mobile Device Characteristics Recognition. International Conference on Computer System and Technologies, CompSysTech’07.

Krämer BJ. 2005. Mobile Learning: The Next Generation of Learning FernUniversität’s Contributions to the 2nd Year of the Leonardo Project mlearn2. FernUniversität Hagen, Germany.

[MSDN Library]. Understanding User-Agent String. [terhubung berkala].

http://msdn.microsoft.com/en-us/library/ms537503(VS.85).aspx Nursalamah DA. 2008. Adaptasi E-Learning

Pada Sisi Server Untuk Aplikasi M-learning. Bogor: Departemen Ilmu Komputer, Institut Pertanian Bogor. Passani L. 2008. The Wireless Universal

Resource File. [terhubung berkala]. http://wurfl.sourceforge.net

Pressman R. 2001. Software Engineering: A Practitioner’s Approach. Ed ke-5. New York: McGraw-Hill

.

(22)

(23)

Lampiran 1 Jenis-jenis perangkat mobile yang digunakan pada uji adaptasi Resolusi layar (pixel) Jenis perangkat Hasil uji adaptasi

Nokia 3300 Mobile Nokia 6800 Mobile LG 3300 Mobile Motorola C390 Mobile Samsung SCH S179 Mobile 128x128

SonyEricsson Z300i Mobile Nokia 3110 Mobile Samsung SGH-C400 Mobile 128x160

SonyEricsson K508i Mobile Nokia 3600 Mobile 176x208 Nokia N70 Mobile BenQ S80 Mobile LG KG320 Mobile Siemens S81 Mobile SonyEricsson K530i Mobile 176x220

SonyEricsson W810i Mobile HP iPAQ HW6500 Mobile

Nokia N73 Mobile

O2 Xda Atom Mobile

Nokia N95 Mobile

240x320

SonyEricsson W910i Mobile 320x240 Nokia E61 Mobile 320x480 Apple iPhone Mobile 480x320 RIM BlackBerry 9000 Mobile

Lampiran 2 Jenis-jenis perangkat desktop yang digunakan pada uji adaptasi Sistem operasi Jenis browser Hasil uji adaptasi

MSIE 8.0 Desktop

Google Chrome 2.0 Desktop Firefox 3.5 Desktop Opera 9.6 Desktop Maxthon 2.5 Desktop Windows XP Lunascape 5.0 Desktop Safari 4.0 Desktop Camino 1.6 Desktop Netscape 9.0 Desktop Shiira 2.2 Desktop OS X Leopard Seamonkey 1.1 Desktop Konqueror Desktop Galeon Desktop Linux Ubuntu NetSurf 2.1 Desktop

(24)

15

Lampiran 3 Hasil uji navigasi website KSB menggunakan browser Google Chrome

Halaman Posisi Link Status

Arsip Artikel Ok

Header

Tentang Kami Ok

Body -- Tidak ada

Kategori Artikel Ok Sidebar

Form Cari Ok

Beranda

Beranda Ok Header Tentang Kami Ok Judul Artikel Ok Body Paging Ok Arsip Artikel

Beranda Ok Arsip Artikel Ok Header Tentang Kami Ok Body Breadcrumb Ok Judul Artikel Ok Kategori Artikel Ok Sidebar Form Cari Ok Isi Artikel

Beranda Ok Header Tentang Kami Ok Judul Artikel Ok Body Paging Ok Hasil Pencarian *

Beranda Ok

Header

Arsip Artikel Ok

Body -- Tidak ada

Tentang Kami

Keterangan:

* Hasil pencarian ditampilkan pada halaman Arsip Artikel -- Tidak terdapat link pada posisi tersebut

(25)

Lampiran 4 Hasil uji navigasi website KSB menggunakan Apple iPhone

Artikel Ok Header Cari Ok Ke Atas Ok Body Form Cari Ok Beranda

Beranda Ok Header Cari Ok Judul Artikel Ok Paging Ok Body Form Cari Ok Artikel

Beranda Ok Artikel Ok Header Cari Ok Kembali Ok Breadcrumb Ok Ke Atas Ok Body Form Cari Ok Isi Artikel

Beranda Ok Header Cari Ok Judul Artikel Ok Paging Ok Body Form Cari Ok Hasil Pencarian *

Beranda Ok

Artikel Ok

Header

Cari Ok

Body -- Tidak ada

Tentang Kami

Keterangan:

* Hasil pencarian ditampilkan pada halaman Artikel -- Tidak terdapat link pada posisi tersebut

(26)

17

Lampiran 5 Hasil uji navigasi CMS menggunakan browser Google Chrome

Header KSB Home Page Ok Login

Body Form Login Ok

New Article Ok Tags Ok View Site Ok Check WURFL Ok Header Log Out Ok Judul Artikel Ok Home Body Paging Ok Home Ok New Article Ok Tags Ok View Site Ok Header Log Out Ok Button Delete Ok Edit/Delete Article Body Button Save Ok Home Ok Tags Ok View Site Ok Header Log Out Ok New Article

Body Button Save Ok

Home Ok New Article Ok View Site Ok Header Log Out Ok Tags

Body -- Tidak ada

Keterangan:

(27)

Lampiran 6 Hasil uji navigasi CMS menggunakan Apple iPhone

Header - Tidak ada

Form Login Ok Login Body Radio Buttons Ok New Article Ok Tags Ok View Site Ok Check WURFL Ok Header Log Out Ok Judul Artikel Ok Home Body Paging Ok Home Ok New Article Ok Tags Ok View Site Ok Header Log Out Ok Button Delete Ok Edit/Delete Article Body Button Save Ok Home Ok Tags Ok View Site Ok Header Log Out Ok New Article

Body Button Save Ok

Home Ok New Article Ok View Site Ok Header Log Out Ok Tags

Body - Tidak ada

Keterangan: