LAPORAN TUGAS

SISTEM INFORMASI GEOGRAFIS BERBASIS WEB

PERSEBARAN HOTEL DI KOTA MALANG

Dosen Pengampu :
Dedy Kurnia Sunaryo, ST,.MT

Disusun Oleh :
Verinda Septita N

14.25.908

Denny Santana Sinaga

14.25.915

M Aldin Yusfan

14.25.919

Sri Kartika Sakti

14.25.920

Husein Agustino K

14.25.925

TEKNIK GEODESI DAN GEOINFORMATIKA

FAKULTAS TEKNIK SIPIL DAN PERENCANAAN
INSITUT TEKNOLOGI NASIONAL
MALANG
2014

Daftar Isi
Daftar Isi ..........................................................................................................

Jadwal Rencana ................................................................................................

Kualitas Informasi ............................................................................................

Presentasi ...........................................................................................................

Tujuan ............................................................................................

Dasar Teori ....................................................................................

Skema Konseptual .........................................................................

Diagram .........................................................................................

Skema SIG .....................................................................................

Tampilan Web ...............................................................................

10

Pembuatan Peta ................................................................................................

11

A.

Mengelola Peta .dwg di software arcGIS ......................................

11

B.

Kompres file ke format .zip untuk upload di arcGis.com .............

12

Upload Peta .......................................................................................................

13

A.

Menambahkan Layer dari Shapefile (.shp)....................................

13

B.

Menambahkan Layer dari file .CSV ..............................................

14

C.

Menyimpan Peta ............................................................................

15

D.

Share / Embed Map .......................................................................

15

Pembuatan Website ..........................................................................................

16

A.

Melakukan Pemotongan Gambar ..................................................

17

B.

Membuat Chatbox untuk Website .................................................

17

C.

Design Web menggunakan Web Page Maker ...............................

17

D.

Publikasi hasil design di Web Page Maker ...................................

20

Upload Website .................................................................................................

21

A.

Pendaftaran Domain ......................................................................

21

B.

Pendaftaran Hosting ......................................................................

22

C.

Upload Design Web.......................................................................

23

Teknik Geodesi dan Geoinformatika

Fakultas Teknik Sipil dan Perencanaan | Institut Teknologi Nasional

Jadwal Rencana Pembuatan Sistem Informasi Geograsis Berbasis WEB

Nama Kegiatan
Minggu ke

Pembuatan
Kelompok dan
Perencanaan

Membuat
power point

Pembuatan
web dengan
prosentase 30
%

Pembuatan
Web dengan
prosentase
60%

Mencari data
dan
Mengolah data
melakukan
survei

Pembuatan
peta

Pemrograman
sistem Informasi
Berbasis WEB

Publikasi

1
2
3
4
5
6
: perencanaan
: pelaksanaan

Persebaran Hotel di Kota Malang | SIG berbasis Web 2014

Teknik Geodesi dan Geoinformatika

Fakultas Teknik Sipil dan Perencanaan | Institut Teknologi Nasional

KUALITAS INFORMASI

Seiring dengan perkembangan jaman dan teknologi, manusia semakin membutuhkan

