PEMBANGUNAN WEBSITE DENGAN ANIMASI IMAGE READY

PEMBUATAN WEBSITE DENGAN PENGGABUNGAN ANIMASI ADOBE
IMAGE READY
TUGAS AKHIR
Diajukan sebagai salah satu syarat untuk menyelesaikan
Pendidikan Pada Program IT Setara Diploma 1
Oleh :
AKHMAD MUFIT FAKHRUDIN
NIS:3593
Kerjasama
FKK SDI – ITS Dan Madrasah Aliyah Negri Bangil
KEMENTRIAN AGAMA
MADRASAH ALIYAH NEGERI BAGIL
KABUPATEN PASURUAN
TAHUN 2011

LEMBAR PENGESAHAN
PEMBUATAN, PENGGABUNGAN DAN PENGHOSTINGAN ANIMASI
ADOBE IMAGEREADY KE DALAM WEBSITE
Oleh :
AKHMAD MUFIT FAKHRUDIN
NIS :3593
Telah Dipertahankan di Depan Tim Penguji dan Dinyatakan Lulus
Pada Tanggal 28 - september – 2011
Tim Penguji
Penguji I Penguji II
Anshar prayudi, Spd Iva wahyuni, Spd
NIP:150402871000000000
Mengetahui, Mengesahkan
Kepala MAN Bangil Ketua Program IT
Setara D1 FKK SDI ITS
H. Rusdiyanto S. Pd, M.si Ir.Heru Lumaksono, MT

DAFTAR ISI
Lembar Persetujuan ............................................................................................... i
Lembar Pengesahan .............................................................................................. ii
Kata Pengantar ...................................................................................................... iii
Daftar Isi................................................................................................................ v
Daftar Gambar ....................................................................................................... vii
BAB I PENDAHULUAN
1.1. Latar Belakang............................................................................... 1
1.2. Rumusan Masalah ......................................................................... 2
1.3. Tujuan Penulisan ........................................................................... 2
1.4. Manfaat .......................................................................................... 2
1.5. Sistematika Penulisan .................................................................... 3
BAB II KAJIAN PUSTAKA
2.1. Website .......................................................................................... 5
2.1.1. Pengertian Website ............................................................ 5
2.1.2. Jenis Website ..................................................................... 7
2.1.3. Tujuan Website .................................................................. 8
2.1.4. Fungsi Website .................................................................. 8
2.2. Adobe Image Ready 7.0 ................................................................ 9
2.2.1. Pengertian Adobe Image Ready 7.0 .................................. 9
2.2.2. Sejarah ............................................................................... 10
2.2.3. Integrasi dengan Photoshop ............................................... 11
2.2.4. Jenis Image Ready ............................................................. 13
2.2.5. Tujuan Image Ready .......................................................... 13
2.2.6. Fungsi Image Ready .......................................................... 14
BAB III PERANCANGAN SISTEM
3.1. Pembuatan Website ....................................................................... 15
3.2. Pembuatan Animasi Image Ready ke dalam Website ................... 19

3.3. Pembuatan Nama Domain dan Penghostingan Website ............... 25
BAB IV IMPLEMENTASI SISTEM
4.1. Hasil Pembuatan Produk ............................................................... 35
4.1.1. Website .............................................................................. 35
4.1.2. Animasi .............................................................................. 37
BAB V PENUTUP
5.1. Kesimpulan .................................................................................... 38
5.2. Saran .............................................................................................. 38

DAFTAR GAMBAR
Gambar 2.1 Adobe Image Ready User Interface..................................................12
Gambar 3.1 Membuka Notepad............................................................................15
Gambar 3.2 Tampilan Notepad.............................................................................16
Gambar 3.3 Pembuatan Animasi Image Ready....................................................20
Gambar 3.10 Pembuatan Animasi Image Ready..................................................23
Gambar 3.13 Pembuatan Animasi Image Ready................................................. 24
Gambar 3.14 Pembuatan Domain Website...........................................................25
Gambar 3.21 Penghostingan Website...................................................................29

