BAB I PENDAHULUAN 1.1 Latar Belakang Masalah

Transkripsi

1 BAB I PENDAHULUAN 1.1 Latar Belakang Masalah Perkembangan dunia sistem informasi saat ini semakin bertambah cepat, informasi yang berkembang banyak kita temukan dalam berbagai media-media informasi salah satunya adalah internet, melalui internet orang-orang yang ingin mendapatkan informasi secara cepat, mudah, terbaru dan dimana saja dapat dipenuhi. Diantara sekian banyak fasilitas yang ditawarkan oleh internet salah satu fasilitas yang sering digunakan adalah WWW (World Wide Web). World Wide Web merupakan bagian dari internet, World Wide Web berisi kumpulan informasi pada beberapa server komputer yang saling terhubung satu sama lain dalam jaringan internet. Informasi-informasi dalam web mempunyai link-link yang menghubungkan informasi tersebut ke informasi lain di dalam jaringan internet. World Wide Web dibangun dari web page atau dikenal juga sebagai home page. Home page dibuat dengan menggunakan Hyper Text Markup Language (HTML), tanpa HTML tidak akan ada Home page dan tanpa Home page tidak akan ada World Wide Web. Di World Wide Web memerlukan alamat khusus yang disebut website. Setiap informasi ini disimpan dalam suatu file yang berbeda-beda yang disebut web page. Di dalam Web page inilah tersimpan berbagai informasi dan link yang menghubungkan suatu informasi ke informasi lainnya, baik itu di dalam web page yang sama ataupun dalam web page lain dalam web site yang berbeda. Penulis membuat Web site yang berzona Akademi Fantasi Indosiar (AFI) 2. AFI 2 adalah nama ajang kompetisi menyanyi yang diselenggarakan oleh Indosiar yang ke-2 kalinya setelah AFI 1, yang tentu saja setiap anggotanya memiliki banyak penggemar di Indonesia mulai dari ABG, remaja atau dewasa sekalipun. Web site ini 1

2 dibangun ditujukan kepada para pecinta AFI 2 di Indonesia yang pada kenyataannya kekurangan informasi mengenai AFI 2 yang digemari serta perkembangannya saat ini setelah AFI 2 berakhir. Karena itu penulis ingin memberikan informasi mengenai AFI 2 melalui media teknologi informasi yaitu internet agar memudahkan penyampaian kepada pecinta dan penggemar AFI 2 untuk mendapatkan informasi. Informasi yang diberikan yaitu informai anggota AFI 2 dan album yang dirilis. Penulis berharap web site ini dapat menjadi sumber informasi yang berguna dan bermanfaat bagi para pecinta AFI 2. Semoga kehadiran web site ini dapat mengobati kerinduan para pecinta AFI 2. Penulis dalam merancang WEB ini menggunakan Macromedia Dreamweaver MX 2004, karena menurut penulis Software inilah yang bias membuat situs internet terlihat menarik. 1.2 Batasan masalah Dalam penulisan ilmiah ini penulis akan membahas mengenai AFI 2 dan membatasi permasalahan hanya dalam pembuatan Web site AFI 2 yang memberikan informasi anggota AFI 2, foto-foto anggota AFI 2 dan album yang dirilis. Aplikasi yang digunakan untuk membuat web site ini adalah Macromedia Dreamweaver MX Tujuan Penulisan Tujuan dari penulisan ilmiah ini adalah untuk memberikan informasi mengenai Akademi Fantasi Indosiar 2 kepada para pecinta AFI 2 yang ada di Indonesia maupun di seluruh Dunia dengan menggunakan Teknologi Informasi (TI) atau Internet. 1.4 Metode Penulisan 2

3 Dalam menyelesaikan penulisan ilmiah ini, penulis melakukan pengumpulan bahan dengan menggunakan metode studi pustaka yaitu melalui buku-buku, literature-literlatur lainnya yang berkenaan dalam masalah. 1.5 Sistematika Penulisan Agar sistematika penulisan ilmiah ini terjamin sepenuhnya, yaitu dengan maksud memenuhi persyaratan ilmiah dan agar setiap bab membahas hal-hal yang perlu dan sesuai dengan pembahasan materi, maka dibuat suatu pedoman yaitu sistematika penulisan yang terbagi dalam 4 bab : BAB I PENDAHULUAN Menerangkan Latar belakang masalah, Batasan masalah, Tujuan penulisan, Metode penelitian dan Sistemetika penulisan. BAB II LANDASAN TEORI Berisikan konsep-konsep atau teori-teori dasar yang berkenaan dengan pembuatan web site dan menerangkan mengenai Macromedia Dreamweaver MX BAB III ANALISA DAN PEMBAHASAN MASALAH Pada bab ini menjelaskan tentang proses design dan pembuatan situs. BAB IV PENUTUP Pada bab ini berisikan kesimpulan dari hasil penulisan ilmiah yang dilakukan penulisan dan saran-saran yang dapat diberikan berdasarkan permasalahan dan kesimpulan yang ada. 3

4 BAB II LANDASAN TEORI 2.1 Internet Istilah Internet bukan berarti, seperti yang mungkin di duga, internahal net, melainkan berasal dari bahasa latin Inter yang berarti Antara. Secara kata perkata Internet berarti Jaringan antara atau penghubung (Nolden, 2002, Hal, 40). Internet menghubungkan berbagai jaringan yang tidak saling tergantung pada satu sama lain sedemikian rupa, sehingga mereka dapat berkomunikasi. Sistem apa yang digunakan pada masing-masing tidak menjadi soal. Sementara jaringan lokal biasanya terdiri atas komputer sejenis (misalnya Dos atau Unix), Internet mengatasi perbedaan berbagai system operasi dengan penggunaan bahasa yang sama oleh semua jaringan dalam pengiriman data. Pada dasar inilah yang menyebabkan besarnya dimensi internet. Internet berfungsi sebagai jaringannya jaringan, dengan menciptakan kemungkinan komunikasi antar jaringan diseluruh dunia tanpa bergantung pada jenis komputernya (Nolden, 2002, Hal, 40) Sejarah Internet Internet lahir pada tahun 1963 oleh RAND Corporation, organisasi perang dingin Amerika serikat yang menghadapi masalah tentang persiapan perang nuklir yaitu bagaimana agar terus dapat berkomunikasi dengan lancar selama perang terjadi. Pemecahannya yaitu membuat system jaringan yang saling berhubungan dari satu tempat ke tempat yang lain yang strategis di Amerika Serikat walaupun semua hancur 4