informasi yang tidak terbatas. Tanpa dibatasinya manusia untuk mencari informasi, terdapat
banyak cara untuk mendapatkan informasi yang dibutuhkan. Untuk memenuhi informasi, salah
satunya adalah dengan membentuk Sistem Informasi Geografis.
Sistem adalah suatu kesatuan yang terdiri komponen atau elemen yang dihubungkan
bersama untuk memudahkan aliran informasi, materi atau energi untuk mencapai suatu tujuan.
Informasi adalah pesan (ucapan atau ekspresi) atau kumpulan pesan yang terdiri dari order
sekuens dari simbol, atau makna yang dapat ditafsirkan dari pesan atau kumpulan pesan.
Geografis adalah keterangan tentang suatu lokasi serta persamaan dan perbedaan (variasi)
keruangan atas fenomena fisik dan manusia di atas permukaan bumi.
Berdasarkan pengertian-pengertian di atas dapat disimpulkan bahwa pengertian dari
Sistem Informasi Geografis adalah sistem komputer yang memiliki kemampuan untuk
membangun, menyimpan, mengelola dan menampilkan informasi berefrensi geografis, misalnya
data yang diidentifikasi menurut lokasinya, dalam sebuah database.
Web adalah halaman informasi yang disediakan melalui jalur internet sehingga dapat
diakses dimana pun da nkapan pun selama masih terhubung dengan internet. Kesimpulannya, arti
dari SIG berbasis web adalah sistem informasi bereferensi geografis dalamsebuah database yang
disediakan melalui jalur internet.
Pembuatan SIG berbasis web yang bertemakan persebaran hotel di kota Malang ini dapat
sangat berguna bagi pengguna informasi. Apabila pengguna ingin mengetahui tempat untuk
beristirahat dan menginap dengan berbagai fasilitas yang ditawarkan maka pengguna dapat
secara langsung mengakses web yang kami buat.
Untuk mendapatkan informasi yang akan kami tampilkan di WEB, kami melakukan
survey sehingga informasi yang kami tampilkan benar dan akurat. Sekarang ini web dapat
dengan mudah diakses dimanapun dan kapanpun sehingga dapat diakses tepat pada saat
dibutuhkan.
Informasi persebaran hotel yang kami berikan sangat efisien karena pengguna informasi
dapat mengetahui informasi letak, harga, dan fasilitas hotel tersebut secara langsung tanpa harus

Persebaran Hotel di Kota Malang | SIG berbasis Web 2014

Teknik Geodesi dan Geoinformatika

Fakultas Teknik Sipil dan Perencanaan | Institut Teknologi Nasional

berkeliling Kota Malang dan bertanya kepada banyak orang untuk mendapatkan lokasi hotel
secara tepat.
Untuk mendapatkan informasi pada Web tidak membutuhkan banyak biaya, hanya
memerlukan koneksi internet. Tidak membuang banyak biaya seperti transportasi dan tenaga.
Informasi yang kami berikan di dalam Web ini, kami dapatkan di internet dan kami
buktikan dengan melakukan survey kelokasi-lokasi hotel yang ada di dalam Web kami. Sehingga
informasi yang diberikan dapatdipercaya.
Kualitas informasi yang kami berikan selalu konsisten. Kami memberikan informasi
dengan kualitas yang baik dan tidak berubah-ubah. Agar kualitas informasi yang kami berikan
selalu baik maka kami selalu meng-update setiap ada perubahan pada fasilitas, tarif, lokasi
ataupun kelas pada hotel- hotel yang terdapat pada web kami.
Informasi yang ada di dalam Web selalu diperbaharui ketika ada perubahan tarif, fasilitas,
maupun lokasinya. sehingga pada saat pengguna informasi membutuhkan informasi yang kami
sediakan, informasinya sudah ter-update.

Persebaran Hotel di Kota Malang | SIG berbasis Web 2014

Teknik Geodesi dan Geoinformatika

Fakultas Teknik Sipil dan Perencanaan | Institut Teknologi Nasional

PERSEBARAN HOTEL DI KOTA MALANG

SISTEM INFORMASI GEOGRAFIS BERBASIS WEB
TEKNIK GEODESI
INSTITUT TEKNOLOGI NASIONAL
MALANG
Anggota Kelompok :
Verinda Septita N
14.25.908
Denny Santana Sinaga
14.25.915
M Aldin Yusfan
14.25.919
Sri Kartika Sakti
14.25.920
Husein Agustino K
14.25.925
Persebaran Hotel di Kota Malang | SIG berbasis Web 2014

Teknik Geodesi dan Geoinformatika

Fakultas Teknik Sipil dan Perencanaan | Institut Teknologi Nasional

Memberikan informasi hotel di kota malang, meliputi :

Persebaran / Lokasi
Tarif dan Fasilitas berdasarkan kelas yang ditawarkan
oleh Hotel terkait.
Memberi kemudahan bagi pengguna untuk mencari tempat
penginapan di kota malang.

Persebaran Hotel di Kota Malang | SIG berbasis Web 2014

Teknik Geodesi dan Geoinformatika

Fakultas Teknik Sipil dan Perencanaan | Institut Teknologi Nasional