Gambar 4.1 Header Website.................................................................................35
Gambar 4.2 Navigasi / Menu Website..................................................................36
Gambar 4.3 Content Website................................................................................36
Gambar 4.4 Animasi.............................................................................................37
Gambar 4.5 Daftar Pustaka…………………………..…………………………38

BAB 1
PENDAHULUAN
1.1 Latar Belakang
Sekarang banyak orang memanfaatkan internet sebagai media untuk
mencari sesuatu yang mereka inginkan, seperti mencari informasi yang sangat
berguna bagi dirinya, bahkan menjadikan internet sebagai pekerjaan. Website,
inilah salah satu media penting yang terdapat pada internet. Website merupakan
kumpulan dari beberapa halaman web yang disusun menjadi satu rangkaian. Siapa
pun bisa membuatnya dengan mudah, apalagi sekarang banyak web hosting yang
gratis, kita harus memanfaatkan website (membuat website sehat dan possitive).
Kita dapat menuliskan sesuatu yang rasanya harus di beritahukan kepada seluruh
masyarakat, seperti macam-macam penyakit cara penyembuhanya, sekaligus cara
mencegahnya, dan lain-lain.
Adobe Image Ready 7.0, mungkin sudah tidak asing lagi ditelinga para
software. Adobe Image Ready 7.0 adalah sebuah program keluaran dari sebuah
perusahaan adobe yang digunakan untuk mengedit foto, dan animasi dengan
kualitas yang terbaik.
Alasan penulis memilih website sebagai produk tugas akhir ini karena
agar pembaca dapat sedikit mengetahui tentang tugas akhir penulis secara online,
seperti latar belakang, rumusan masalah dan tujuan tugas akhir.

Oleh karena itu, dibuatlah tugas akhir ini agar pembaca dapat
mengaplikasikan pembuatan penggunaan, dan pengembangan website dengan
baik dan benar.
1.2 Rumusan Masalah
Dalam tugas akhir ini ada beberapa masalah yang akan dipecahkan oleh
penulis, meliputi:
3. Bagaimana cara membuat website?
4. Bagaimana cara membuat animasi dengan adobe imageready7.0?
5. Bagaimana cara memasukkan animasi adobe imageready7.0 kedalam web
page?
6. Bagaimana cara membuat nama domain dan menghosting website?
1.3 Tujuan Penulisan
penyusunan tugas akhir ini mempunyai tujuan antara lain:
1. Untuk mengetahui membuat website.
2. Untuk mengetahui cara membuat animasi dengan adobe imageready 7.0.
3. Untuk mengetahui cara memasukkan animasi adobe imageready 7.0
kedalam web page.
4. Untuk mengetahui cara membuat nama domain dan menghosting website.

1.4 Manfaat
Manfaat dari tugas akhir bagi penulis yaitu dapat membuat sebuah
website sekaligus menghostingnya, membuat animasi sekaligus menginteraksikan
ke dalam sebuah website.
1.5 Sistematika Penulisan Bab Akhir
Berikut merupakan urutan penyajian penulisan tugas akhir yang telah
dibagi menjadi beberapa bab sistematika penulisan tersebut sebagai berikut:
BAB I :Pendahuluan
Dalam bab ini menjelaskan tentang latar belakang, rumusan
masalah, tujuan, manfaat, dan sistematika penulisan tugas akhir.
BAB II :Kajian Pustaka
Dalam bab ini menjelaskan mengenai pengertian dari website dan
adobe,jenis-jenis dari website dan adobe, tujuan dari website dan
adobe dan fungsi dari website dan adobe.
BAB III :Perancangan Sistem

