Mamiana: Makalah Web

BAB I

PENDAHULUAN

A. Latar Belakang

Perancangan halaman atau web design adalah istilah umum yang digunakan untuk mencakup bagaimana isi web konten ditampilkan, (biasanya berupa hypertext atau hypermedia) yang dikirimkan ke pengguna akhir melalui World Wide Web, dengan menggunakan sebuah browser web atau perangkat lunak berbasis web. Tujuan dari web design adalah untuk membuat website sekumpulan konten online termasuk dokumen dan aplikasi yang berada pada server web / server. Sebuah website dapat berupa sekumpulan teks, gambar, suara dan konten lainnya, serta dapat bersifat interaktif ataupun statis.

Elemen-elemen seperti teks, forms, images (GIFs, JPEGs, Portable Network Graphics) dan video dapat diletakkan didalam halaman menggunakan tag-tag HTML/XHTML/XML. Browser terkadang juga memerlukan Plug-ins seperti Adobe Flash, QuickTime, Java, dan sebagainya untuk menampilkan beberapa media yang diletakkan didalam halaman web menggunakan tag-tag HTML/XHTML.

Halaman web dan situs web dapat berupa halaman statis, atau dapat diprogram secara dinamis sehingga menghasilkan halaman web dengan konten atau tampilan visual yang diinginkan, tergantung pada berbagai faktor, seperti masukan dari pengguna akhir, masukan dari Webmaster, atau perubahan dalam lingkungan komputasi (seperti situs yang terkait dengan database yang telah diubah).

Dengan berkembangnya spesialisasi dalam desain komunikasi dan bidang teknologi informasi, ada kecenderungan kuat untuk menarik garis yang jelas antara web design khusus untuk halaman web dan pengembangan web secara keseluruhan dari semua layanan berbasis web.

B. Rumusan Masalah

Dari latar belakang tersebut maka rumusan masalah adalah:

1. Apa itu website?

2. Bagaimana langkah-langkah dalam mendesain halaman web?

3. Tag-tag apa saja yang digunakan untuk membuat halaman web?

4. Bagaimana bentuk halaman web?

C. Tujuan Masalah

Dari rumusan masalah diatas maka tujuan masalah adalah:

1. Mampu mengetahui pengertian dari webside.

2. Mampu mengetahui langkah-langkah dalam mendesain halaman web.

3. Mampu mengetahui tag-tag yang digunakan dalam membuat halaman web

4. Mampu membuat halaman web pribaedinya masing-masing.

BAB II

PEMBAHASAN

A. Pengenalan Perancangan Web

Perancangan web adalah istilah umum yang digunakan untuk mencakup bagaimana isi web konten ditampilkan, (biasanya berupa hypertext atau hypermedia) yang dikirimkan ke pengguna akhir melalui World Wide Web, dengan menggunakan sebuah browser web atau perangkat lunak berbasis web. Tujuan dari web design adalah untuk membuat website sekumpulan konten online termasuk dokumen dan aplikasi yang berada pada server web / server. Sebuah website dapat berupa sekumpulan teks, gambar, suara dan konten lainnya, serta dapat bersifat interaktif ataupun statis.

B. Langkah-Langkah Mendesain Halaman Web

Untuk membangun sebuah website, diperlukan suatu langkah-langkah persiapan yang secara umum dibagi dalam lima tahap, yakni:

1. Merumuskan tujuan membuat website

Berdasarkan isi maupun tujuan, suatu website biasanya dapat digolongkan menjadi seperti berikut ini:

a. Website marketing, berfungsi sebagai media presentasi dan pemasaran.

b. Website customer service, berfungsi sebagai media untuk melayani konsumen.

c. Website e-Commerce, berfungsi sebagai media transaksi on-line.

d. Website informasi/berita, berfungsi sebagai media informasi berita

2. Menentukan isi website

Faktor yang paling penting dalam suatu website adalah isi dari website itu sendiri. Hal tersebut berkaitan dengan manfaat yang akan diperoleh pengunjung dari sebuah website.

3. Menentukan target pengunjung