Sistem informasi geografis adalah sistem informasi yang

mampu mengintegrasikan informasi tertentu yang dapat
bermanfaat bagi pengguna informasi.
Hotel adalah suatu jenis bangunan yang dirancang khusus
sebagai tempat yang menyediakan jasa pelayanan penginapan,
penyedia makanan dan juga minuman, serta tidak ketinggalan
fasilitas-fasilitas yang lainnya.
Sistem Informasi Geografis mengenai persebaran hotel di Kota
Malang
merupakan integrasi informasi geografis hotel beserta
informasi atribut (fasilitas, tarif, dan kelas) yang dapat
bermanfaat bagi pengguna informasi.
Persebaran Hotel di Kota Malang | SIG berbasis Web 2014

Teknik Geodesi dan Geoinformatika

Fakultas Teknik Sipil dan Perencanaan | Institut Teknologi Nasional

Sistem basisdata merupakan

bagian penting pada sistem
informasi, berguna untuk mengelola
sumber informasi pada suatu
organisasi. Hal utama yang harus
dilakukan adalah merancang suatu
sistem basisdata agar informasi
yang ada pada organisasi tersebut
dapat digunakan secara maksimal.
Tujuan Perancangan basisdata
mempermudah
proses
perekaman, perubahan dan
pemanggilan data informasi
yang berkaitan tentang hotel.
Menyediakan informasi yang
optimal
sesuai
dengan
Persebaran Hotel di Kota Malang | SIG
berbasis Web 2014
kebutuhan pengguna.

Teknik Geodesi dan Geoinformatika

Fakultas Teknik Sipil dan Perencanaan | Institut Teknologi Nasional

Persebaran Hotel di Kota Malang | SIG berbasis Web 2014

Teknik Geodesi dan Geoinformatika

Fakultas Teknik Sipil dan Perencanaan | Institut Teknologi Nasional

Persebaran Hotel di Kota Malang | SIG berbasis Web 2014

Teknik Geodesi dan Geoinformatika

Fakultas Teknik Sipil dan Perencanaan | Institut Teknologi Nasional

Persebaran Hotel di Kota Malang | SIG berbasis Web 2014

10

Teknik Geodesi dan Geoinformatika

Fakultas Teknik Sipil dan Perencanaan | Institut Teknologi Nasional

Pembuatan Peta
Pembuatan peta ini ditujukan untuk menampilkan letak geografis persebaran hotel
yang berlokasi di kota Malang yang nantinya dapat diakses secara global melalui jaringan
internet.
Pada tahap pembuatan peta ini, kami menggunakan software arcGIS. Adapun peta
yang kami gunakan bersumber dari peta garis digital yang memiliki keterangan sebagai
berikut :

Sumber data

: IKONOS

Datum

: WGS84

Geocolor 1m Orthorektifikasi

Sistem Koordinat

: UTM zona 49s

Tanggal Perekaman

Jumlah file

: 13 file

Format file

: CAD (.dwg)

: 5 Agustus 2003

Titik Kontrol Tanah : GPS

Berikut contoh langkah-langkah pengolahan peta dalam arcGIS hingga proses

kompres file ke format .zip :

A. Mengelola Peta .dwg di software arcGIS.

1. Membuka software arcMap.
2. Membuka data .dwg
a. Pilih Add Data > pilih file 1.2.dwg > klik Add
b. Muncul kotak dialog unknown spatial reference > klik OK
c. Perhatikan tulisan koordinat di kanan bawah, masih tertulis unknown
units.
3. Mengatur sistem koordinat
a. Klik kanan layer > Properties > Coordinat System
b. Pilih Predifined > Projected Coordinate System >UTM > WGS
1984 > Shoutern Hemisphere > cari dan pilih WGS 1984 UTM Zone
49s > OK
c. Perhatikan tulisan koordinat di kanan bawah, sudah menunjukkan
unit yang sesuai.
4. Export data ke format shapefile (.shp)
a.

Expand layer 1.2.dwg Group Layer

Persebaran Hotel di Kota Malang | SIG berbasis Web 2014

11

Teknik Geodesi dan Geoinformatika

