MusicPlaylistView Profile
Create a playlist at MixPod.com

Wednesday, March 10, 2010

Struktur HTML Untuk Membuat Website

Website atau situs adalah suatu kumpulan dari beberapa halaman yang terkumpul dalam suatu domain. Fungsinya untuk memberikan suatu informasi yang kita punya, atau mengiklankan suatu jasa dan produk, atau bahkan sebagai sarana bisnis. Untuk membuat sebuah website, sebetulnya tidak terlalu sulit namun kebanyakan dari kita semua tidak pernah mencoba mencari tahu caranya dan akhirnya pun berhenti di tengah jalan. Ada banyak fasilitas penyedia situs seperti Joomla!, Wordpress, Php, dan sebagainya. Dengan menggunakan fasilitas2 tsb, kode2 html yang dibutuhkan untuk membangun website akan otomatis terbuat saat kita mendaftar. Namun, kita juga bisa membuat kode html itu sendiri dengan menggunakan program aplikasi bawaan Windoes seperti Notepad. Dengan menggunakan Notepad, kita akan membuat file index.html yang biasanya berupa homepage dari website yang akan kita buat. Tapi, HTML itu sebetulnya apa sih? HTML merupakan singkatan dari Hyper-Text Markup Language. HTML merupakan suatu format halaman web yang biasa digunakan dalam berbagai situs. Banyak orang menggunakan format tsb karena pengkodeannya yang mudah. Setiap kode yang kita tulis, diumpamakan sebagai berikut ini: dan

Diawali dengan kurung buka (<) dan diakhiri dengan kurung tutup (>). Lalu, kita pun harus menutup tag tsb yaitu dengan menambahkan di akhir tulisan. Saya akan memberikan contoh script yang saya buat untuk tugas TIK di SMPN 2 Bandung berikut ini:


<html>
<head>
<title>Ananda Ganesha's Website</title>
<link rel="stylesheet" type="text/css" href="2leveltab.css" />

<script type="text/javascript" src="2leveltab.js"></script>
<script language='JavaScript'>alert("selamat datang di situs percobaan ananda ganesha!");</script>
<link href='dewagajah-favicon.ico' rel='shortcut icon'/>
</head>
<body background="logo-dewagajah-berwarna.JPG" bgcolor="orange">
<marquee behavior='alternate' background-color='red'>
<center><font color='yellow' size='7' face='Verdana' style='background-color: red'>Welcome to my website!</font><br/>
<img width='320' height='240' src='13067_1195427337464_1581871207_487082_1069792_n.jpg'></center>
</marquee>

<ul id="maintab" class="basictab">
<li><a href="index.html">Home</a></li>
<li rel="my blogs"><a href="#">My Blogs &#9660;</a></li>
<li rel="profile"><a href="profil.html">Profile &#9660;</a></li>
<li><a href="galeri.html">Galeri</a></li>
<li rel="artikel"><a href="#">Artikel &#9660;</a></li>
</ul>

<font face='Verdana' color='yellow'><div id="profile" class="submenustyle">
<ul>
<li><a href="http://profile.to/dewagajah">Facebook</a></li>
<li><a href="http://www.friendster.com/ananda64n35h4">Friendster</a></li>
<li><a href="http://www.myspace.com/gajahpandaisekalii">MySpace</a></li>
</div></font>

<font face='Verdana' color='yellow'><div id="my blogs" class="submenustyle">
<ul>
<li><a target='_blank' href="http://www.dewagajah.co.cc">Blogger (Active)</a></li>
<li><a target='_blank' href="http://gajahpandai.wordpress.com">Wordpress (Unactive)</a></li>
<li><a target='_blank' href="http://gajahduduk.tumblr.com">Tumblr (setengah aktif)</a></li>
<li><a target='_blank' href="http://gajahpandai.blog.friendster.com">Blog Friendster (Unactive)</a></li>
</div></font>

<font face='Verdana' color='yellow'><div id="artikel" class="submenustyle">
<ul>
<li><a target='_blank' href="http://www.dewagajah.co.cc/2010/03/6-alasan-kenapa-komentar-di-blog-kita.html">6 Alasan Kenapa Komentar di Blog Kita Hanya Sedikit</a></li>
<li><a target='_blank' href="http://www.dewagajah.co.cc/2010/03/raup-uang-dengan-menulis.html">Raup Uang dengan Menulis? Bisa Banget!</a></li>
<li><a target='_blank' href="http://www.dewagajah.co.cc/2010/02/eboostr-solusi-bagi-ram-kecil.html">Eboostr, Solusi Bagi RAM Kecil</a></li>
<li><a target='_blank' href="http://www.dewagajah.co.cc/2010/02/cara-sms-gratis-via-internet-trust-me.html">Cara SMS Gratis Via Internet</a></li>
</div></font>