5 maka RAND dan DARPA akhirnya memberikan RFP (request for proposal) kepada UCLA ( University of California Los Angles) untuk merancangnya. Dilanjutkan di tahun 1969, BBN mengirimkan 4 buah IMP (interface message processor) kepada 4 perguruan tinggi yakni UCLA, SRI, UCSB dan University of Utah. Keempat jaringan tersebut di sebut jaringan ARPANET yang di sponsori oleh DARPA (Defense of Advanced Research Project Agency) penatagon. Pada awalnya sejak tahun 1969 ARPANET memakai protocol NCP (Network Control Protocol) sebagai protocol tranmisinya sehingga tahun 1980 sampai akhirnya diputuskan diganti dengan TCP/IP (Transfer Control Protokol / Internet Protokol) sebagai protocol militer yang lebih disukai. Protokol TCP/IP sebenarnya dikembangkan sejak tahun 1970 bersamaan dengan proyek ARPANET yang mulanya hanya bernama TCP saja hingga saat ditemukan protocol UDP maka sebutannya berubah menjadi TCP/IP, akhirnya pada tahun 1982 diputuskan seluruh node di ARPANET harus mengkonversi protocol dari NCP menadi TCP?IP hingga saat ini. Seiring evolusi ARPANET di beberapa tempat lain juga bermunculan jaringanjaringan lain yang memang diciptakan oleh para pemakainya sendiri. Jaringanjaringan tersebut misalnya UUCP (Unix to Unix Copy Protocol) yang lahir pada tahun 1976 hasil karya Mike Lesk dari AT&T Bell dan USENET tahun 1979 karya Steve Bellovin yang mulanya hanya menghubungkan UNC dan Duke University. Kemudian dilanjutkan pada bulan mei 1979 CSnet bekerja sama dengan NSF dengan memanfaatkan jaringan UUCP dan menyatukan perguruan tinggi yang tidak tergabung dalam proyek ARPANET. Dilaanjutkan dengan lahirnya BITNET dan jaringan PC FIDONE tahun Hingga pada tahun 1983 ARPANET pecah menjadi dua dan milnet lebih banyak digunakan untuk kebutuhan militer sedangkan ARPANET untuk kebutuhan riset. Gabungan keduanya dikenal dengan disederhanakan menjadi Internet. 5 nama DAPRA Internet yang

6 2.2 WWW WWW (World Wide Web) merupakan kumpulan web server dari seluruh dunia yang berfungsi menyediakan data dan informasi untuk dapat digunakan bersama. Informasi-informasi dalam web mempunyai link-link yang menghubungkan informasi tersebut ke informasi lain di dalam jaringan internet. Sistem yang menghubungkan informasi-informasi melalui link ini disebut dengan Hypertext. Dengan semakin berkembangnya World Wide Web, istilahnya hypertext ini kemudian berkembang dan berubah menjadi hypermedia. Di mana linklink penghubungantar informasi bukan hanya berupa text, tetapi juga dapat berupa file multimedia, seperti gambar, suara atau video. 2.3 Browser Browser merupakan program aplikasi yang digunakan untuk memudahkan kita melakukan navigasi berbagai data dan informasi pada WWW. Salah satu web browser yang popular dan banyak digunakan saat ini yaitu Microsoft Internet Explorer dan Netscape Navigator. 2.4 HTML HTML (Hypertext Markup Language) merupakan suatu script dimana kita bisa menampilkan informasi dan daya kreasi kita lewat Internet. HTML sendiri adalah suatu dokumen teks biasa yan mudah untuk dimengerti dibandingkan bahasa pemprograman lainnya, karena bentuknya itu maka HTML dapat dibaca oleh Plat form yann berlainan seperti Windows. 2.5 Struktur Dasar Navigasi Penjajakan termasuk struktur terpenting dalam pembuatan suatu website dan gambarannya harus sudah ada pada tahap perencanaan. Peta penjajakan merupakan rancangan hubungan dan raantai kerja dari beberapa area yang berbeda dan dapat 6

7 membantu mengorganisasikan seluruh elemen website dengan memberikan kemudahan menganalisa keinteraktifan seluruh objek dalam website dan bagaimana pengaruh keinteraktifan terhadap pengguna. Peta penjajakan merupakan beberapa cirri khas yang dapat digolongkan menurut kebutuhan akan obyek, kemudahan pemakaian, keinteraktifitasannya dan kemudahan membuatnya yang berpengaruh terhadap waktu pembutan suatu website. Beberapa dasar struktur pembuatan website. a. Linier Linier (suatu alur) merupakan struktur yang hanya mempunyai satu rangkaian cerita yang terurut. Struktur ini menampilkan satu demi satu tampilan layer secara berurut menurut aturannya. Tampilan yang dapat ditampilkan pada struktur jenis ini adalh suatu halaman sebelumnya atau satu halaman sebelumnya. Pada struktur penjajakan ini tidak diperkenankan adanya percabangan. Biasanya struktur ini digunakan untuk membuat multimedia presentasi karena tidak terlalu menuntut kemampuan tetapi hanya memerlukan keindahan dan kemudahan menampilkan data sebagai informasi. Gambar 2.1 Struktur Navigasi Linier b. Hierarchical Struktur Hierarchical (bercabang) merupakan suatu struktur yang mengandalkan percabangan untuk menampilkan data berdasarkan Kriteria tertentu. Tampilan pada menu pertama akan disebut sebagai master page (halaman utama ke satu), halaman utama ini akan mempunyai halaman percabangan yang dikatakan slave page (halaman pendukung). 7

8 Jika salah satu halaman pendukung dipilih atau diaktifkan maka tampilan tersebut akan bernama master page (halaman utama ke dua), dan seterusnya. Pada struktur penjajakan ini tidak diperkenankan adanya tampilan linier. Gambar 2.2 Struktur Navigasi Hierarchical c. Non Linier Struktur penjajakan non linier (tidak teratur) merupakan pengembangan dari struktur penjajakan linier. Pada struktur ini diperkenankan membuat penjajakan bercabang. Percabangan yang dibuat pada struktur non linier ini berbeda dengan percabangan pada struktur hierarchi, karena pada percabangan non linier ini walaupun terdapat percabangan, tetapi tiap-tiap tampilan mempunyai kedudukan yang sama tidak ada master page dan slave page. 8

