Perancangan dan Implementasi HTML 5 Dalam Media

Pembelajaran Bahasa Arab

Artikel Ilmiah

Diajukan kepada

Fakultas Teknologi Informasi

untuk memperoleh Gelar Sarjana Komputer

Oleh:

Ihsan Ardiyan Syahfrudin

NIM: 672010074

Program Studi Teknik Informatika

Fakultas Teknologi Informasi

Universitas Kristen Satya Wacana

Salatiga

Januari 2015

Perancangan dan Implementasi HTML 5 Dalam Media

Pembelajaran Bahasa Arab

1) Ihsan Ardiyan Syahfrudin, 2) Christ Rudianto, 3) Dharmaputra

Taludangga Palekahelu

Fakultas Teknologi Informasi

Universitas Kristen Satya Wacana

Jl. Diponegoro 52-60, Salatiga 50771, Indonesia

Email: 1) xrudianto@yahoo.com, 2) dpalekahelu@yahoo.com, 3)

Ihsan.ardiyan@gmail.com

Abstract The development of technology todays especially technology website has been very

rapid the example is HyperText Markup Language 5 or known by the name of HTML 5.

HTML 5 is a markup language for structuring and presenting content on the World Wide

Web, which is a core technology of the Internet. Learning using the internet media is one

of the examples of applications that can be created using HTML 5. In this study, quizzes,

interactive learning video also used as a means of learning pronunciation and

conversational Arabic. The results of the application of learning in the form of HTML 5

video media and interactive quiz. With the use of these technologies, it can be concluded

that the use of HTML 5 in addition to useful technology to support learning and

interactive quizzes are also useful as a substitute for the function of most of the plugin.

Key words : HTML 5,pembelajaran, bahasa arab

Perkembangan teknologi dewasa ini terutama teknologi website sudah sangatlah

pesat salah satu contohnya adalah HyperText Markup Language 5 atau yang sering

dikenal dengan nama HTML 5. HTML 5 merupakan sebuah bahasa markah untuk

menstrukturkan dan menampilkan isi dari World Wide Web, yaitu sebuah teknologi inti

dari Internet. Media pembelajaran dengan menggunakan internet merupakan salah satu

contoh aplikasi yang dapat dibuat dengan menggunakan HTML 5. Dalam penelitian ini

kuis pembelajaran interaktif dan juga video digunakan sebagai sarana pembelajaran

pelafalan dan percakapan bahasa arab. Hasil dari pengaplikasian HTML 5 berupa

pembelajaran dengan media video dan kuis interaktif. Dengan penggunaan teknologi

tersebut maka dapat disimpulkan bahwa penggunaan teknologi HTML 5 selain berguna

sebagai penunjang pembelajaran dan kuis interaktif juga berguna sebagai pengganti

fungsi sebagian plugin.

Kata kunci : HTML 5, pembelajaran, bahasa arab

1) Mahasiswa Fakultas Teknologi Informasi Jurusan Teknik Informatika, Universitas Kristen Satya

Wacana Salatiga. 2) Staff Pengajar Fakultas Teknologi Informasi, Universitas Kristen Satya Wacana Salatiga. 3) Dekan Fakultas Teknologi Informasi, Universitas Kristen Satya Wacana Salatiga.

1. Pendahuluan

Perkembangan teknologi informasi saat ini mulai mendapat sambutan

positif dari masyarakat. Informasi yang terintegrasi, cepat, dan akurat semakin

penting dalam mendukung untuk berbagai jenis kegiatan dan tidak terkecuali

untuk pembelajaran. Belajar adalah suatu bentuk kegiatan yang kompleks yang di

tunjukkan pada hasil pembelajaran perubahan dari belum tahu menjadi lebih tahu.

Hal ini tampak pada diri seseorang dimana dia belajar maka responnya akan

menjadi lebih baik daripada dia tidak belajar. Salah satu media informasi yang

menyediakan itu semua adalah melalui media website. Hal ini diperkuat dari hasil

survei yang dilakukan sebelumnya, yang menyebutkan bahwa rata rata responden

tertarik belajar menggunakan media website di internet.

Bahasa Arab merupakan bahasa yang digunakan di kitab suci agama

Islam, bahasa komunikasi dan informasi umat Islam. Dalam fase

perkembangannya, yakni pada tahun 1973, bahasa arab telah dijadikan sebagai