<script type="text/javascript">
//initialize tab menu, by passing in ID of UL
initalizetab("maintab")
</script>
<font color="yellow"><h1>
<a href='http://www.dewagajah.co.cc/2010/03/6-alasan-kenapa-komentar-di-blog-kita.html'>6 Alasan Kenapa Komentar di Blog Kita Hanya Sedikit</a>
</h1></font>
</div>
<p><p><font color="yellow" face="Verdana" size="3">Ga usah ditanya lagi, semua blogger di dunia pasti suka banget kalo salah satu artikelnya banyak ditanggapi oleh komentar2 positif. Fungsi dari komentar itu sendiri ada macem2, bisa sebagai bukti apresiasi masyarakat atas rasa terima kasih terhadap artikel yang baru saja dibacanya, dan juga berfungsi sebagai pemacu motivasi penulis serta sebagai bahan pembelajaran bagi penulis untuk dapat memperbaiki kesalahan saat menulis pada artikel selanjutnya. Kalo ada pembaca yang merasa dirinya terbantu atau ngerasa artikel yang telah dibacanya itu bagus, menarik, atau bermanfaat, seengganya pembaca tsb pasti bakal kasih komentar berisi ucapan terima kasih, pujian, atau pendapatnya sendiri. Tapi, ada kemungkinan juga si pembaca itu ga kasih komentar walau menurutnya inti dan maksud dari artikel itu sangat bermanfaat. Mengapa? Ada beberapa faktor yang bikin pembaca betah atau ngga berkomentar di artikel yang pembaca sukai, salah satunya mungkin karena cara penulisan yang penulis lakukan tidak berkenan di hati para pembaca. Lalu, mungkin saja karena pembaca memiliki kesulitan dalam menulis atau memberi komentar di blog kamu, dan mungkin masih banyak faktor lainnya. Terkadang kita sebagai penulis juga jarang merhatiin kenapa yang berkomentar di blog saya sedikit&#160; banget? Seringkali juga penulis selalu beranggapan kalo isi dari postingan yang kita tulis itu ga bermanfaat bagi pembaca, padahal justru sebaliknya. Atau mungkin penulis juga sering bertanya2 dalam hati, kenapa sedikit banget yang berkomentar di postingan ini, padahal postingan ini masih sangat &#8220;fresh&#8221; dan hangat untuk dibacarakan masyarakat baru2 ini. Pasti gamau dong ya hal itu terjadi pada kita semua? Hal itulah yang bakal saya bahas pada postingan kali ini, yaitu beberapa alasan mengapa hanya sedikit pengunjung blog yang memberi komentar.</p>
<br/><a href="http://www.dewagajah.co.cc/2010/03/6-alasan-kenapa-komentar-di-blog-kita.html">Baca selanjutnya...</a><br/><br/>
<h1>
<a href='http://www.dewagajah.co.cc/2010/03/raup-uang-dengan-menulis.html'>Raup Uang dengan Menulis? Bisa Banget!</a>
</h1>
</div>
<p>Menulis adalah suatu kegiatan yang ngebutuhin inspirasi dan pengetahuan kosa-kata yang tinggi. Tanpa semua ilmu yang dibutuhin seperti yang di atas, bakal susah untuk bikin tulisan yang bagus. Apalagi kalo orang tsb ga begitu doyan maen2 di internet. Loh, emang nyambung? Ya pasti nyambung doong. Orang yang terbiasa ngabisin waktunya di dunia maya pasti punya kemampuan menulis lebih tinggi ketimbang mereka yang ga suka. Malah, sebagian pengguna internet milih menulis sebagai hobi yang paling mereka gemari. Kenapa bisa gitu? Hmm di jaman yang udah serba modern gini pasti kalian udah ga asing kan dengan yang namanya blog? Blog itu singkatan dari weblog yang pertama kali dipopulerkan oleh fasilitas penyedia blog yaitu Blogspot. Nah, semenjak saat ini lah orang2 mulai nunjukin kebolehannya dalam berkarya berbentuk suatu tulisan, dan saat itu juga hobi blogging udah mulai mendunia. <br /> <br /> Ga cuman sebagai hobi, ngeblog itu bisa juga kita maanfatin sebagai sumber penghasil dolar!! Percaya ga? Hmm enak banget yaa kalo kita bisa dapet duit tambahan dengan ngejalanin hobi kita. Seneng dapet, duit pun dapet. Tapi gimana sih cara2nya biar blog kita bisa ngasilin duit?
</font>
</body>
</html>


Silahkan dikopi ke Notepad dan save file as .html. Lalu buka file tsb dengan menggunakan browser seperti Mozilla Firefox dan lihat hasilnya. Silahkan pelajari sendiri kode apa saja yang dapat digunakan untuk membuat website dari html yang telah saya buat di atas. Semoga bermanfaat :)

5 Testimonials:

Unknown on March 15, 2010 at 10:06 PM said...

dicoba sob..thanks

Berita unik ala radit online on March 16, 2010 at 9:23 AM said...

Memang perlu memperhatikan struktur html?
walaupun sekarang sudah banyak template gratis namun kita tetaplah perlu untuk mempelajari html, karena kita bisa me-redesign blog kita jika kita sedikit paham tentang html

Saiful on March 17, 2010 at 5:32 AM said...

Wah, mas, kode-kodenya udah nggak HTML5-compatible nih..

dalam artian beberapa tahun yg akan datang, itu kode-kode udah nggak akan bisa dipake karena udah jadul..

fai said...

nice untuk awam seperti saya

Ghufron on July 29, 2010 at 7:02 PM said...

Kalo buat link yang SEO friendly gimana ya? Coz aku punya web yang dapet bikin sendiri menggunakan PHP.

Thanks a lot :)

Post a Comment

Silahkan berkomentar semau kamu..
Tapi yang sesuai dengan topik yaa...

 

Site Info

Related Posts with Thumbnails

Followers

Thinking Positive, Thinking Out of The Box Copyright © 2010 Blogger Template Sponsored by Trip and Travel Guide