9 Gambar 2.3 Struktur Navigasi Non Linier d. Composite Struktur penjajakan Composite ( campuran ) merupakan gabungan dari ke tiga struktur sebelumnya yaitu linier, non linier dan hierarchi. Struktur penjajakan ini juga bisa disebut struktur penjajakan bebas. Jika suatu tampilan membutuhkan penjabangan, maka dapat dibuat percabangan dan bila dalam percabangan tersebut terdapat suatu tampilan yang sama kedudukannya maka dapat dibuat struktur linier dalam percabangan tersebut. Struktur penjajakan banyak digunakan dalam pembuatan website sebab struktur ini dapat memberikan keinteraksian yang lebih tinggi. Setiap struktur peta penjajakan seperti yang baru di bahas mempunyai fungsi dan tujuan tersendiri, tidak ada yang lebih baik atau lebih buruk. Penggunaan peta penjajakan bergantung kepada kebutuhan dan tujuan dari aplikasi web yang hendak di buat. Semakin sulit pula pembuatan aplikasi web dari peta penjajakan tersebut. 9

10 Gambar 2.4 Struktur Navigasi Composite 2.6 Sekilas Tentang Macromedia Dreamweaver MX 2004 Macromedia Dreamweaver adalah sebuah HTML editor professional untuk mendesain secara visual dan mengelola situs web maupun halaman web. Saat ini terdapat software dari kelompok Macromedia yang banyak digunakan untuk mendesain situs web. Macromedia Dreamweaver 3 merupakan versi lama dari Macromedia Dreamweaver dan merupakan Web Authoring terbaik untuk tahun Pada tahun 2001, Macromedia meluncurkan Macromedia Dreamweaver 4 yang lebih baik dan lebih canggih lagi. Pada tahun 2002 Macromedia meluncurkan versi baru lagi, yaitu Macromedia Dreamweaver MX. Versi terbaru dari Macromedia Dreamweaver saat ini adalah Macromedia Dreamweaver MX Pada Dreamweaver MX 2004 terdapat beberapa kemampuan bukan hanya sebagai software untuk desain web saja tetapi juga untuk menyunting kode serta pembuatan aplikasi web dengan menggunakan berbagai bahasa pemprograman web, ntara lain JPS, PHP, ASP dan ColdFusion. Dreamweaver merupakan software utama yang digunakan oleh web desainer maupun web programmer guna mengembangkan situs web. Ruang kerja, fasilitas dan kemampuan Dreamweaver mampu menungkatkan produktivitas dan efektivitas dalam desain maupun membangun situs web. Dreamweaver juga dilengkapi dengan fasilitas untuk manajemen situs yang cukup lengkap. Fasilitas penyuntingan secara visual dari Dreamweaver MX 2004 menbuat kita dapat menambah desain dan fungsionalitas halaman web tanpa perlu menulis satu baris kode pun. Kita dapat membuat dan mengedit image dalam Macromedia Firework. Kita juga dapat menanbahkan objek Flash secara langsung dalam Dreamweaver MX

11 2.6.1 Perbedaan Dreamweaver MX 2004 dengan versi sebelumnya. User interface pada dreamweaver MX 2004 lebih baik dari pada versi sebelumnya, yaitu Dreamweaver MX. Karena Dreamweaver mx 2004 ada paningkatan kemampuan toolbar, di mana Dreamweaver MX 2004 dapat digunakan untuk memodifikasi toolbar yang sudah ada atau menanbahkan fungsi baru. Selain user interface baru, dreamweaver MX 2004 memiliki kemampuan untuk menyunting kode dengan lebih baik. Dreamweaver MX 2004 juga dapat melakukan print kode pada jendela Code View, selain juga memiliki fasilitas Code Hints yang membant dalam urusan tag, serta Tag Inspector yang sangat berguna dalam menangani tag HTML. Dreamweaver MX 2004 memiliki panel baru, yitu panel snippset yang memberikan fasilitas untuk menyunting dan menyimpan blok kode yang sering digunakan. Kemampuan baru Dreamweaver MX 2004 lainnya adalah fasilitas untuk menangani dokumen-dokumen baru seperti XHTML, Ektension Manager yang telah ditingkatkan kemampuannya, kemampuan validasi dan debug di browser, serta fasilitas penanganan aplikasi data base yang sebelumnya hanya terdapat pada Macromedia Dreamweaver MX Ultradev Ruang Kerja Dreamweaver MX Ruang kerja pada Dreamweaver MX 2004 memiliki komponen-komponen yang memberikan fasilitas dan ruang untuk menuangkan kreasi kita dalam bekerja, seperti yang terlihat pada Gambar 2.1. Komponen-komponen yang disediakan oleh ruang kerja Dreamweaver MX 2004 antara lain adalah Insert Bar, Document Toolbar, Document Window, Kelompok Panel, Tag Selector, Property Inspector dan Site panel. Komponen-komponen yang terdapat di dalam ruang kerja Dreamweaver MX 2004 adalah : 11

12 Insert Bar Panel Group Document Document Toolbar Window 12

13 Site Panel Tag Selector Property Inspector Gambar 2.5 Ruang Kerja Dreamweaver MX

14 a. Document Windows berfungsi untuk menampilkan dokumen dimana kita sekarang bekerja. b. Insert Bar mengandung tombol-tombol untuk menyisipkan berbagai macam objek seperti image, table dan layer ke dalam dokumen. c. Document Toolbar berisi tombol-tombol dan menu pop-up yang menyediakan tampilan berbeda dari document windows. d. Kelompok Panel adalah kumpulan panel yang saling berkaitan satu sama lain, yang dikelompokan di bawah satu judul. e. Tag Selector berfungsi untuk menampilkan hirarki tag di sekitar pilihan yang aktif pada desain view. f. Property Inspector digunakan untuk melihat dan mengubah berbagai property objek atauu teks. g. Site panel digunakan untuk mengatur file dan folder yang membentuk situs web anda Komponen Ruang Kerja. Di dalam ruang kerja Dreamweaver MX 2004 terdapat beberapa komponen utama yang membentuk suatu ruang kerja. Ruang kerja Dreamweaver MX 2004 ini memberikan kesatuan tampilan antara menu utama, panel, property inspector, serta toolbar Menu Utama Sistem Menu yang terdapat pada Dreamweaver MX 2004 sangat sederhana dan mudah dipahami karena perintah yang terdapat pada hampir sebagian besar fungsi menu terdapat juga dalam panel. Kita tidak akan menghabiskan waktu dengan perintah yang terdapat pada menu tetapi akan lebih banyak bekerja dengan menggunakan perintah panel. 14

