T1 672009266 Full text
1
Pengembangan Web Taman Wisata Kopeng Berbasis Responsive
Web Design (RWD)
Artikel Ilmiah
diajukan kepada
Fakultas Teknologi Informasi
untuk memperoleh Gelar Sarjana Komputer
Peneliti:
Agus Kistiyantoro (672009266)
Suprihadi, S.Si., M.Kom.
Program Studi Teknik Informatika
Fakultas Teknologi Informasi
Universitas Kristen Satya Wacana
Salatiga
Mei 2016
(2)
(3)
(4)
(5)
(6)
(7)
7
Pengembangan Web Taman Wisata Kopeng Berbasis Responsive
Web Design (RWD)
1)
Agus Kistiyantoro, 2)Suprihadi
Fakultas Teknologi Informasi Universitas Kristen Satya Wacana Jl. Diponegoro 52-60, Salatiga 50711, Indonesia
E-mail : 1)[email protected], 2) [email protected]
Abstract
Design and this study attempts to develop information system based tourism web
responsive design that would facilitate users in access to information service kopeng park .Design for development website park kopeng it uses hardware intel® celeron® , processor1.50 ghz and memoryram 4 gb .The research in the development of information park web based kopeng responsive using twitter bootstrap is to collect data , designing programs , make the program , and testing , if in testing program does not runs well repair , so as to produce information systems park kopeng decent accessed online .The data used in this research obtained from interviews directly with the park kopeng , and the internet .By applying responsive web design at the website park kopeng allow users to access information service kopeng with young tourism.
Keywords : Responsive Web Design, Twitter Bootstrapt
Abstrak
Perancangan dan penelitian ini bertujuan untuk mengembangkan sistem informasi
pariwisata berbasis Responsive Web Design yang dapat memudahkan pengguna dalam
mengakses layanan informasi Taman Wisata Kopeng. Perancangan untuk pengembangan
Website Taman Wisata Kopeng ini menggunakan hardware intel® Celeron®, Processor1.50 GHz dan MemoryRAM 4 GB . Alur penelitian dalam pengembangan
informasi Taman Wisata Kopeng berbasis web Responsive dengan menggunakan twitter
bootstrap adalah mengumpulkan data, merancang program, membuat program, dan pengujian, jika dalam pengujian program tidak berjalan baik maka dilakukan perbaikan, sehingga menghasilkan sistem informasi Taman Wisata Kopeng yang layak diakses secara online. Data yang digunakan dalam penelitian ini didapat dari hasil wawancara langsung dengan staff taman Wisata Kopeng, dan internet. Dengan menerapkan
Responsive Web Design pada website Taman Wisata Kopeng memudahkan pengguna dalam mengakses layanan informasi pariwisata kopeng dengan mudah.
Kata Kunci: Responsive Web Design, Twitter Bootstrap
1
Mahasiswa Fakultas Teknologi Informasi Universitas Kristen Satya Wacana 2
(8)
8
1. Pendahuluan
Kabupaten Semarang yang merupakan salah satu daerah tujuan wisata di Jawa Tengah yang memiliki potensi kepariwisataan, yaitu Taman Wisata Kopeng. Desa Wisata Kopeng terletak di Kecamatan Getasan Kabupaten Semarang. Letak geografisnya berada di lereng gunung Merbabu, gunung Telomoyo dan gunung Andong di ketinggian 1450 m dari permukaan laut. Menyajikan panorama yang memikat dalam nuansa alam pedesaan dipadu dengan keindahan hamparan tanaman bunga dan sayuran membentuk suasana asri nan menyejukkan. Daerah tujuan wisata alam ini berjarak tempuh sekitar 14 km dari kota Salatiga dan sekitar 54 km dari kota Semarang. Berkunjung ke Desa Wisata Kopeng, wisatawan dapat menikmati wisata alam pegunungan, bunga, petik strawberi, berkuda, kerajinan, budaya dan kuliner. Wana wisata Kopeng memiliki beberapa lokasi ideal yang bisa digunakan sebagai rekreasi keluarga, perkemahan, outbond dan acara rapat serta seminar pada institusi.
Perkembangan teknologi saat ini telah berkembang sangat pesat dan membawa perubahan yang sangat besar karena dengan teknologi tersebut informasi dapat didapat dengan cepat, akurat dan tidak terbatas oleh waktu dan tempat. Salah satu sektor yang berkembang dalam perkembangan teknologi adalah di bidang pariwisata yang memberikan andil untuk mendistribusikan informasi objek-objek wisata yang lebih interaktif khususnya melalui teknologi internet.
Dengan harapan setelah adanya website pariwisata yang menggunakan
Responsive Web Design ini akan terjadi peningkatan pengunjung, baik pada
hari-hari biasa maupun hari-hari libur. Dan memudahkan pengunjung untuk melakukan pemesanan hotel dan mengetahui informasi tentang hotel di Taman Wisata Kopeng. Berdasarkan permasalahan Website yang terjadi di Taman Wisata Kopeng maka dikembangkan Webite Taman Wisata Kopeng berbasis web Responsive Web Desaign (RWD).
2. Tinjauan Pustaka
Penelitian pada jurnal dengan judul Perancangan Website Responsive Sebagai Media Informasi dan E-Learning pada SMA Negeri 1 Kota Bima Menggunakan FrameworkBootstrap.
Pada penelitian dengan jurnal yang berjudul Perancangan Website
Responsive Sebagai Media Informasi dan E-Learning pada SMA Negeri 1 Kota
Bima Menggunakan FrameworkBootstrap didapatkan bahwa dengan menerapkan
web responsive menggunakan framework Bootstrap dapat mempermudah siswa
dalam belajar diluar sekolah menggunakan pc atau gadget dengan tampilan yang bisa menyesuaikan dengan device yang digunakan.
Berdasarkan penelitian sebelumnya maka dari itu melalui penelitian ini, akan diterapkan Responsive pada pembuatan Website pariwisata menggunakan
framework Bootstrap untuk Mempermudah Wisatawan dalam mengakses website
(9)
9
PHP singkatan dari Hypertext Preprocessor yang digunakan sebagai bahasa script server-side dalam pengembangan web yang disisipkan pada dokumen HTML. Penggunaan PHP memungkinkan web dapat dibuat dinamis sehingga maintenance web menjadi lebih mudah dan efisien [1]. Gambar 1 merupakan alur kerja dari PHP yang didukung bermacam-macam sistem
database.
Gambar 1 Alur Kerja PHP [2]
PHP pertama kali dibuat oleh Rasmus Lerdroft, seorang programmer C, sehingga sintaks PHP mirip dengan bahasa C. Semula PHP digunakan Rasmus untuk menghitung jumlah pengunjung didalam suatu web yang kemudian dikenal dengan Personal Home Page Tools versi 1.0 dan dapat dipakai dengan gratis. Versi ini pertama kali keluar pada tahun 1995. Isinya adalah sekumpulan script PERL yang dibuat untuk menciptakan halaman web yang dinamis. Kemudian pada tahun 1996 Rasmus mengeluarkan PHP versi 2.0 yang kemampuannya mampu mengakses database dan dapat terintegrasi dengan HTML. Kemudian pada tanggal 6 Juni 1998 dan 22 Mei 2000 muncul PHP versi 3.0 dan 4.0 yang lebih lengkap dibandingkan versi sebelumnya.
Responsive adalah teknik untuk menbuat layout website yang dapat secara
otomatis menyesuaikan dengan device yang digunakan pengunjung, baik ukuran maupun orientasinya.
Pada artikel Ethan Marcotte mengulas tentang tiga teknik dalam pembuatan web Responsive, yaitu flexible layout, flexible images, dan media
queries ke dalam satu pendekatan dan menamakannya Responsive Design.
Hypertext Markup Language (HTML) merupakan salah satu format yang
digunakan dalam pembuatan dokumen dan aplikasi yang berjalan di halaman web. Dokumen ini dikenal sebagai web page. Dokumen HTML merupakan dokumen yang disajikan pada web browser.
Twitter Bootstrap adalah sebuah alat bantu untuk menbuat tampilan
website yang dapat mempercepat pekerjaan seseorang pengembang website
ataupun pendesain halaman website. Sesuai dengan namanya, website yang dibuat dengan alat bantu ini memiliki tampilan halaman Twitter atau desainer juga dapat mengubah tampilan halaman website sesuai dengan kebutuhan.
Twitter Bootstrap dibangun dengan teknologi HTML dan CSS yang dapat
(10)
10
lainnya dalam sebuah website hanya dengan memanggil fungsi CSS (Class) dalam berkas HTML yang telah didefinisikan. Selain itu juga terdapat komponen-komponen lainnya yang dibangun menggunakan JavaScript.
Cascading Style Sheets (CSS) merupakan aturan untuk mengatur beberapa
komponen dalam sebuah web sehingga akan lebuh terstruktur dan seragam. CSS bukan merupakan pemrograman. Sama halnya Styles dalam aplikasi pegolahan kata seperti Microsoft word yang dapat mengatur beberapa Style, misalnya
Heading, Subbab, bodytext, Footer, images, dan Style lainnya untuk dapat
digunakan bersama-sama dalam beberapa berkas (File). Pada umumnya CSS dipakai untuk memformat tampilan halaman web yang dibuat dengan bahasa HTML dan XHTML.
JavaScript adalah bahasa pemrograman tingkat tinggi dan dinamis.
JavaScript dapat bekerja disebagian besar browser seperti Internet Explorer (IE),
Mozilla Firefox, Netscape, dan Opera. Code JavaScript dapat disisipkan dalam
halaman web menggunakan tag SCRIPT.
3. Metode Penelitian
Setelah mengetahui permasalahan dan kebutuhan penelitian, maka diperlukan suatu metode penelitian untuk mencapai tujuan penelitian yang telah ditentukan. Metode penelitian yang digunakan pada penelitian ini dapat dilihat pada gambar 2.
Analisis Masalah dan Kebutuhan
Studi Pustaka
Pengembangan Sistem
Kesimpulan dan Saran
Laporan dan Publikasi
Gambar 2 Tahapan Penelitian
Pada tahap pertama metode penelitian, yaitu studi pustaka. Hasil pada tahap pertama adalah pemahaman teori tentang Responsive Web Design, Twitter
Bootstrap, bahasa pemrograman PHP, basis data MySql dan NetBeans sebagi
editor untuk mengimplementasikan aplikasi, serta Unified Modelling Language sebagai model perancangan aplikasi.
Tahap kedua, yaitu merancang template dengan menggunakan bootstrapt, mendapatkan source code dari bootstrapt terlebih dahulu. dan membangun web
(11)
11
tersebut yang memanfaatkan source code bootstrap. Untuk menjalankan komponen-komponen bawaan dari bootstrap seperti modal dialog, navigation agar bias berjalan dibutuhkan jquery.
Tahap selanjutnya adalah tahap ketiga, yaitu melakukan uji coba terhadap sistem yang telah dibangun pada tahap sebelumnya. Tahap ini dilakukan untuk mengukur unjuk kerja website yang dibangun, Pengujian selanjutnya adalah menguji aplikasi dalam menampilkan data-data informasi Taman Wisata Kopeng dan informasi hotel yang diperoleh dari Database, yang kemudian disajikan dalam bentuk tabel. Hasil pada tahap ketiga ini adalah sebuah aplikasi berbasis web dengan menggunakan Responsive Web Design yang layak dipergunakan untuk pengembangan obyek Taman Wisata Kopeng.
Tahap terakhir, yaitu tahap pengambilan kesimpulan dan saran, dilanjutkan dengan pembuatan laporan. Laporan diwujudkan dalam bentuk laporan penelitian dan artikel ilmiah sebagai draft jurnal publikasi hasil penelitian ini. Admin Pengunjung Kelola Kamar Kelola Layanan Kelola Fasilitas Kelola Gallery Ubah
Tambah Hapus Lihat
Ubah Tambah Hapus Lihat Ubah Tambah Hapus Lihat Ubah Tambah Hapus Lihat <<extend>> <<extend>> <<extend>> <<extend>> <<extend>><<extend>> <<extend>> <<extend>> <<extend>> <<extend>> <<extend>> <<extend>> <<extend>> <<extend>> <<extend>><<extend>> Lihat Kamar Lihat Layanan Lihat Fasilitas Lihat Gallery Lihat Home
Gambar 3. Use Case Diagram Aplikasi
Gambar 3 merupakan use case diagram yang terdiri atas dua aktor yaitu admin dan Pengunjung. aktor admin memiliki hak akses dalam sistem. Admin bertugas mengelola data-data seperti data kamar, layanan, fasilitas, dan gallery. Sedangkan pada aktor Pengunjung hanya dapat melihat informasi dari tampilan home, kamar, layanan, fasilitas dan gallery.
(12)
12
Admin Sistem Pengunjung
Atur Data Kamar
Edit Kamar
Tambah Kamar
Hapus Kamar
Simpan Atur Data Laayanan
Edit Layanan
Tambah Layanan
Hapus Layanan
Atur Data Fasilitas
Edit Fasilitas
Tambah Fasilitas
Hapus Fasilitas Atur Data Gallery
Edit Gallery
Tambah Gallery
Hapus Gallery
Lihat Kamar
Lihat Layanan
Lihat Fasilitas
Lihat Gallery Mulai
Selesai
Gambar 5. Ativity Diagram
Gambar 5 menggambarkan aktifitas yang terjadi untuk Admin dan Pengunjung. Dimulai dari login Admin dengan masuk ke menu Admin pada laman Website, kemudian akan masuk ke menu Admin. Di dalam menu Admin, Admin bisa atur data kamar, layanan, fasilitas, dan gallery. Dan data akan disimpan pada
system. Didalam Diagram aktifity ini user hanya bisa melihat atau membaca
(13)
13
4. Hasil dan Pembahasan
Pada bab ini berisi tentang hasil dan pembahasan yang meliputi implementasi rancangan pengembangan web Taman Wisata Kopeng Berbasis Responsive, dan pembahasan hasil implementasi web yang digunakan. Pembahasan berisi uraian hasil implementasi berdasarkan yang tertulis dalam bab 3 (tiga). Sedangkan analisis hasil akan dilakukan terhadap hasil yang telah diuji dari aplikasi.
Metode pengembangan sistem yang dipergunakan pada penelitian ini adalah metode prototype. Dalam proses implementasi, menghasilkan 2 (dua) prototipe, yang berdasarkan hasil pengujian merupakan prototype aplikasi presentasi transaksi jual beli yang sudah sesuai dengan kebutuhan pengelola dan pemilik pasar digital. Supaya lebih memperjelas proses pengembangan sistem dapat dilihat dalam Tabel 1.
Tabel 1 Dokumentasi Prototipe I
No Spesifikasi Deskripsi Testing dan Validasi Ket. 1 Kelola Website
bagi Admin
Proses Create, Update
dan Delete kamar pada
website taman wisata kopeng
Admin menambah,
mengedit dan menghapus
kamar taman wisata kopeng.
OK
Proses Create, Update
dan Delete layanan pada website taman wisata kopeng
Admin menambah,
mengedit dan menghapus
layanan taman wisata kopeng.
OK
Proses Create, Update
dan Delete fasilitas pada website taman wisata kopeng
Admin menambah,
mengedit dan menghapus daftar harga dan fasilitas lainnya di taman wisata kopeng.
OK
Proses Create, Update
dan Delete gallery pada website taman wisata kopeng
Admin menambah,
mengedit dan menghapus foto gallery yang disediakan taman wisata kopeng.
OK
Penerapan Responsive pada web Taman Wisata Kopeng dipergunakan untuk lebih pengembangkan pengunjung taman wisata kopeng, Untuk dapat mewujudkan tersebut, maka diperlukan teknologi untuk memudahkan pengunjung dalam impelementasinya. Dipilih responsiveweb design karena tampilan bisa menyesuaikan dengan device yang digunakan user sehingga user menjadi nyaman mengaksesnya.
Selama ini web Taman Wisata Kopeng Masih mengunakan template web yang biasa, sehingga disaat user mengakses dengan menggunakan mobile tampilan menjadi terpotong sesuai ukuran device nya.
(14)
14
Gambar 6. Tampilan web dengan menggunakan ponsel
Gambar 7. Tampilan web dengan menggubakan Tablet
Pada Gambar 6 dan Gambar 7 adalah tampilan Website menggunakan
device mobile. Pada web tersebut akan terpotong dan untuk mengakses laman user
harus menggeser atau memperbesar laman Web.
karena hal tersebut, maka sistem diberi layanan login seperti terlihat pada gambar 8.
(15)
15
Setelah login berhasil maka sistem akan menampilkan laman Admin seperti pada gambar 9, dimana Admin bisa mengelola konten yang ada seperti kamar, layanan, fasilitas, dan gallery.
Gambar 9 Tampilan Beranda Kamar Admin
Pada gambar 9 adalah tampilan untuk mengelola kamar. Admin bisa bisa menambah kamar, edit tariff kamar, dan menghapus kamar.
Gambar 10 Tampilan Beranda Layanan Admin
Pada gambar 10 adalah tampilan untuk mengelola Layanan yang didalamnya berupa menu makanan dan minuman. Admin bisa menambah menu makanan dan minuman, edit harga makanan dan minuman, dan menghapus menu.
(16)
16
Gambar 11 Tampilan Beranda Fasilitas Admin
Pada gambar 11 adalah tampilan untuk mengelola Fasilitas yang disediakan di obyek Taman Wisata Kopeng. Admin bisa menambah Fasilitas, edit tariff Fasilitas , dan menghapus Fasilitas.
Gambar 12 Tampilan Beranda Gallery Admin
Pada gambar 12 adalah tampilan untuk mengelola Gallery berupa Foto-foto fasilitas di obyek Taman Wisata Kopeng. Admin bisa menambah Fasilitas, edit tariff Fasilitas , dan menghapus Fasilitas.
(17)
17
Kode Program 1 Adalah Kode program index.html untuk memanggil Bootstrap
1. <!DOCTYPE html>
2. <html> 3. <head>
4. <meta charset="utf-8">
5. <title>My First Bootstrap project</title> 6. <link rel="stylesheet"
7. type="text/css"href="css/bootstrap.css"> 8. </head>
9. <body>
10. <!-- Javascript files harus ditaruh di bawah untuk
11. meningkatkan performa web -->
12. <script src="http://code.jquery.com/jquery
13. 1.10.1.min.js"></script>
14. <script src="js/bootstrap.js"></script> 15. </body>
16. </html>
5. Simpulan
Dari data diatas, dapat menyimpulkan bahwa semakin berkembangnya jaman maka semakin pula kebutuhan RWD sangat dibutuhkan bagi para web
designer. Hal ini tidak memungkinkan jika pada tahun tahun mendatang
penerapan RWD sangat diwajibkan. Dalam pengembangan Website Taman Wisata Kopeng dengan menggunakan Responsive Web Design yang dapat menyesuaikan resolusi layar pengunjung, maka akan semakin banyak pula pengunjung yang akan nyaman ketika mengunjungi web tersebut.
Pembangunan website ini masih bisa dibuat semenarik mungkin dan dikembangkan lebih lanjut terutama dalam tampilan sistemnya. Dari segi yang disajikan mungkin belum sepenuhnya sempurna, oleh karena itu, ada baiknya dengan menambah beberapa informasi yang lebih lengkap. Agar website ini kelihatan cantik, disarankan untuk menambah sekaligus diperbanyak animasi, dengan tujuan agar pengunjung dalam mengakses website ini tidak cepat bosan.
6. Pustaka
[1] Akib, z. 2014. “Perancangan Website Menggunakan Responsive Web
Design”, Vol. 2 Issue 1, ISSN: 2303-5786.
[2] Suwantoro, 2004, Dasar-Dasar Pariwisata, Yogyakarta : Andi.
[3] Putra, C., Iriani, A. & Manuputty, A. D. 2011. Perancangan dan Implementasi
E-Tourism pada Sistem Informasi Pariwisata Salatiga.
[4] Faudi, A. 2013. Perancangan Dan Pembuatan Sistem Informasi
Pariwisata Kabupaten Simeule Berbasis Web. Sekolah Tinggi Manajemen
Informatika Dan Komputer STMIK U’BUDIYAH Indonesia, Banda Aceh.
[5] Purnama, Pupung Budi.2005.Kiat Praktis Menjadi Desainer Web
(1)
12
Admin Sistem Pengunjung
Atur Data Kamar
Edit Kamar
Tambah Kamar
Hapus Kamar
Simpan Atur Data Laayanan
Edit Layanan
Tambah Layanan
Hapus Layanan
Atur Data Fasilitas
Edit Fasilitas
Tambah Fasilitas
Hapus Fasilitas Atur Data Gallery
Edit Gallery
Tambah Gallery
Hapus Gallery
Lihat Kamar
Lihat Layanan
Lihat Fasilitas
Lihat Gallery Mulai
Selesai
Gambar 5. Ativity Diagram
Gambar 5 menggambarkan aktifitas yang terjadi untuk Admin dan Pengunjung. Dimulai dari login Admin dengan masuk ke menu Admin pada laman Website, kemudian akan masuk ke menu Admin. Di dalam menu Admin, Admin bisa atur data kamar, layanan, fasilitas, dan gallery. Dan data akan disimpan pada system. Didalam Diagram aktifity ini user hanya bisa melihat atau membaca informasi saja.
(2)
13 4. Hasil dan Pembahasan
Pada bab ini berisi tentang hasil dan pembahasan yang meliputi implementasi rancangan pengembangan web Taman Wisata Kopeng Berbasis Responsive, dan pembahasan hasil implementasi web yang digunakan. Pembahasan berisi uraian hasil implementasi berdasarkan yang tertulis dalam bab 3 (tiga). Sedangkan analisis hasil akan dilakukan terhadap hasil yang telah diuji dari aplikasi.
Metode pengembangan sistem yang dipergunakan pada penelitian ini adalah metode prototype. Dalam proses implementasi, menghasilkan 2 (dua) prototipe, yang berdasarkan hasil pengujian merupakan prototype aplikasi presentasi transaksi jual beli yang sudah sesuai dengan kebutuhan pengelola dan pemilik pasar digital. Supaya lebih memperjelas proses pengembangan sistem dapat dilihat dalam Tabel 1.
Tabel 1 Dokumentasi Prototipe I
No Spesifikasi Deskripsi Testing dan Validasi Ket.
1 Kelola Website
bagi Admin
Proses Create, Update
dan Delete kamar pada website taman wisata kopeng
Admin menambah, mengedit dan menghapus
kamar taman wisata kopeng.
OK
Proses Create, Update
dan Delete layanan pada website taman wisata kopeng
Admin menambah, mengedit dan menghapus
layanan taman wisata kopeng.
OK
Proses Create, Update
dan Delete fasilitas pada website taman wisata kopeng
Admin menambah, mengedit dan menghapus daftar harga dan fasilitas lainnya di taman wisata kopeng.
OK
Proses Create, Update
dan Delete gallery pada website taman wisata kopeng
Admin menambah, mengedit dan menghapus foto gallery yang disediakan taman wisata kopeng.
OK
Penerapan Responsive pada web Taman Wisata Kopeng dipergunakan untuk lebih pengembangkan pengunjung taman wisata kopeng, Untuk dapat mewujudkan tersebut, maka diperlukan teknologi untuk memudahkan pengunjung dalam impelementasinya. Dipilih responsiveweb design karena tampilan bisa menyesuaikan dengan device yang digunakan user sehingga user menjadi nyaman mengaksesnya.
Selama ini web Taman Wisata Kopeng Masih mengunakan template web yang biasa, sehingga disaat user mengakses dengan menggunakan mobile tampilan menjadi terpotong sesuai ukuran device nya.
(3)
14
Gambar 6. Tampilan web dengan menggunakan ponsel
Gambar 7. Tampilan web dengan menggubakan Tablet
Pada Gambar 6 dan Gambar 7 adalah tampilan Website menggunakan device mobile. Pada web tersebut akan terpotong dan untuk mengakses laman user harus menggeser atau memperbesar laman Web.
karena hal tersebut, maka sistem diberi layanan login seperti terlihat pada gambar 8.
(4)
15
Setelah login berhasil maka sistem akan menampilkan laman Admin seperti pada gambar 9, dimana Admin bisa mengelola konten yang ada seperti kamar, layanan, fasilitas, dan gallery.
Gambar 9 Tampilan Beranda Kamar Admin
Pada gambar 9 adalah tampilan untuk mengelola kamar. Admin bisa bisa menambah kamar, edit tariff kamar, dan menghapus kamar.
Gambar 10 Tampilan Beranda Layanan Admin
Pada gambar 10 adalah tampilan untuk mengelola Layanan yang didalamnya berupa menu makanan dan minuman. Admin bisa menambah menu makanan dan minuman, edit harga makanan dan minuman, dan menghapus menu.
(5)
16
Gambar 11 Tampilan Beranda Fasilitas Admin
Pada gambar 11 adalah tampilan untuk mengelola Fasilitas yang disediakan di obyek Taman Wisata Kopeng. Admin bisa menambah Fasilitas, edit tariff Fasilitas , dan menghapus Fasilitas.
Gambar 12 Tampilan Beranda Gallery Admin
Pada gambar 12 adalah tampilan untuk mengelola Gallery berupa Foto-foto fasilitas di obyek Taman Wisata Kopeng. Admin bisa menambah Fasilitas, edit tariff Fasilitas , dan menghapus Fasilitas.
(6)
17
Kode Program 1 Adalah Kode program index.html untuk memanggil Bootstrap
1. <!DOCTYPE html>
2. <html> 3. <head>
4. <meta charset="utf-8">
5. <title>My First Bootstrap project</title> 6. <link rel="stylesheet"
7. type="text/css"href="css/bootstrap.css"> 8. </head>
9. <body>
10. <!-- Javascript files harus ditaruh di bawah untuk
11. meningkatkan performa web -->
12. <script src="http://code.jquery.com/jquery
13. 1.10.1.min.js"></script>
14. <script src="js/bootstrap.js"></script> 15. </body>
16. </html>
5. Simpulan
Dari data diatas, dapat menyimpulkan bahwa semakin berkembangnya jaman maka semakin pula kebutuhan RWD sangat dibutuhkan bagi para web designer. Hal ini tidak memungkinkan jika pada tahun tahun mendatang penerapan RWD sangat diwajibkan. Dalam pengembangan Website Taman Wisata Kopeng dengan menggunakan Responsive Web Design yang dapat menyesuaikan resolusi layar pengunjung, maka akan semakin banyak pula pengunjung yang akan nyaman ketika mengunjungi web tersebut.
Pembangunan website ini masih bisa dibuat semenarik mungkin dan dikembangkan lebih lanjut terutama dalam tampilan sistemnya. Dari segi yang disajikan mungkin belum sepenuhnya sempurna, oleh karena itu, ada baiknya dengan menambah beberapa informasi yang lebih lengkap. Agar website ini kelihatan cantik, disarankan untuk menambah sekaligus diperbanyak animasi, dengan tujuan agar pengunjung dalam mengakses website ini tidak cepat bosan.
6. Pustaka
[1] Akib, z. 2014. “Perancangan Website Menggunakan Responsive Web Design”, Vol. 2 Issue 1, ISSN: 2303-5786.
[2] Suwantoro, 2004, Dasar-Dasar Pariwisata, Yogyakarta : Andi.
[3] Putra, C., Iriani, A. & Manuputty, A. D. 2011. Perancangan dan Implementasi
E-Tourism pada Sistem Informasi Pariwisata Salatiga.
[4] Faudi, A. 2013. Perancangan Dan Pembuatan Sistem Informasi Pariwisata Kabupaten Simeule Berbasis Web. Sekolah Tinggi Manajemen
Informatika Dan Komputer STMIK U’BUDIYAH Indonesia, Banda Aceh.
[5] Purnama, Pupung Budi.2005.Kiat Praktis Menjadi Desainer Web