Dalam bab ini membahas implementasi system yang berisi tentang
langkah membuat website dan animasi.
BAB IV :Hasil Pembahasan
Dalam bab ini, berisi implementasi uraian pembuatan sebuah
produk dan hasil pembuatan produkyang terdapat pada tugas akhir
penulis.
BAB V :Penutup
Dalam bab ini berisi kumpulan dari hasil tugas akhir. Selain itu juga
berisi saran atau masukan dari penulis kepada pembaca untuk di
pertimbangkan.

BAB II
KAJIAN PUSTAKA
2.1 Website
2.1.1 Pengertian Website
Secara terminologi, website adalah kumpulan dari halaman-halaman
situs, yang biasanya terangkum dalam sebuah domain (nama untuk yang diberikan
untuk mengidentifikasi nama server komputer seperti Web server atau email
server) atau subdomain, yang tempatnya berada dalam World Wide Web (WWW)
di internet.
Sebuah halaman Web adalah dokumaen yang tertulis dalam format
HTML (Hyper Text Markup Language), yang hampir selalu diakses melalui
HTTP, yaitu protokolyang menyampaikaninformasi dari server website untuk di
tampilkan kepada para pemakai melalui web browser.
Halaman-halaman dari website akan bisa diakses melalui sebuah URL
yang biasa disebut Hompage. URL ini mengatur halaman-halaman situs untuk
menjadi sebuah hierarki, meskipun hyperlink-hyperlink yang ada didalam tersebut
mengatur para pembaca dan pemberi tahu mereka susunan keseluruhanya dan
bagaimana arus informasi ini berjalan.
Penemu website adalah Sir Timothy John Tim Barners-Lee, sedangkan
website yang tersambung dengan jaringan, pertama kali muncul pada tahun 1991.
Maksud dari Tim ketika membuat website adlah untuk mempermudah tukar

menukar dan memperbarui informasi kepada sesama peneliti ditempat dia
bekerja. Pada tanggal 30 April 1993, CERN (tempat dimana Tim bekerja)
menginformasikan bahwa WWW dapat digunakan gratis oleh semua orang.
Website ditulis atau scara dinamik dikonversi menjadi HTML dan
diakses melaluisebuah program software yang biasa disebut dengan Web Browser,
yang dikenal dengan HTTP Clien halaman web dapat dilihat atau didakses melalui
jaringan komputer dan internet, perangkatnya bisa saja berupa komputer pribadi,
laptop, PDA ataupun telepon seluler.
Sebuah website dibuat daam sebuah system komputer yang dikenal
dengan server web,juga disebut HTTP Server dan pengertian ini juga bisa
menunjukan pada software yang dipakai untuk menjalankan sistem ini, yang
kemudian menerima lalu mengirimkan halaman-halaman yang diperlukan untuk
merespon permintaan dari pengguna. Apache adalah piranti lunak yang biasa
digunakan dalam sebuah web server, kemudian setelah itu adalah Microsoft
Internet Information Services (ISS).
Dalam merancang dan membangun sebuah website yang baik
diperlukan beberapa skill. oleh karena itu biasanya dalam pembuatan website
dibutuhkan tim, agar tujuan pembuatan web yang baik tercapai. Berikut ini
bebrapa skill yang sebaiknya dimiliki seorang webmaster:
 Skill dalam bidang bahasa pemograman.Misalnya, bahasa pemograman PHP,
ASP, JSP, Javascript, HTML dan lain-lain.

 Skill dalam bidang animasi. Misalnya menguasai Adobe image ready, Flash,
Swish, gif animator, phothoscape dan lain- lain.
 Skill dalam bidang desain.Misalnya menguasai software photosop, Illustrator
Paintshop Pro dan lain-lain
Dalam website terdapat beberapa bagian, antara lain:
 Header adalah gambar atau tulisan tagline dari website yang berada di sisi atas
sebuah web.biasanya header berisi nama situs atau logo dan slogan-sloganya
 Navigasi/Menu biasanya berisi menu-menu page, atau bisa di isi menu-menu
kategori.
 Sidebare biasanya berisi jumlah komentar, judul postingan terakhir, iklan,