15 a. Menu File dan Menu Edit Berisi item menu standar untuk menu File dan menu Edit, seperti New, Open, Save All, Cut, Copy, Paste, Undo dan Redo. Menu File terdiri dari beberapa macam perintah untuk menampilkan atau memperlakukan dokumen baru, seperti Preview in Browser dan Print Code. Menu Edit berisi perintah untuk pemilihan, seperti select Parent Tag, serta Find dan Replace. b. Menu View Berisi perintah untuk menampilkan beberapa macam tampilan dari dokumen kita (seperti tampilan Design view dan tampilan code) dan untuk menampilkan dan menyembunyikan beberapa elemen halaman dan tomboltombol Dreamweaver dan toolbar. c. Menu Insert Berisikam alternatif baris insert untuk menyisipkan obyek di dalam dokumen. d. Menu Modify Berfungsi untuk melakukan perubahan property pada item atau halaman terpilih. Dengan menggunakan menu ini kita dapat mengedit atribut tag, mengganti table dan elemen table dan bermacambentuk aksi untuk item library dan template. e. Menu Text Berfungsi untuk mempermudah dalam melakukan format teks. f. Menu Commands Berisi akses ke beberapa perintah, format kode yang sesuai dengan format pilihan kita, membuat photo album dan melakukan pengeditan gambar dengan menggunakan Macromedia Fireworks. g. Menu Site Berisi item menu untuk mengelola situs dan melakukan upload dan download file. 15

16 h. Menu Window Menyediakan akses ke seluruh panel, inspector dan jendela di dalam Dreamweaver. i. Menu Help Menyediakan akses ke dokumen Dreamweaver, membuka lembar kerja Help untuk membantu kita dalam menggunakan Dreamweaver dan menyediakan bahan referensi untuk beberapa bahasa Baris Standar Pada saat kita membuka jendela Dreamweaver MX, secara default hanya menampilkan Document Bar tanpa menampilkan Standar Bar. Gambar 2.6 Baris Standar Berikut ini fungsi-fungsi tombol perintah yang terdapat di dalam Standard Bar. a. New, untuk membuat halaman web baru. b. Open, untuk membuka halaman web yang sudah ada. c. Save, untuk menyimpan halaman web yang sedang aktif. d. Save All, untuk menyimpan seluruh halam web yang sedang di buka. e. Cut, untuk menghapus objek yang terpilih. f. Copy, untuk menyalin objek yang terpiih. g. Paste, untuk menempel atau meletakkan objek hasi salinan. 16

17 h. Undo, untuk membatalkan perintah yang sedang terakhir kali di lakukan. i. Redo, untuk mengulang kembali perintah yang terakhir yang dibatalkan Baris Tombol Dokumen Document Toolbar berisi tombol-tombol dan menu pop-up yan menyediakan tampilan berbeda dari document window. Kita bisa mengatur tampilan Document window dalam bentuk design view atau code view atau kedu-duanya kita juga dapat memberikan judul document window pada bagian title. Gambar 2.7 Baris Tombol Dokumen Berikut ini fungsi-fungsi tombol perintah yang terdapat di dalam Baris Tombol Dokumen. a. Show Code View, untuk menampilkan mode pengetikan kode HTML dalam jendela Code View. b. Show Code dan Design Views, untuk menampilkan jendela Code View dan jendela Design View. c. Show Design View, untuk menampilkan jendela Design View. Pada tampilan ini apa yang kita lihat akan sama seperti pada jendela browser. d. No Browser Check Errors, untuk melakukan pengecekan kesalahan pada dokumen web. e. Document Title, untuk memberikan judul pada dokumen web. f. File Management, untuk proses upload dan download file. g. Preview atau Debug in Browser, untuk melihat hasil dalam browser, mencari kesalahan script dalam dokumen dan untuk memasukan browser dalam daftar browser yang di kenali oleh Dreamweaver MX. 17

18 h. Refresh Site List, untuk melakukan pembaharuan terhadap daftar isi situs kita. i. View Options, untuk mengatur pilihan pada tampilan ruang kerja kita Baris Insert. Baris insert terdiri dari tombol-tombol untuk membuat dan menyisipkan obyek seperti tabel, layer dan gambar. Ketika kita menggulung pointer melewati sebuah tombol, tampil sebuah kotak keterangan dengan menampilkan nama tombol. Tombol-tombol tersebut mengatur beberapa kategori. Kita dapat berganti kategori dengan menekan tombol pada bagian kiri dari insert bar. Kategori tambahan akan kelihatan ketika sebuah dokumen berisi kode server, seperti dokumen ASP atau CFML. Ketika kita mulai menjalankan program Dreamweaver, kategori yang kita tampilkan sama seperti pada waktu kita bekerja terakhir kali. Gambar 2.8 Baris Insert Baris Insert digunakan untuk mengatur beberapa piliha sebagai berikut : a. Kategori Common memungkinkan kita untuk membuat dan menyisipkan beberapa penggunaan obyek biasa, seperti gambar dan tabel. b. Kategori Layout memungkinkan kita untuk menyisipkan tabel, div tag, layer dan frame. Kita juga dapat memilih salah satu dari tiga tampilan tabel : Standard (default), Expanded Tables dan layout. Ketika mode tampilan 18

19 terpilih, kita dapat menggunakan tombol layout Dreamweaaver: Draw layout cell dan Draw layout table. c. Kategori Form berisi tombol-tombol untuk membuat form dan menyisipkan elemen form. d. Kategori Text memungkinkan kita menyisipkan beberapa teks dan daftar format tag, seperti b, em, p, h1 dan u1. e. Kategori HTML memungkinkan kita untuk menyisipkan tag HTML untuk mistar horizontal, head content, tabel, rame dan script. f. Kategori Server-code hanya tersedia untuk halaman-halaman yang menggunakan bahasa khusus server, termasuk di dalamnya ASP, ASP.NET, CFML Basic, CFML Flow, CFML Advanced, JSP dan PHP. Selain kategori ini menyediakan obyek-obyek server-code yang dapat kita sisipkan di dalam tampilan code. g. Kategori Application memungkinkan kita untuk menyisipkan elemen dinamis seperti recorset, repeated region dan record insertion dan update form. h. Kategori Flash Element memungkinkan kita untuk menyisipkan elemen flash. i. Kategori Favorites memungkinkan kita untuk mengelompokan dan mengatur tombol-tombol baris insert yang kita gunakan dalam suatu wadah Jendela Documen Documen Window merupakan bagian yang digunakan untuk mendesain halaman situs web. Dalam document window, Kita dapat menyisipkan teks, image seta objek lain yang mendukung pembuatan situs web atau tempat untuk membuat desain web. 19