Meskipun suatu website mempunyai sifat terbuka dalam arti sebuah website bebas dikunjungi oleh semua orang, namun alangkah baiknya apabila dalam pembuatan website perlu dilakukan gambaran target yang akan dituju oleh sebuah website. Alasan ini lebih didasarkan pada penggunaan hardware dan aplikasi browser yang berbeda dengan setiap pengunjung.

4. Menentukan struktur website

Struktur website diperlukan untuk memberikan kemudahan dalam mengelola suatu website. Tentunya struktur tersebut harus disesuaikan dengan isi dari website. Dengan memiliki struktur yang terorganisasi dengan baik, suatu website akan memberikan kemudahan dalam navigasi, editing dan pemeliharaan website tersebut.

5. Desain website

Faktor keindahan desain tampilan dari suatu website merupakan salah satu faktor yang paling penting dalam menetukan keberhasilan suatu website, selain faktor kecepatan loading. Suatu situs yang baik memiliki suatu kesatuan desain bisa dikatakan memiliki kesamaan tema dalam halaman-halaman webnya. Hal ini penting dalam segi estetika maupun segi navigasi. Kesamaan desain yang biasanya dipertahankan antara lain kesamaan jenis font yang digunakan, warna, tombol navigasi (menu), letak menu dan sebagainya.

C. Elemen-elemen desain

Desain grafis khususnya dalam halaman-halaman web terdiri dari beberapa elemen sebagai berikut (Ariesto Hadi Sutopo,2002):

a. Teks adalah bagian yang paling utama untuk menampilkan informasi

b. Grafik atau Image merupakan elemen yang dapat membantu menjelaskan informasi. Dengan penggunaan grafik maupun image orang lebih mudah memahami suatu pesan.

c. Animasi merupakan sarana untuk menampilkan informasi dengan baik, disamping animasi merupakan daya tarik yang mudah diingat pengunjung.

d. Video dapat merupakan hasil suatu rekaman dengan kamera video maupun hasil pengolahan dengan komputer.

e. Suara melengkapi desain web, memberikan efek khusus pada suatu tampilan animasi serta memberikan kenyaman bagi pengunjung yang mendengarkannya

f. Interaktive link dapat menggunakan button yang berupa teks, simbol, grafik, maupun image, yang berfungsi untuk memudahkan pengunjung dalam menyelusuri suatu website.

D. Konsep Desain

Pada intinya konsep mendesain tampilan website sangat berkaitan dengan desain gra-fis , dan pada dasarnya mengikut prinsip desain grafis secara umum. Oleh karena itu alangkah baiknya jika dalam mendesain halaman tampilan website juga memperhatikan prinsip desain. Prinsip-prinsip desain tersebut adalah:

1. Komunikatif. Prinsip komunikatif berhubungan dengan corporate identity, isi pesan serta audiens.

2. Estetis. Fungsi dari estetis ini adalah memberikan suatu keindahan, sehingga lebih menarik minat pengunjung untuk lebih menggali informasi yang ditawarkan dari suatu website.

3. Ekonomis. Desain web harus memperhatiakan faktor ekonomis dalam arti ukuran file yang digunakan. Hal tersebut berkaitan erat dengan kecepatan akses yang ditawarkan suatu website.

Untuk mendapatkan desain yang komunikatif, estetis dan ekonomis hendaknya seorang web designer perlu memperhatikan pedoman-pedoman yang ada untuk membuat tata letak suatu tampilan, yaitu dalam mengatur elemen-elemen layout. Pedoman yang dimaksud adalah:

1. Kesatuan. Elemen-elemen layout dari halaman harus ditempatkan sedemikian rupa sehingga merupakan kesatuan informasi pada satu halaman atau beberapa halaman.

2. Balance. Elemen-elemen layout dari halaman harus ditempatkan sedemikian rupa sehingga terdapat keseimbangan secara keseluruhan.

3. Kontras. Diperlukan untuk menonjolkan bagian yang dianggap lebih penting dari bagian lainnya. Kontras dapat dinyatakan dengan membedakan ukuran serta warna dari elemen-elemen layout.