shoutbox atau yang lainya.
 Content biasanya terdiri dari berisi dari isi postingan itu sendiri.
2.1.2 Jenis Website
Jika ingin membuat Website, memulailah untuk memikirkan website apa
yang akan di buat, kaerana website memiliki beberapa macam, diantaranya:
 Website dinamis: sebuah website yang menyediakan content atau isi yang
selalu berubah-ubah setiap saat. Misalnya seperti website berita,
www.viva.com dll
 Website statis: merupakan website yang isinya sangat jarang diubah,
misalnya,web profil pemerintahan dll.

2.1.3 Tujuan Website
Website adalah media untuk menuliskan sesuatu yang rasanya penting
untuk diketahui banyak orang, tetapi tidak hanya bertujuan untuk membagi
sesuatu yang rasanya penting, bisa juga bertujuan lain, antara lain:
 Media Pencari Uang Yaitu memanfaatkan penyedia sponsor yang
membayar kita jika sponsor itu diklik, seperti googlee adsense.
 Sebagai Profil Sebuah Organisasi Yaitu sebagai website profil
sebuah perusahaan, sekolah dan pemerintahan
2.1.4 Fungsi Website
Website mempunyai fungsi yang bermacam-macam,tergantung dari
tujuan dan jenis website yang dibuat, tetapi secara garis besar dapat bertujuan
sebagai:
7. Media Promosi
Sebagai media promosi dapat dibedakan menjadi media promosi
utama,misalnya website, misalnya website yang berfungsi sebagai search engine

atau took online, atau sebagai penunjang promosi utama, namun website dapat
berisi informasi yang lebih lengkap dari pada media offline seperti koran atau
majalah, dll.
 Media Pemasaran
Pada toko online atau sistem afiliasi, website merupakan media
pemasaran yang cukup baik, karena dibandingkan dengan toko sebagaimana
didunia nyata, untuk membangun toko online diperlukan modal yang kecil, dan
dapt beropasi 24 jam walaupun pemilik sedang istirahat, serta dapat diakses
dimana saja.
 Media Informasi
Website dapat menjangkau lebih luas dari pada media informasi
konvensional seperti, Koran, majalah, radio, atau televisi yang bersifat lokal.
 Media Komunikasi
Sekarang banyak website yang dibangun khusus untuk berkomunikasi,
misalnya jejaring social facebook, twitter, dll.
2.2 Adobe ImageReady 7.0
2.2.1 Pengertian Adobe ImageReady 7.0

Adobe ImageReady 7.0 adalah animasi yang biasa dipergunakan untuk
membuat tampilan sebuah website lebih terlihat familiar, interactive dll. pada
halaman website tersebut diberikan tambahan animasi (tampilan yang dapat
bergerak), biasanya animasi yangdipergunakan berformat Gif (graphics
interchange format), swf (flash) dll. Dalam kesempatan kali ini kita akan
membahas tentang pembuatan animasi gif mempergunakan Adobe ImageReady
7.0 yang biasanya sudah terintegrasidengan Adobe Photoshop 7.0.Banyak aplikasi
yang dapat dipergunakan untuk membuat animasi/gambar bergerak antara lain
berformat Gif (graphicsinterchange format) ialah MS GifAnimator (freeware Dari
Microsoft) Ulead gif animator (licensi Ulead Corp) Adobe ImageReady 7.0
(licensi dari Adobe) dll. Sengaja pada pembahasan kali ini membahas pembuatan
animasi gif mempergunakan Adobe ImageReady 7.0, karena Aplikasi ini biasanya
terdapat/sudah terintegrasi dengan aplikasi lainnya yang sudah sangat terkenal
dalam manipulasi gambar dan sudah tentu pula dipergunakan banyak oleh
anda-anda semua yaitu Adobe Photoshop 7.0, artinya jika dikomputer anda sudah
terpasang software adobe photoshop 7.0 kemungkinan besar pula Adobe
ImageReady 7.0 sudah ikut terinstal.
Adobe ImageReady 7,0, program image processing difokuskan pada
mengoptimalkan grafik untuk website, dikirim dengan Adobe Photoshop 7.0 bila
perangkat lunak ini dirilis pada tahun 2002.Sedangkan Adobe Photoshop awalnya
dirancang untuk produk berbasis cetak, perusahaan yang dirancang ImageReady
untuk proyek web, menurut manual instruksional dari Universitas