Fakultas Teknik Sipil dan Perencanaan | Institut Teknologi Nasional

b. Pilih jenis data yang akan di-export, misal polyline maka klik kanan
1.2.dwg Polyline > Data > Export Data
c. Menentukan lokasi dan nama file, klik icon folder > mencari lokasi
penyimpanan > memberikan nama file, misal 1.2-polyline.shp >
Save > OK
d. Muncul kotak dialog tambah data yang di-export sebagai layer di
peta?, Ya
5. Mematikan layer 1.2.dwg Group Layer untuk melihat perubahan pada layar.
6. Menyimpan data sesuai dengan kategorinya
a. Klik kanan layer 1.2-polyline > Open Attribute Table
b. Muncul tabel yang memuat informasi yang terdapat pada layer
tersebut.
c. Pilih Table Option > Select by Attribute > isikan kode sesuai dengan
data yang akan di panggil, misal memanggil data bangunan dengan
kode Layer = Bangunan > Apply
d. Maka data yang terpanggil akan muncul (ter-select), untuk
memastikannya klik icon Show selected records pada tabel
e. Klik kanan layer 1.2-polyline > Data > Export Data > pilih the data
frame > memberi nama, misal 1.2-polyline-bangunan.shp
f. Muncul kotak dialog tambah data yang di-export sebagai layer di
peta?, Ya
7. Mematikan layer 1.2-polyline untuk melihat perubahan pada layar.
8. Mengulangi langkah 1-7 untuk mengambil data lainnya yang dibutuhkan.

B. Kompres file ke format .zip untuk upload di arcGis.com.

1. Buka folder lokasi penyimpanan file shapefile (.shp)
2. Memilih semua file yang mempunyai nama sama, misal 1.2.polylinebangunan.
3. Memastikan

files

tersebut

mempunyai

format

berbeda.

(.dbf,.prj,.sbn,.sbx,.shp,.shx)
4. Klik kanan > tambah ke arsip > Mengisikan nama arsip, memastikan format
arsip adalah ZIP > klik OK.
5. File 1.2.polyline-bangunan.zip sudah terbuat, dan siap di-upload.

Persebaran Hotel di Kota Malang | SIG berbasis Web 2014

12

Teknik Geodesi dan Geoinformatika

Fakultas Teknik Sipil dan Perencanaan | Institut Teknologi Nasional

Upload Peta
Pembuatan peta ini ditujukan untuk menampilkan letak geografis persebaran hotel
yang berlokasi di kota Malang yang dapat diakses secara global melalui jaringan internet.
Pada tahap kali ini kami membuat peta dari arcgis.com, situs tersebut menawarkan link
peta yang dibuat untuk ditampilkan pada website kami.

Adapun langkah-langkah pembuatan dan pengelolaan sebagai berikut:

A. Menambahkan Layer dari Shapefile (.shp).

1. Membuka arcgis.com.
2. Memilih sign in ke akun arcgis.com.
a. Mengisikan username dan password > klik sign in.
3. Membuka menu My Content.
4. Membuat peta baru
a. Klik Create Map.
5. Menambahkan layer
a. Klik Add > Add Layer from file > klik telusuri > pilih file yang akan
di-upload, misal I_bataskota.zip > klik Open.
b.Pilih Generalize feature for web display, untuk menyesuaikan hasil
digitasi untuk tampilan web. > klik Import Layer.
6. Merubah nama layer
a. Klik panah bawah kecil disamping layer I_bataskota > Rename.
b.Menyesuaikan nama, misal I_bataskota menjadi Batas Kota >
klik OK.
c. Maka nama dalam konten sudah berganti
7. Mengganti simbol
a. Klik panah bawah kecil disamping layer Batas Kota > Change
Symbols.
b.Klik change symbol > Menyesuaikan simbol yang digunakan, misal
batas kota menggunakan simbol garis putus-putus
c. Klik color untuk merubah warna, misal hitam.
d.Mengatur transparansi dan lebar > klik Done.

Persebaran Hotel di Kota Malang | SIG berbasis Web 2014

13

Teknik Geodesi dan Geoinformatika

Fakultas Teknik Sipil dan Perencanaan | Institut Teknologi Nasional

