pembuatan ta man bangil "pembuatan website"

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, SpdNIP: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.

2. 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.

3. 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:

6. Membuat animasi yang sangat menarik.

7. 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.

http://www.frehostia.com/

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

http://camex.wen.ru/Wapmaker/Gambar.html

http://camex.wen.ru/Wapmaker/Huruf.html

http://cahya.nab.su/k-html.html

http://api.jquery.com/html/

http://www.htmlcodetutorial.com/linking/linking.html

http://en.wikipedia.org/wiki/HTML

pembuatan ta man bangil "pembuatan website"

Education