Bloomsburg.Namun demikian, ImageReady tidak memiliki beberapa fitur
Photoshop lebih maju.
2.2.2Sejarah
Adobe ImageReady dirilis sebagai aplikasi mandiri pada tahun 1998,
pengiriman dengan Photoshop 5.5.Perusahaan terus menyertakan ImageReady
dengan instalasi Photoshop sampai 2007, ketika dirilis Adobe Creative Suite 3
perusahaan perangkat lunak, yang terintegrasi banyak fitur ImageReady ke dalam
Photoshop.Adobe sekarang menggunakan Fireworks sebagai program gambar
utama online pengolahan.
2.2.3 Integrasi dengan photoshop
Adobe ImageReady 7.0 dan Photoshop 7.0 dirancang untuk bekerja
bergandengan tangan untuk membuat dan mengoptimalkan grafis. Anda dapat
melakukan editing gambar dasar di Photoshop, kemudian beralih ke ImageReady
melalui cara pintas keyboard, tombol di ruang kerja atau pilihan menu untuk
membuat animasi atau gambar rollover. Jika anda perlu, anda dapat dengan
mudah beralih kembali ke Photoshop.
6. Fitur
Adobe ImageReady 7.0 memungkinkan Anda untuk membuat gambar
rollover, grafik data-driven, animasi dan peta gambar, antara lain.Program
ini juga menawarkan fitur yang disebut "optimasi tertimbang", yang
menjaga seni teks dan vektor yang tajam oleh memadatkan area lain dari
gambar ketika itu disimpan.

7. user interfrce di adobe ImageReady7.0 terbagi menjadi 8 bagian yaitu:
gambar 2.1Adobe Image Ready User Interface
o Stage
Stage merupakan merupakan daerah yang berwarna putih,dimana area
kerja utama jika anda ingin membuat animasi Maupin aplikasi image
ready lainya.

o Tools
Merupakan kumpulan alat gambar dan mewarnai sesuatu yang ada di
stage.
o Show bounding tex
Untuk menunjukan garis tepi sebuah gambar atau tulisan.
o Animation
Untuk menunjukan gambar /tulisan yang akan di jalankan.
o Optimize
Digunakan untuk menentukan penyimpaanya.
o Color
Digunakan untuk mewarnai gambar/tulisan yang ada di dalam stage.
o Layer
Digunakan untuk melihat gambar yang sudah dikerjakan sebelunya.
o Layer Option
Digunakan untuk memilih layer yang ada di stage.
2.2.4Jenis ImageReady
ImageReady dapat mengeluarkan banyak file keluaran.namu secara
umum,terdapat 3 jenis file utama pada imageready,diantaranya:

 File utama photoshop (.psd), adalah jenis file utama ketika kita
menyimpan data kita.Kita bisa membuka dan dan mengedit semua jenis file .psd
pada imageready.
Sedangkan macam dari animasi imageready itu sendiri sebagai berikut:
5. Frame by frame,yaitu efek animasi diciptakan dengan mengganti
gambar yang satu dengan gambar lain selama beberapa waktu.
2.2.5 Tujuan ImageReady
ImageReady adalah sebuah software untuk menuangkan animasi
inspiratif kita.kita dapat membuat animasi sesuai dengan keinginan kita. Di sisi
lain, ImageReady memiliki beberapa tujuan ,antara lain:
10. Membuat animasi yang sangat menarik.
11. Mengedit foto.
2.2.6 Fungsi ImageReady
Fungsi imageready digunakan sekedar untuk animasi di
web,misalnyadalam iklan-iklan, berikut ini adalah beberapa contoh aplikasi yang
dihasilkan imageready.
 Banner Web