bahasa resmi dalam lingkungan Perserikatan Bangsa-bangsa (PBB) yang

sekaligus meningkatkan kedudukan bahasa Arab itu sendiri. Sebab itulah tidak

berlebihan jika pengajaran bahasa Arab sekarang ini perlu mendapatkan

penekanan dan perhatian seksama, mulai dari tingkat dasar sampai pada lembaga

pendidikan tinggi, baik negeri maupun swasta, umum maupun agama, untuk

digalakkan dan diajarkan. Dalam pengajarannya tentunya harus disesuaikan

dengan taraf kemampuan dan perkembangan siswa. Pada umumnya metode

pengajaran pelajaran bahasa arab dilakukan dengan metode ceramah. Metode

ceramah adalah penerangan secara lisan atas bahan pembelajaran kepada

sekelompok pendengar untuk mencapai tujuan tertentu dalam jumlah yang

relative besar. Bahasa Arab sendiri mempunyai beberapa kesulitan diantaranya

tulisan, dan pelafalan atau cara baca.Pendapat tersebut juga diperkuat dari

keterangan siswa dan juga guru yang menyatakan bahwa memang terdapat

beberapa kesulitan dalam pembelajaran bahasa arab tersebut diantarannya yaitu

penulisan, dan pelafalan karena dalam standart kompetensi yang diharpkan yaitu

siswa mampu memahami dan menerapkan materi yang ada pada mata pelajaran

bahasa arab. Berdasarkan alas an tersebut maka ditemukan pilihan alternative

untuk pembelajaran bahasa arab salah satunya dengan memanfaatkan media

internet.

Banyak alasan mengapa internet dipilih sebagai sarana belajar salah

satunya karena memungkinkan user dapat memberikan pemaham yang lebih

terhadapa sesuatu yang sedang dibahas[1]. Alasan lain yang menjadi sebab

mengapa internet dijadikan sebagai media pembelajaran adalah mutimedia.

Musik, game, gambar merupakan salah satu metode dalam pembelajaran agar

para pengguna lebih tertarik untuk mempelajari suatu hal. Selain hal tersebut

interface juga menjadi faktor penting yang digunakan dalam menarik keinginan

pengguna untuk menggunakan sebuah website.

Sebagai media pembelajaran tentunya dituntut dengan interface dan

mutimedia yang mendukung karena hal tersebut sangat diperlukan sebagai

pendukung media pembelajaran. Sebuah pilihan menarik ketika HTML 5 atau

HyperText Markup Language 5 muncul. HTML 5 merupakan salah satu teknologi

yang mendukung terhadap fungsi fungsi multimedia yang dibutuhkan para

pengembang website agar dapat membuat aplikasi multimedia tanpa tergantung

sepenuhnya dengan plugin dikarenakan sudah banyaknya fitur fitur dari plugin

yang sudah terdapat di dalam HTML 5.

Dengan adanya teknologi HTML 5 muncul keinginan mengaplikasikan

teknologi HTML 5 ke dalam media pembelajaran bahasa arab yang nantinya

teknologi tersebut berguna untuk membantu dalam proses pembelajaran

khususnya untuk menyelesaikan masalah dalam pembelajaran yang sering

dikeluhkan oleh siswa. Dalam hal ini untuk acuan pembuatan media pembelajaran

yang akan dibuat adalah dengan mengambil acuan materi pembelajaran bahasa

arab yang digunakan oleh SMP Islam Al - Azhar 18 Salatiga.

2. Tinjauan Pustaka

Sudah banyak contoh penelitian tentang pemanfaatan teknologi HTML 5 atau

HyperText Markup Language 5 diantarannya seperti pembuatan run and jump

game menggunakan HTML5 canvas oleh Ainurrofiq Alfaiz pada penelitian

tersebut dijelaskan bahwa canvas yang dimiliki HTML 5 dapat digunakan

sebagai media pembuatan game yang bertujuan untuk mengasah keterampilan

dan refleks anak [2]. Pemanfaatan HTML 5 lainnya yaitu implementasi media

pembelajaran interaktif sekolah dasar kelas 5 IPA dan IPS menggunakan HTML

5 oleh Sunardy Iwan Sahputra Sinurat pada pengaplikasian tersebut didaptkan

hasil bahwa penggunaan HTML 5 sebagai pendukung media pembelajaran dapat