20 Tidak seperti pada versi sebelumnya, Dreamweaver MX membuat dokumendokumen yang sedang dibuka dalam jendela yang sama. Jika kita perhatikan untuk dokumen yang terbuka dalam jendela yang sama, akan disimpan dalam tab-tab seperti lembar kerja pada Microsoft Excel. Dengan demikian kita dapat dengan mudah berpindah antar dokumen tanpa harus menutup tampilan jendela yang sudah terbuka, yaitu dengan mengklik tab dokumen yang kita inginkan. Gambar 2.9 Jendela Documen Panel Group Panel Group adalah kumpulan panel yang saling satu sama lain yang dikelompokan bersama dibawah satu judul. Kalau kita perhatikan pada bagian panel group, di situ terdapat beberapa panel yang tersusun secara rapi pada bagian sebelahh kanan window. Kelompok panel tersebut antara lain : Design, Code, Application, Files dan Answer. Pada setiap bagian dari panel Group terdapar beberapa macam panel lagi, misalnya pada panel group Design berisikan panel HTML Style, CSS Style dan Behaviour. Pada bagian panel group Files terdapat panel Site dan Assets. 20

21 Gambar 2.10 Panel Group Files Panel Files Panel merupakan bagian dari panel group file selain panel Assets. Bagian ini berfungsi untuk mengatur file dan folder yang membentuk situs web kita. Panel ini memiliki fungsi lain yang cukup penting karena memungkinkan anda untuk mengatur file-file dari situs web dengan efesien. 21

22 Gambar 2.11 Files Panel Pada bagian Files Panel ini, Kita dapat melakukan beberapa aktivitas, antara lain manajemen file, melakukan koneksi ke remote server atau testing server, menempatkan file ke server atau menyalin file dari server ke situs local Snippsets Panel Snippset Panel merupakan kode yang sering digunakan dan disisipkan pada dokumen. Kita dapat mengambil kode Snappet built-in yang ada di dalam bagian snippet dengan menentukan terlebih dahulu kode apa yang akan disisipkan ke dalam dokemen. Misalnya, apabila kita ingin membuat sebuah judul beserta menu, maka kita harus memilih Headers, selanjutnya kita bisa menentukan bentuk dari Headers tersebut. Selain Headers, Kita juga bisa menggunkan kode lainnya, seperti footer, layout navigasi, fungsi navigasi, fungsi Java script dan masih banyak lagi. 22

23 Gambar 2.12 Snippsets Panel Tag Inspector Tag Inspector merupakan salah satu fasilitas terbaru dari Dreamweaver MX. Dalam tag Inspector kita dapat melihat struktur hirarki tag dan atribut-atribut yang dapat melihat struktur hirarki tag dan atribut-atribut yang dapat ditambahkan atau di edit. 23

24 Gambar 2.13 Taq Inspector Tag Selector Tag Selector terdapat pada bagian bawah document window atau pada bagian status bar. Fungsi dari tag Selector adalah untuk menampilkan hirarki tag pada design view yang aktif. Pada saat kita mengaktifkan jendela document window, secara otomatis pada bagian status bar akan muncul indicator < body >. Gambar 2.14 Taq Selector 24

25 Property Inspector Property Inspector digunakan untuk melihat dan mengubah berbagai property objek dan teks yang dipilih. Setiap objek maupun teks mempunyai property yang berbeda-beda. Misalnya, untuk teks yang terpilih maka property inspector akan menampilkan property teks seperti yang tampak pada Gambar Pada bagian property terdapat beberapa pengaturan format untuk jenis font, ukuran font, perataan, dan lain sebagainya. Sedangkan property image akan menampilkan pengaturan ukuran image, nama image, dan sebagainya, seperti terlihat pada Gambar Gambar 2.15 Property Teks Gambar 2.16 Property Image 25

26 BAB III ANALISA DAN PEMBAHASAN MASALAH 3.1 Sekilas Mengenai Akademi Fantasi Indosiar 2 Akademi Fantasi Indosiar 2 (AFI 2) adalah merupakan ajang kontes menyanyi yang diadakan oleh salah satu stasiun televisi swasta di Indonesia, yaitu Indosiar. AFI 2 ini kedua kalinya diselenggarakan oleh Indosiar setelah AFI 1 Dalam AFI 2 di Indosiar telah menyaring lebih dari peserta audisi pada 6 kota yaitu Medan, Jakarta, Yogyakarta, Surabaya, Bandung dan Solo, dan akhirnya terpilih 12 akademia yang diantaranya Haikal dan Pasha wakil dari Medan, Micke dan Cindy wakil dari Jakarta, Adi dan Jovita wakil dari Jogjakarta, Adi dan Nia wakil dari Surabaya, Rindu dan Lia dari Bandung, serta Nana dan Tia wakil dari Solo. Pada setiap minggunya ajang kontes menyanyi ini mengadakan konser eliminasi, dimana setiap akademia harus menunjukkan kemajuan kwalitas vokal mereka. Di akhir konser eliminasi ini akademia yang memiliki dukungan terkecil dari SMS pemirsa Indosiar akan dieliminasi. Kendala yang dihadapi dalam AFI : 1. Banyak Masyarakat yang menggandrungi AFI 2 justru setelah Konser Eliminasi AFI 2 telah beberapa minggu berlangsung, otomatis para fans baru AFI 2 (Afimania) ini banyak tertinggal informasi tentang para akademia tercinta mereka. 2. Sangat jarangnya website-website yang memberikan informasi tentang para akademia AFI 2. 26

27 3.2 Struktur Navigasi Struktur navigasi adalah struktur atau alur dari suatu program. Menentukan struktur navigasi merupakan tahap dari pembuatan aplikasi multimedia. Struktur navigasi ini dapat digunakan dengan flowchart pada program pascal, basic, atau lainnya, jadi struktur navigasi ini sama fungsinya dengan flowchart yaitu memberikan petunjuk kepada user, sehingga user juga bisa menjadikan struktur navigasi sebagai pedoman dalam mencari informasi yang ada dalam website ini. Pada penulisan ini, penulis menggunakan struktur navigasi campuran, dikarenakan dapat memberikan interaktif yang lebih tinggi dan sesuai dengan kebutuhan penulis. PROFILE Profile Micke Profile Cindy Profile Rindu LYRIC Profile Haikal Profile Lia Profile Jovita START HOME GALERY Profile Adi Profile Pasha PENGAJAR Profile Nia Profile Adit Profile Nana ALBUM 27 Profile Tia