Disini imagerady hanya berukuran kecil dan digabungkan kehalaman
HTML biasa, file imagerady digunakan sebagai iklan atau sebagai logo.

 Pengeditan foto
Selain dari fungsi diatas imageready juga dapat digunakan untuk
mengedit foto-foto.

BAB III
PERANCANGAN SISTEM
3.1 Pembuatan Website
Pembuatan dan pendesainan website harus dengan kode, tetapi sekarang
sudah banyak software yang menyediakan pendesainan website dengan cara
memasukkan, gambar, dan, file lainya tanpa menggunakan kode. Kodenya
otomatis tertulis ketika file masuk ke area webpage. Adapun cara membuat
website dan juga Kode-kodenya adalah sebagai berikut:
 Klik Start
 Pilih All Program kemudian pilih Acsesories
 Lalu klik Notepad
Gambar 3.1 Membuka Notepad

Gambar 3.2 Tampilan Notepad
o Struktur Dokumen HTML:

<HTML>
<HEAD>
<TITLE>Judul Website</TITLE>
<HTML>
<BODY>
Hai, apa kabar?
</BODY>
</HTML>
o HEADING
<H1>Heading level 1</H1>
o Paragraf
<P ALIGN="Center" paragraf rata tengah </p>

<P ALIGN="right" paragraf rata kanan </p>
<P ALIGN="left" paragraf rata kiri </p>
o Break
-----------------------<BR>
Nama :mufit fakhrudin<BR>
Alamat:kedung boto<BR>
-----------------------<BR>
o Font
<FONT SIZE: "-"> Ukuran font
<FONT COLOR: "-"> Warna font
<FONT FACE: "-"> Jenis font
<SUP> Letak font sedikit ke atas
<SUB> Letak font sedikit ke bawah
<B>Cetak Tebal<B>
<U>Cetak Garis Bawah<U>
<I>Cetak Miring<I>

o List
Ordered list
<OL>
<LI>Nomor<LI>
</OL>
Unodered List
<UL>
<LI>Nomor<LI>
</OL>
o Gambar
<IMG SRC=”namafile.gif/alamatfile.gif>
o Tabel
<TABLE BORDER=1>
<CAPTION>Nomor</CAPTION>
<TR>
<TH>Judul Kolom 1</TH>
<TH>Judul Kolom 2</TH>

</TR>
<TR>
<TD>Baris 1,Kolom 1</TD>
<TD>Baris 2,Kolom 2</TD>
</TR>
</TABLE>
o Background
Background Warna
<BODY BGCOLOR=SILVER>
Background Gambar
<BODY BACKGROUND=”namafile.gif/alamatfile.gif>
o Line
<hr size=”2” width=”100%” color=”blue”>
Size=ukuran
Width=lebar
Color=warna
o Link

<a href=”alamat web”>judul</a>
Tuliskan kode HTML di atas di dalam notepad(software pembuat web)
dengan benar, susun sesuai kebutuhan. Simpa dengan ekstensi .html.
3.2 Pembuatan Animasi ImageReady ke dalam Website
Pastikan komputer anda sudah terinstal Adobe ImageReady,biasanya
Adobe ImageReady sedah terintegrasi dengan Adobe photosop. Langkah-langkah
pembuatan animasi adalah sebagai berikut:
 Klik start
 Klik Adobe ImageReady, jika tidak ada pilih all program lalu klik Adobe
ImageReady
Gambar 3.3 Pembuatan Animasi ImageReady
 Pembuatan animasi ImageReady

 Klik file pilih new untuk membuat dokumen baru
 Lalu tuliskan kata-kata atau masukkan gambar sesuai keinginan anda

 Lalu pada Animation klik duplicates current frame
 Layer di Animation akan menjadi dua

 Pilih tweens animation frame , pada animation kemudian akan muncul