diterima oleh sebagian besar siswa [3]. Implentasi game edukasi untuk media

pembelajaran matematika berbasis HTML 5 pada web browser oleh

Mukhammad Bagus Muslim adalah penelitian ketiga yang menggunakan HTML

5, dari penelitian tersebut didaptkan hasil bahwa dengan menggunakan fitur

multimedia dapat meningkatkan minat siswa terhadap satu pelajaran [4] .

Penggunaan HTML 5 pada ketiga penelitian tersebut dapat membuktikan bahawa

penggunaan multimedia dalam media pembelajaran dapat membantu dalam

proses belajar selain itu multimedia juga dapat meningkatkan minat siswa

terhadap satu mata pelajaran.HTML5 merupakan sebuah bahasa markah untuk

menstrukturkan dan menampilkan isi dari World Wide Web, sebuah teknologi inti

dari Internet. Tujuan utama pengembangan HTML5 adalah untuk memperbaiki

teknologi HTML agar mendukung teknologi multimedia terbaru. HTML 5

memiliki penambahan pemanambahan fitur diantaranya :

- Dukungan yang lebih baik untuk penyimpanan secara offline

- Elemen konten yang lebih spesifik, seperti artikel, footer, header,

navigation, dan section

- Bentuk kontrol form seperti kalender, tanggal, waktu, email, url, search.

Adapun kelebihan HTML5 sendiri adalah :

- Dapat ditulis dalam sintaks HTML (dengan tipe media text/HTML) dan XML.

- Integrasi yang lebih baik dengan aplikasi situs dan pemrosesannya. [5]

CSS atau Cascading Style Sheets adalah: kumpulan kode-kode yang berurutan

dan saling berhubungan untuk mengatur format / tampilan tata letak sebuah

halaman web. CSS ini bersifat embeded pada tag HTML yang artinya menempel

atau melekat pada tag HTML. CSS3 merpukan generasi ke-3 dari perkembangan

CSS sebelumnya. Jadi pada dasarnya, pengertian CSS3 sama saja dengan

pengertian CSS generasi paling awal. Hanya saja terdapat beberapa standar baru

untuk CSS3 menggantikan CSS2.[6]

3. Metode dan Perancangan Penelitian yang dilakukan, diselesaikan melalui tahapan penelitian yang

terbagi dalam empat tahapan, yaitu Tahap Identifikasi Masalah dan Pengumpulan

Data, Perancangan Sistem, Implementasi Sistem Pengujian serta analisis hasil

pengujian.

Gambar 2 Tahapan Penelitian

Gambar 2 menjelaskan tentang tahapan penelitian, tahap pertama yaitu

identifikasi masalah dan pengumpulan data. Pada tahap ini dilakukan proses

pengidentifikasian masalah yaitu, membuat alternative pembelajaran bahasa arab

menggunakan media website untuk kemudian dilakukan proses pengumpulan data

yang berhubungan dengan masalah pembuatan media pembelajaran bahasa arab

menggunakan HTML 5. Selanjutnya adalah tahap kedua dimana dilakukan proses

perancangan sistem yang nantinya akan diterapkan pada permasalahan yang ada.

Langkah ketiga merupakan implementasi HTML 5 pada masalah yang sudah

ditentukan. Langkah terakir dalam penyelesaian penelitian ini adalah pengujian

serta analisis hasil pengujian yang ditujukan untuk mengetahui hasil dari

perancangan aplikasi pembelajaran bahasa arab dengan menggunakan HTML 5

ini setelah diterapkan pada permasalahan tersebut.

Identifikasi masalah dan pengumpulan data

Perancangan Sistem

Implementasi Sistem

Pengujian Sistem

Metode pengembangan sistem yang akan digunakan dalam penelitian ini

adalah prototyping model. Prototyping model merupakan sebuah proses untuk

membangun sebuah model dari sebuah sistem berdasarkan dari kebutuhan user,

dengan kondisi user tidak memberikan detail input, proses dan detail output.

Bagan prototype dapat dilihat pada Gambar 1.

Gambar 3 Model Prototyping [7].

Prototyping melewati tiga proses, yaitu pengumpulan kebutuhan,

perancangan, dan evaluasi Prototype. Pada tahap pengumpulan kebutuhan

digunakan beberapa teknik dalam pengumpulan data diantarannya yaitu

wawancara, angket (kuesioner) dan dokumen. Pada proses pengumpulan

