SlideShare a Scribd company logo
1 of 21
Download to read offline
i
IMPLEMENTASI DESAIN RESPONSIF PADA
PENGEMBANGAN ANTARMUKA WEBSITE SEKOLAH
MENENGAH KEJURUAN NEGERI 1 SRAGEN
PROPOSAL SKRIPSI
Diajukan Untuk Memenuhi Salah Satu Syarat Kelulusan Pada
Jenjang Sarjana (S1) Program Studi Teknik Informatika
Fakultas Teknik Elektro Dan Informatika
Universitas Surakarta
Disusun oleh:
Nama : Sugeng Wardoyo
NIM : 200922027
Pembimbing 1 : Dimas Sasongko, S.Kom., M.Eng.
Pembimbing 2 : Bayu Mukti, S.Kom
FAKULTAS TEKNIK ELEKTRO DAN INFORMATIKA
UNIVERSITAS SURAKARTA
2017
ii
UNIVERSITAS SURAKARTA
FAKULTAS TEKNIK ELEKTRO DAN INFORMATIKA
LEMBAR PERSETUJUAN PROPOSAL SKRIPSI
JUDUL : Implementasi Desain Responsif Pada Pengembangan Antarmuka
Website Sekolah Menengah Kejuruan Negeri 1 Sragen
NAMA : Sugeng Wardoyo
NIM : 200922027
Proposal ini telah disetujui
Surakarta, Juli 2017
Pembimbing 1 Pembimbing 2
Dimas Sasongko, S. Kom., M.Eng. Bayu Mukti, S.Kom.
NIPY. 19850502 061024 1 159 NIPY. 55401.061024-070792
iii
UNIVERSITAS SURAKARTA
FAKULTAS TEKNIK ELEKTRO DAN INFORMATIKA
LEMBAR PENGESAHAN PROPOSAL SKRIPSI
JUDUL : Implementasi Desain Responsif Pada Pengembangan Antarmuka
Website Sekolah Menengah Kejuruan Negeri 1 Sragen
NAMA : Sugeng Wardoyo
NIM : 200922027
Surakarta, Juli 2017
Pembimbing 1 Pembimbing 2
Dimas Sasongko, S. Kom., M.Eng. Bayu Mukti, S.Kom.
NIPY. 19850502 061024 1 159 NIPY.55401.061024-070792
Ketua Program Studi
Teknik Informatika (S1)
Ir. Tri Irianto Tj, M.T
NIP. 19620311 199303 1 001
iv
Implementasi Desain Responsif Pada Pengembangan Antarmuka Website
Sekolah Menengah Kejuruan Negeri 1 Sragen
Sugeng Wardoyo, 200922027, wardoyosugeng79@yahoo.co.id
Fakultas Teknik Elektro dan Informatika, Universitas Surakarta
Deskripsi
Sekolah Menengah Kejuruan Negeri 1 Sragen (SMKN 1 Sragen) sudah
memiliki situs web dengan alamat situs www.smkn1sragen.sch.id. Hasil evaluasi
yang dilakukan pada website SMKN 1 Sragen, bahwa website SMKN 1 Sragen
belum menyesuaikan dengan ukuran layar perangkat pengguna. Tampilan user
interface website SMKN 1 Sragen tidak efektif khususnya pada perangkat mobile,
hal ini dibuktikan dengan pengguna perlu melakukan zoom in, zoom out, dan
slide untuk melihat konten website..
Rumusan masalah pada penelitian ini adalah desain tampilan website
SMKN 1 Sragen belum menyesuaikan dengan beragam ukuran layar pengguna
dan bagaimana menerapkan metode Responsive Web Design pada
pengembangan website SMK Negeri 1 Sragen. Tujuan dari penelitian ini adalah
untuk mengembangkan website SMKN 1 Sragen menyesuaikan dengan layar
pengguna.
Metode pengembangan website yang digunakan dalam penelitian ini
adalah metode Responsive Web Design. Tahapan dalam metode Responsive Web
Design yang digunakan dalam penelitian ini terdiri dari analisis kebutuhan
pengguna, content strategy, wireframing, pengujian, dan implementasi
Hasil yang diharapkan dari penelitian ini adalah website Sekolah Menengah
Kejuruan Negeri 1 Sragen mampu menyesuaikan dengan beragam ukuran layar
perangkat yang digunakan oleh pengguna. Selanjutnya, hasil pengembangan
diharapkan dapat dijadikan sebagai masukkan untuk implementasi website
Sekolah Menengah Kejuruan Negeri 1 Sragen.
Kata Kunci : website, layout website, Responsive Web Design
Pustaka : 11 (2001-2016)
v
The Implementation of Responsive Design on Website Interface Development
of Vocational High School 1 Sragen
Sugeng Wardoyo, 200922027, wardoyosugeng79@yahoo.co.id
Faculty of Electrical Engineering and Informatics, University of Surakarta
Description
Vocational High School 1 Sragen (SMKN 1 Sragen) already has a website
with the website address www.smkn1sragen.sch.id. The results of the evaluation
conducted on the website SMKN 1 Sragen, that SMKN 1 Sragen website has not
adjusted to the screen size of the user device. The look of SMKN 1 Sragen
website user interface is not effective especially on mobile devices, this is proven
by users need to zoom in, zoom out, and slide to view website content ..
The formulation of the problem in this research is the website display
design SMKN 1 Sragen not adjust to the various screen size of the user and how
to apply Responsive Web Design method on the website development of SMK
Negeri 1 Sragen. The purpose of this research is to develop website SMKN 1
Sragen adjust to user screen.
Website development method used in this research is Responsive Web
Design method. Stages in the Responsive Web Design method used in this study
consist of user needs analysis, content strategy, wireframing, testing, and
implementation
The expected result of this study is the website of Vocational High School 1
Sragen able to adjust to the various screen sizes of devices used by users.
Furthermore, the results of the development is expected to be used as an input
for the implementation of the website of Vocational High School 1 Sragen.
Keywords : website, layout website, Responsive Web Design.
References : 11 (2001-2016)
vi
DAFTAR ISI
Halaman
Halaman Judul ................................................................................................................ i
Halaman Persetujuan ..................................................................................................... ii
Halaman Pengesahan ..................................................................................................... iii
Deskripsi ......................................................................................................................... iv
Description...................................................................................................................... v
Daftar Isi ......................................................................................................................... vi
I. Latar Belakang Masalah .................................................................................... 1
II. Rumusan Masalah ............................................................................................. 2
III. Batasan Masalah ............................................................................................... 3
IV. Tujuan Peneltian ............................................................................................... 3
V. Manfaat Penelitian ............................................................................................ 3
VI. Metode Penelitian ............................................................................................ 3
VII. Landasan Teori .................................................................................................. 5
VIII. Tinjauan Pustaka ............................................................................................... 9
IX. Sistematika Penulisan ........................................................................................ 11
X. Kerangka Pemikiran .......................................................................................... 12
XI. Jadwal Penyusunan Penelitian .......................................................................... 13
XII. Perencanaan Biaya ............................................................................................ 14
Daftar Pustaka............................................................................................................. 15
Lampiran
1
I. LATAR BELAKANG MASALAH
Pemanfaatan kemajuan teknologi informasi dan komunikasi (TIK) dalam
menjalankan proses operasional sekolah menjadi suatu keharusan agar sekolah
bisa memberikan pelayanan terbaik kepada masyarakat. Salah satunya dengan
pembangunan situs web sekolah yang dapat memenuhi kebutuhan dari para
penggunanya. Tujuan pembangunan situs web adalah memberikan layanan
informasi kepada pengguna secara efektif dan efisien yang pada akhirnya
kepuasan pengguna dapat tercapai. Dengan situs web diharapkan dapat
meningkatkan pelayanan sekolah kepada masyarakat.
Mobile device berkembang sangat pesat, sekitar enam milyar mobile device
digunakan di seluruh dunia. Mobile device memiliki ukuran resolusi layar yang
beragam, mobile device yang populer memiliki resolusi layar antara 280 pixel
sampai 1920 pixel. Tahun 2011 lebih dari lima puluh persen data penjualan
perangkat personal computer (PC) dan non-PC adalah smartphone dan tablet, hal
itu melebihi data penjualan laptop, notebook dan netbook (Sasongko, 2016).
Sekolah Menengah Kejuruan Negeri 1 Sragen (SMKN 1 Sragen) sudah
memiliki situs web dengan alamat situs www.smkn1sragen.sch.id. Website SMKN
1 Sragen digunakan sebagai media informasi dan komunikasi antara sekolah
dengan siswa, sekolah dengan orang tua, sekolah dengan lembaga-lembaga
terkait dan sekolah dengan masyarakat.
Hasil evaluasi yang dilakukan pada website SMKN 1 Sragen oleh Wardoyo
(2017), bahwa website SMKN 1 Sragen belum menyesuaikan dengan ukuran
2
layar perangkat pengguna. Tampilan user interface website SMKN 1 Sragen tidak
efektif khususnya pada perangkat mobile, hal ini dibuktikan dengan pengguna
perlu melakukan zoom in, zoom out, dan slide untuk melihat konten website
(Wardoyo, 2017).
Pada penelitian yang akan dilakukan desain responsif digunakan untuk
membantu pengembangan tampilan antarmuka pengguna website SMKN 1
Sragen, sehingga hasil halaman website dapat menyesuaikan beragam resolusi
layar dan informasi yang ditampilkan konsisten untuk perangkat desktop dan
mobile. Metode yang digunakan untuk pengembangan tampilan antarmuka
website SMKN 1 Sragen adalah Responsive Web Design. Penelitian yang
dilakukan mengambil judul penelitian “Implementasi Desain Responsif Pada
Pengembangan Antarmuka Website Sekolah Menengah Kejuruan Negeri 1
Sragen”.
II. RUMUSAN MASALAH
Dari uraian latar belakang masalah, maka penulis dapat merumuskan
masalah dalam penulisan penelitian ini yaitu :
1. Desain tampilan website SMKN 1 Sragen belum menyesuaikan dengan
beragam ukuran layar pengguna.
2. Bagaimana menerapkan metode Responsive Web Design pada
pengembangan website SMK Negeri 1 Sragen ?
3
III. BATASAN MASALAH
Batasan pada penelitian ini adalah :
1. Fokus penelitian pada perangkat mobile dengan ukuran layar
perangkat 4,5 inch, 5 inch, dan 7 inch.
2. Fokus penelitian pada perangkat desktop dengan ukuran layar
perangkat 10 inch, 12 inch, dan 14 inch.
IV. TUJUAN PENELITIAN
Tujuan dari penelitian ini adalah untuk mengembangkan website SMKN 1
Sragen menyesuaikan dengan layar pengguna dengan menggunakan metode
Responsive Web Design.
V. MANFAAT PENELITIAN
Manfaat yang diharapkan dari penelitian ini adalah :
1. Website SMKN 1 Sragen dapat menyesuaikan dengan layar pengguna.
2. Pengguna dapat mudah dan nyaman melakukan akses website SMKN 1
Sragen menggunakan perangkat desktop dan mobile.
VI. METODE PENELITIAN
Adapun metode penelitian yang dilakukan sebagai berikut :
Metode Pengumpulan Data
a. Observasi
4
Observasi dilakukan dengan melakukan pengamatan langsung pada
website SMKN 1 Sragen dan pada pengguna ketika mengakses website
SMKN 1 Sragen.
b. Wawancara
Wawancara dilakukan dilakukan kepada responden untuk mengetahui
lebih lanjut pendapat dari responden tentang website SMKN 1 Sragen.
c. Kepustakaan
Berisi sumber data berupa buku, prosiding seminar dan jurnal yang
membahas tentang website, layout website, dan Responsive Web Design.
Metode Pengembangan
a. Analisis
Menganalisa kebutuhan pengguna, content strategy dan tampilan
antarmuka pengguna website SMKN 1 Sragen.
b. Desain
Membuat desain pengembangan website SMKN 1 Sragen berdasarkan
data dari analisis. Desain yang dibuat adalah berupa wireframe.
c. Pembuatan
Membuat pengembangan website SMKN 1 Sragen berdasarkan data dari
desain. Pembuatan website menggunakan Wordpress.
d. Pengujian
5
Tahapan pengujian ini adalah melakukan pengujian hasil pengembangan
website SMKN 1 Sragen. metode yang digunakan dalam pengujian adalah
metode compatibility.
e. Implementasi
Tahap implementasi merupakan tahap sosialisai halaman website pada
pengguna untuk mengetahui kesesuaian desain hasil pengembangan
website SMKN 1 Sragen dengan kebutuhan pengguna.
VII. LANDASAN TEORI
1. Website
Hildreth (2008) mendefinisikan website merupakan jaringan komputer
yang terdiri dari situs-situs yang berisikan data serta informasi berupa teks,
gambar, suara, dan animasi maupun gabungan dari semuanya. Website dapat
bersifat statis maupun dinamis, yang membentuk satu rangkaian bangunan yang
saling terkait dimana masing-masing dihubungkan dengan jaringan-jaringan
halaman atau hyperlink (Amanda, 2011).
Menurut Sidik (2001), website merupakan kumpulan dokumen–dokumen
yang tersebar di mesin–mesin di internet. Dokumen ini biasa disebut page
(halaman HTML). Tiap page mengandung link ke page yang lain di mesin
yang lain di internet. Halaman website yang melakukan point ke halaman yang
lain ini dinamakan menggunakan Hypertext. String yang melakukan link ke
halaman yang lain disebut dengan Hyperlink (Sidik, 2001).
6
Jenis website dilihat dari tujuannya terdiri dari (Davis, 2001):
1. Personal web, website yang berisi tentang hal-hal pribadi seseorang
2. Corporate web, website yang dimiliki oleh sebuah perusahaan dan berisi
informasi dan data perusahaan
3. Portal web, website yang menyediakan berbagai layanan sepert berita, email,
dan jasa lainnya
4. Forum web, website yang memiliki tujuan sebagai media diskusi, serta website
yang menyediakan berbagai layanan penting seperti e-Government, e-
Bangking, e-Learning, dan lain-lain.
2. Layout Website
Layout adalah penyusunan elemen-elemen kedalam sebuah bidang
sehingga membentuk susunan artistik. Tujuan utama layout adalah menampilkan
elemen gambar dan teks agar menjadi komunikatif dalam sebuah cara yang
dapat memudahkan pembaca menerima informasi yang disajikan
(www.satriamultimedia.com; diakses tanggal 20 Juli 2016).
3. Kategori Layout Website
Desain layout website dapat dikelompokkan menjadi empat kategori
berdasarkan pengaturan lebar halaman website, yaitu fixed-width, liquid atau
fluid, elastic dan hybrid (Gillenwater, 2010)
a. Fixed-width
Layout fixed-width merupakan layout yang paling umum digunakan
pada halaman website. Lebar keseluruhan desain layout fixed-width
7
diatur ke dalam sebuah nilai dengan satuan piksel yang ditentukan oleh
pembuat website. Pada umumnya pembuat website memilih lebar
berdasarkan pada salah satu dari resolusi layar yang umum digunakan,
yaitu 800x600 atau 1024x768.
Layout fixed-width merupakan desain yang kaku, karena komponen
website diatur dalam lebar yang tetap. Pengguna yang melihat website
dengan desain fixed-width dari browser dengan ukuran apa pun akan
melihat website beserta komponennya dalam lebar yang tetap dan tidak
akan berpindah. Website yang menggunakan layout fixed-width maka
lebar layout website tetap sama bahkan ketika dilihat di browser yang
berbeda.
b. Liquid/fluid
Layout fluid merupakan layout yang perubahan lebarnya berdasarkan
pada ukuran viewport pengguna, sehingga membuat keseluruhan
tampilan website terlihat baik pada browser yang berbeda. Lebar layout
desain fluid ditentukan oleh presentase bukan ukuran piksel seperti
pada layout fixed-width. Elemen-elemen website pada layout fluid
menyesuaikan dengan baik pada ukuran layar dan resolusi layar yang
berbeda.
c. Elastic
Layout elastic merupakan layout yangperubahan lebarnya berdasarkan
pada ukuran ukuran teks yang ditetapkan pada perangkat browsing
8
pengguna. Pengguna yang telah menetapkan ukuran teks lebih besar
dari ukuran teks default akan melihat halaman di mana tidak hanya teks
yang lebih besar, tetapi seluruh tata letak akan lebih besar secara
proporsional.
d. Hybrid
Layout hybrid adalah layout yang dihasilkan dari penggabungan dua
atau lebih layout yang sudah ada. Jenis layout hybrid yang umum
digunakan adalah sidebar yang dibangun menggunakan layout fixed-
width dan konten yang menggunakan layout fluid.
4. Responsive Web Design
Responsive Web Design merupakan salah satu metode desain dengan
menggabungkan HTML5 dan CSS3 untuk arsitektur desain web agar website
dapat menyesuaikan dengan berbagai ukuran resolusi layar (Marcotte, 2010).
Tujuan dari RWD adalah membuat halaman website terlihat sama pada beragam
ukuran piksel dan ukuran layar (Kim, 2013). Manfaat utama dari teknik RWD
adalah website yang dirancang akan memberikan pengalaman yang konsisten
kepada pengguna, yang kemudian akan meningkatkan user experience
(pengalaman pengguna). Teknik Responsive Web Design mempunyai tiga bagian
inti yaitu : fluid layout, flexible image dan media queries (Marcotte, 2011).
9
VIII.TINJUAN PUSTAKA
Penelitian Medi Suhartanto (2012) dengan judul “Pembuatan Website
Sekolah Menengah Pertama Negeri 3 Delanggu Dengan Menggunakan Php dan
MySQL” penelitian yang dilakukan memiliki tujuan menyajikan website yang
dinamis untuk sekolah Menegah Pertama Negeri 3 Delanggu sebagai sarana
promosi dan publikasi. Karena sistem ini bertujuan sebagai sumber informasi
sekolah SMP Negeri 3 Delanggu maka sistem ini dibuat secara sederhana dan
mudah digunakan. Sistem ini memiliki fasilitas-fasilitas antara lain adalah Home,
Profil Sekolah, Fasilitas Sekolah, Data Karyawan, Berita, Kesiswaan yang meliputi
unit kegiatan dan prestasi, Galeri Foto dan yang terakhir buku tamu. SMP Negeri
3 Delanggu sekarang sudah memiliki website sebagai sarana promosi dan
publikasi kepada masyarakat umum dengan alamat situs
http://smpn3delanggu.sch.id/ Sehingga dapat dimanfaatkan oleh masyarakat
yang ingin mencari informasi seputar SMP N 3 Delanggu tanpa harus datang
kesekolah.
Penelitian Pringgo Winoto dan Tri Iriantio Tj (2012) dengan judul
“Pembuatan Website Profil Sekolah Dasar Negeri 03 Kalisoro” penelitian yang
dilakukan memiliki tujuan menghasilkan website profil untuk menyampaikan
informasi dan mempromosikan tentang Sekolah Dasar Negeri 03 Kalisoro kepada
masyarakat umum. Metode yang dilakukan dalam penelitian antara lain
Kepustakaan, observasi,analisis dan perancangan, pembuatan website,
implementasi. Sekolah Dasar Negeri 03 Kalisoro sudah mempunyai website,
10
sehingga masyarakat bisa mencari informasi mengenai Sekolah Dasar Negeri 03
Kalisoro secara online. Dengan adanya website ini jangkauan informasi yang
diberikan lebih luas bukan hanya masyarakat sekitar namun dari segala penjuru
mampu mengetahui Sekolah Dasar Negeri 03 Kalisoro dengan lebih lengkap dan
jelas melalui media internet.
Penelitian Dina Khusnia dan Berliana Kusuma Riasti (2014) dengan judul
“Pembuatan Website Profil Sekolah Menengah Pertama Negeri 1 Kalitudu
Bojonegoro” penelitian yang dilakukan memiliki tujuan menghasilkan website
profil Sekolah Menengah Pertama Negeri 1 Kalitudu yang dinamis, yang dapat
digunakan sebagai media penyampaian informasi yang lebih efektif dan efisien.
Metode penelitian yang penulis pergunakan adalah: kepustakaan, observasi,
wawancara, analisis, perancangan, pembuatan, uji coba dan implementasi.
Website profil ini dibuat dengan menggunakan PHP dan MySQL. Dan dengan
adanya website tersebut SMP N 1 Kalitidu dapat menyampaikan informasi secara
luas ke masyarakat umum dengan lebih efektif dan efisien.
Penelitian yang akan dilakukan oleh peneliti memiliki perbedaan pada
metode desain dan pembuatan yaitu menggunakan Responsive Web Design.
Penelitian difokuskan pada pengembangan antarmuka website SMKN 1 Sragen
untuk bisa menyesuaikan dengan ukuran layar pengguna.
11
IX. SISTEMATIKA PENULISAN
Untuk mempermudah dalam penyususunan skripsi, maka penulis
menggunakan sistematika penulisan yang terdiri dari :
BAB I PENDAHULUAN
Bab ini bertulisan tentang latar belakang, rumusan masalah, batasan
masalah, tujuan penelitian, manfaat penelitian, metode penelitian, dan
sistematika penyusunan skripsi.
BAB II GAMBARAN UMUM, LANDASAN TEORI DAN TINJAUAN PUSTAKA
Bab ini berisi tulisan tentang gambaran umum SMKN 1 Sragen. Landasan
teori berisi tentang teori website, layout website dan Responsive Web
Design. Tinjauan pustaka berisi tulisan tentang review penelitian
sebelumnya yang sejenis dan dapat dibedakan dengan penelitian yang
sedang dilakukan.
BAB III METODE PENELITIAN
Berisi tentang alat dan bahan, dan alur penelitian.
BAB IV HASIL DAN PEMBAHASAN
Bab ini berisi tulisan tentang desain, pengujian dan implementasi website
SMKN 1 Sragen.
BAB V PENUTUP
Berisi kesimpulan dan saran.
DAFTAR PUSTAKA
LAMPIRAN
12
X. ALUR PENELITIAN
Alur penelitian pengujian antarmuka website SMKN 1 Sragen, sebagai
berikut :
Gambar 1.1 Alur Penelitian
Mulai
Studi Literatur
Produk Pembanding
Desain Website
Pembuatan Website
Pengujian website
Implementasi Website
Selesai
Uji
Kompatibel
Sesuai
Tidak Sesuai
13
XI. JADWAL PENYUSUNAN PENELITIAN
Kegiatan akan dimulai pada Bulan Juni 2017 dan direncanakan akan
berakhir pada Agustus 2017. Adapun tabel rencana kegiatan penelitian sebagai
berikut :
Tabel 1.1 Jadwal Penelitian
No Kegiatan
Juni
2017
Juli
2017
Agustus
2017
1 2 3 4 1 2 3 4 1 2 3 4
1 Sudi literatur
2 Produk pembanding
3 Desain website
4 Pembuatan website
5 Pengujian website
6 Implementasi website
14
XII. PERENCANAAN BIAYA
Berisi daftar semua biaya yang diperlukan dalam penelitian, termasuk
barang habis/tidak habis pakai, sewa, upah, jasa, dsb.
Tabel 1.2 Perencaan Biaya
No. Jenis Pengeluaran Biaya Pengeluaran
1 Sewa Komputer Rp 200.000
2 Cetak Laporan Rp 35.000
3 Alat Tulis Rp 17.000
4 CD Blank + Tempat CD Rp 15.000
5 Buku Referensi Rp 110.000
6 Jilid dan Penggandaan Laporan Rp 95.000
7 Biaya Internet Rp 150.000
8 Transportasi Rp 150.000
9 Biaya Desainer Rp 150.000
10 Biaya Programmer Rp 400.000
Total Biaya Rp 1.332.000
15
DAFTAR PUSTAKA
Gillenwater. Z. M. 2010. Flexible Web Design: Creating Liquid and Elastic Layouts
With CSS. Peachpit Press.
Khusnia. D, Riasti. BK,. 2014. Pembuatan Website Profil Sekolah Menengah
Pertama Negeri 1 Kalitudu Bojonegoro. Indonesian Journal on Networking
and Security. Vol. 3 No.1.
Kim. B,. 2013. Responsive Web Design, Discoverability, and Mobile Challenge
Libr. Technol. Rep., vol. 49, no. 6, pp. 29–39.
Marcotte. E,. 2010. Responsive web design. List Apart, vol. 306.
Marcotte. E,. 2011. Responsive design. Book Apart N. Y.
Noviandhi, A., 2011, Perbandingan Pengaruh User Experience Pada Situs
Terhadap Citra Merek Pada Pengguna Goal-Directed Dan Pengguna
Experiental (Studi Kasus Pada Situs www.hellosoursally.com Terhadap Citra
Merek Sour Sally, Skripsi, FISIPOL Universitas Indonesia.
Sasongko. D. 2016. Pengembangan Antarmuka Perpustakaan Digital
Menggunakan Responsive Web Design Dengan Pendekatan User
Experience (Studi Kasus Pada Perpustakaan Digital Universitas Surakarta).
Tesis. Universitas Gadjah Mada Yogyakarta.
Sidik. B. 2001. Pemrograman Web dengan PHP. Bandung: Informatika.
Suhartanto. M,. 2012. Pembuatan Website Sekolah Menengah Pertama Negeri 3
Delanggu Dengan Menggunakan Php Dan MySQL. Sentra Penelitian
Engineering dan Edukasi. Vol. 4 No.1.
Winoto. P,. 2012. Pembuatan Website Profil Sekolah Dasar Negeri 03 Kalisoro.
Sentra Penelitian Engineering dan Edukasi. Vol. 4 No.1.
www.satriamultimedia.com (diakses tanggal 20 Juli 2016)

More Related Content

Similar to Implementasi Desain Responsif Pada Pengembangan Antarmuka Website SMK Negeri 1 Sragen

Kerangka acuan kerja sbmptn
Kerangka acuan kerja sbmptnKerangka acuan kerja sbmptn
Kerangka acuan kerja sbmptnHilma Kamilah
 
Kerangka Acuan Kerja SBMPTN
Kerangka Acuan Kerja SBMPTNKerangka Acuan Kerja SBMPTN
Kerangka Acuan Kerja SBMPTNraras anggita
 
Workshop Penyelarasan Kurikulum dgn IDUKA 2023.pptx
Workshop Penyelarasan Kurikulum dgn IDUKA 2023.pptxWorkshop Penyelarasan Kurikulum dgn IDUKA 2023.pptx
Workshop Penyelarasan Kurikulum dgn IDUKA 2023.pptxMyrnaAstari1
 
Proposal penguji ukk
Proposal penguji ukkProposal penguji ukk
Proposal penguji ukktyaswahyu
 
Project charter tugas uas project management
Project charter   tugas uas project managementProject charter   tugas uas project management
Project charter tugas uas project managementDoni Andriansyah
 
Kerangka acuan kerja
Kerangka acuan kerjaKerangka acuan kerja
Kerangka acuan kerjajeffrynasri
 
Fp dokumen perencanaan proyek
Fp dokumen perencanaan proyekFp dokumen perencanaan proyek
Fp dokumen perencanaan proyekAdam Aremania
 
RPS - Pemrograman Web Desain - berbasis KKNI OBE Prodi MI.pdf
RPS - Pemrograman Web Desain - berbasis KKNI OBE Prodi MI.pdfRPS - Pemrograman Web Desain - berbasis KKNI OBE Prodi MI.pdf
RPS - Pemrograman Web Desain - berbasis KKNI OBE Prodi MI.pdfSuparno20
 
Kerangka acuan kerja
Kerangka acuan kerjaKerangka acuan kerja
Kerangka acuan kerjajeffrynasri
 
aplikasi android dalam ppbk
aplikasi android dalam ppbkaplikasi android dalam ppbk
aplikasi android dalam ppbkRomzi Bin Zainal
 
Jasa Pembuatan Website Universitas - Website Kampus - 081333555017
Jasa Pembuatan Website Universitas - Website Kampus - 081333555017Jasa Pembuatan Website Universitas - Website Kampus - 081333555017
Jasa Pembuatan Website Universitas - Website Kampus - 081333555017'Agus DistroBlogger
 
About me & about course mobile applicaton development
About me & about course mobile applicaton developmentAbout me & about course mobile applicaton development
About me & about course mobile applicaton developmentNazruddin Safaat
 
PPT_Pandi Fathu Romdhoni.pptx
PPT_Pandi Fathu Romdhoni.pptxPPT_Pandi Fathu Romdhoni.pptx
PPT_Pandi Fathu Romdhoni.pptxKiJarotSukaseuri
 
Tubes apsi ananda mutiara putri 6701144089_pis1405
Tubes apsi ananda mutiara putri 6701144089_pis1405Tubes apsi ananda mutiara putri 6701144089_pis1405
Tubes apsi ananda mutiara putri 6701144089_pis1405AnandaMP
 
Tubes apsi ananda mutiara putri 6701144089_pis1405
Tubes apsi ananda mutiara putri 6701144089_pis1405Tubes apsi ananda mutiara putri 6701144089_pis1405
Tubes apsi ananda mutiara putri 6701144089_pis1405AnandaMP
 

Similar to Implementasi Desain Responsif Pada Pengembangan Antarmuka Website SMK Negeri 1 Sragen (20)

Kerangka acuan kerja sbmptn
Kerangka acuan kerja sbmptnKerangka acuan kerja sbmptn
Kerangka acuan kerja sbmptn
 
Kerangka Acuan Kerja SBMPTN
Kerangka Acuan Kerja SBMPTNKerangka Acuan Kerja SBMPTN
Kerangka Acuan Kerja SBMPTN
 
Workshop Penyelarasan Kurikulum dgn IDUKA 2023.pptx
Workshop Penyelarasan Kurikulum dgn IDUKA 2023.pptxWorkshop Penyelarasan Kurikulum dgn IDUKA 2023.pptx
Workshop Penyelarasan Kurikulum dgn IDUKA 2023.pptx
 
Proposal penguji ukk
Proposal penguji ukkProposal penguji ukk
Proposal penguji ukk
 
Project charter tugas uas project management
Project charter   tugas uas project managementProject charter   tugas uas project management
Project charter tugas uas project management
 
Kerangka acuan kerja
Kerangka acuan kerjaKerangka acuan kerja
Kerangka acuan kerja
 
Modul elektronika
Modul elektronikaModul elektronika
Modul elektronika
 
Fp dokumen perencanaan proyek
Fp dokumen perencanaan proyekFp dokumen perencanaan proyek
Fp dokumen perencanaan proyek
 
Proposal E Learning
Proposal E LearningProposal E Learning
Proposal E Learning
 
RPS - Pemrograman Web Desain - berbasis KKNI OBE Prodi MI.pdf
RPS - Pemrograman Web Desain - berbasis KKNI OBE Prodi MI.pdfRPS - Pemrograman Web Desain - berbasis KKNI OBE Prodi MI.pdf
RPS - Pemrograman Web Desain - berbasis KKNI OBE Prodi MI.pdf
 
Kerangka acuan kerja
Kerangka acuan kerjaKerangka acuan kerja
Kerangka acuan kerja
 
aplikasi android dalam ppbk
aplikasi android dalam ppbkaplikasi android dalam ppbk
aplikasi android dalam ppbk
 
Kak
KakKak
Kak
 
Jasa Pembuatan Website Universitas - Website Kampus - 081333555017
Jasa Pembuatan Website Universitas - Website Kampus - 081333555017Jasa Pembuatan Website Universitas - Website Kampus - 081333555017
Jasa Pembuatan Website Universitas - Website Kampus - 081333555017
 
About me & about course mobile applicaton development
About me & about course mobile applicaton developmentAbout me & about course mobile applicaton development
About me & about course mobile applicaton development
 
PPT_Pandi Fathu Romdhoni.pptx
PPT_Pandi Fathu Romdhoni.pptxPPT_Pandi Fathu Romdhoni.pptx
PPT_Pandi Fathu Romdhoni.pptx
 
IS-2 Tantangan SMK di Era Digital
IS-2  Tantangan SMK di Era Digital IS-2  Tantangan SMK di Era Digital
IS-2 Tantangan SMK di Era Digital
 
Tantang SMK di Era Digital
Tantang SMK di Era DigitalTantang SMK di Era Digital
Tantang SMK di Era Digital
 
Tubes apsi ananda mutiara putri 6701144089_pis1405
Tubes apsi ananda mutiara putri 6701144089_pis1405Tubes apsi ananda mutiara putri 6701144089_pis1405
Tubes apsi ananda mutiara putri 6701144089_pis1405
 
Tubes apsi ananda mutiara putri 6701144089_pis1405
Tubes apsi ananda mutiara putri 6701144089_pis1405Tubes apsi ananda mutiara putri 6701144089_pis1405
Tubes apsi ananda mutiara putri 6701144089_pis1405
 

More from BASUKI ERYANTO

2.1.a.8. Koneksi Antar Materi - Modul 2.1.pdf
2.1.a.8. Koneksi Antar Materi - Modul 2.1.pdf2.1.a.8. Koneksi Antar Materi - Modul 2.1.pdf
2.1.a.8. Koneksi Antar Materi - Modul 2.1.pdfBASUKI ERYANTO
 
2.1.a.5.2. Unggah Tugas Ruang Kolaborasi - Modul 2.1.pdf
2.1.a.5.2. Unggah Tugas Ruang Kolaborasi - Modul 2.1.pdf2.1.a.5.2. Unggah Tugas Ruang Kolaborasi - Modul 2.1.pdf
2.1.a.5.2. Unggah Tugas Ruang Kolaborasi - Modul 2.1.pdfBASUKI ERYANTO
 
1.2.a.5. Ruang Kolaborasi Modul 1.2 - Diskusi Mandiri.pdf
1.2.a.5. Ruang Kolaborasi Modul 1.2 - Diskusi Mandiri.pdf1.2.a.5. Ruang Kolaborasi Modul 1.2 - Diskusi Mandiri.pdf
1.2.a.5. Ruang Kolaborasi Modul 1.2 - Diskusi Mandiri.pdfBASUKI ERYANTO
 
1.4.a.6. Demonstrasi Konstektual - Modul 1.4 - SKENARIO PRAKTIK SEGITIGA REST...
1.4.a.6. Demonstrasi Konstektual - Modul 1.4 - SKENARIO PRAKTIK SEGITIGA REST...1.4.a.6. Demonstrasi Konstektual - Modul 1.4 - SKENARIO PRAKTIK SEGITIGA REST...
1.4.a.6. Demonstrasi Konstektual - Modul 1.4 - SKENARIO PRAKTIK SEGITIGA REST...BASUKI ERYANTO
 
1.3.a.8. Koneksi Antar Materi - Modul 1.3.pdf
1.3.a.8. Koneksi Antar Materi - Modul 1.3.pdf1.3.a.8. Koneksi Antar Materi - Modul 1.3.pdf
1.3.a.8. Koneksi Antar Materi - Modul 1.3.pdfBASUKI ERYANTO
 
1.2.a.8. Koneksi Antar Materi - Modul 1.2.pdf
1.2.a.8. Koneksi Antar Materi - Modul 1.2.pdf1.2.a.8. Koneksi Antar Materi - Modul 1.2.pdf
1.2.a.8. Koneksi Antar Materi - Modul 1.2.pdfBASUKI ERYANTO
 
1.1.a.8. Koneksi Antar Materi – Kesimpulan dan Refleksi Modul 1.1.pdf
1.1.a.8. Koneksi Antar Materi – Kesimpulan dan Refleksi Modul 1.1.pdf1.1.a.8. Koneksi Antar Materi – Kesimpulan dan Refleksi Modul 1.1.pdf
1.1.a.8. Koneksi Antar Materi – Kesimpulan dan Refleksi Modul 1.1.pdfBASUKI ERYANTO
 
PUISI - Demonstrasi Kontekstual - Modul 1.1.pdf
PUISI - Demonstrasi Kontekstual - Modul 1.1.pdfPUISI - Demonstrasi Kontekstual - Modul 1.1.pdf
PUISI - Demonstrasi Kontekstual - Modul 1.1.pdfBASUKI ERYANTO
 
1.3.a.6. Demonstrasi Kontekstual - Modul 1.3.pdf
1.3.a.6. Demonstrasi Kontekstual - Modul 1.3.pdf1.3.a.6. Demonstrasi Kontekstual - Modul 1.3.pdf
1.3.a.6. Demonstrasi Kontekstual - Modul 1.3.pdfBASUKI ERYANTO
 
Bahan presentasi ujian tesis
Bahan presentasi   ujian tesisBahan presentasi   ujian tesis
Bahan presentasi ujian tesisBASUKI ERYANTO
 

More from BASUKI ERYANTO (12)

2.1.a.8. Koneksi Antar Materi - Modul 2.1.pdf
2.1.a.8. Koneksi Antar Materi - Modul 2.1.pdf2.1.a.8. Koneksi Antar Materi - Modul 2.1.pdf
2.1.a.8. Koneksi Antar Materi - Modul 2.1.pdf
 
2.1.a.5.2. Unggah Tugas Ruang Kolaborasi - Modul 2.1.pdf
2.1.a.5.2. Unggah Tugas Ruang Kolaborasi - Modul 2.1.pdf2.1.a.5.2. Unggah Tugas Ruang Kolaborasi - Modul 2.1.pdf
2.1.a.5.2. Unggah Tugas Ruang Kolaborasi - Modul 2.1.pdf
 
1.2.a.5. Ruang Kolaborasi Modul 1.2 - Diskusi Mandiri.pdf
1.2.a.5. Ruang Kolaborasi Modul 1.2 - Diskusi Mandiri.pdf1.2.a.5. Ruang Kolaborasi Modul 1.2 - Diskusi Mandiri.pdf
1.2.a.5. Ruang Kolaborasi Modul 1.2 - Diskusi Mandiri.pdf
 
1.4.a.6. Demonstrasi Konstektual - Modul 1.4 - SKENARIO PRAKTIK SEGITIGA REST...
1.4.a.6. Demonstrasi Konstektual - Modul 1.4 - SKENARIO PRAKTIK SEGITIGA REST...1.4.a.6. Demonstrasi Konstektual - Modul 1.4 - SKENARIO PRAKTIK SEGITIGA REST...
1.4.a.6. Demonstrasi Konstektual - Modul 1.4 - SKENARIO PRAKTIK SEGITIGA REST...
 
1.3.a.8. Koneksi Antar Materi - Modul 1.3.pdf
1.3.a.8. Koneksi Antar Materi - Modul 1.3.pdf1.3.a.8. Koneksi Antar Materi - Modul 1.3.pdf
1.3.a.8. Koneksi Antar Materi - Modul 1.3.pdf
 
1.2.a.8. Koneksi Antar Materi - Modul 1.2.pdf
1.2.a.8. Koneksi Antar Materi - Modul 1.2.pdf1.2.a.8. Koneksi Antar Materi - Modul 1.2.pdf
1.2.a.8. Koneksi Antar Materi - Modul 1.2.pdf
 
1.1.a.8. Koneksi Antar Materi – Kesimpulan dan Refleksi Modul 1.1.pdf
1.1.a.8. Koneksi Antar Materi – Kesimpulan dan Refleksi Modul 1.1.pdf1.1.a.8. Koneksi Antar Materi – Kesimpulan dan Refleksi Modul 1.1.pdf
1.1.a.8. Koneksi Antar Materi – Kesimpulan dan Refleksi Modul 1.1.pdf
 
PUISI - Demonstrasi Kontekstual - Modul 1.1.pdf
PUISI - Demonstrasi Kontekstual - Modul 1.1.pdfPUISI - Demonstrasi Kontekstual - Modul 1.1.pdf
PUISI - Demonstrasi Kontekstual - Modul 1.1.pdf
 
1.3.a.6. Demonstrasi Kontekstual - Modul 1.3.pdf
1.3.a.6. Demonstrasi Kontekstual - Modul 1.3.pdf1.3.a.6. Demonstrasi Kontekstual - Modul 1.3.pdf
1.3.a.6. Demonstrasi Kontekstual - Modul 1.3.pdf
 
Basuki Eryanto.pptx
Basuki Eryanto.pptxBasuki Eryanto.pptx
Basuki Eryanto.pptx
 
Bahan presentasi ujian tesis
Bahan presentasi   ujian tesisBahan presentasi   ujian tesis
Bahan presentasi ujian tesis
 
Pos professional 2.0
Pos professional 2.0Pos professional 2.0
Pos professional 2.0
 

Recently uploaded

Kesebangunan Segitiga matematika kelas 7 kurikulum merdeka.pptx
Kesebangunan Segitiga matematika kelas 7 kurikulum merdeka.pptxKesebangunan Segitiga matematika kelas 7 kurikulum merdeka.pptx
Kesebangunan Segitiga matematika kelas 7 kurikulum merdeka.pptxDwiYuniarti14
 
Lembar Catatan Percakapan Pasca observasidocx
Lembar Catatan Percakapan Pasca observasidocxLembar Catatan Percakapan Pasca observasidocx
Lembar Catatan Percakapan Pasca observasidocxbkandrisaputra
 
KONSEP KEBUTUHAN AKTIVITAS DAN LATIHAN.pptx
KONSEP KEBUTUHAN AKTIVITAS DAN LATIHAN.pptxKONSEP KEBUTUHAN AKTIVITAS DAN LATIHAN.pptx
KONSEP KEBUTUHAN AKTIVITAS DAN LATIHAN.pptxawaldarmawan3
 
aku-dan-kebutuhanku-Kelas 4 SD Mapel IPAS
aku-dan-kebutuhanku-Kelas 4 SD Mapel IPASaku-dan-kebutuhanku-Kelas 4 SD Mapel IPAS
aku-dan-kebutuhanku-Kelas 4 SD Mapel IPASreskosatrio1
 
TUGAS GURU PENGGERAK Aksi Nyata Modul 1.1.pdf
TUGAS GURU PENGGERAK Aksi Nyata Modul 1.1.pdfTUGAS GURU PENGGERAK Aksi Nyata Modul 1.1.pdf
TUGAS GURU PENGGERAK Aksi Nyata Modul 1.1.pdfElaAditya
 
REFLEKSI MANDIRI_Prakarsa Perubahan BAGJA Modul 1.3.pdf
REFLEKSI MANDIRI_Prakarsa Perubahan BAGJA Modul 1.3.pdfREFLEKSI MANDIRI_Prakarsa Perubahan BAGJA Modul 1.3.pdf
REFLEKSI MANDIRI_Prakarsa Perubahan BAGJA Modul 1.3.pdfirwanabidin08
 
Lembar Observasi Pembelajaran di Kelas.docx
Lembar Observasi Pembelajaran di  Kelas.docxLembar Observasi Pembelajaran di  Kelas.docx
Lembar Observasi Pembelajaran di Kelas.docxbkandrisaputra
 
Karakteristik Negara Brazil, Geografi Regional Dunia
Karakteristik Negara Brazil, Geografi Regional DuniaKarakteristik Negara Brazil, Geografi Regional Dunia
Karakteristik Negara Brazil, Geografi Regional DuniaNadia Putri Ayu
 
tugas 1 anak berkebutihan khusus pelajaran semester 6 jawaban tuton 1.docx
tugas 1 anak berkebutihan khusus pelajaran semester 6 jawaban tuton 1.docxtugas 1 anak berkebutihan khusus pelajaran semester 6 jawaban tuton 1.docx
tugas 1 anak berkebutihan khusus pelajaran semester 6 jawaban tuton 1.docxmawan5982
 
MATERI EKOSISTEM UNTUK SEKOLAH MENENGAH ATAS
MATERI EKOSISTEM UNTUK SEKOLAH MENENGAH ATASMATERI EKOSISTEM UNTUK SEKOLAH MENENGAH ATAS
MATERI EKOSISTEM UNTUK SEKOLAH MENENGAH ATASKurniawan Dirham
 
Modul 1.2.a.8 Koneksi antar materi 1.2.pdf
Modul 1.2.a.8 Koneksi antar materi 1.2.pdfModul 1.2.a.8 Koneksi antar materi 1.2.pdf
Modul 1.2.a.8 Koneksi antar materi 1.2.pdfSitiJulaeha820399
 
Modul Ajar Bahasa Indonesia Kelas 4 Fase B
Modul Ajar Bahasa Indonesia Kelas 4 Fase BModul Ajar Bahasa Indonesia Kelas 4 Fase B
Modul Ajar Bahasa Indonesia Kelas 4 Fase BAbdiera
 
2 KISI-KISI Ujian Sekolah Dasar mata pelajaranPPKn 2024.pdf
2 KISI-KISI Ujian Sekolah Dasar  mata pelajaranPPKn 2024.pdf2 KISI-KISI Ujian Sekolah Dasar  mata pelajaranPPKn 2024.pdf
2 KISI-KISI Ujian Sekolah Dasar mata pelajaranPPKn 2024.pdfsdn3jatiblora
 
421783639-ppt-overdosis-dan-keracunan-pptx.pptx
421783639-ppt-overdosis-dan-keracunan-pptx.pptx421783639-ppt-overdosis-dan-keracunan-pptx.pptx
421783639-ppt-overdosis-dan-keracunan-pptx.pptxGiftaJewela
 
Kelompok 2 Karakteristik Negara Nigeria.pdf
Kelompok 2 Karakteristik Negara Nigeria.pdfKelompok 2 Karakteristik Negara Nigeria.pdf
Kelompok 2 Karakteristik Negara Nigeria.pdftsaniasalftn18
 
BAHAN SOSIALISASI PPDB SMA-SMK NEGERI DISDIKSU TP. 2024-2025 REVISI.pptx
BAHAN SOSIALISASI PPDB SMA-SMK NEGERI DISDIKSU TP. 2024-2025 REVISI.pptxBAHAN SOSIALISASI PPDB SMA-SMK NEGERI DISDIKSU TP. 2024-2025 REVISI.pptx
BAHAN SOSIALISASI PPDB SMA-SMK NEGERI DISDIKSU TP. 2024-2025 REVISI.pptxJamhuriIshak
 
04-Gemelli.- kehamilan ganda- duo atau triplet
04-Gemelli.- kehamilan ganda- duo atau triplet04-Gemelli.- kehamilan ganda- duo atau triplet
04-Gemelli.- kehamilan ganda- duo atau tripletMelianaJayasaputra
 
Demonstrasi Kontekstual Modul 1.2. pdf
Demonstrasi Kontekstual  Modul 1.2.  pdfDemonstrasi Kontekstual  Modul 1.2.  pdf
Demonstrasi Kontekstual Modul 1.2. pdfvebronialite32
 
Materi Pertemuan Materi Pertemuan 7.pptx
Materi Pertemuan Materi Pertemuan 7.pptxMateri Pertemuan Materi Pertemuan 7.pptx
Materi Pertemuan Materi Pertemuan 7.pptxRezaWahyuni6
 
MODUL AJAR MATEMATIKA KELAS 6 KURIKULUM MERDEKA
MODUL AJAR MATEMATIKA KELAS 6 KURIKULUM MERDEKAMODUL AJAR MATEMATIKA KELAS 6 KURIKULUM MERDEKA
MODUL AJAR MATEMATIKA KELAS 6 KURIKULUM MERDEKAAndiCoc
 

Recently uploaded (20)

Kesebangunan Segitiga matematika kelas 7 kurikulum merdeka.pptx
Kesebangunan Segitiga matematika kelas 7 kurikulum merdeka.pptxKesebangunan Segitiga matematika kelas 7 kurikulum merdeka.pptx
Kesebangunan Segitiga matematika kelas 7 kurikulum merdeka.pptx
 
Lembar Catatan Percakapan Pasca observasidocx
Lembar Catatan Percakapan Pasca observasidocxLembar Catatan Percakapan Pasca observasidocx
Lembar Catatan Percakapan Pasca observasidocx
 
KONSEP KEBUTUHAN AKTIVITAS DAN LATIHAN.pptx
KONSEP KEBUTUHAN AKTIVITAS DAN LATIHAN.pptxKONSEP KEBUTUHAN AKTIVITAS DAN LATIHAN.pptx
KONSEP KEBUTUHAN AKTIVITAS DAN LATIHAN.pptx
 
aku-dan-kebutuhanku-Kelas 4 SD Mapel IPAS
aku-dan-kebutuhanku-Kelas 4 SD Mapel IPASaku-dan-kebutuhanku-Kelas 4 SD Mapel IPAS
aku-dan-kebutuhanku-Kelas 4 SD Mapel IPAS
 
TUGAS GURU PENGGERAK Aksi Nyata Modul 1.1.pdf
TUGAS GURU PENGGERAK Aksi Nyata Modul 1.1.pdfTUGAS GURU PENGGERAK Aksi Nyata Modul 1.1.pdf
TUGAS GURU PENGGERAK Aksi Nyata Modul 1.1.pdf
 
REFLEKSI MANDIRI_Prakarsa Perubahan BAGJA Modul 1.3.pdf
REFLEKSI MANDIRI_Prakarsa Perubahan BAGJA Modul 1.3.pdfREFLEKSI MANDIRI_Prakarsa Perubahan BAGJA Modul 1.3.pdf
REFLEKSI MANDIRI_Prakarsa Perubahan BAGJA Modul 1.3.pdf
 
Lembar Observasi Pembelajaran di Kelas.docx
Lembar Observasi Pembelajaran di  Kelas.docxLembar Observasi Pembelajaran di  Kelas.docx
Lembar Observasi Pembelajaran di Kelas.docx
 
Karakteristik Negara Brazil, Geografi Regional Dunia
Karakteristik Negara Brazil, Geografi Regional DuniaKarakteristik Negara Brazil, Geografi Regional Dunia
Karakteristik Negara Brazil, Geografi Regional Dunia
 
tugas 1 anak berkebutihan khusus pelajaran semester 6 jawaban tuton 1.docx
tugas 1 anak berkebutihan khusus pelajaran semester 6 jawaban tuton 1.docxtugas 1 anak berkebutihan khusus pelajaran semester 6 jawaban tuton 1.docx
tugas 1 anak berkebutihan khusus pelajaran semester 6 jawaban tuton 1.docx
 
MATERI EKOSISTEM UNTUK SEKOLAH MENENGAH ATAS
MATERI EKOSISTEM UNTUK SEKOLAH MENENGAH ATASMATERI EKOSISTEM UNTUK SEKOLAH MENENGAH ATAS
MATERI EKOSISTEM UNTUK SEKOLAH MENENGAH ATAS
 
Modul 1.2.a.8 Koneksi antar materi 1.2.pdf
Modul 1.2.a.8 Koneksi antar materi 1.2.pdfModul 1.2.a.8 Koneksi antar materi 1.2.pdf
Modul 1.2.a.8 Koneksi antar materi 1.2.pdf
 
Modul Ajar Bahasa Indonesia Kelas 4 Fase B
Modul Ajar Bahasa Indonesia Kelas 4 Fase BModul Ajar Bahasa Indonesia Kelas 4 Fase B
Modul Ajar Bahasa Indonesia Kelas 4 Fase B
 
2 KISI-KISI Ujian Sekolah Dasar mata pelajaranPPKn 2024.pdf
2 KISI-KISI Ujian Sekolah Dasar  mata pelajaranPPKn 2024.pdf2 KISI-KISI Ujian Sekolah Dasar  mata pelajaranPPKn 2024.pdf
2 KISI-KISI Ujian Sekolah Dasar mata pelajaranPPKn 2024.pdf
 
421783639-ppt-overdosis-dan-keracunan-pptx.pptx
421783639-ppt-overdosis-dan-keracunan-pptx.pptx421783639-ppt-overdosis-dan-keracunan-pptx.pptx
421783639-ppt-overdosis-dan-keracunan-pptx.pptx
 
Kelompok 2 Karakteristik Negara Nigeria.pdf
Kelompok 2 Karakteristik Negara Nigeria.pdfKelompok 2 Karakteristik Negara Nigeria.pdf
Kelompok 2 Karakteristik Negara Nigeria.pdf
 
BAHAN SOSIALISASI PPDB SMA-SMK NEGERI DISDIKSU TP. 2024-2025 REVISI.pptx
BAHAN SOSIALISASI PPDB SMA-SMK NEGERI DISDIKSU TP. 2024-2025 REVISI.pptxBAHAN SOSIALISASI PPDB SMA-SMK NEGERI DISDIKSU TP. 2024-2025 REVISI.pptx
BAHAN SOSIALISASI PPDB SMA-SMK NEGERI DISDIKSU TP. 2024-2025 REVISI.pptx
 
04-Gemelli.- kehamilan ganda- duo atau triplet
04-Gemelli.- kehamilan ganda- duo atau triplet04-Gemelli.- kehamilan ganda- duo atau triplet
04-Gemelli.- kehamilan ganda- duo atau triplet
 
Demonstrasi Kontekstual Modul 1.2. pdf
Demonstrasi Kontekstual  Modul 1.2.  pdfDemonstrasi Kontekstual  Modul 1.2.  pdf
Demonstrasi Kontekstual Modul 1.2. pdf
 
Materi Pertemuan Materi Pertemuan 7.pptx
Materi Pertemuan Materi Pertemuan 7.pptxMateri Pertemuan Materi Pertemuan 7.pptx
Materi Pertemuan Materi Pertemuan 7.pptx
 
MODUL AJAR MATEMATIKA KELAS 6 KURIKULUM MERDEKA
MODUL AJAR MATEMATIKA KELAS 6 KURIKULUM MERDEKAMODUL AJAR MATEMATIKA KELAS 6 KURIKULUM MERDEKA
MODUL AJAR MATEMATIKA KELAS 6 KURIKULUM MERDEKA
 

Implementasi Desain Responsif Pada Pengembangan Antarmuka Website SMK Negeri 1 Sragen

  • 1. i IMPLEMENTASI DESAIN RESPONSIF PADA PENGEMBANGAN ANTARMUKA WEBSITE SEKOLAH MENENGAH KEJURUAN NEGERI 1 SRAGEN PROPOSAL SKRIPSI Diajukan Untuk Memenuhi Salah Satu Syarat Kelulusan Pada Jenjang Sarjana (S1) Program Studi Teknik Informatika Fakultas Teknik Elektro Dan Informatika Universitas Surakarta Disusun oleh: Nama : Sugeng Wardoyo NIM : 200922027 Pembimbing 1 : Dimas Sasongko, S.Kom., M.Eng. Pembimbing 2 : Bayu Mukti, S.Kom FAKULTAS TEKNIK ELEKTRO DAN INFORMATIKA UNIVERSITAS SURAKARTA 2017
  • 2. ii UNIVERSITAS SURAKARTA FAKULTAS TEKNIK ELEKTRO DAN INFORMATIKA LEMBAR PERSETUJUAN PROPOSAL SKRIPSI JUDUL : Implementasi Desain Responsif Pada Pengembangan Antarmuka Website Sekolah Menengah Kejuruan Negeri 1 Sragen NAMA : Sugeng Wardoyo NIM : 200922027 Proposal ini telah disetujui Surakarta, Juli 2017 Pembimbing 1 Pembimbing 2 Dimas Sasongko, S. Kom., M.Eng. Bayu Mukti, S.Kom. NIPY. 19850502 061024 1 159 NIPY. 55401.061024-070792
  • 3. iii UNIVERSITAS SURAKARTA FAKULTAS TEKNIK ELEKTRO DAN INFORMATIKA LEMBAR PENGESAHAN PROPOSAL SKRIPSI JUDUL : Implementasi Desain Responsif Pada Pengembangan Antarmuka Website Sekolah Menengah Kejuruan Negeri 1 Sragen NAMA : Sugeng Wardoyo NIM : 200922027 Surakarta, Juli 2017 Pembimbing 1 Pembimbing 2 Dimas Sasongko, S. Kom., M.Eng. Bayu Mukti, S.Kom. NIPY. 19850502 061024 1 159 NIPY.55401.061024-070792 Ketua Program Studi Teknik Informatika (S1) Ir. Tri Irianto Tj, M.T NIP. 19620311 199303 1 001
  • 4. iv Implementasi Desain Responsif Pada Pengembangan Antarmuka Website Sekolah Menengah Kejuruan Negeri 1 Sragen Sugeng Wardoyo, 200922027, wardoyosugeng79@yahoo.co.id Fakultas Teknik Elektro dan Informatika, Universitas Surakarta Deskripsi Sekolah Menengah Kejuruan Negeri 1 Sragen (SMKN 1 Sragen) sudah memiliki situs web dengan alamat situs www.smkn1sragen.sch.id. Hasil evaluasi yang dilakukan pada website SMKN 1 Sragen, bahwa website SMKN 1 Sragen belum menyesuaikan dengan ukuran layar perangkat pengguna. Tampilan user interface website SMKN 1 Sragen tidak efektif khususnya pada perangkat mobile, hal ini dibuktikan dengan pengguna perlu melakukan zoom in, zoom out, dan slide untuk melihat konten website.. Rumusan masalah pada penelitian ini adalah desain tampilan website SMKN 1 Sragen belum menyesuaikan dengan beragam ukuran layar pengguna dan bagaimana menerapkan metode Responsive Web Design pada pengembangan website SMK Negeri 1 Sragen. Tujuan dari penelitian ini adalah untuk mengembangkan website SMKN 1 Sragen menyesuaikan dengan layar pengguna. Metode pengembangan website yang digunakan dalam penelitian ini adalah metode Responsive Web Design. Tahapan dalam metode Responsive Web Design yang digunakan dalam penelitian ini terdiri dari analisis kebutuhan pengguna, content strategy, wireframing, pengujian, dan implementasi Hasil yang diharapkan dari penelitian ini adalah website Sekolah Menengah Kejuruan Negeri 1 Sragen mampu menyesuaikan dengan beragam ukuran layar perangkat yang digunakan oleh pengguna. Selanjutnya, hasil pengembangan diharapkan dapat dijadikan sebagai masukkan untuk implementasi website Sekolah Menengah Kejuruan Negeri 1 Sragen. Kata Kunci : website, layout website, Responsive Web Design Pustaka : 11 (2001-2016)
  • 5. v The Implementation of Responsive Design on Website Interface Development of Vocational High School 1 Sragen Sugeng Wardoyo, 200922027, wardoyosugeng79@yahoo.co.id Faculty of Electrical Engineering and Informatics, University of Surakarta Description Vocational High School 1 Sragen (SMKN 1 Sragen) already has a website with the website address www.smkn1sragen.sch.id. The results of the evaluation conducted on the website SMKN 1 Sragen, that SMKN 1 Sragen website has not adjusted to the screen size of the user device. The look of SMKN 1 Sragen website user interface is not effective especially on mobile devices, this is proven by users need to zoom in, zoom out, and slide to view website content .. The formulation of the problem in this research is the website display design SMKN 1 Sragen not adjust to the various screen size of the user and how to apply Responsive Web Design method on the website development of SMK Negeri 1 Sragen. The purpose of this research is to develop website SMKN 1 Sragen adjust to user screen. Website development method used in this research is Responsive Web Design method. Stages in the Responsive Web Design method used in this study consist of user needs analysis, content strategy, wireframing, testing, and implementation The expected result of this study is the website of Vocational High School 1 Sragen able to adjust to the various screen sizes of devices used by users. Furthermore, the results of the development is expected to be used as an input for the implementation of the website of Vocational High School 1 Sragen. Keywords : website, layout website, Responsive Web Design. References : 11 (2001-2016)
  • 6. vi DAFTAR ISI Halaman Halaman Judul ................................................................................................................ i Halaman Persetujuan ..................................................................................................... ii Halaman Pengesahan ..................................................................................................... iii Deskripsi ......................................................................................................................... iv Description...................................................................................................................... v Daftar Isi ......................................................................................................................... vi I. Latar Belakang Masalah .................................................................................... 1 II. Rumusan Masalah ............................................................................................. 2 III. Batasan Masalah ............................................................................................... 3 IV. Tujuan Peneltian ............................................................................................... 3 V. Manfaat Penelitian ............................................................................................ 3 VI. Metode Penelitian ............................................................................................ 3 VII. Landasan Teori .................................................................................................. 5 VIII. Tinjauan Pustaka ............................................................................................... 9 IX. Sistematika Penulisan ........................................................................................ 11 X. Kerangka Pemikiran .......................................................................................... 12 XI. Jadwal Penyusunan Penelitian .......................................................................... 13 XII. Perencanaan Biaya ............................................................................................ 14 Daftar Pustaka............................................................................................................. 15 Lampiran
  • 7. 1 I. LATAR BELAKANG MASALAH Pemanfaatan kemajuan teknologi informasi dan komunikasi (TIK) dalam menjalankan proses operasional sekolah menjadi suatu keharusan agar sekolah bisa memberikan pelayanan terbaik kepada masyarakat. Salah satunya dengan pembangunan situs web sekolah yang dapat memenuhi kebutuhan dari para penggunanya. Tujuan pembangunan situs web adalah memberikan layanan informasi kepada pengguna secara efektif dan efisien yang pada akhirnya kepuasan pengguna dapat tercapai. Dengan situs web diharapkan dapat meningkatkan pelayanan sekolah kepada masyarakat. Mobile device berkembang sangat pesat, sekitar enam milyar mobile device digunakan di seluruh dunia. Mobile device memiliki ukuran resolusi layar yang beragam, mobile device yang populer memiliki resolusi layar antara 280 pixel sampai 1920 pixel. Tahun 2011 lebih dari lima puluh persen data penjualan perangkat personal computer (PC) dan non-PC adalah smartphone dan tablet, hal itu melebihi data penjualan laptop, notebook dan netbook (Sasongko, 2016). Sekolah Menengah Kejuruan Negeri 1 Sragen (SMKN 1 Sragen) sudah memiliki situs web dengan alamat situs www.smkn1sragen.sch.id. Website SMKN 1 Sragen digunakan sebagai media informasi dan komunikasi antara sekolah dengan siswa, sekolah dengan orang tua, sekolah dengan lembaga-lembaga terkait dan sekolah dengan masyarakat. Hasil evaluasi yang dilakukan pada website SMKN 1 Sragen oleh Wardoyo (2017), bahwa website SMKN 1 Sragen belum menyesuaikan dengan ukuran
  • 8. 2 layar perangkat pengguna. Tampilan user interface website SMKN 1 Sragen tidak efektif khususnya pada perangkat mobile, hal ini dibuktikan dengan pengguna perlu melakukan zoom in, zoom out, dan slide untuk melihat konten website (Wardoyo, 2017). Pada penelitian yang akan dilakukan desain responsif digunakan untuk membantu pengembangan tampilan antarmuka pengguna website SMKN 1 Sragen, sehingga hasil halaman website dapat menyesuaikan beragam resolusi layar dan informasi yang ditampilkan konsisten untuk perangkat desktop dan mobile. Metode yang digunakan untuk pengembangan tampilan antarmuka website SMKN 1 Sragen adalah Responsive Web Design. Penelitian yang dilakukan mengambil judul penelitian “Implementasi Desain Responsif Pada Pengembangan Antarmuka Website Sekolah Menengah Kejuruan Negeri 1 Sragen”. II. RUMUSAN MASALAH Dari uraian latar belakang masalah, maka penulis dapat merumuskan masalah dalam penulisan penelitian ini yaitu : 1. Desain tampilan website SMKN 1 Sragen belum menyesuaikan dengan beragam ukuran layar pengguna. 2. Bagaimana menerapkan metode Responsive Web Design pada pengembangan website SMK Negeri 1 Sragen ?
  • 9. 3 III. BATASAN MASALAH Batasan pada penelitian ini adalah : 1. Fokus penelitian pada perangkat mobile dengan ukuran layar perangkat 4,5 inch, 5 inch, dan 7 inch. 2. Fokus penelitian pada perangkat desktop dengan ukuran layar perangkat 10 inch, 12 inch, dan 14 inch. IV. TUJUAN PENELITIAN Tujuan dari penelitian ini adalah untuk mengembangkan website SMKN 1 Sragen menyesuaikan dengan layar pengguna dengan menggunakan metode Responsive Web Design. V. MANFAAT PENELITIAN Manfaat yang diharapkan dari penelitian ini adalah : 1. Website SMKN 1 Sragen dapat menyesuaikan dengan layar pengguna. 2. Pengguna dapat mudah dan nyaman melakukan akses website SMKN 1 Sragen menggunakan perangkat desktop dan mobile. VI. METODE PENELITIAN Adapun metode penelitian yang dilakukan sebagai berikut : Metode Pengumpulan Data a. Observasi
  • 10. 4 Observasi dilakukan dengan melakukan pengamatan langsung pada website SMKN 1 Sragen dan pada pengguna ketika mengakses website SMKN 1 Sragen. b. Wawancara Wawancara dilakukan dilakukan kepada responden untuk mengetahui lebih lanjut pendapat dari responden tentang website SMKN 1 Sragen. c. Kepustakaan Berisi sumber data berupa buku, prosiding seminar dan jurnal yang membahas tentang website, layout website, dan Responsive Web Design. Metode Pengembangan a. Analisis Menganalisa kebutuhan pengguna, content strategy dan tampilan antarmuka pengguna website SMKN 1 Sragen. b. Desain Membuat desain pengembangan website SMKN 1 Sragen berdasarkan data dari analisis. Desain yang dibuat adalah berupa wireframe. c. Pembuatan Membuat pengembangan website SMKN 1 Sragen berdasarkan data dari desain. Pembuatan website menggunakan Wordpress. d. Pengujian
  • 11. 5 Tahapan pengujian ini adalah melakukan pengujian hasil pengembangan website SMKN 1 Sragen. metode yang digunakan dalam pengujian adalah metode compatibility. e. Implementasi Tahap implementasi merupakan tahap sosialisai halaman website pada pengguna untuk mengetahui kesesuaian desain hasil pengembangan website SMKN 1 Sragen dengan kebutuhan pengguna. VII. LANDASAN TEORI 1. Website Hildreth (2008) mendefinisikan website merupakan jaringan komputer yang terdiri dari situs-situs yang berisikan data serta informasi berupa teks, gambar, suara, dan animasi maupun gabungan dari semuanya. Website dapat bersifat statis maupun dinamis, yang membentuk satu rangkaian bangunan yang saling terkait dimana masing-masing dihubungkan dengan jaringan-jaringan halaman atau hyperlink (Amanda, 2011). Menurut Sidik (2001), website merupakan kumpulan dokumen–dokumen yang tersebar di mesin–mesin di internet. Dokumen ini biasa disebut page (halaman HTML). Tiap page mengandung link ke page yang lain di mesin yang lain di internet. Halaman website yang melakukan point ke halaman yang lain ini dinamakan menggunakan Hypertext. String yang melakukan link ke halaman yang lain disebut dengan Hyperlink (Sidik, 2001).
  • 12. 6 Jenis website dilihat dari tujuannya terdiri dari (Davis, 2001): 1. Personal web, website yang berisi tentang hal-hal pribadi seseorang 2. Corporate web, website yang dimiliki oleh sebuah perusahaan dan berisi informasi dan data perusahaan 3. Portal web, website yang menyediakan berbagai layanan sepert berita, email, dan jasa lainnya 4. Forum web, website yang memiliki tujuan sebagai media diskusi, serta website yang menyediakan berbagai layanan penting seperti e-Government, e- Bangking, e-Learning, dan lain-lain. 2. Layout Website Layout adalah penyusunan elemen-elemen kedalam sebuah bidang sehingga membentuk susunan artistik. Tujuan utama layout adalah menampilkan elemen gambar dan teks agar menjadi komunikatif dalam sebuah cara yang dapat memudahkan pembaca menerima informasi yang disajikan (www.satriamultimedia.com; diakses tanggal 20 Juli 2016). 3. Kategori Layout Website Desain layout website dapat dikelompokkan menjadi empat kategori berdasarkan pengaturan lebar halaman website, yaitu fixed-width, liquid atau fluid, elastic dan hybrid (Gillenwater, 2010) a. Fixed-width Layout fixed-width merupakan layout yang paling umum digunakan pada halaman website. Lebar keseluruhan desain layout fixed-width
  • 13. 7 diatur ke dalam sebuah nilai dengan satuan piksel yang ditentukan oleh pembuat website. Pada umumnya pembuat website memilih lebar berdasarkan pada salah satu dari resolusi layar yang umum digunakan, yaitu 800x600 atau 1024x768. Layout fixed-width merupakan desain yang kaku, karena komponen website diatur dalam lebar yang tetap. Pengguna yang melihat website dengan desain fixed-width dari browser dengan ukuran apa pun akan melihat website beserta komponennya dalam lebar yang tetap dan tidak akan berpindah. Website yang menggunakan layout fixed-width maka lebar layout website tetap sama bahkan ketika dilihat di browser yang berbeda. b. Liquid/fluid Layout fluid merupakan layout yang perubahan lebarnya berdasarkan pada ukuran viewport pengguna, sehingga membuat keseluruhan tampilan website terlihat baik pada browser yang berbeda. Lebar layout desain fluid ditentukan oleh presentase bukan ukuran piksel seperti pada layout fixed-width. Elemen-elemen website pada layout fluid menyesuaikan dengan baik pada ukuran layar dan resolusi layar yang berbeda. c. Elastic Layout elastic merupakan layout yangperubahan lebarnya berdasarkan pada ukuran ukuran teks yang ditetapkan pada perangkat browsing
  • 14. 8 pengguna. Pengguna yang telah menetapkan ukuran teks lebih besar dari ukuran teks default akan melihat halaman di mana tidak hanya teks yang lebih besar, tetapi seluruh tata letak akan lebih besar secara proporsional. d. Hybrid Layout hybrid adalah layout yang dihasilkan dari penggabungan dua atau lebih layout yang sudah ada. Jenis layout hybrid yang umum digunakan adalah sidebar yang dibangun menggunakan layout fixed- width dan konten yang menggunakan layout fluid. 4. Responsive Web Design Responsive Web Design merupakan salah satu metode desain dengan menggabungkan HTML5 dan CSS3 untuk arsitektur desain web agar website dapat menyesuaikan dengan berbagai ukuran resolusi layar (Marcotte, 2010). Tujuan dari RWD adalah membuat halaman website terlihat sama pada beragam ukuran piksel dan ukuran layar (Kim, 2013). Manfaat utama dari teknik RWD adalah website yang dirancang akan memberikan pengalaman yang konsisten kepada pengguna, yang kemudian akan meningkatkan user experience (pengalaman pengguna). Teknik Responsive Web Design mempunyai tiga bagian inti yaitu : fluid layout, flexible image dan media queries (Marcotte, 2011).
  • 15. 9 VIII.TINJUAN PUSTAKA Penelitian Medi Suhartanto (2012) dengan judul “Pembuatan Website Sekolah Menengah Pertama Negeri 3 Delanggu Dengan Menggunakan Php dan MySQL” penelitian yang dilakukan memiliki tujuan menyajikan website yang dinamis untuk sekolah Menegah Pertama Negeri 3 Delanggu sebagai sarana promosi dan publikasi. Karena sistem ini bertujuan sebagai sumber informasi sekolah SMP Negeri 3 Delanggu maka sistem ini dibuat secara sederhana dan mudah digunakan. Sistem ini memiliki fasilitas-fasilitas antara lain adalah Home, Profil Sekolah, Fasilitas Sekolah, Data Karyawan, Berita, Kesiswaan yang meliputi unit kegiatan dan prestasi, Galeri Foto dan yang terakhir buku tamu. SMP Negeri 3 Delanggu sekarang sudah memiliki website sebagai sarana promosi dan publikasi kepada masyarakat umum dengan alamat situs http://smpn3delanggu.sch.id/ Sehingga dapat dimanfaatkan oleh masyarakat yang ingin mencari informasi seputar SMP N 3 Delanggu tanpa harus datang kesekolah. Penelitian Pringgo Winoto dan Tri Iriantio Tj (2012) dengan judul “Pembuatan Website Profil Sekolah Dasar Negeri 03 Kalisoro” penelitian yang dilakukan memiliki tujuan menghasilkan website profil untuk menyampaikan informasi dan mempromosikan tentang Sekolah Dasar Negeri 03 Kalisoro kepada masyarakat umum. Metode yang dilakukan dalam penelitian antara lain Kepustakaan, observasi,analisis dan perancangan, pembuatan website, implementasi. Sekolah Dasar Negeri 03 Kalisoro sudah mempunyai website,
  • 16. 10 sehingga masyarakat bisa mencari informasi mengenai Sekolah Dasar Negeri 03 Kalisoro secara online. Dengan adanya website ini jangkauan informasi yang diberikan lebih luas bukan hanya masyarakat sekitar namun dari segala penjuru mampu mengetahui Sekolah Dasar Negeri 03 Kalisoro dengan lebih lengkap dan jelas melalui media internet. Penelitian Dina Khusnia dan Berliana Kusuma Riasti (2014) dengan judul “Pembuatan Website Profil Sekolah Menengah Pertama Negeri 1 Kalitudu Bojonegoro” penelitian yang dilakukan memiliki tujuan menghasilkan website profil Sekolah Menengah Pertama Negeri 1 Kalitudu yang dinamis, yang dapat digunakan sebagai media penyampaian informasi yang lebih efektif dan efisien. Metode penelitian yang penulis pergunakan adalah: kepustakaan, observasi, wawancara, analisis, perancangan, pembuatan, uji coba dan implementasi. Website profil ini dibuat dengan menggunakan PHP dan MySQL. Dan dengan adanya website tersebut SMP N 1 Kalitidu dapat menyampaikan informasi secara luas ke masyarakat umum dengan lebih efektif dan efisien. Penelitian yang akan dilakukan oleh peneliti memiliki perbedaan pada metode desain dan pembuatan yaitu menggunakan Responsive Web Design. Penelitian difokuskan pada pengembangan antarmuka website SMKN 1 Sragen untuk bisa menyesuaikan dengan ukuran layar pengguna.
  • 17. 11 IX. SISTEMATIKA PENULISAN Untuk mempermudah dalam penyususunan skripsi, maka penulis menggunakan sistematika penulisan yang terdiri dari : BAB I PENDAHULUAN Bab ini bertulisan tentang latar belakang, rumusan masalah, batasan masalah, tujuan penelitian, manfaat penelitian, metode penelitian, dan sistematika penyusunan skripsi. BAB II GAMBARAN UMUM, LANDASAN TEORI DAN TINJAUAN PUSTAKA Bab ini berisi tulisan tentang gambaran umum SMKN 1 Sragen. Landasan teori berisi tentang teori website, layout website dan Responsive Web Design. Tinjauan pustaka berisi tulisan tentang review penelitian sebelumnya yang sejenis dan dapat dibedakan dengan penelitian yang sedang dilakukan. BAB III METODE PENELITIAN Berisi tentang alat dan bahan, dan alur penelitian. BAB IV HASIL DAN PEMBAHASAN Bab ini berisi tulisan tentang desain, pengujian dan implementasi website SMKN 1 Sragen. BAB V PENUTUP Berisi kesimpulan dan saran. DAFTAR PUSTAKA LAMPIRAN
  • 18. 12 X. ALUR PENELITIAN Alur penelitian pengujian antarmuka website SMKN 1 Sragen, sebagai berikut : Gambar 1.1 Alur Penelitian Mulai Studi Literatur Produk Pembanding Desain Website Pembuatan Website Pengujian website Implementasi Website Selesai Uji Kompatibel Sesuai Tidak Sesuai
  • 19. 13 XI. JADWAL PENYUSUNAN PENELITIAN Kegiatan akan dimulai pada Bulan Juni 2017 dan direncanakan akan berakhir pada Agustus 2017. Adapun tabel rencana kegiatan penelitian sebagai berikut : Tabel 1.1 Jadwal Penelitian No Kegiatan Juni 2017 Juli 2017 Agustus 2017 1 2 3 4 1 2 3 4 1 2 3 4 1 Sudi literatur 2 Produk pembanding 3 Desain website 4 Pembuatan website 5 Pengujian website 6 Implementasi website
  • 20. 14 XII. PERENCANAAN BIAYA Berisi daftar semua biaya yang diperlukan dalam penelitian, termasuk barang habis/tidak habis pakai, sewa, upah, jasa, dsb. Tabel 1.2 Perencaan Biaya No. Jenis Pengeluaran Biaya Pengeluaran 1 Sewa Komputer Rp 200.000 2 Cetak Laporan Rp 35.000 3 Alat Tulis Rp 17.000 4 CD Blank + Tempat CD Rp 15.000 5 Buku Referensi Rp 110.000 6 Jilid dan Penggandaan Laporan Rp 95.000 7 Biaya Internet Rp 150.000 8 Transportasi Rp 150.000 9 Biaya Desainer Rp 150.000 10 Biaya Programmer Rp 400.000 Total Biaya Rp 1.332.000
  • 21. 15 DAFTAR PUSTAKA Gillenwater. Z. M. 2010. Flexible Web Design: Creating Liquid and Elastic Layouts With CSS. Peachpit Press. Khusnia. D, Riasti. BK,. 2014. Pembuatan Website Profil Sekolah Menengah Pertama Negeri 1 Kalitudu Bojonegoro. Indonesian Journal on Networking and Security. Vol. 3 No.1. Kim. B,. 2013. Responsive Web Design, Discoverability, and Mobile Challenge Libr. Technol. Rep., vol. 49, no. 6, pp. 29–39. Marcotte. E,. 2010. Responsive web design. List Apart, vol. 306. Marcotte. E,. 2011. Responsive design. Book Apart N. Y. Noviandhi, A., 2011, Perbandingan Pengaruh User Experience Pada Situs Terhadap Citra Merek Pada Pengguna Goal-Directed Dan Pengguna Experiental (Studi Kasus Pada Situs www.hellosoursally.com Terhadap Citra Merek Sour Sally, Skripsi, FISIPOL Universitas Indonesia. Sasongko. D. 2016. Pengembangan Antarmuka Perpustakaan Digital Menggunakan Responsive Web Design Dengan Pendekatan User Experience (Studi Kasus Pada Perpustakaan Digital Universitas Surakarta). Tesis. Universitas Gadjah Mada Yogyakarta. Sidik. B. 2001. Pemrograman Web dengan PHP. Bandung: Informatika. Suhartanto. M,. 2012. Pembuatan Website Sekolah Menengah Pertama Negeri 3 Delanggu Dengan Menggunakan Php Dan MySQL. Sentra Penelitian Engineering dan Edukasi. Vol. 4 No.1. Winoto. P,. 2012. Pembuatan Website Profil Sekolah Dasar Negeri 03 Kalisoro. Sentra Penelitian Engineering dan Edukasi. Vol. 4 No.1. www.satriamultimedia.com (diakses tanggal 20 Juli 2016)