kotak tween lalu isi frame to add dengan angka sesuai keinginan anda lalu
tekan OK

 Kemudian pada Animation layernya akan bertambah sesuai keinginan anda
 Kemudian pada Animation klik layer 1 dan teruskan dengan mengedit dengan
cara menggeser tulisan tersebut
 Setelah itu pada animation pilih waktu yang digunakan untuk menentukan
lamanya animasi.

 Lalu mengexport (Ctrl+Alt+Shift+S) untuk menyimpan animasi tersebut
dengan format.gif. Atau dengan klik file pilih Save Optimized As.
 Klik icon select first frame untuk mengaktifkan frame satu lalu klik icon
play animation untuk memainkan animasi.
 Untuk menghentikan animasi klik icon stop animation .
3.3 Pembuatan Nama Domain dan Penghostingan Website

Nama domain (domain name) adalah nama unuk yang diberikan untuk
menudentifikasi nama server komputer atau e-mail server di jaringan komputer
atau internet. Nama domain berfungsi untuk mempermudah pengguna di internet
pada saat melakukan akses ke server, selain juga di pakai intuk mengingat nama
server yang di kunjungi tanpa harus mengenal deretan angka yang rumit yang di
kenal dengan IP addres. Nama domain ini juga dikenal sebagai sebuah kesatuan
dari sebuah situs web sepeti contohnya “Wikipedia.org”. Nama domain kadang-kadang
juga disebut dengan istilah URL, atau alamat website.
Dalam tahap ini penulis akan menunjukan bagaimana cara untuk
mendapatkan nama domain secara gratis. Sebenarnya ada banyak cara untuk
mendapatkan nama domain secara gratis, tetapi penulis menggunakan domain
yang terkenal, yaitu .CO.CC. Cara untuk mendapatkanya yaitu:
 Masu ke www.co.cc
Gambar 3.14 pembuatan Domain Website
 Menulis nama domain Website dalam kolom seperti gambar diatas.
 Mengklik “periksa ketersediaan”, jika tidak tersedia, mencari nama lain.

Gambar 3.15 Pembuatan Domain Website
 Jika tersedia, mengklik ”lanjutkan ke pendaftaran”.
 Memilih “buat account baru sekarang”, jika sudah memiliki akun, langsung
“sign in”.

 Mengisi formulir.
 Menyentang tanda cawang ”saya menerima persyaratan dan layanan”.
 Mengklik
“continue”.
 Jika berhasil akan keluar halaman seperti gambar di atas, jika belum,
melengkapi formulir.
 Mengklik “setup”
 Mengklik “setup” lagi.

 Mengklik “name server”, lalu mengisikan dns1.freehostia.com pada “name
server 1” dan dns2.freehostia.com pada “name server 2”, untuk nama server
tergantung pada layanan penyedia hosting, penulis menggunakan
freehostia.com.
 Menyentang tanda cawang, lalu “setup”.
o Mengklik “ok”.
o Domain sudah siap.

Jika Domain sudah di tangan, lanjutkan ke penghostingan website,
Menghosting Website yaitu membuat website yang tadinya offline menjadi online.
Hosting dapat di artikan sebagai ruangan yang terdapat dalam hard disk tempat
menyimpan berbagai data, file-file, gambar dan lain sebagainya yang akan di
tampilkan di situs. Besarnya data yang bisa di masukkan tergantung dari besarnya
hosting yang disewa/di punyai, semakin besar hosting semakin besar pula data
yang dimasukkan dan ditampilkan dalam situs. Penulis memilih layanan penyedia
hosting gratis Freehostia. Untuk prosedur pembuatan account freehostia dapat di
lihat dalam langkah-langkah berikut:
4. Memasuki www.freehostia.com.
Gambar 3.21 Penghostingan Web
5. Memilih “sign up” untuk daftar terlebih dahulu, jika memiliki akun, tidak
perlu daftar, hanya perlu, “log in”.