kebutuhan Metode pengumpulan data yang dilakukan dalam penelitian ini yaitu

menggunakan sumber data primer dan sumber data sekunder, berikut

penjelasannya :

1. Sumber Data Primer

Data primer adalah data yang di kumpulkan oleh penulis secara langsung

melalui objek penelitian, yaitu dengan cara observasi dan wawancara

a. Observasi, adalah suatu cara untuk mengumpulkan data dengan melakukan

penelitian secara langsung datang ke SMP Islam Al Azhar, Kemudian

setelah selesai proses pengamatan maka dilakukan pembagian angket

untuk mengetahui perbedaan kesimpulan oleh pengumpul dan siswa.

b. Wawancara, adalah suatu cara pengumpulan data secara langsung antara

pengumpul data dengan beberapa siswa dan guru, proses ini digunakan

sebagai pembuat rancangan aplikasi sementara.

2. Sumber Data Sekunder

Pada kasus ini hasil data sekunder yaitu berupa dokumen yang digunakan

oleh SMP Islam Al Azhar 18 Salatiga.

Pada proses perancangan membutuhkan kode program HTML5 dan CSS 3

kode program ini ditujukan untuk pembuatan desain user interface dan

multimedia yang ditujukan kepada siswa dan juga digunakan sebagai pengganti

plugin. Hasilnya berupa animasi dalam pergantian halaman dan juga

memunculkan video tanpa plugin player namun dengan menggunakan player

default dari HTML 5. Setelah kebutuhan sistem terkumpul, maka mulai

dirancang prototype sistem. pada tahap ini dilakukan pembuatan prototype desain

aplikasi website pembelajaran. perancangan ini ditujukan pada pengguna aplikasi

yaitu siswa. Perancangan desain apikasi website ini masih dibuat dalam bentuk

yang sederhana. Dasar dari pembuatan prototype tahap kedua ini berasal dari

kekurangan prototype tahap pertama yaitu belum dibuatnya bentuk desain

aplikasi website. Sedangkan kekurangan pada prototype tahap kedua yaitu belum

ada implementasi fungsi-fungsi dari tiap bagian desain akan diperbaiki pada

prototype tahap ketiga. Perancangan dilakukan cepat dan rancangan mewakili

semua aspek sistem yang diketahui, dan rancangan ini menjadi dasar pembuatan

prototype. Evaluasi Prototype merupakan proses terakhir dimana proses ini

Kustomer melakukan evaluasi prototype dengan cara mengulang proses satu

sampai dengan tiga yang sudah dibuat dan digunakan untuk memperjelas

kebutuhan software. Perulangan dari ketiga proses tadi dilakukan terus menerus

hingga semua kebutuhan terpenuhi. Perancangan sistem pada penelitian ini

dibuat dengan menggunakan Data Flow Diagram (DFD) yang merupakan alat

pembuatan model yang memberikan penekanan hanya pada fungsi sistem. Data

flow diagram ini merupakan alat perancangan sistem yang berorientasi pada alur

data dengan konsep dekomposisi dapat digunakan untuk penggambaran analisa

maupun rancangan[8].

Gambar 4 DFD (data flow diagram) level 0

Gambar 4 menjelaskan tentang DFD level 0, aplikasi pembelajaran bahasa

arab sendiri mempunyai dua user yaitu siswa dan admin, pada Gambar 4

dijelaskan secara keseluruhan konsep aplikasi yang akan dibuat [9]. Dimana

siswa melakukan request system pembelajaran dengan cara membuka aplikasi

yang sudah dibuat, kemudian aplikasi memberikan dua menu yang bisa

digunakan sebagai pembelajaran yaitu materi dan kuis, siswa dapat mempelajari

materi kemudian juga dapat mengerjakan kuis sebagai salah satu cara pengukur

tingkat keberhasilan pembelajaran. Kemudian admin atau guru pada sisi admin,

admin dapat melakukan request data kemudian direspon dengan memberikan

data yaitu data materi dan data kuis. Admin dapat mengolah data materi dan juga

data kuis dengan memasukan, mengupdate, dan menghapus data. Proses tersebut

direspon aplikasi dengan memberikan view data materi dan juga data kuis.

Gambar 5 DFD (data flow diagram) materi level 1

Gambar 5 menjelaskan tentang DFD dari sub menu pembelajaran bahasa