4. Kontinyuitas. Informasi lebih dimengerti oleh pengguna bila mempunyai aliran-aliran yang baik, sedikit gangguan yang menghambatnya. Suatu aliran informasi dapat dikatakan kontinyu dan harmonis bila tampilannya mencerminkan kesinambungan dari satu bagian ke bagian lain. Kontinuitas dapat dibuat dengan membuat halaman-halaman mempunyai gaya, bentuk atau warna yang memberikan pengguna merasakan kesinambunagn dengan halaman lainnya.

Bermacam-macam langkah yang digunakan untuk membuat layout dari suatu website. Berikut ini merupakan proses yang secara umum banyak dilakukan dalam pembuatan layout.

a. Membuat sketsa desain. Seorang desainer bisa saja menuangkan ide dalam pembuatan interface dengan terlebih dahulu membuat sketsa di atas kertas. Namun untuk kebanyakan orang, langkah ini biasanya dilewatkan dan langsung pada langkah pembuatan layout desain dengan menggunakan software.

b. Membuat layout desain. Banyak software yang dapat digunakan membuat layout. Salah satu diantaranya adalah Macromedia, proses ini dikerjakan setelah pembuatan sketsa desain. Namun terkadang pembuatan layout merupakan proses yang pertama kali dikerjakan.

c. Membagi gambar menjadi potongan-potongan kecil. Proses ini diperlukan untuk meng-optimize waktu download.

d. Membuat animasi. Animasi diperlukan untuk menghidupkan atau menjadikan website lebih interaktif.

E. Tag-Tag Yang Digunakan Untuk Membuat Halaman Web

1. Jenis-Jenis Tag Pada HTML

NO	JENIS TAG	DESKRIPSI
1	<TITLE>	Untuk memberi judul dokumen
2	<BASE>	Untuk menentukan baris url sebuah dokumen
3	<LINK>	Untuk membuat relasi antar dokumem HTML
4	<META>	Untuk mendefinisikan informasi-informasi diluar html
5	<HR>	Untuk membuat garis batas horizontal dengan atribut
6	<PRE>	Untuk membuat tampilan html pada broser sama dengan tampilan pada text editor
7	<TEXTARE><CITE>	Untuk membuat sebuah kotak text multibaris
8	<CITE>	Untuk menandai suatu ketikan
9	<CODE>	Untuk menampilkan kode program
10	<DFN>	Untuk menandai sebuah sub definisi daftar definisi
11	<B>	Untuk menebalkan huruf
12	<I>	Untuk memiringkan huruf
13	<U>	Untuk garis bawah text
14	<TT>	Untuk huruf masin ketik
15	<STRIKE>	Untuk garis horizontal pada tengah huruf
16	<BIG>	Untuk memperbesar tampilan huruf
17	<SMALL>	Untuk memperkecil tampilan huruf
18	<KBD>	Untuk menandai suatu text yang dimasukan oleh user melalui keyboard
19	<STRONG>	Untuk menandai bagian terpenting dari suatu text
20	<VAR>	Untuk menampilkan nama variabel
21	<EM>	Untuk menandai suatu text yang ditentukan penulis
22	<SUB>	Untuk karakter subscript
23	<SUP>	Untukkarakter supercript
24	<BLOCKUOTE>	Untuk menandai suatu bagian khususkan dokumen
25	<FONT>	Untuk mengatur jenis, ukuran,dan warna huruf
26	<TH>	Untuk membuat judul coloum atau baris
27	<TD>	Untuk membuat coloum tabel
28	<FORM>	Untuk membuat sebuah form
29	<TEBLE>	Untuk mendefinisikan sebuah tabel
30	<TR>	Untuk membuat garis tabel
31	<SELECT>	Untuk membuat sebuah daftar pilihan
32	<H>	Untuk merupakan sekumpulan kata yang menjadi judul atau subjudul dalam suatu dokumen
33	<DIV>	Untuk membagi dokumen html dalam hierarki yang terstuktur
34	<SAMP>	Untuk menandai suatu text yang dimadsudkan sebagai contoh
35	<INPUT>	Untuk membuat dokumen yang digunakan untuk meminta informasi dari user

2. Struktur dasar HTML