e. Klik Done Changing Symbols > Maka simbol yang terpakai sudah
berganti.

B. Menambahkan Layer dari file .CSV.

1. Menambahkan layer
a. Klik Add > Add Layer from file > klik telusuri > pilih file yang akan
di-upload, misal daftar fix.csv > klik Open.
b.Klik Import Layer.
2. Merubah nama layer
a. Klik panah bawah kecil disamping layer daftar fix > Rename.
b.Menyesuaikan nama, misal daftar fix menjadi Hotel > klik OK.
c. Maka nama dalam konten sudah berganti
3. Mengganti simbol
a. Klik panah bawah kecil disamping layer Hotel > Change Symbols.
b.Klik change symbol > Menyesuaikan simbol yang digunakan, misal
Hotel menggunakan simbol rumah / hotel.
c. Klik kolom preview > pilih People places > pilih simbol yang
menyerupai hotel.
d.Mengatur ukuran > klik Done.
e. Klik Done Changing Symbols > Maka simbol yang terpakai sudah
berganti.
4. Mengatur tampilan Pop-up
a. Klik panah bawah kecil disamping layer Hotel > Configure Pop-up.
b.Klik tanda + disamping kotak Pop-up title > pilih Nama Hotel
sebagai Judul
c. Klik Configure Attributes > mengatur informasi yang akan
ditampilkan pada pop-up, misal menggilangkan nama hotel karena
sudah terpakai untuk Judul dengan cara menghilangkan tanda check
(v)
d.Klik OK > Save Pop-Up.

Persebaran Hotel di Kota Malang | SIG berbasis Web 2014

14

Teknik Geodesi dan Geoinformatika

Fakultas Teknik Sipil dan Perencanaan | Institut Teknologi Nasional

C. Menyimpan Peta
1. Klik icon Save > pilih Save As. (karena belum pernah melakukan
penyimpanan sebelumnya)
2. Mengisikan informasi > pilih Save Map .

D. Share / Embed Map

1. Klik Share.
2. Beri tanda check pada Everyone (public).
3. Pilih embed in website,
4. Mengatur ukuran dan atribut apa saja yang akan ditampilkan pada peta.
5. Copy kode html, yang nantinya akan di paste ke website.

Persebaran Hotel di Kota Malang | SIG berbasis Web 2014

15

Teknik Geodesi dan Geoinformatika

Fakultas Teknik Sipil dan Perencanaan | Institut Teknologi Nasional

Pembuatan Website
Pada tahap kali ini kami akan menjelasakan tentang bagaimana langkah-langkah
pembuatan website yang akan kami gunakan untuk memuat informasi persebaran hotel di
kota Malang berserta sistem informasi geografisnya. Berbagai

aplikasi/software

dapat

digunakan untuk pembuatan design website, seperti Microsoft Office Publisher, Joomla,
Drupal, Jeruk, Wordpress, dsb.
CMS atau aplikasi yang ditawarkan untuk membuat design website sangatlah
beragam, mulai dari yang design manual melakukan koding dari 0 (nol), contoh
Notepad++ dan Adobe Dreamweaver. Ada pula yang semi manual tidak perlu koding
manual dari 0, melainkan design bisa menggunakan cara drag and drop, contoh Microsoft
Office Publisher, SiteSpinner dan Web Page Maker. Sampai dengan design website
menggunakan template yang sudah disediakan dan sistem yang sudah dikembangkan di
dalamnya, contoh Blogspot, Wix, website builder, Joomla, Drupal, Jeruk, Wordpress, dsb.
Kelompok kami memutuskan untuk menggunakan software Web Page Maker,
karena software ini menawarkan sistem design drag and drop, sehingga kami dapat
membuat design website sesuai dengan keinginan tanpa disulitkan untuk melakukan
koding dari 0 (nol). Software ini sudah dilengkapi dengan berbagai fitur lainnya, termasuk
meta tag yang berisi title, author, keyword, dan description sebagai syarat SEO sehingga
website dengan mudah ter-index di Google.
Web Page Maker is an easy to use web creator that helps you make your own web
pages with no experience or HTML knowledge. Just drag and drop images, text, music and
video.. into a layout. During the edit process, you can easily move the objects with your
mouse to anywhere on the page. Web Page Maker comes with some high quality templates
that help you to get started. Other features include thumbnail, mouse-over effects, readyto-use Java Script effects, text link style sheet, tables, forms, iframes etc... The program
also includes a built-in FTP publisher to allow you upload your site to the Internet by
pressing a publish button.