arab pada level satu. Gambar 5 menjelaskan tentang konsep relasi pada proses

materi, evaluasi, database dan juga user, dimana semua proses ini saling

berketautan antara satu dan yang lainnya. Pertama siswa dapat request data

materi dan direspon dengan menmpilkan data materi yang selanjutnya dapat

dipelajari oleh siswa. Sedangkan dari admin, admin dapat request data materi

yang kemudian direspon dengan pemberian data materi dan data evaluasi yang

kemudian bisa diolah dengan memasukan, meng-update, dan juga menghapus

data di tampilkan hasilnya sebagai respon berupam view data.

Gambar 6 DFD (data flow diagram) kuis level 1

Gambar 6 menjelaskan tentang DFD dari kuis yang merupakan sub menu

pembelajaran bahasa arab pada level satu. Gambar 6 menjelaskan proses relasi

antara kuis, dan juga user. Terdapat dua user pada pembelajaran bahasa arab ini

yaitu siswa dan admin / guru. Siswa dapat melakukan request data ke kuis dan

direspon dengan menampilkan data kuis yang dilanjutkan dengan penyelesaian

kuis, sedangkan untuk admin dapat melakukan data kemudian ditampilkan semua

data kuis yang ada dimana nantinya admin melakukan olah data kuis dan nanti

hasilnya akan ditampilkan melalui view data kuis.

Gambar 7 Relation Tabel

Gambar 7 merupakan hubungan atar tabel yang digunakan dalam

aplikasi ini. Tbkelas atau tabel kelas mempunyai dua entity didalamnya yaitu

id_kelas sebagai primary key dan nama_kelas, kemudian ada tbkuis yang

didalamnya memiliki sembilan entity yaitu id_kuis sebagai primary key,

id_kelas sebagai foreign key, pertanyaan, name, jawaban_1, jawaban_2,

jawaban_3, jawaban_4 dan kunci. Sedangkan tbmateri memiliki id_materi

sebagai primary key, id_kelas sebagai foreign key, nama_materi, mater,

url_gambar dan name. Tbsoal mempunyai delapan entity diantaranya adalah

id_soal yang merupakan primary key, nama_materi sebagai foreign key,

pertanyaan, j1, j2, j3, j4, dan kunci. Tabel terakhir yaitu tblogin, tblogin

mempunyai tiga entity yaitu id_user sebagai primary key, username, dan

password.

Gambar 8 Entitiy Relationship

Gambar 8 menjelaskan tentang entity relationship[10]. Pada aplikasi ini

terdiri lima proses yaitu kuis, kelas, materi, soal, dan login. Kuis, kelas, materi

dan soal saling berhubungan, kuis dipilih berdasarkan pada kelas, kemudian setiap

kelas mempunyai kategori materi, dan dari materi yang ada menjadi soal.

4. Hasil dan Pembahasan

Pemilihan kelas terdapat pada halaman utama, pada pemilihan kelas nantinya

digunakan sebagai kriteria sebelum masuk ke sub menu yang ada, contohnya jika

ingin memilih kuis, maka langkah pertama adalah memilih kelas kemudian akan

ditampilkan pertanyaan sesuai dengan kelas yang dipilih sebelumnya, proses

yang sama ketika ingin memilih materi, setelah pemilihan kelas maka akan

ditampilkan materi sesuai dengan kelas masing masing seperti yang ditunjukan

pada Gambar 9.

Gambar 9 Pemilihan Kelas

Gambar 9 merupakan tampilan saat pemilihan kelas sebelum masuk ke materi,

terdapat tiga kelas yang ada dalam applikasi ini yaitu kelas tujuh, delapan, dan

sembilan. Setelah pemilihan kelas maka muncul proses pemilihan kategori materi

sesuai dengan kelas, proses pemilihan kategori seperti pada kode program 2

Kode Program 1 Perintah untuk Pemilihan kategori materi sesuai dengan kelas

Kode Program 1 menjelaskan pemanggilan kategori materi sesuai dengan

kelas, pengambilan data kategori materi ini kemudian ditampilkan di halaman

baru bernama detail. Proses setelah pemilihan kategori materi adalah

menampilkan materi yang ada.berikut adalah perintah untuk mengambil data

materi dari database.Tampilan pada saat pemilihan kategori materi dapat dilihat

di Gambar10.

1.echo"<a href='Dtl.php?id_materi=".$row['id_materi'].