<HTML>

<HEAD>

<TITLE> isikan text </TITLE>

</HEAD>

<BODY>

isikan text sesuai keinginan

</BODY>

</HTML>

3. Tag-Tag Pada Halaman Homepage

<html>

<head>

</head>

<tr>

<td>

<marquee scrolldelay="100" style="Arial" width="850">Selamat Datang Di Website zainal_abidin_stk10</marquee></b></font></div>

</tr>

</td>

</table>

<tr>

<td>

<tr>

</td></A>

</tr>

</table>

<tr>

<font color="red"><b><center><font face="arial" size=4>Profil</font></b></font>

</tr>

</td></A>

</table>

<tr>

<font color="silver"><b><center><font face="arial" size=4>About</font></b></font>

</tr>

</td></A>

</table>

</tr>

</td>

</table>

<center><font face="arial" size="4"color="aqua"><b>Profile</b></font></td></A></tr></table>

<table background="wind4.jpg" border=2><tr><td width=260 height=45><A Href="About.html" Target="_top"<center><font face="arial" size="4" color="purple"><b>About</b></font></td></tr></table>

</td></tr></table>

Category Pilihan Website ini :

<option value="Artikel" selected>Artikel</option>

<option value="Profile">Profile</option>

<option value="About">About</option>

<option value="Biodata">Biodata</option>

<option value="Permainan" >permainan</option>

</select><p></P>

</form>

<Pre>

</pre>

Pilih Pendapat Anda tentang Website ini :

<input type="checkbox" name="ini" value="Bagus">Bagus<p></p>

<input type="checkbox" name="ini" value="Sedang">Sedang<p></P

<input type="checkbox" name="ini" value="Biasa">Biasa<p></p>

<input type="checkbox" name="ini" value="Jelek">Jelek<p></p>

<P>

</object><br>

</object></H2>

</form>

</td></tr></table>

</td><td width=600>

<table background="wind6.jpg" border=0><tr><td width=700 height=450 Align=center valign=top><font face="French Script MT" size="7" color="red"><center><b><marquee>"Rumah-rumah ALLAH"</marquee></b></font>

<p></p>

<br>

<></b></font></div>

</td></tr></table>

      <font face="arial" size=6>Rumah-rumah ALLAH yang biasa disebut dengan mesjid merupakan tempat beribadah bagi umat islam,dengan menjalankan segala perintahnya yaitu dengan menunaikan shalat sebagaimana yang diwajibkan. Barang siapa yang memilihara masjid maka insya allah,allah akan memeliharanya pula dalam surganya. Oleh karena itu marilah kita bersama-sama menjaga rumah allah tersebut agar kita semua masuk dalam surganya. </font>

</font></td></tr></table>

<center><font face="arial" size=3 color="blue">Halaman <A Href="Bagian I.html" Target="_top"> 1, </A><A Href="Bagian I_2.html" Target="_top"> 2, </A><A Href="Bagian I.html" Target="_top"> Next </A><A Href="Bagian I.html" Target="_top"> Back <A>

</td></tr>

</table>

</tr>

</td>

</table>

<marquee scrolldelay="100" style="Arial" width="850"><i>Sampai jumpa dilain waktu</i></marquee></b></font></div>

</tr>

</td>

</table>

</tr>

</td>

</table>

</boody>

</html>

BAB III

PENUTUP

A. Simpulan

Desainerweb (webdesigner) adalah orang yang memiliki keahlian menciptakan konten presentasi (biasanya hypertext atau hypermedia) yang dikirimkan ke pengguna-akhir melalui World Wide Web, menggunakan Webbrowser atau perangkat lunak Web-enabled lain seperti televisi internet, Microblogging, RSS, dan sebagainya. Dengan berkembangnya spesialisasi dalam desain komunikasi dan bidang teknologi informasi, ada kecenderungan kuat untuk menarik garis yang jelas antara web design khusus untuk halaman web dan pengembangan web secara keseluruhan dari semua layanan berbasis web.

Mamiana

Sabtu, 07 Januari 2017

Makalah Web

Tidak ada komentar:

Posting Komentar