28 Gambar 3.1 Struktur Navigasi 3.3 Perencanaan Storyboard Untuk mendesain antar muka biasanya digunakan storyboard yang disusun secara berurutan atau layar demi layar, sehingga dapat mempermudah dalam mendesain web nantinya. Pada storyboard ini selain digambarkan perkiraan dari tampilan akhir yang diinginkan, juga di tulis penjelasan dan spesifikasi tiap layar yang terlihat pada monitor, yang meliputi keterangan tiap tombol, teks, letak dan penjelasan. Satu hal yang perlu diperhatikan dalam membuat storyboard adalah tetap mengikuti struktur navigasi yang telah dibuat, sehingga desain terarah Start atau Halaman Pembuka Pada Halaman pembuka ini terdapat tampilan gambar akademia AFI 2. Untuk membuka tampilan menu berikutnya dapat dilakukan dengan mengklik pada area halaman utama. Logo AFI TEXT Gambar 12 Akademia START Gambar 3.2 Rancangan Start 28

29 3.3.2 Menu utama atau Home.htm Pada menu utama ini pengunjung akan diberikan pilihan-pilihan submenu lainnya yang dapat dipilih dengan mengklik salah satu tombol menu yang ada seperti Home, Profile, Galery, Pengajar, dan Album. ZONA AFI 2 LOGO AFI Home Profile Galery TEXT Pengajar GAMBAR 12 AKADEMIA AFI 2 Gambar 3.3 Rancangan Menu Home 29 Album

30 3.3.3 Profile.htm Di dalam sub menu profile ini terdapat 12 tombol pilihan yang bertuliskan nama-nama akademia. Pengunjung dapat memilih satu dari 12 tombol tersebut untuk melihat profile akademia yang mereka pilih, seperti nama lengkap, tempat tanggal lahir, hobby, cita-cita dan lain-lain. LOGO AFI Home Zona afi 2 Profile Galery MICKE CINDY RINDU HAIKAL LIA NANA ADIT Pengajar Album GAMBAR AKADEMIA NIA PASYA ADI JOVITA PROFILE AKADEMIA Gambar 3.4 Rancangan Menu Profile 30

31 3.3.4 Galery.htm Pada Sub menu Galery ini ditampilkan sekilas gambar atau foto para akademia pada saat konser eliminasi sampai malam konser Grand Final AFI 2. Zona afi 2 LOGO AFI Home Profile Galery GAMBAR /FOTO Pengajar TEXT GAMBAR /FOTO TEXT GAMBAR /FOTO TEXT GAMBAR /FOTO TEXT Gambar 3.5 Rancangan Menu Galery 31 Album

32 3.3.5 Pengajar.htm Pada menu ini pengunjung dapat melihat siapa saja pengajar pada AFI 2 dan Profilnya. ZONA AFI 2 LOGO AFI Hom e Profile Galery Pengajar GAMBAR PENGAJAR TEXT GAMBAR PENGAJAR TEXT GAMBAR PENGAJAR TEXT GAMBAR PENGAJAR TEXT Gambar3.6 Rancangan Menu Pengajar 32 Album

33 3.3.6 Album.htm Menu ini menampilkan album-album yang telah dihasilkan oleh para akademia AFI 2: LOGO AFI Home ZONA AFI 2 Profile Galery Album Pengajar GAMBAR ALBUM TEXT GAMBAR ALBUM TEXT GAMBAR ALBUM TEXT GAMBAR ALBUM TEXT Gambar 3.7 Rancangan Menu Album 33

34 3.4 Membuat situs local Situs local memiliki pengertian bahwa seluruh site yang digunakan untuk membangun situs web tersebut berada dalam computer yamg berdiri sendiri. Bisa menempatkannya dalam drive local. Dalam Dreamwever, untuk membuat situs web perlu mendefinisikan situs dengan menggunakan kotak site definition. Pada kotak dialok site definition tersebut diminta untuk menentukan situs yang akan dibuat. Ada dua cara proses pendefinisian, yaitu dengan menggunakan pilihan basic atau advance. Pilihan Basic memberikan kemudahan dalam mempersiapkan situs. Dan pilihan Advance bagi yang sudah paham betul akan konsep yang berlaku pada Dreamwever MX. Adapun langkah-langkah untuk mengatur pendefinisian site yang dijalankan pada versi basic adalah sebagai berikut : 1. Pilih perintah Menu Site > Manage Site 34

35 Gambar 3.8 Kotak dialog manage site Pada tampilan kotak dialog manage site dapat melakukan beberapa hal, antara lain New, Edit < Duplicate, Remove, Export Dan Import. Untuk membuat situs baru pilih tombol New sehingga akan tampil dua pilihan menu melayang, Site dan FTP & RDS server. Kemudian tekan tombol site. Selanjutnya akan tampil kotak dialog site Definition seperti pada gambar 3.9. Pada halaman ini diminta untuk memasukkan nama sesuai keinginan. 35

36 Gambar 3.9 Site Definition Langkah 2. Klik Next untuk masuk pada kotak dialog berikutnya Pada kotak dialog kedua diminta untuk memilih tipe dokumen. Perhatikan gambar 3.3. Jika memilih No, berarti memilih situs statis tanpa halaman dinamis. Atau, pilih yes apabila ingin memilih dokumen dinamis. Gambar 3.10 Site Definition langkah Kedua 3. Klik Next untuk melakukan ke langkah berikutnya. Pilih pilihan pertama, Edit locally, them upload to remove testing server setelah itu di tentukan tempat penyaimpanan files pada harddisk dengan mengetikan folder penyimpanan pada bagian kotak teks yang disediakan. 36

37 Gambar 3.11 Site Definition Langkah Ketiga 4. Selanjutnya tekan tombol Next untuk menuju kotak dialog berikutnya Pada bagian tersebut diminta untuk menentukan Web Server, maka pilih Lokal/Network. Gambar 3.12 Site Definition Keempat 37