2."' target='_blank'>Detail</a>";

Gambar 10 Kategori Materi

Setelah memilih materi maka akan dimunculkan isi dari materi yang sudah

dipilih dan pada kode program 2 dijelaskan tentang bagaimana memilih materi

sesuai dengan kategori materi yang telah dipilih, dan Gambar 11 adalah

tampilan saaat materi dimunculkan.

Kode Program 2 Perintah menampilkan isi materi

Gambar 11 Isi dari Materi yang Dipilih

1.echo"<div><h4>".$nama_materi."</h4></div>";

2.echo"<a href='#'>

3.<img src='admin/gmb/".$name."' alt='' width='53' height='65' /></a>";

4.echo"</div>";

5.echo"<div class='produk1'>";

6.echo"<table>";

7.echo"<tr>

8.<td>".$id_kelas."</td>

9.</tr>";

10.echo"<tr>

11.<td>".$materi."</td>

12.</tr>";

Gambar 12 Evaluasi Materi

Gambar 12 merupakan tampilan saat evaluasi dijalnkan, evaluasi ini adalah

proses setalah melakukan pembelajaran dengan melihat materi yang sudah

ditampilkan sebelumnya.

Gambar 13 Tampilan Kuis

Gambar 13 adalah tampilan kuis setipa kelas, pada kuis tersebut berisi

pertanyaan dari setiap kategori berdasarkan kelas.

Gambar 14 Penggunaan Video pada Aplikasi Pembelajaran

Gambar 14 merupakan tampilan video yang terdapat pada halaman awal

applikas, video tersebut digunakan sebagai penungjang proses pembelajaran

.Terdapat beberapa proses perubahan selama proses pembuatan aplikasi ini

salahsatunya adalah tampilan aplikasi yang dapat dilihat pada Gambar 15,

Gambar 16, dan juga Gambar 17. Gambar 15 merupakan tampilan pertama kali

namun karena dirasa kurang cocok maka tampilan pun berubah menjadi seperti

Gambar 16. Gambar 17 merupakan hasil akhir dari tampilan yang digunakan

dalam aplikasi.

Gambar 15 Tampilan Pertama

Gambar 16 Tampilan Setelah Revisi Pertama

Gambar 17 Tampilan Final Setelah Revisi Kedua

Pengujian aplikasi dilakukan untuk menguji fungsi-fungsi aplikasi hasil

implementasi arsitektur dengan melihat DFD atau data flow diagram. Pengujian

aplikasi menggunakan teknik black box, yaitu pengujian fungsional tanpa melihat

alur eksekusi program, namun cukup dengan memperhatikan apakah setiap

fungsi sudah berjalan dengan baik sesuai dengan yang diharapkan. Hal yang diuji

dan hasil pengujian dapat dilihat pada Tabel 1.

Tabel 1. Hasil Pengujian Fungsionalitas Program Menggunakan Black Box

No Point Validasi

Input

Data

Input

Hasil

Uji

Status

Uji

1 Pelajari

materi

Data

materi

Kelas dan

kategori

Sistem akan menampilkan

materi sesuai kelas dan

kategori

Valid

2. Menyeles

aikan

Evaluasi

Data soal Jawaban

soal

Sistem akan menampilkan

soal evaluasi dan hasil

Valid

3 Menyeles

aikan

Kuis

Data kuis Kelas dan

jawaban

kuis

Sistem akan menampilkan

kuis dan hasil kuis

Valid

4 Lihat

materi

Data

Materi

Data materi Sistem akan menampilkan

materi

Valid

5 Lihat kuis Data

Pertanyaa

n kuis

Data

Pertanyaan

kuis

Sistem akan menampilkan

pertanyaan kuis

Valid

6 Lihat

Evaluasi

Data

Evaluasi

Data

pertanyaan

Evaluasi

Sistem akan menampilkan

pertanyaan evaluasi

Valid

7 Olah Data Data

pembela-

jaran

Data

pembelajar

an

Sistem akan menampilkan

data pembelajaran

Valid

Berdasarkan hasil pengujian fungsionalitas program pada Tabel 1, dapat

disimpulkan bahwa aplikasi pembelajaran bahasa arab dengan menggunakan

HTML 5 untuk digunakan sebagai alat bantu pembelajaran atau aplikasi

pembelajaran sebagai media sudah memenuhi tujuan penelitian.