Persebaran Hotel di Kota Malang | SIG berbasis Web 2014

16

Teknik Geodesi dan Geoinformatika

Fakultas Teknik Sipil dan Perencanaan | Institut Teknologi Nasional

Adapun langkah-langkah pembuatan design website sebagai berikut:

A. Melakukan Pemotongan Gambar.
1. Membuka file gambar yang akan dijadikan background frame dasar
menggunakan microsoft office picture manager.
2. Klik Edit Pictures > Crop > mengatur ukuran potongan gambar, misal
mengambil bagian atas > klik OK.
3. Save As > Memberikan nama, misal frame-atas > klik save.
4. Melakukan langkah 1-3 hingga file gambar dapat terpotong menjadi
beberapa bagian.

B. Membuat Chatbox untuk Website.

1. Membuka website www.smartchatbox.com.
2. Pilih menu Create.
3. Memasuki halamam create free chatbox
a. Specify Settings, mengatur ukuran dan di website apa chatbox akan
dipasang.
b.Select Background, memilih tampilan dasar yang digunakan untuk
chatbox.
c. Preview, menampilkan contoh design chatbox yang akan terpasang.
d.Creat Admin, membuat 1 user admin, untuk mengelola isi
percakapan bila dibutuhkan.
e. Setelah selesai, klik Generate code of my smart chatbox.
4. Memasuki ke bagian pengaturan lanjutan
a. Menyesuikan pengaturan.
b.Melihat preview chatbox.
c. Setelah semuanya cocok, klik finish.
5. Copy kode Html dan paste ke design web yang dibuat.

C. Design Web menggunakan Web Page Maker.

1. Jalankan software Web Page Maker.
2. Menambahkan gambar dalam web
a. Pilih gambar > Drag and Drop ke Web Page Maker
b.Mengatur letak gambar, bisa di-Drag and Drop.

Persebaran Hotel di Kota Malang | SIG berbasis Web 2014

17

Teknik Geodesi dan Geoinformatika

Fakultas Teknik Sipil dan Perencanaan | Institut Teknologi Nasional

3. Mengatur Ukuran suatu Gambar

a. Klik kanan Gambar > pilih Properties > pilih General.
b.Atur ukuran pada menu Size > klik OK.
c. Tambahkan semua item dasar sehingga tampilan utama website
terbentuk.
4. Mengunci design utama
a. Klik kanan gambar > pilih Lock.
b.Lakukan pada semua item dasar sehingga tampilan utama website
terkunci.
5. Menambahkan teks pada halaman
a. Klik

> klik 2x pada kotak teks yang muncul > tulis teks dan

sesuaikan ukuran, font warna dan format > klik OK.

b.Mengatur letak teks, Drag and Drop.
6. Menggambar pada halaman
a. Klik icon Shape > pilih model yang akan digambar, misal kotak
maka pilih Rectangle.
b.Mengatur ukuran, bisa memanfaatkan Arrow Key untuk menggeser,
Shift + Arrow Key untuk megatur ukuran. Bisa juga menggunakan
pointer mouse untuk resize.
c. Mengatur posisi letak, misal akan dipindahkan ke layer paling
bawah maka klik kanan gambar > Layer > Send to All Back.
7. Page Properties
a. Untuk melakukan lebih lanjut tentang halaman yang dibuat maka
gunakan menu page properties. Klik kanan pada halaman > pilih
Properties.
b.Meta Tags, untuk menambahkan informasi pada halaman yang
terkait, seperti Title, Author, Keyword, Description. Hal ini sangat
membantu nilai SEO website.
c. Background, untuk mengatur background / gambar dasar yang akan
ditampilkan oleh website.
d.Apperance, untuk mengatur format tampilan dasar pada pembuatan
website, misal align berfungsi untuk mengatur letak design web