38 5. Klik Next untuk menuju langkah selanjutnya Kotak dialog pada gambar 3.13 menampilkan ringkasan dari setting yang telah dibuat. Klik tombol Done untuk mengakhiri proses. Gambar 3.13 Site Definition Kelima 3.5 Pembahasan program Pada tahapan ini berisikan pembahasan cara-cara pembuatan website Zona Afi 2 yang dibuat oleh penulis. Adapun langkah-langkah yang telah dilakukan oleh penulis dalam pembuatan website ini adalah : 1. Mengambil gambar dengan menggunakan internet 2. Membuat struktur navigasi 3. Merancang dan mendesain elemen gambar situs 4. Membuat isi informasi website Adapun langkah awal dalam pembuatan Halaman utama atau start adalah sebagai berikut : 38

39 1. Pilih Menu File pada Menu Bar > New atau bisa juga dengan menggunakan shortcut Ctrl+N. Kemudian akan tampak tampilan dari kotak dialog New Document seperti pada gambar Pilih Basic Page > HTML >Creat. 3. Maka munculah ruang kerja Dreanwever Gambar 3.14 New Document 39

40 Gambar 3.15 Tampilan Ruang kerja Dreamweaver 4. Buat table ke dalam document, isikan dengan Rows: 2, Columns: Lalu pilih menu Insert > Image atau Ctrl + alt + i. 6. Kemudian masukkan gambar yang telah dipilih. 7. Lalu atur besar kecil layer. 8. Lalu pindahkan kursor kearah Files. Kemudian buatlah file baru untuk halaman utama. Dengan cara klik kanan pada halaman Files > New File, ketik Home.html kemudian tekan enter. 9. Lalu klik pada layer sehingga pada bagian properties sel table ada gambar kecil layer layer tersebut. 10. Lalu pada box properties isikan link dengan Home.html. 11. Simpan file sebagai start.htm. 40

41 Gambar 3.16 Tampilan start Langkah kedua dalam pembuatan menu Home.htm adalah sebagai berikut : 1. Pilih menu File > Open > Home.htm lalu akan tampil kotak New Document baru. 2. Buat Table ke dalam document, isikan dengan Rows : 2, Columns : 3 3. Perbesar table sesuai dengan keinginan. 4. Klik bagian dalam Table kiri atas, kemudian masukkan gambar dengan menggunakan Insert > Image,atur lebar dan panjang gambar. Masukkan gambar pada Table kanan bawah dengan cara yang sama. 5. Setelah itu Klik lagi bagian table kanan atas dan table kiri bawah, masukan data berupa teks dengan cara di ketik.gunakan Align Center untuk mengatur agar text rata pada bagian tengah. 6. Gabungkan Cell frame bagian tengah (baris kedua) dengan menggunakan Merges Sellected Cell. 41

42 7. Lalu buatlah File baru untuk halaman Profile.html, Galeries.html, Pengajar.html, Lyric.html, Album.html. 8. Kemudian buat tombol button (tombol pilihan menu) dengan cara : a. Klik Menu Insert > Media > Flash Button untuk membuka kotak dialog Insert Flash Button, seperti pada gambar Gambar 3.17 Tampilan Insert Flash Button Dalam kotak dialog yang tampil, lakukan beberapa pengaturan berikut : a. Pilih jenis tombol pada kotak Style. Dapat melihat contoh animasi tombol dengan mengarahkan mouse pada kotak Sample. b. Masukkan Teks yang akan di tampilkan pada tombol kotak teks Button Text. c. Tentukan link yang ingin dihubungkan dengan mengetikan alamat link pada kotak teks Link. d. Tentukkan target/window dari limk pada kotak Target. e. Jika ingin memberikkan warna latar belakang yang sesuai dengan warna latar belakang halaman, dapat memilih warna pada Bg ColorKlik OK. 42

43 b. Pilih Style Button Blue Warper, masukkan Text Home, lalu pilih Font Culrs mt dengan link Profile.htm, pilih target parent lalu save as : Profile Button.swf. Lakukan cara yang sama untuk membuat tombol button (tombol pilihan menu) Profile (dengan Link : profile.htm), Galeries (dengan Link : Galeries.htm), Pengajar (dengan Link : Pengajar.htm), Lyric (dengan Link : Lyric.htm), Album (dengan Link : Album.htm). 7. Pemasukkan warna pada background dapat dilakukan dengan mengklik bagian page properties. Pilih warna sesuai keinginan. 8. Lalu Save as Home.html. Gambar3.18 Tampilan Home.htm Langkah ketiga dalam pembuatan halaman profile.htm ini adalah sebagai berikut : 43

44 1. Buka Profile.html dengan cara File > Open > Profile. 2. Buat Table ke dalam document, isikan dengan Rows: 3, Columns: Perbesar table sesuai ukuran. 4. Buat bagian table atas, dan table bagian tengah (baris kedua) dengan cara yang sama seperti tampilan sebelumnya. 5. Lalu klik bagian table kanan bawah, buat table lagi didalamnya dengan Rows: 12, Columns:1. Perbesar table sesuai ukuran. 6. Kemudian ketikan teks berupa nama para akademia, gunakan Align Center untuk mengatur agar teks rata pada bagian tengah. Berikan warna pada latar belakang dapat dilakukan dengan meng-klik bagian Page properties. Pilih warna sesuai keinginan.ubah font dengan Curlz Mt, Size dengan ukuran 20, dan color teks sesuai keinginan, pada box properties isikan link dengan Home.html. 7. Klik bagian table kanan bawah, buat table lagi didalamnya dengan Rows: 2, Columns: 1. Perbesar table sesuai dengan ukuran. a. Klik bagian table atas buat layer didalamnya dengan cara Insert > Layout objects > Layer. Gunakan Align Center untuk mengatur agar teks rata pada bagian tengah. b. Lalu masukan gambar academia Tia ke dalam layer dengan menggunakan Insert > Image. c. Klik bagian bawah table, buat lagi table didalamnya dengan Rows: 7,dan Columns: 3. d. Lalu masukan teks pada table tersebut sesuai data yang telah didapat tentang academia Tia. Gunakan Align Center untuk mengatur agar teks rata pada bagian tengah, Ubah font dengan Curlz Mt, Size dengan ukuran 20, dan color teks sesuai keinginan. 8. Berikan warna pada latar belakang dapat dilakukan dengan meng-klik bagian Page properties, pilih warna sesuai keinginan. 9. Save as dengan nama PROFILE TIA.HTML 44