Pengujian berikutnya adalah pengujian penerimaan penguna kepada guru.

Pengujian dilakukan untuk mengetahui manfaat yang dihasilkan dari aplikasi yang

telah dibuat. Pengujian dilakukan melalui kuisioner yang diberikan kepada guru

setelah guru melakukan pengujian aplikasi secara langsung. Hasil dari pengujian

ini dapat dilihat pada Tabel 2 yang merupakan tabel pengujian penerimaan

pengguna kepada guru.

Tabel 2. Hasil Pengujian penerimaan penguna kepada guru

No pengujian SS S R TS

1 Aplikasi pembelajaran bahasa arab

sudah berjalan dengan baik

25% 70% 5% 0%

2. Aplikasi pembelajaran bahasa arab

sudah membantu proses pembelajaran

20% 78% 2% 0%

3 Aplikasi pembelajaran bahasa arab

sudah membantu evalasuai materi

30% 65% 5% 0%

4 Materi yang ditampilkan sudah

mewakili materi yang sesungguhnya

40% 60% 0% 0%

Tabel 2 menjelaskan tentang hasil pengujian penerima pengguna kepada

guru, terdapar empat kriteria penilaian yang dilakuka oleh guru yaitu SS =

Sangat Setuju, S = Setuju, R = Ragu Ragu, dan TS = Tidak Setuju. Berdasarkan

Tabel 1 dapat disimpulkan bahwa penerapan HTML 5 dalam pembelajaran

bahasa arab bisa dikatakan berhasil dan bisa digunakan sebagai alternatif

pembelajaran bahasa arab.

5. Simpulan

Penerapan HyperText Markup Language 5 atau HTML 5 pada

pembelajaran bahasa arab memberi sentuhan baru dalam pembelajaran bahasa

arab karena ditambah dengan media video, kuis interaktif, dan juga adanya

evaluasi disetiap materi yang ada. Hal ini tentunya akan membantu dalam

proses pembelajaran bahasa arab yang pada umumnya hanya menggunakan

metode ceramah biasa. Selain itu penggunaan HTML 5 dirasa sangat cocok

untuk mendukung pembuatan aplikasi berbasis web dengan multimedia dan

penggunaan elemen yang ditujukan sebagai penunjang HTML 5, sehingga bisa

menyelesaikan permasalahan yang ditemui oleh siswa yaitu melafalkan dan

menghafalkan materi yang ada.

6 . Daftar Pustaka

[1] Jaya, Roisu., 2010, Pemanfaatan internet sebagai media pembelajaran di

SMPN 02 Malang , http://www.academia.edu/. Diakses tanggal 25

September 2014

[2] Alfaiz, Ainurrofiq, 2012, Pembuatan Run And Jump Game

Menggunakan HTML 5 Canvas, http://digilib.uns.ac.id/. Diakses tanggal

9 January 2015

[3] Sinurat, Sunardy Iwan Sahputra, 2012, Implementasi media

pembelajaran interaktif sekolah dasar kelas 5 IPA dan IPS menggunakan

HTML 5 , http://aksara.pcr.ac.id/ . Diakses Tanggal 9 January 2015

[4] Muslim, Mukhammad Bagus, 2012 , Implentasi game edukasi untuk

media pembelajaran matematika berbasis HTML 5 pada web browser ,

http://trunojoyo.ac.id . Diakses Tanggal 9 January 2015

[5] Kadir, Abdul , 2013, From Zero To a Pro , Yogyakarta : ANDI

[6] Nahasan, Jeanot , 2012 , Mengenal Pengertian dan Perkembangan CSS 3

, http://www.jeanotnahasan.com/ , diakses pada 9 January 2015

[7] Pressman, Roger, 2001, Rekayasa Perangkat Lunak Pendekatan Praktisi

(Buku Satu), Yogyakarta: Andi

[8] David, 2003, Implementasi Customer Relationship Management (CRM)

pada, 6:113 – 126, http://repository.maranatha.edu/ , Diakses tanggal 23

oktober 2014

[9] Nurwarsito, Heru, 2009, Sistem Informasi Jadwal Perkuliahan dengan

Metode Sistem Pakar, 3 : 57 - 61

[10] Edi , Doro, 2009, Analisis Data dengan Menggunakan ERD dan Model

Konseptual Data Warehouse , 5 : 71 -85