belajar membuat website
Post on 19-Jul-2015
130 Views
Preview:
TRANSCRIPT
BELAJAR MEMBUAT WEBSITE
Dengan HTML
• Seiring dengan pertambahan jumlah netter (pengguna internet) di seluruh dunia, termasuk di Indonesia, makin banyak pula orang yang ingin mempunyai homepage atauwebsite sendiri.
• Hal ini wajar mengingat manfaat yang bisakita dapatkan dengan mempunyai website sendiri.
Bagaimana caranya bisa menampilkan website sendiri di internet?
• Yang Harus diperhatikan dalam membuatwebsitet :
– Website yang dari segi perwajahan tidak"menyedihkan“
– dari segi isi tidak "asal-asalan“
– dan dari segi pengunjung cukup "dilirik"
Untuk membuat sebuah website :• pertama-tama kita harus belajar bahasa HTML yaitu
sebuah "bahasa program" yang memungkinkan kitamembuat halaman web yang bisa ditampilkan dalambrowser (Internet Explorer, Netscape, Opera, dll).
• Setelah kita menguasai dasar-dasar HTML, barulah kitamencoba membuat rencana dan rancangan dari desaindan isi website yang hendak kita buat.
• Kemudian rancangan itu kita tuangkan dalam bentukhalaman-halaman web yang terpadu.
• Setelah selesai atau "mengarah ke selesai", kita harusmendaftarkannya ke web hosting agar website kita"terpasang" dan dapat diakses di internet.
• Akhirnya, yang juga tidak kalah penting adalah bagaimanamempromosikan website tersebut agar dikenal dandikunjungi oleh para netter.
HTML (Hypertext Markup Language)bahasa program yang digunakan untuk menulis formatdokumen yang dapat digunakan dalam Web.
Dengan HTML, teks ASCII (file *.txt) dapat dipoles (di-mark-up) dengan kode-kode tertentu yang disebut taguntuk menjadi dokumen HTML (file *.htm atau *.html)
Oleh karena itu, untuk membuat dokumen HTML, andabisa menggunakan semua program teks editor biasa,mulai dari Notepad hingga MS Word.
Untuk mudahnya, kita gunakan program Notepad
• Meskipun anda bisa saja membuat web page(halaman web) tanpa mengerti sedikitpunHTML
• Yakni dengan menggunakan editor HTMLberjenis WYSIWYG (What You See Is WhatYou Get / Apa Yang Anda Lihat Adalah ApaYang Anda Dapatkan) seperti MicrosoftFrontPage, Dream Weaper, Webpage Maker,Joomla, dll
• Namun sangat disarankan bahkan nyarisdiharuskan, agar anda mengerti bahasa HTML.
Langkah-langkah menampilkan Editor program
1. Klik Start 2. Programs3. Accessories4. Notepad
PENGENALAN KODE HTML
Dalam program Notepad anda, tulislah sepertiini:
<HTML>
</HTML>
• Masing-masing baris di atas disebut tag.• Tag adalah kode yang digunakan untuk me-mark-
up (memoles) teks ASCII menjadi file HTML.• Setiap tag diapit dengan tanda kurung runcing.• Ada tag pembuka yaitu <HTML>• dan ada tag penutup yaitu </HTML> yang
ditandai dengan tanda slash (garis miring) didepan awal tulisannya.
• Tag-tag html dapat ditulis dengan huruf besarataupun huruf kecil
• Artinya, penulisan <HTML> atau <html> atau<Html> sama saja hasilnya.
Membuat Website sederhana:
<HTML>
<BODY>
Belajar Membuat Web Site
…………………………… Isi dari pada
…………………………….. Website
……………………………..
</BODY>
</HTML>
Menyimpan File HTML• Sekarang simpanlah file ini dengan meng-klik menu File
lalu Save• Tentukan Folder tempat penyimpanan data anda.• Pada kotak File Name : Buatlah nama file yang akan
disimpan• Contoh : COBA.HTML atau COBA.HTM• Lalu klik Tombol SaveCatatan :
Kalau anda menyimpan pertama sekali dengan .HTMLmaka gunakan .HTML untuk seluruh File Anda Tetapikalau anda menyimpan dengan .HTM maka gunakan.HTM untuk seluruh file anda
Menampilkan Hasil website
• Buka salah satu browser yang ada di komputeranda apakah Internet Explorer, Mozilla, Crome, Opera, DLL
• Kemudian klik File Open
• Cari dimana menyimpan file html tadi, kemudian klik file tersebut
• Lalu ok
• Atau anda bisa membuka memalui windows explorer cari filenya, kemudian double klik
Apakah tag BODY fungsinya sekedar penandatubuh atau isi dari dokumen web?
Tidak, dalam tag BODY ini bisa kitasisipkan bermacam-macam atribut yang akan berpengaruh terhadap format atautampilan halaman web secara keseluruhan.
Pada kesempatan ini kita mengambil contohbagaimana mengubah warna latar belakangdan warna tulisan dari halaman web denganpenambahan atribut ke dalam tag BODY.
Memberi Warna Background
<HTML>
<BODY BGCOLOR=“Black”>
<FONT COLOR="blue">Tulisan warnabiru</FONT>
<FONT COLOR="red">Background berwarnaHitam</FONT>,
</BODY>
</HTML>
Perlu diketahui bahwa penentuan warna padaHTML bisa dengan nama warna (dalam bahasaInggris) dan bisa pula dengan kode warna.Kode warna ditulis dalam format heksa.Berikut ini adalah 16 nama warna beserta kodenyadalam format heksa (harap diingat bahwa tulisan 0adalah angka nol, bukan huruf O).
black #000000 blue #0000FF olive #808000 white #FFFFFF fuchsia #FF00FF green #008000 red #FF0000 gray #808080 teal #008080 yellow #FFFF00 silver #C0C0C0 navy #000080 lime #00FF00 maroon #800000 purple #800080 aqua #00FFFF
<HTML>
<BODY BGCOLOR="#FFFF00" TEXT="#FF0000">
Belajar Membuat Web Site
</BODY>
</HTML>
Membuat Judul Website
• Di sini terlihat bahwa kita menambah tag <HEAD> dan tag <TITLE>.
• Tag HEAD berfungsi untuk mengapit berbagaimacam fungsi dan informasi yang berkenandengan halaman web yang bersangkutan.
• Pada latihan kali ini, kita memasukkan tag TITLE diantara tag HEAD. Sesuai namanya, tag TITLE ini berfungsi untuk mengapit kalimat yang menjadi judul dari halaman web tersebut.
• Sekarang mari kita tuliskan judul halaman web ini:
<HTML>
<HEAD>
<TITLE>WebSite Aku Yang Pertama</TITLE>
</HEAD>
<BODY BGCOLOR="yellow" TEXT="red">
Belajar Membuat Web Site
</BODY>
</HTML>
MENGUTAK-ATIK HURUF
• Dalam latihan kedua ini, kita akan mempelajaribeberapa tag yang relatif mudah diingat.
• Tag-tag ini berfungsi untuk mengubah tipehuruf yaitu menebalkan (bold) <B>
• membuat tulisan miring (italic) <i>
• atau memberi garis bawah (underline) <U>
• Bahkan bisa pula ketiga tipe tulisan tersebutsekaligus bergabung menjadi satu berupa tulisantebal, miring dan bergaris bawah.
• Kesimpulannya, penekanan tombol Enter tidakmenghasilkan baris dalam tampilan browser.
• Demikianlah sifat penulisan dokumenHTML. Lantas, bagaimana caranya membuatbaris
• Gunakanlah tag <BR>. Tag ini tidakmempunyai tag penutup.
• Tag <BR> tersebut dapat pula digunakan untukmembuat baris kosong, artinya baris yangtidak mempunyai kalimat apa-apa.
• Di sini kita lihat bahwa tag <BR> yang ditulisdua kali akan menghasilkan dua baris,demikian seterusnya.
VARIASI FONT• Tanpa campur tangan kita, dokumen HTML
menggunakan font default dari Windows(Sistem Operasi Komputer) atau browser(Internet Explorer), biasanya Times NewRoman dengan ukuran 12 point.
• Kita bisa mengubah jenis, warna dan ukuranfont sesuai dengan selera kita menggunakantag <FONT> diikut dengan atribut-atributnya.
Atribut COLOR
<HTML>
<BODY>
<FONT COLOR="blue">Tulisan warna biru</FONT>,
<FONT COLOR="red">Tulisan warnamerah</FONT>,
<FONT COLOR="yellow">Tulisan warnakuning</FONT>
</BODY>
</HTML>
Atribut SIZE<HTML> <BODY> <FONT SIZE="1">Font Size 1</FONT>, <FONT SIZE="2">Font Size 2</FONT>, <FONT SIZE="3">Font Size 3</FONT>, <FONT SIZE="4">Font Size 4</FONT>, <FONT SIZE="5">Font Size 5</FONT>, <FONT SIZE="6">Font Size 6</FONT>, <FONT SIZE="7">Font Size 7</FONT> </BODY> </HTML>
Atribut FACE
<HTML>
<BODY>
Ini adalah font <FONT FACE="Arial">Arial</FONT>,
ini adalah font <FONT FACE="Verdana">Verdana</FONT>,
dan ini adalah font <FONT FACE="Impact">Impact</FONT>
</BODY>
</HTML>
TUGAS AKHIR
HOME BIODATA TUTORIAL TIP & TRIK CERITA
1. Memasukkan Video Dari Youtube Ke Website
2. TIK3. Mulok4. Budidaya Tanaman………10. Dll
1. TIK……………………..10. DLL
1………2………3………4………5………
DIKUMPUL PALING LAMBAT TANGGAL 31MEI 2014 JAM 12.00 WIB
URL Dapat Dikirim Ke
E-mail : yudiavis@yahoo.com
FB : yudiavis@yahoo.com
Pin BB : 75576FC2
SMS : 0813 65 780574
JANGAN LUPA NAMA DAN KELAS ANDA
top related