Persebaran Hotel di Kota Malang | SIG berbasis Web 2014

18

Teknik Geodesi dan Geoinformatika

Fakultas Teknik Sipil dan Perencanaan | Institut Teknologi Nasional

ketika ditampilkan dalam browser, pilih Left bila ingin design rata
kiri, pilih center bila ingin design rata tengah.
e. Page Transition,untuk menentukan efek perpindahan website dari
halaman ke halaman, namun hal ini hanya berlaku untuk peramban
Internet Explorer saja.
f. Header, untuk mengatur tulisan pada header, serta pengaktifan
password bila diperlukan.
g.Selesai, klik OK
8. Membuat Slideshow
a. Pilih menu Insert > Flash > Flash Slideshow
b.Stelah muncul kotak dialog, klik Add > pilih beberapa gambar yang
akan ditampilkan > klik Open.
c. Pilih setting > sesuaikan > klik OK
d.Maka gambar slideshow akan muncul pada halaman.
9. Menambahkan Html code atau Script code
a. Html code atau Script code, berfungsi untuk memanggil dan
menampilkan peta yang telah dibuat pada website arcgis.com serta
chatbox pada smartchatbox.com.
b.Pilih menu Insert > Html code or Script code
c. Paste kode html > klik OK.
d.Maka keluar kotak dialog sebagai peringatan bahwa harus
dipastikan ukuran sesuai dengan yang telah dibuat pada web
berkaitan > Klik OK.
10. Membuat halaman duplikat
a. Langkah ini digunakan untuk membuat duplikat design web dasar
yang akan digunakan untuk seluruh halaman, sehingga kami tidak
perlu mendesign dari awal pada tiap halaman.
b.Pada site sontents, klik kanan halaman yang akan diduplikat > pilih
Clone Page.
11. Mengganti nama halaman
a. Langkah ini digunakan untuk mempermudah pengelolaan seluruh
halaman.

Persebaran Hotel di Kota Malang | SIG berbasis Web 2014

19

Teknik Geodesi dan Geoinformatika

Fakultas Teknik Sipil dan Perencanaan | Institut Teknologi Nasional

b.Pada site sontents, klik kanan halaman yang akan diduplikat > pilih
Rename Page.
12. Menambahkan galeri foto
a. Pilih menu Insert > Image Objects > Photo Gallery.
b.Muncul kotak dialog, pilih Add.
c. Pilih foto yang akan ditampilkan > klik Open
d.Sesuaikan ukuran pada tabs general.
e. Pindah ke tabs Setting > menyesuaikan > klik OK.
13. Menambahkan Navigation Bar
a. Pilih menu Insert > Navigation Bar > pilih design yang akan
dipakai > Klik OK.
b.Pada tab option, mengatur menu apa saja yang akan ditampilkan
pada Navigation Bar tersebut.
c. Pindah ke tab text, mengatur font dan format tulisan yang
digunakan.
d.Pindah ke tab Layout, memilih bagaimana Navigation Bar akan
ditampilkan.
e. Pindah ke tab Customize, untuk mengatur design tampilan pada
button Navigation Bar.
f. Selesai Klik OK.

D. Publikasi hasil design di Web Page Maker

1. Buka hasil design yang dibuat.
2. Pilih menu File > Publish
3. Pada tab Publish Destination, pilih Local Directory > Browse, pilih lokasi
folder untuk penyimpanan hasil publikasi.
4. Pada tab Page Option, sesuaikan dengan yang diinginkan namun pastikan
nama halaman untuk home adalah index. Pilih Publish all pages in my site
dan publish all files, untuk pertama kali design dipublikasikan.
5. Klik Publish.
6. Buka folder tempat penyimpanan hasil publikasi. Files inilah yang nantinya
akan di-upload.

Persebaran Hotel di Kota Malang | SIG berbasis Web 2014

20

Teknik Geodesi dan Geoinformatika

Fakultas Teknik Sipil dan Perencanaan | Institut Teknologi Nasional