6. Memilih “chocolate”, memilih “12 months period $0.00 USD ($0.00
permonth).
7. Memilih “use my existing domain”, mengisi alamat website.
 Mengisi formulir dan menulis kode.
 Mengklik “continue”.
 Menunggu sampai proses pendaftaran selesai .

Gambar 3.24 Penghostingan website
 Akan keluar halaman ucapan terimah kasih, menutup halaman tersebut

 Memilih “login to control panel ”untuk memilih control panel akun.
5. Memasuki pesan freehostia dalam email untuk melihat user name dan
password akun, jika menggunakan FTV untuk mentransfer file, FTV host, user
name, dan password akun yang ada di pesan ini

6. Setelah memasuki akun freehostia, memasuki “file manager”.
7. Memasuki folder di mana terdapat domain name halaman web yang tadi telah
terdaftar.
8. Memilih “telusuri” untuk mencari file yang akan di hosting .
9. Mengklik “open”untuk memasuki file .
10. Mengklik “upload file (s)” untuk menghosting.

11. Menunggu hingga proses upload selesai, mengklik “ok”.

BAB IV
IMPLEMENTASI SISTEM
4.2 Hasil Pembuatan Produk
Hasil Pembuatan produk yaitu hasil jadi sebuah produk yang proses
pembatanya terdapat pada bab sebelumnya. Produk dari tugas akhir ini terdiri dari
4 macam produk, diantaranya:
4.1.1 Website
Salah satu contoh website statis yang sudah di buat oleh penulis
adalah sebagai
berikut:
Gambar 4.1 Header website
1.Header

Gambar 4.2 navigasi/menu Website
2. Navigasi/menu
Gambar 4.3 Content Website
3. Content Website
4.

4.1.2 Animasi
Salah satu contoh animasi yang sudah di buat oleh penulis adalah
sebagai berikut:
Gambar 4.4 Animasi

BAB V
PENUTUP
5.1 Kesimpulan
Dari pembahasan tugas akhir ini penulis dapat menyimpulkan bahwa:
1 Kita dapat membuat Website dengan menggunakan Notepad.
2 Kita dapat membuat animasi dengan adobe imageready7.0 dengan mudah
dan cepat.
3 Kita dapat memasukkan animasi adobe imageready7.0 kedalam web page
dengan menggunakan dengan kode-kode html.
4 Kita dapat membuat nama domain dan menghosting website dengan cara
registrasi dulu ke www.co.cc dan www.frehostia.com.
5.2 Saran
1. Dengan berbagai kelebihan yang dimiliki, penulis menyarankan agar dapat
menggunakan Notepad dalam pembuatan Web dan pembuatan aplikasi-aplikasi
yang lain selain yang ada pada adobe imageready7.0.
2. Desain Web ini dapat dikembangkan lebih lanjut, baik mengenai desain
motif (model) maupun keinformatifannya. Sehingga mampu memberikan
daya tarik dalam mempromosikan.

DAFTAR PUSTAKA
http://en.wikipedia.org/wiki/HTML
http://www.htmlcodetutorial.com/linking/linking.html
http://api.jquery.com/html/
http://cahya.nab.su/k-html.html
http://camex.wen.ru/Wapmaker/Huruf.html
http://camex.wen.ru/Wapmaker/Gambar.html

PEMBANGUNAN WEBSITE DENGAN ANIMASI IMAGE READY

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Similar to PEMBANGUNAN WEBSITE DENGAN ANIMASI IMAGE READY

Similar to PEMBANGUNAN WEBSITE DENGAN ANIMASI IMAGE READY (20)

Recently uploaded

Recently uploaded (20)

PEMBANGUNAN WEBSITE DENGAN ANIMASI IMAGE READY