45 10. Buat 11 tampilan desain untuk akademia lainnya dengan cara yang sama. Gambar 3.19 Tampilan Profile Kemudian langkah keempat dalam pembuatan Lyric.html adalah sebagai berikut : 1. Buka Lyric.html dengan cara File > Open > Lyric. 2. Lalu masukan Table kedalam document. Isikan Rows: 4, Columns: Perbesar table sesuai ukuran. 4. Buat bagian table atas, dan colom table bagian baris kedua dengan cara yang sama seperti tampilan sebelumnya. 5. Masukan teks pada Columns kesatu, kedua, dan ketiga bagian kiri berupa lirik lagu. Gunakan Align Center untuk mengatur agar teks rata pada bagian tengah. 6. Lalu pada bagian table kanan bawah masukan gambar dengan cara Insert > Image setelah sebelumnya meng-klik align center pada box properties, lalu atur besar kecil layer. 45

46 7. Berikan warna pada latar belakang dapat dilakukan dengan cara meng-klik bagian Page properties, pilih warna sesuai keinginan. 8. Save as Lyric.html. Gambar 3.20 Tampilan Lyric Langkah kelima dalam pembuetan Galery.html adalah sebagai berikut : 1. Buka Galleries.html dengan cara File > Open >Galery 46

47 2. Lalu masukan table kedalam document. Isikan Rows: 15, Columns: Perbesar table sesuai ukuran. 4. Buat bagian table atas, dan colom table bagian baris kedua dengan cara yang sama seperti tampilan sebelumnya. 5. Gabungkan setiap Cell sebelah kiri pada baris ketiga sampai dengan kelimabelas dengan menggunakan Merges Sellected Cell. 6. Buat lagi table didalam setiap baris table tersebut dengan Rows: 1, Columns: Perbesar table sesuai ukuran. 8. Pada column pertama masukan gambar dengan cara Insert >Image. Sedangkan pada column ketiga masukan teks pada table tersebut yaitu berupa keterangan gambar. Gunakan Align Center untuk mengatur agar teks dan gambar rata pada bagian tengah. 9. Berikan warna pada latar belakang dapat dilakukan dengan meng-klik bagian Page properties, pilih warna sesuai keinginan. 10. Lalu Save as: Galery.html. 47

48 Gambar 3.21 Tampilan Galery Langkah keenam dalam penulisan Pengajar.html adalah sebagai berikut : 1. Buka Pengajar.html dengan cara File > Open > Pengajar. 2. Lalu masukan table kedalam document. Isikan Rows: 3,,Columns: 2 3. Perbesar table sesuai ukuran. 4. Buat bagian table baris pertama (bagian atas) dan table baris kedua (bagian tengah) dengan cara yang sama seperti tampilan sebelumnya. 5. Gabungkan Cell sebelah kiri pada baris ketiga dengan menggunakan Merges Sellected Cell. 6. Buat lagi table didalam table baris ketiga tersebut dengan Rows: 7, Columns: 1, Perbesar table. a. Kemudian masukan teks kedalam table baris pertama. b. Buat kembali table didalam table baris ke dua sampai dengan baris ketujuh dengan Rows: 1, Columns: 3,perbesar table sesuai ukuran. 48

49 c. Lalu masukan gambar pada column table pertama dengan cara Insert > Image, atur lebar dan panjangnya. Sedangkan pada column table ketiga masukan teks sesuai data yang telah didapat tentang pengajar. Gunakan Align Center untuk mengatur agar teks dan gambar rata pada bagian tengah. 7. Berikan warna pada latar belakang dapat dilakukan dengan meng-klik bagian Page properties.pilih warna sesuai keinginan. 8. Lalu Save as Penajar.html. Gamgar 3.22 Tampilan Pengajar Langkah ketujuh dalam pembuatan Album.html adalah sebagai berikut : 1. Buka Album.html dengan cara File > Open > Album. 2. Lalu masukan table kedalam document. Isikan Rows: 6, Columns: 2 3. Perbesar table sesuai ukuran. 49

50 4. Buat bagian table atas, dan colom table baris kedua dengan cara yang sama seperti tampilan sebelumnya. 5. Gabungkan setiap Cell sebelah kiri pada baris ketiga sampai dengan keenam dengan menggunakan Merges Sellected Cell. 6. Buat lagi table didalam setiap baris table tersebut dengan Rows: 1, Columns: Perbesar table sesuai ukuran. 8. Pada column pertama masukan gambar dengan cara Insert >Image. Sedangkan pada column ketiga masukan teks pada table tersebut yaitu berupa keterangan isi album. Gunakan Align Center untuk mengatur agar teks dan gambar rata pada bagian tengah. 9. Save as : Album.html Gambar 3.23 Tampilan Album. 3.6 Perangkat Pendukung. 50

51 Untuk dapat menjalankan program Macromedia Dreamwever MX 2004 ini minimal komputer memiliki spesifikasi sebagai berikut : a. Prosesor intel Pentium II atau lebih, 300 Mhz atau lebih b. Windows 98, Windows 2000, Windows NT,Windows ME dan Windows XP c. Netscape Navigator atau Microsoft Exporer versi 4 keatas. d. Minimal 96 MB RAM disarankan 128 MB RAM. e. Ruangan yang tersisa dalam Harddisk minimal 275 MB f. CD-ROM. BAB IV PENUTUP 4.1 Kesimpulan Website di Internet merupakan sarana yang sangat efektif untuk menyajikan informasi berbagai macam hal salah satu diantaranya adalah Entertent dan penyampaian tersebut akan lebih menarik dengan adanya tambahan berbagai gambar dan tampilan menarik atau bahkan animasi. Website Zona AFI 2 ini memuat berbagai macam informasi menarik yang disajikan untuk masyarakat pada umumnya dan untuk para penggemar Akademi Fantasi Indosiar (AFI mania) pada khususnya yang ingin mengetahui lebih banyak lagi tentang para Akademia AFI 2 mereka. Berbagai macam foto para Akademia AFI 2 dan acara grand final AFI 2 di sajikan di sini. Website ini juga memberikan informasi Album terbaru yang dihasilkan oleh Akademi Fantasi Indosiar Saran Tampilan Zona AFI 2 yang dibuat oleh penulis masih jauh dari sempurna, oleh karena itu masih banyak yang harus dikembangkan dalam Website ini, misalnya 51

52 penambahan gambar gambar, informasi yang lebih banyak, dan tampilan Website yang lebih menarik sehingga dapat membuat Website ini lebih baik. Dalam pembuatan Website ini penulis berharap para AFI Mania 2 dapat memanfaatkan Website ini dengan sebaik baiknya. 52