Upload Website
Langkah terakhir adalah publishing ke publik secara global menggunakan jaringan
internet, maka website yang telah kami buat harus diupload supaya dapat diakses melalui
jaringan internet.
Pada tahap ini dibagi menjadi tiga yaitu, pendaftaran domain, pendaftaran hosting,
dan upload design web, dengan tiga langkah inilah web yang telah dibuat dapat diakses
oleh semua orang.

Adapun langkah-langkah pembuatan design website sebagai berikut:

A. Pendaftaran Domain
1. Buka website freenom.com, untuk mendaftarkan domain tertentu secara
gratis.
2. Klik sign in to My Account > masukkan alamat email dan password > klik
Sign in.
3. Pilih menu Domain > Register a New Domain.
4. Isikan alamat domain yang diinginkan, misal hotelkotamalang.ga > Check
Availability.
5. Bila alamat tersebut tersedia makan alamat website dapat dipesan, bila tidak
tersedia maka coba alamat yang lain, pilih berapa lama akan menyewa
alamat tersebut > klik Order Now.
6. Memasuki halaman Order Overview, pastikan alamat yang akan dipesan
sudah benar > Klik Continue.
7. Memasuki halaman Review & Checkout, halaman ini berisikan jumlah
biaya/tagihan dan informasi pemesan. > Klik Complete Order.
8. Memasuki halaman Order Confirmation, berisikan konfimasi pemesanan. >
kembali ke Client Area.
9. Pilih menu Domain >My Domain
10. Memasuki halaman My Domain > klik Manage Domain.
11. Pilih Managemen Tools > Nameserver .
12. Pindahkan nameserver, klik use custom nameserver > isikan nameserver
sesuai dengan arah hosting, misal idhostinger.com, maka isikan

Persebaran Hotel di Kota Malang | SIG berbasis Web 2014

21

Teknik Geodesi dan Geoinformatika

Fakultas Teknik Sipil dan Perencanaan | Institut Teknologi Nasional

ns1.idhostinger.com,

ns2.idhostinger.com,

ns3.idhostinger.com,

ns3.idhostinger.com, dengan catatan tiap hosting mempunyai nameserver

yang berbeda cek selengkapnya di penyedia hosting berkaitan. > Klik
Change Nameservers.
13. Patikan perubahan nameserver berhasil.

B. Pendaftaran Hosting
1. Buka website idhostinger.com, untuk mendaftarkan hosting tertentu secara
gratis.
2. Masukkan alamat email dan password > klik Login.
3. Pilih Hosting Baru > free Hosting.
4. Ubah tipe domain menjadi Domain, karena kami sudah mendaftarkan
domain hotelkotamalang.ga.
5. Isikan alamat domain dan password > Klik Lanjutkan
6. Memasuki halaman konfirmasi pemesanan, isikan captcha > klik Order.
7. Bila berhasil akan muncul pesan Akun hotelkotamalang.ga telah berhasil
dengan baik.
8. Klik tanda + disebelah kiri hotelkotamalang.ga > klik Kelola.
9. Memasuki ke halaman beranda hosting hotelkotamalang.ga, cek apakah
domain dan hosting sudah aktif > klik icon expand disamping
hotelkotamalang.ga.
10. Akan membuka halaman baru dan Website telah aktif bila menunjukkan
halaman berisikan default.php.
11. Kembali ke beranda > klik menu Akun Detail.
12. Menampilkan informasi lengkap tentang hosting yang digunakan.

C. Upload Design Web

1. Masuk ke akun idhostinger.com.
2. Pada beranda hosting, pilih File Manager 1.
3. Instal File Manager jika belum diinstal.
4. Muncullah kotak dialog yang menampilkan file direktori.
5. Klik icon Unggah Berkas > pilih semua file berkaitan dengan design web
yang sudah dibuat > Klik Open.

Persebaran Hotel di Kota Malang | SIG berbasis Web 2014

22

Teknik Geodesi dan Geoinformatika

Fakultas Teknik Sipil dan Perencanaan | Institut Teknologi Nasional

6. Tunggu sampai file berhasil di upload.

7. Setelah selesai di upload maka web yang telah kami buat sudah dapat
diakses oleh semua orang melalui jaringan internet.

Persebaran Hotel di Kota Malang | SIG berbasis Web 2014

23