Responsive Website Implementation Using Bootstrap (Case Study: Gkpi Church Website Tebing Tinggi City Special Congregation)
Abstract
Peningkatan penggunaan teknologi informasi dalam era digital menuntut adaptasi setiap entitas, termasuk lembaga keagamaan seperti gereja, dalam menyajikan informasi secara efektif dan responsif. Penelitian ini membahas penerapan grid system pada Bootstrap sebagai solusi untuk meningkatkan responsivitas dan pengalaman pengguna pada website. Dengan menggunakan metodologi pengembangan web responsif, fitur-fitur grid system Bootstrap diintegrasikan untuk mencapai tata letak yang dinamis dan sesuai dengan berbagai ukuran layar. Metode penelitian melibatkan analisis kebutuhan pada website yang responsif, pengembangan dan implementasi grid system pada Bootstrap, serta evaluasi hasil implementasi melalui pengujian cross-device. Pengujian cross-device mencakup desktop, tablet, dan mobile. dengan tujuan untuk memastikan tampilan dan interaksi yang konsisten di berbagai perangkat. Hasil implementasi menunjukkan peningkatan signifikan dalam tampilan dan kinerja website. Responsivitas yang ditingkatkan memastikan bahwa konten dapat diakses dengan baik pada perangkat apa pun, mulai dari desktop hingga smartphone. Tata letak yang terstruktur memberikan pengalaman pengguna yang konsisten dan optimal, meningkatkan daya tarik visual dan memudahkan navigasi. Tantangan dalam penyesuaian elemen-elemen konten dan perubahan tata letak diatasi dengan pendekatan yang terstruktur. Kesimpulan penelitian ini menjelaskan manfaat besar dari penerapan grid system pada Bootstrap dalam meningkatkan keterlibatan pengguna dan menjaga tampilan yang menarik di semua perangkat. Penelitian ini menjelaskan pentingnya penerapan grid system pada Bootstrap sebagai pendekatan yang efektif untuk mengoptimalkan desain responsif. Rekomendasi untuk pengembangan selanjutnya mencakup pemeliharaan rutin dan pembaruan desain responsif berdasarkan evolusi teknologi dan kebutuhan pengguna.
Kata Kunci: Responsivitas, Pengalaman Pengguna, Grid System, Bootstrap, Web Responsif.
References
I Gede Handika, Ayi Purbasari, "Pemanfaatan Framework Laravel Dalam Pembangunan Aplikasi E- Travel Berbasis Website," Konferensi Nasional Sistem informasi 2018. 2018
Y. I. Melani, Sistem Pengaduan Layanan Akademik Menggunakan Responsive Web Design. J. Sisfokom (Sistem Inf. dan Komputer), vol. 8, no. 1, pp. 39–45, 2019, doi: 10.32736/sisfokom.v8i1.597
H. Hendri, J. W. H. Manurung, R. A. Ferian, W. F. Hana atmoko, dan Y. Yulianti, "Pengujian Black Box pada Aplikasi Sistem Informasi Pengelolaan Masjid Menggunakan Teknik Equivalence Partitions," Jurnal Teknologi Sistem Informasi Dan Aplikasi, vol. 3, no. 2, hlm. 107–113, 2020
Suharti, Muhamad Sadali, Yupi Kuspandi Putra, " Sistem Informasi Berbasis Web SMA Al- Mukhatariyah Mamben Lauk berbasis Php dan MySQL dengan Framework Codeigniter," Jurnal Informatika dan Teknologi, Vol.3, No. 1, 2020.
Data Ardian Dirgantara, Rian Andrian, " Pengembangan responsif Website untuk semarang Heritage RUN 2022 dengan Framework Bootstrap," Jurnal Media Infotama Vol.19, No.2 2023.
Andhika Wicaksono, Faishal Mufied Al Anshary, Rahmat Fauzi, " Perancangan Backend Pada Website Helpmeong Menggunakan Framework Laravel Dengan Metode Scrum," Universitas Telkom, 2023.
Khana Wijaya, Andi Christian, " Implementasi metode model view controller (MVC) dalam rancang bangun website SMK Yayasan Banktu Prabumulih, " Jurnal Komputer dan informatika Universitas Bina Sarana Informatika,Vol. 21, No. 1, 2019.
Ria Anggraini, Andri, " SIstem Informasi Website Online Pada Toko DK Corner Menggunakan Metode Web Design responsif Bootstrap," Jurnal Nasional Ilmu Komputer, Vol.2, No.3, 2021.
Ina Maryani, Ahmad Ishaq, Dennis SLamet Mulyadi, " Sistem informasi pemesanan minuman berbasis client server pada kampung dahar purwokerto," vol. 6, no. 2, 2018
Christian Chastro, Erico Darmawan H.,S.Kom.,M.T.,"Perbandingan Pengembangan Front End Menggunakan Blade Template dan Vue Js," Jurnal Strategi, Vol. 2, No.2, 2020.
S. S. Hilabi, "Rancang Bangun Situs Responsif Di Universitas Buana Perjuangan Karawang Dengan Menggunakan Metode Perpaduan Grid System Dan Css Media Query," Techno Xplore J. Ilmu Komput. dan Teknol. Inf., vol. 2, no. 1, pp. 1–10, 2017, doi: 10.36805/technoxplore.v2i1.220.
W. Ravelo-Méndez, C. Escobar-Vélasquez and M. Linares-Vásquez, "Kraken-Mobile: CrossDevice Interaction-Based Testing of Android Apps," 2019 IEEE International Conference on Software Maintenance and Evolution (ICSME), Cleveland, OH, USA, 2019, pp. 410-413, doi: 10.1109/ICSME.2019.00071.
M Yusuf, Yuli Astuti, " Analisis dan Evaluasi Aspek Usability pada Aplikasi Pijar Career Center menggunakan System Usability Scale (SUS)." Jurnal Sistem Komputer, Vol. 9, No. 2, 2020.
Miftah Faroq Santoso, "Teknik responsif Web Design (RWD) Serta Penerapannya dalam rancangan bangun layout web," Jurnal Pilar Nusa Mandir, Vol.15, No. 1, 2019.
Safira, N.F., Al Anshary, F. M., & Hardiyanti, M. (2021). Perancangan Frontend pada Website Aplikasi Jobbie: Pencarian Dan Penyedia Jasa Lapangan Kerja. eProceedings of Engineering,
Welda, Desak Made Dwi Utami Putra, Ayu Manik Dirgayusari (2020), "Usability Testing Website dengan Menggunakan Metode System Usability Scale (SUS)." Jurnal of Natural Science and Engineering, Vol. 4, No. 3, 2020.
