Kkpi 2

Membuat Desain Website Berbasis HTML Dengan Notepad++ Pengenalan Tag Pada HTML Dalam HTML tag merupakan
code sekaligus perintah dimana kita dapat mengatur tampilan yang kita inginkan. Tag pada HTML selalu diawali dengan <x>dan ditutup dengan </x> dimana x adalah perintah dari apa yang kita inginkan. Daftar Tag Pada HTML ELEMEN DASAR Jenis Dokumen Judul Mukadimah (Header) Batang Tubuh <HTML></HTML> (terdapat pada awal dan akhir dari file HTML) <TITLE></TITLE> (harus selalu terdapat pada mukadimah) <HEAD></HEAD> (keterangan umum, seperti judul dsb.) <BODY></BODY> (isi dari halaman HTML)
FORMAT TAMPILAN Huruf Tebal Huruf Miring Garis Bawah Rata Tengah Huruf Kedip Ukuran Huruf Warna Huruf Pilih Jenis Huruf <B></B> <I></I> <U></U> <CENTER></CENTER> <BLINK></BLINK> <FONT SIZE=?></FONT> <FONT COLOR="#$$$$$$"></FONT> <FONT FACE="***"></FONT> (Bold) (Italic) (Underline - jarang digunakan) (Center - berlaku untuk teks maupun gambar) (Blinking - tag terlucu sampai kini) (Font Size - boleh diisi dari 1 sampai 7)
PEMISAH Paragraf Align Text Pndah Baris Garis Datar Penataan Letak Garis Tebal Garis Lebar Garis Lebar Garis Persentasi <P></P> (tag penutup seringkali tak diperlukan)
<P ALIGN=LEFT|CENTER|RIGHT></P> <BR> (pindah ke baris berikut) <HR> (Horizontal Rule) <HR ALIGN=LEFT|RIGHT|CENTER> <HR SIZE=?> <HR WIDTH=?> <HR WIDTH="%"> (dalam satuan pixel) (dalam satuan pixel) (dalam persentasi terhadap lebar halaman)
LATAR BELAKANG DAN WARNA Latar Belakang Gambar Warna Latar Belakang Warna Huruf Teks <BODY BACKGROUND="URL"> <BODY BGCOLOR="#$$$$$$" <BODY TEXT="#$$$$$$"> (Tiled Background) (Background Color urutan: merah/hijau/biru)
TABEL Rancangan Tabel Garis Batas Tabel Lebar Tabel Lebar Tabel Persentasi Baris dalam Tabel Penataan Letak Baris Sel dalam Tabel Penataan Letak Sel Kepala Tabel <TABLE></TABLE> <TABLE BORDER=?></TABLE> <TABLE WIDTH=?> <TABLE WIDTH="%"> <TR></TR> <TR ALIGN=LEFT|RIGHT| CENTER|MIDDLE|BOTTOM VALIGN=TOP|BOTTOM|MIDDLE> <TD></TD> (harus ada dalam setiap baris tabel) <TD ALIGN=LEFT|RIGHT| CENTER|MIDDLE|BOTTOM VALIGN=TOP|BOTTOM|MIDDLE> <TH></TH> (Table Header - seperti data dengan Bold dan Center) <TH ALIGN=LEFT|RIGHT| CENTER|MIDDLE|BOTTOM VALIGN=TOP|BOTTOM|MIDDLE> <TH BGCOLOR="#$$$$$$"> (dalam satuan pixel) (dalam satuan persen terhadap lebar halaman)
Penataan Letak Kepala Tabel Warna Kepala Tabel
A. 1.
Dasar dasar HTML Membuat judul tab dalam halaman web, buka notepad++ terlebih dahulu, kemudian ketikan code dibawah ini: <html> <head> <title> My First HTML Project </title> </head> <body BGCOLOR=Green TEXT=Red> WELCOME TO MY WEBSITE </body> <body bgcolor=#00ff00> </html> Langkah selanjutnya simpan dalam format HTML dan buka file dengan firefox atau sejenisnya, maka hasilnya akan seperti pada gambar 1 berikut:
Gambar 1. Judul Tab Halaman 2. Mengatur paragraf texs, buka notepad++ kemudin ketikan code dibawah ini: <html> <head> <title> Tag P, Br dan Hr </title> </head> <body> <p>Ini adalah paragraf pertama, yang berisi 3 baris. satu, dua dan tiga. <br><br></p> <p>Ini adalah paragraf kerdua, yang berisi horizontal</p> <hr> Ini adalah garis horizontal. </body> <body bgcolor=#00ff00> </html>
Baris garis
Langkah selanjutnya simpan dalam format HTML dan buka file dengan firefox atau sejenisnya, maka hasilnya akan seperti pada gambar 2 berikut:
Gambar 2. Mengatur Paragraf 3. Mengatur ukuran huruf, buka notepad++, kemudian ketikan code dibawah ini: <html> <head> <title> Tag Heading </title> </head> <body> <h1> Heading 1 </h1> <h2> Heading 2 </h2>
<h3> Heading 3 </h3> <h4> Heading 4 </h4> <h5> Heading 5 </h5> <h6> Heading 6 </h6> </body> <body bgcolor=#00ff00> </html> Langkah selanjutnya simpan dalam format HTML dan buka file dengan firefox atau sejenisnya, maka hasilnya akan seperti pada gambar 3 berikut:
Gambar 3. Ukuran Huruf 4. Mengatur format texs, Buka notepad++, kemudian ketikan code dibawah ini: <html> <head> <title>format tulisan</titele> </head> <body> teks normal <br> <small> teks small </small><br> <big> teks big</big><br> <b> teks tebal </b><br> <i> teks miring </i><br> <u> teks bergaris bawah </u><br> Contoh superscript : x <sup>2</sup><br> Contoh subscript : H<sub>2</sub>O<br> <strike> Ini teks tercoret </strike><br> <font size = 5 face = verdana> menggunakan tag font </font> </body> <body BGCOLOR ="#00FF00"> </html> Langkah selanjutnya simpan dalam format HTML dan buka file dengan firefox atau sejenisnya, maka hasilnya akan seperti pada gambar 4 berikut:
Gambar 4. Format tulisan 5. Membuat from komentar, buka notepad++, kemudian ketikan code dibawah ini: <html> <head> <title> From komentar </title> </head> <body> <table> <tr> <tdcolspan="3"> </td></tr><tr> <td colspan="3"><h3>Silahkan Berkomentar : </h3></td> </tr> <tr> <td>Nama</td> <td>:</td> <td><input type=text name="nama"></td> </tr> <tr> <td>Email</td> <td>:</td> <td><input type=text name="email"></td> </tr> <tr> <td valign=top>Komentar</td> <td valign=top>:</td> <td><textarea name="komentar" width=200></textarea></td> </tr> <tr> <td colspan="3"><input type=submit name="submit" value=submit></td> </tr> </table> </body> <body BGCOLOR ="#00FF00">
rows=6
</html> Langkah selanjutnya simpan dalam format HTML dan buka file dengan firefox atau sejenisnya, maka hasilnya akan seperti pada gambar 5 berikut:
Gambar 5. From komentar 6. Mengatur kolom, buka notepad++ kemudian ketikan code dibawah ini: <html> <head> <title>warna-warna</title> </head> <body> <table width="300" border="1"> <tr> <td colspan="3" align="center">warna-warna </td> </tr> <tr> <td bgcolor="#00FF00">Hijau</td> <td bgcolor="#FFFF00">Kuning</td> <td bgcolor="#FF0000">Merah </td> </tr> <tr> <td bgcolor="#999999">Abu-abu</td> <td bgcolor="#0000FF">Biru</td> <td bgcolor="#FF9900">Orange</td> </tr> <tr> <td bgcolor="#663300">Cokelat</td> <td bgcolor="#3399CC">Biru muda</td> <td bgcolor="#FF00FF">Merah muda</td> </tr> </table> </body> <body BGCOLOR ="#00FF00"> </html>
Langkah selanjutnya simpan dalam format HTML dan buka file dengan firefox atau sejenisnya, maka hasilnya akan seperti pada gambar 6 berikut:
Gambar 6. Tabel B. 1. Hyperlink Membuat hyperlink kehalaman web lain, buka notepad++, kemudian ketikan atau copy saja code dibawah ini: <html> <head> <title> Judul tab </title> </head> <body> Ini hyperlink ke wordpress <a href="http://www.wordpress.com/" title="Masuwordpress"> Wordpress </a> <br>Klik dan masuk ke yahoo<a href="http://www.yahoo.com/" title="Masuk yahoo"> Yahoo </a> <br>Masuk ke facebook anda <a href="http://http://www.facebook.com/" title="Masuk ke facebook"> Facebook </a> </body> <body BGCOLOR ="#00FF00"> </html> Langkah selanjutnya simpan dalam format HTML dan buka file dengan firefox atau sejenisnya, maka hasilnya akan seperti pada gambar 7 berikut:
Gambar 7 link halaman web lain
2.
Membuat hyperlink antar bagian dalam web, buka notepad++, kemudian ketikan atau copy saja code dibawah ini: <html> <head> <title> Judul tab </title> </head> <body> <ahref="file:///C:/Users/COMPAQ/Documents/HTML.1/desain%20web/ home.html" title="ke Rumah"><img src="file:///C:/Users/COMPAQ/Documents/HTML.1/gambar/Graphic1. jpg" border="0" width="80" height="30"/></a> <ahref="file:///C:/Users/COMPAQ/Documents/HTML.1/desain%20web/ profil.html" title="Profilku"><img src="file:///C:/Users/COMPAQ/Documents/HTML.1/gambar/profil.jp g" border="0" width="100" height="30"/></a> <ahref="file:///C:/Users/COMPAQ/Documents/HTML.1/html_colors.h tml" title="Kode Warna Pada HTML"><img src="file:///C:/Users/COMPAQ/Documents/HTML.1/gambar/Kode%20Wa rna.jpg" border="0" width="150" height="30"/></a> <a href="file:///C:/Users/COMPAQ/Documents/HTML.1/kumpulan%20puis i.html" title="kumpulan Kata-kata Mutiara"><img src="file:///C:/Users/COMPAQ/Documents/HTML.1/gambar/kata%20ka ta.jpg" border="0" width="100" height="30"/></a> </body> <body BGCOLOR ="#00FF00"> </html> Langkah selanjutnya simpan dalam format HTML dan buka file dengan firefox atau sejenisnya, maka hasilnya akan seperti pada gambar 8 berikut:
Gambar 8. Link Antar Bagian Dalam Web C. 1. Membuat Website Sederhana Membuat halaman login pada website, buka notepad++, kemudin ketikan atau copy saja code dibawah ini: <html> <head> <title>login web</title><link rel='icon' href='gambar/B.png'> </head>
<body> <p align="center"> <font size="6" color="#FF6600" > Silahkan mengisi data yang ada di bawah untuk masuk ke website saya :)</font> </p> <table align="center"> <td><form method="post" action="home.html"><label><font color="#FF6600">Nama Anda:</label> <br> <input type="text" name="nama" value=""></br> <label><font color="#FF6600">Email Atau telepon:</label> <br> <input type="text" name="Email" value=""></br><label><font color="#FF6600">Alamat:</label> <br> <input type="text" name="Alamat" Value=""></br> <label><font color="#FF6600">Tanggal Lahir </label> <br> <select name="select"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value="10">10</option> <option value="11">11</option> <option value="12">12</option> <option value="13">13</option> <option value="14">14</option> <option value="15">15</option> <option value="16">16</option> <option value="17">17</option> <option value="18">18</option> <option value="19">19</option> <option value="20">20</option> <option value="21">21</option> <option value="22">22</option> <option value="23">23</option> <option value="24">24</option> <option value="25">25</option> <option value="26">26</option> <option value="27">27</option> <option value="28">28</option> <option value="29">29</option> <option value="30">30</option> <option value="31">31</option> </select>
<select name="select2"> <option value="1">Januari</option> <option value="2">Februari</option> <option value="3">Maret</option> <option value="4">April</option> <option value="5">Mei</option> <option value="6">Juni</option> <option value="7">Juli</option> <option value="8">Agustus</option> <option value="9">September</option> <option value="10">Oktober</option> <option value="11">Nopember</option> <option value="12">Desember</option> </select> <select name="select3"> <option value="2001">1988</option> <option value="2002">1989</option> <option value="2003">1990</option> <option value="2004">1991</option> <option value="2005">1992</option> <option value="2006">1993</option> <option value="2007">1994</option> <option value="2008">1995</option> <option value="2009">1996</option> </select></br> <label><font color="#FF6600">Jenis Kelamin </label> <br><font color="red">Pria <font color="#CCFF00">Wanita</br> <input type="submit" Value="Masuk"> </td> </table> <body background="gambar/aaa.png"> <EMBED SRC="MP3/Greenday%20-%20I%20walk%20Alone.swf" AUTOSTART="TRUE" LOOP="TRUE" WIDTH="1" HEIGHT="1" ALIGN="CENTER"></EMBED> <p align="center"> <font size="1" color="#FF6600" ><BLINK>..... Dalam penggisiannya harus jujur yaa, jangan bo'onk :) ...... </body> </html> Langkah selanjutnya simpan dalam format HTML dan buka file dengan firefox atau sejenisnya, background dapat anda ganti sendiri sesuai dengan kesukaan anda. Hasilnya seperti pada gambar 9 berikut:
Gambar 9. Halaman login 2. Membuat halaman awal, buka notepad++, kemudian ketikan atau copy saja code dibawah ini: <html> <head> <title>Home</title> <link rel='icon' href='gambar/alien.ico'> </head> <body> <center><table width='1000' height='400' border="0" background='gambar/xx.jpg' cellpadding="0" cellspacing="<tr> <td colspan="2" color="white" align='center'> <img src="gambar/1.png" width="1000" height="400"> </td> </tr> <tr height="50"><td colspan='2' background='gambar/zz.jpg' align='left' height="20"> <p><ul><ul><left><BLINK><b><font color="#00CCFF" size="5"><img src='gambar/halo.gif' border='0' width='40' height='40'>~ Selamat datang di website pertama saya ~ <img src='gambar/halo.gif' border='0' width='40' height='40'></font></BLINK></b></ul></ul></p></left> <left> <ul><a href="home.html" title="ke Rumah"><img src='gambar/HOME.jpg' BORDER='0' width='80' height='30'></a> <a href="http://mp3skull.com/" title="MP3"><img src='gambar/MP3.jpg' BORDER='0' width='80' height='30'></font></a> <a href="profilku.html" title="Profilku"><img src='gambar/PROFIL.jpg' BORDER='0' width='90' height='30'></a> <a href="html_colors.html" title="Kode Warna Pada HTML"><img src='gambar/KODE WARNA.jpg' BORDER='0' width='120' height='30'></a> <a href="http://www.gametop.com/" title="Tempat Game"><img src='gambar/GAME.jpg' BORDER='0' width='80' height='30'></a> <a href="http://www.w3schools.com/html/html_intro.asp" title="Tutorial HTML.w3schools.com"><img src='gambar/TUTORIAL.jpg' BORDER='0' width='90' height='30'></a>
<a href="kumpulan%20puisi.html" title="kumpulan Kata-kata Mutiara"><img src='gambar/KATA.jpg' BORDER='0' width='100' height='30'></a> </ul></left> </td> </tr> <tr> <td width='796' height='700' background='gambar/zz.jpg' valign='top' > <p><font color="yellow" size="5">~Dasar-dasar Membuat Website Berbasis HTML~</font> <p align="lift"><font color="white">Nah, anda pasti sudah banyak melihat tutorial tutorial HTML yang ada di ilmuwebsite.com. Tapi, masih ada 1 kekurangan, tutorial HTML untuk tingkat pemula??? <br /> Nggak ada kan??? nah, maka dari itu, saya, Rian hidayat, akan menjelaskan bagaimana website di bangun menggunakan tag-tag HTML, dan ini penulis sediakan untuk pemula. Tapi sebelum itu,? ada yang perlu diketahui.<br /> <br /> <a name='more'></a><br /> <span id="more-712"></span><br /> <b>tag <></b><br /> digunakan untuk menuliskan sintak, ada dua jenis, yaitu tag container dan tag biasa.<br /> Tag container adalah tag yang berisi text yang akan ditampilkan setelah tag ditutup. Contoh: <td> text yang ditampilkan </td>.<br /> Tag biasa, yahh…tag aja, contoh <BR> (break). <br> kaga perlu ditutup oleh tag </br>, tapi jika sintak yang digunakan tag container, contoh: <h1>, yah mesti ditutup dengan </h1>.<br /> Tag yang digunakan untuk mengakhiri sintak punya karakter /(slash) sebelum sintaknya, contohnya: <td> </td><br /> Kita juga dapat mengetik attribut di dalam sebuah tag, contoh: <body bgcolor=”red”> </body>. atau <input type=”text”>.<br /> <b>LANGKAH 1</b><br /> <ul> <li>MEMBUKA NOTEPAD.</li> </ul> <b>LANGKAH 2</b> <br /> <ul> <li>MENGETIKKAN SINTAK/SYNTAX.</li> </ul> Berikut ini adalah syntax dasar yang membentuk suatu HTML.<br /> pertama, ketikkan<br /><html><br />
tekan enter, kemudian ketik<br /><head><br />Dalam container head, kita bisa mengetikan beberapa sintak, tapi yangpaling penting jangan lupa mengetikan sintak <title> judul halaman web </title>. Untuk sintak lain nanti saja.<br />Sekarang ketikkan sintak title tadi, jadi seperti ini:<br /><head> <title> judul halaman web </title> </head><br /> Kemudian ketikkan <body>. Tag body merupakan badan/tubuh/inti dari halaman web, tampilan web yang kita lihat itu berasal dari <body>.<br />Body tuh tag container, jadi mesti ditutup. Hasil sampai sekarang:<br /> <html><br /><head><br /><title> Judul Halaman Web </title><br /> </head><br /> <body><br /> </body><br />?<br /> <br /> <br />Selanjutnya bagaimana cara menampilkan tulisan ke dalam HTML??? Ketikan sembarang text ke dalam tag body, contohnya seperti ini :<br /><body><br />Contoh text yang ditampilin di halaman web, By: Rian Hidayat<br /></body><br />terus, jika sudah, ketikkan </html>, script lengkapnya seperti ini :<br /><html><br /><head><br /> <title> Judul Halaman Web </title><br /> </head><br /><body><br />Contoh text yang ditampilkan di halaman web, By: Rian Hidayat<br /> </body><br /> </html><br /> kalo udah, sekarang save dengan nama dasarHTML.<br /> kalo udah disave, buka data yang tadi di save.<br />?<br />Pada bagian ini, kalian mungkin akan bingun,g karena html yang tadi disave dan cape cape diketikkan, ternyata gagal. Malah yang terbuka adalah file di notepad/wordpad. tau kenapa???<br />Karena ketika men-save, file tersebut di save dalem bentuk TXT, bukan HTML. Nah cara men-save dalem bentuk HTML yaitu: ketika mensave, ada satu tempat di bawah tempat kita menulis nama file,? yakni Save As Type. Silahkan ubah dari text document(*.txt) menjadi all files, ketika menulis nama, di akhir di berikan extensi .html, contoh: dasarHTML.html. <div style='clear: both;'></div> </textarea> <font="left" form method="post" action="file:///C:/Users/COMPAQ/Documents/HTML.1/new%204.html" > <input type="hidden" name="friendID" value="123456"> <textarea name="f_comments" cols="40" rows="5""> Enter your comments here... </textarea><br> <input type="submit" value="coments" />
<input type="reset" value="Reset" /> </form> </td> <td width='200' height='700' bgcolor='' valign='top'> <table align="left" width='200' border='0' bgcolor='' bordercolor='green'> <tr align='center'> <td><p><a href="http://www.facebook.com/" target="_blank" title="Masuk ke Facebook"> <img src="gambar/facebook.ico" border="0" width="90" height="70"/></a></td> <td><p><a href="http://www.youtube.com/" target="_blank" title="Masuk ke youtube"> <img src="gambar/youtube.ico" border="0" width="90" height="70"/></a><td> </p> </tr> </table> <table align='left' width='200' border='0' bgcolor='' bordercolor='green'> <center> <td width="200" valign="top"><font color="#FFFF00" face="Cooper Std Black"> <b>TUTORIAL HTML</b> <ul> <li><a href="buat%20ayat%20bergerak.html" title='membuat tulisan bergerak'><font color='#0000FF' face='Times New Roman'>Cara membuat tulisan bergerak</a></font></li> <li><a href='Menbuat%20from%20komentar.html' title='membuat from komentar'><font color='#0000FF' face='Times New Roman'>Cara membuat from komentar</a></font></li> <li><a href='Membuat%20login.html' title='membuat halaman login'><font color='#0000FF' face='Times New Roman'>Cara membuat halaman login</a></font></li> </ul></font></table></td> </tr> <tr height="50"> s<td colspan='2'background='gambar/zz.jpg'><center><b><marquee><fon t face="Cooper Std Black" color="#00CCFF" size="7">~ Meskipun banyak kendala dalam pembuatan desain web, tapi tetap berusaha untuk mencapai hasil yang terbaik ~</font></b></marquee></center></td></tr> </table><div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"> <img border="0" src="gambar/twitter.ico" title="follow my twitter" alt="animasi bergerak gif" /></a><small><center></div> <div style="position: fixed; bottom: 0px; right: 0px;width:100px;height:100px;"><a href='#top'> <img border="0" src="gambar/top.png" width='50' height='50' title="Kembali ke atas" alt="animasi bergerak gif" /></a><small><center>
</div> <div style="position: fixed; TOP: 0px; right: 10px;width:130px;height:160px;"><a href='login.html'> <img border="0" src="gambar/c.png" width='40' height='40' title="Kembali ke login" alt="animasi bergerak gif" /></a><small><center></div> <body background='gambar/yy.jpg'></body> <EMBED SRC="MP3/I%20Won%27t%20See%20You%20Tonight%28Part1%29.swf" AUTOSTART="TRUE" LOOP="TRUE" WIDTH="1" HEIGHT="1" ALIGN="CENTER"></EMBED></html> Langkah selanjutnya simpan dalam format HTML dan buka file dengan firefox atau sejenisnya, anda bisa menganti gambar-gambarnya sesuai yang anda inginkan, dan anda juga dapat menganti background dan animasi yang sesuai dengan anda. Hasilnya akan seperti pada gambar 10 berikut:
Gambar 10. Halaman awal 3. Membuat data pribadi atau profil, buka notepad++, kemudian ketikan atau copy saja code dibawah ini: <html> <head> <title>Profilku</title> <link rel='icon' href='gambar/alien.ico'> </head> <body> <center><table width='1000' height='400' border="0" background='gambar/xx.jpg' cellpadding="0" cellspacing="20" > <tr> <td colspan="2" color="white" align='center'>
<img src="gambar/1.png" width="1000" height="400"> </td> </tr> <tr height="50"> <td colspan='2' background='gambar/zz.jpg' align='left' height="20"> <p><ul><ul><left><BLINK><b><font color="#00CCFF" size="5"><img src='gambar/halo.gif' border='0' width='40' height='40'>~ Selamat datang di website pertama saya ~ <img src='gambar/halo.gif' border='0' width='40' height='40'></font></BLINK></b></ul></ul></p></left> <left><ul><a href="home.html" title="ke Rumah"><img src='gambar/HOME.jpg' BORDER='0' width='80' height='30'></a> <a href="http://mp3skull.com/" title="MP3"><img src='gambar/MP3.jpg' BORDER='0' width='80' height='30'></font></a> <a href="profilku.html" title="Profilku"><img src='gambar/PROFIL.jpg' BORDER='0' width='90' height='30'></a> <a href="html_colors.html" title="Kode Warna Pada HTML"><img src='gambar/KODE WARNA.jpg' BORDER='0' width='120' height='30'></a> <a href="http://www.gametop.com/" title="Tempat Game"><img src='gambar/GAME.jpg' BORDER='0' width='80' height='30'></a> <a href="http://www.w3schools.com/html/html_intro.asp" title="Tutorial HTML.w3schools.com"><img src='gambar/TUTORIAL.jpg' BORDER='0' width='90' height='30'></a> <a href="kumpulan%20puisi.html" title="kumpulan Katakata Mutiara"><img src='gambar/KATA.jpg' BORDER='0' width='100' height='30'></a></ul></left></td></tr> <tr><td width='796' height='700' background='gambar/zz.jpg' valign='top' > <p><table align="center" border="0" bgcolor="" cellpadding="0" cellspacing="8" > <td><tr><td colspan="2" align="center"><font face="Bauhaus 93" size="8" color="#0066FF"><b>PROFILKU</b></td></tr> <tr><br><table> <P align="center"><font color="#00FFFF"> <img src="gambar/rian.JPG" border="7" width="250" height="300"> <tr><td align="right"><font size="5" color="#00FFFF"><b><p align='left'>NAMA</p></b></td> <td><font size="5"color="#00FFFF">: Rian Hidayat</p></td></tr> <td align="right"><font size="5" color="#00FFFF"><b><p align='left'>ALAMAT</p></b></td> <td><font size="4"color="#00FFFF">: Weru, Sukoharjo</td></tr> <td align="right"><font size="5" color="#00FFFF"><b><p align='left'>TTL</p></b></td>
<td><font size="5"color="#00FFFF">: Sukoharjo, 09November-1993</td></tr> <td align="right"><font size="5" color="#00FFFF"><b><p align='left'>PEKERJAAN</p></b></td> <td><font size="5"color="#00FFFF">: Mahasiswa</td></tr> <td align="right"><font size="5" color="#00FFFF"><b><p align='left'>HOBY</p></b></td> <td><font size="5"color="#00FFFF">: Tidur</td></tr> <td align="right"><font size="5" color="#00FFFF"><b><p align='left'>NO.TELPONE</p></b></td> <td><font size="5"color="#00FFFF">: 085728282066</td></tr> <td align="right"><font size="5" color="#00FFFF"><b><p align='left'>EMAIL</p></b></td> <td><font size="5"color="#00FFFF">:hrian89@gmail.com</td> </tr></table> <table><P align="center"><font color="#00FFFF"><img src="gambar/bram.JPG" border="7" width="250" height="300"></p> <tr><td align="right"><font size="5" color="#00FFFF"><b><p align='left'>NAMA</p></b></td> <td><font size="5"color="#00FFFF">: Bram Putra P.</p></td></tr> <td align="right"><font size="5" color="#00FFFF"><b><p align='left'>ALAMAT</p></b></td> <td><font size="4"color="#00FFFF">: Laweyan, Surakarta</td></tr> <td align="right"><font size="5" color="#00FFFF"><b><p align='left'>TTL</p></b></td> <td><font size="5"color="#00FFFF">: Surakarta, 13April-1992</td></tr> <td align="right"><font size="5" color="#00FFFF"><b><p align='left'>PEKERJAAN</p></b></td> <td><font size="5"color="#00FFFF">: Mahasiswa</td></tr> <td align="right"><font size="5" color="#00FFFF"><b><p align='left'>NO.TELPONE</p></b></td> <td><font size="5"color="#00FFFF">: XXXXXXXXXXXXXX </td> </tr></table></td> <td width='200' height='700' bgcolor='' valign='top'> <table align="left" width='200' border='0' bgcolor='' bordercolor='green'> <tr align='center'><td><p><a href="http://www.facebook.com/" target="_blank" title="Masuk ke Facebook"> <img src="gambar/facebook.ico" border="0" width="90" height="70"/></a></td> <td><p><a href="http://www.youtube.com/" target="_blank" title="Masuk ke youtube"> <img src="gambar/youtube.ico" border="0" width="90" height="70"/></a><td> </p></tr>
</table> <table align='left' width='200' border='0' bgcolor='' bordercolor='green'> <center> <td width="200" valign="top"><font color="#FFFF00" face="Cooper Std Black"> <b>TUTORIAL HTML</b> <ul><li><a href="buat%20ayat%20bergerak.html" title='membuat tulisan bergerak'><font color='#0000FF' face='Times New Roman'>Cara membuat tulisan bergerak</a></font></li> <li><a href='Menbuat%20from%20komentar.html' title='membuat from komentar'><font color='#0000FF' face='Times New Roman'>Cara membuat from komentar</a></font></li> <li><a href='Membuat%20login.html' title='membuat halaman login'><font color='#0000FF' face='Times New Roman'>Cara membuat halaman login</a></font></li> </ul></font></table></td></tr> <tr height="50"><td colspan='2' background='gambar/zz.jpg'><center><b><marquee><font face="Cooper Std Black" color="#00CCFF" size="7">~ Meskipun banyak kendala dalam pembuatan desain web, tapi tetap berusaha untuk mencapai hasil yang terbaik ~</font></b></marquee></center></td> </tr></table><div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"> <img border="0" src="gambar/twitter.ico" title="follow my twitter" alt="animasi bergerak gif" /></a><small><center> </div> <div style="position: fixed; bottom: 0px; right: 0px;width:100px;height:100px;"><a href='#top'> <img border="0" src="gambar/top.png" width='50' height='50' title="Kembali ke atas" alt="animasi bergerak gif" /></a><small><center></div> <div style="position: fixed; TOP: 0px; right: 10px;width:130px;height:160px;"><a href='login.html'> <img border="0" src="gambar/c.png" width='40' height='40' title="Kembali ke login" alt="animasi bergerak gif" /></a><small><center> </div> <body background='gambar/yy.jpg'> </body> <EMBED SRC="MP3/I%20Won%27t%20See%20You%20Tonight%28Part1%29.swf" AUTOSTART="TRUE" LOOP="TRUE" WIDTH="1" HEIGHT="1" ALIGN="CENTER"></EMBED> </html>
Langkah selanjutnya simpan dalam format HTML dan buka file dengan firefox atau sejenisnya, anda bisa menganti gambar-gambarnya sesuai yang anda inginkan, dan anda juga dapat menganti background dan animasi yang sesuai dengan anda. Hasilnya akan seperti pada gambar 11 berikut:
Gambar 11. Membuat data pribadi 4. Membuat album galery, buka notepad++, kemudian ketikan atau bisa copy saja code dibawah ini: <html> <head> <title>Profilku</title> <link rel='icon' href='gambar/alien.ico'> </head> <body> <center> <table width='1000' height='400' border="0" background='gambar/xx.jpg' cellpadding="0" cellspacing="20" > <tr> <td colspan="2" color="white" align='center'> <img src="gambar/1.png" width="1000" height="400"> </td> </tr> <tr height="50"> <td colspan='2' background='gambar/zz.jpg' align='left' height="20"> <p><ul><ul><left><BLINK><b><font color="#00CCFF" size="5"><img src='gambar/halo.gif' border='0' width='40' height='40'>~ Selamat datang di website pertama saya ~ <img src='gambar/halo.gif' border='0' width='40' height='40'></font></BLINK></b></ul></ul></p></left> <left>
<ul><a href="home.html" title="ke Rumah"><img src='gambar/HOME.jpg' BORDER='0' width='80' height='30'></a> <a href="http://mp3skull.com/" title="MP3"><img src='gambar/MP3.jpg' BORDER='0' width='80' height='30'></font></a> <a href="profilku.html" title="Profilku"><img src='gambar/PROFIL.jpg' BORDER='0' width='90' height='30'></a> <a href="html_colors.html" title="Kode Warna Pada HTML"><img src='gambar/KODE WARNA.jpg' BORDER='0' width='120' height='30'></a> <a href="http://www.gametop.com/" title="Tempat Game"><img src='gambar/GAME.jpg' BORDER='0' width='80' height='30'></a> <a href="http://www.w3schools.com/html/html_intro.asp" title="Tutorial HTML.w3schools.com"><img src='gambar/TUTORIAL.jpg' BORDER='0' width='90' height='30'></a> <a href="kumpulan%20puisi.html" title="kumpulan Kata-kata Mutiara"><img src='gambar/KATA.jpg' BORDER='0' width='100' height='30'></a> </ul></left> </td></tr> <tr> <td width='796' height='700' background='gambar/zz.jpg' valign='top' > <p><table align="center" border="0" bgcolor="" cellpadding="0" cellspacing="8" > <td> <p><b><center><font face="Bauhaus 93" size="7" color='#0000FF'>Galery</font></center></b></p><b> <table color="blue" align="center" border="9px"> <tr><p align="center"><font color="#00FFFF" size='6'>Album Kegiatan Teknisi</font> <td><img src="file:///D:/Tugas%20HTML/Gambar/a.png" border="3" width="300" height="300" /></td> <td><img src="file:///D:/Tugas%20HTML/Gambar/b.png" border="3" width="300" height="300" /></td> <tr><td><img src="file:///D:/Tugas%20HTML/Gambar/c.png" border="3" width="300" height="300" /></td> <td><img src="file:///D:/Tugas%20HTML/Gambar/d.png" border="3" width="300" height="300" /></td> <tr><td><img src="file:///D:/Tugas%20HTML/Gambar/e.png" border="2" width="300" height="300" /></td> <td><img src="file:///D:/Tugas%20HTML/Gambar/f.png" border="3" width="300" height="300" /></td></p></tr> </table> </td> <td width='200' height='700' bgcolor='' valign='top'> <table align="left" width='200' border='0' bgcolor='' bordercolor='green'><tr align='center'> <td><p><a href="http://www.facebook.com/" target="_blank" title="Masuk ke Facebook"> <img
src="gambar/facebook.ico" border="0" width="90" height="70"/></a></td> <td><p><a href="http://www.youtube.com/" target="_blank" title="Masuk ke youtube"> <img src="gambar/youtube.ico" border="0" width="90" height="70"/></a><td> </p></tr></table> <table align='left' width='200' border='0' bgcolor='' bordercolor='green'> <center> <td width="200" valign="top"><font color="#FFFF00" face="Cooper Std Black"> <b>TUTORIAL HTML</b><ul> <li><a href="buat%20ayat%20bergerak.html" title='membuat tulisan bergerak'><font color='#0000FF' face='Times New Roman'>Cara membuat tulisan bergerak</a></font></li> <li><a href='Menbuat%20from%20komentar.html' title='membuat from komentar'><font color='#0000FF' face='Times New Roman'>Cara membuat from komentar</a></font></li> <li><a href='Membuat%20login.html' title='membuat halaman login'><font color='#0000FF' face='Times New Roman'>Cara membuat halaman login</a></font></li> </ul></font></table></td></tr> <tr height="50"> <td colspan='2' background='gambar/zz.jpg'><center><b><marquee><font face="Cooper Std Black" color="#00CCFF" size="7">~ Meskipun banyak kendala dalam pembuatan desain web, tapi tetap berusaha untuk mencapai hasil yang terbaik ~</font></b></marquee></center></td> </tr></table> <div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"> <img border="0" src="gambar/twitter.ico" title="follow my twitter" alt="animasi bergerak gif" /></a><small><center></div> <div style="position: fixed; bottom: 0px; right: 0px;width:100px;height:100px;"><a href='#top'> <img border="0" src="gambar/top.png" width='50' height='50' title="Kembali ke atas" alt="animasi bergerak gif" /></a><small><center></div> <div style="position: fixed; TOP: 0px; right: 10px;width:130px;height:160px;"><a href='login.html'><img border="0" src="gambar/c.png" width='40' height='40' title="Kembali ke login" alt="animasi bergerak gif" /></a><small><center></div> <body background='gambar/yy.jpg'> </body> <EMBED SRC="MP3/I%20Won%27t%20See%20You%20Tonight%28Part1%29.swf"
AUTOSTART="TRUE" LOOP="TRUE" ALIGN="CENTER"></EMBED> </html>
WIDTH="1"
HEIGHT="1"
Langkah selanjutnya simpan dalam format HTML dan buka file dengan firefox atau sejenisnya, anda bisa menganti gambar-gambarnya sesuai yang anda inginkan, dan anda juga dapat menganti background dan animasi yang sesuai dengan anda. Hasilnya akan seperti pada gambar 12 berikut:
Gambar 12. Galery 5. Membuat artikel html tentang cara membuat tulisan bergerak, buka notepad++, kemudian ketikan atau copy saja code dibawah ini: <html> <head> <title>Cara membuat tulisan bergerak</title> <link rel='icon' href='gambar/alien.ico'> </head> <body> <center> <table width='1000' height='400' border="0" background='gambar/xx.jpg' cellpadding="0" cellspacing="20" > <tr> <td colspan="2" color="white" align='center'> <img src="gambar/1.png" width="1000" height="400"> </td> </tr> <tr height="50"> <td colspan='2' background='gambar/zz.jpg' align='left' height="20"> <p><ul><ul><left><BLINK><b><font color="#00CCFF" size="5"><img src='gambar/halo.gif' border='0' width='40' height='40'>~
Selamat datang di website pertama saya ~ <img src='gambar/halo.gif' border='0' width='40' height='40'></font></BLINK></b></ul></ul></p></left> <left> <ul><a href="home.html" title="ke Rumah"><img src='gambar/HOME.jpg' BORDER='0' width='80' height='30'></a> <a href="http://mp3skull.com/" title="MP3"><img src='gambar/MP3.jpg' BORDER='0' width='80' height='30'></font></a> <a href="profilku.html" title="Profilku"><img src='gambar/PROFIL.jpg' BORDER='0' width='90' height='30'></a> <a href="html_colors.html" title="Kode Warna Pada HTML"><img src='gambar/KODE WARNA.jpg' BORDER='0' width='120' height='30'></a> <a href="http://www.gametop.com/" title="Tempat Game"><img src='gambar/GAME.jpg' BORDER='0' width='80' height='30'></a> <a href="http://www.w3schools.com/html/html_intro.asp" title="Tutorial HTML.w3schools.com"><img src='gambar/TUTORIAL.jpg' BORDER='0' width='90' height='30'></a> <a href="kumpulan%20puisi.html" title="kumpulan Kata-kata Mutiara"><img src='gambar/KATA.jpg' BORDER='0' width='100' height='30'></a> </ul></left> </td> </tr> <tr> <td width='796' height='700' background='gambar/zz.jpg' valign='top' > <b><center><span style="font-size: large;" align='center'><font color='#0066FF' size='5'>Tutorial Membuat Tulisan Menjadi Bergerak</font></span></center></b> <br /> <br /><font color='#00FFFF'>Marquee tag digunakan untuk menggerakkan sama ada perkataan ataupun gambar. Dalam contoh ini, saya akan tunjukkan beberapa cara untuk menggunakan Marquee tag ini untuk menggerakkan tulisan anda.</font><br /> <br /> <div style="color: #FFFF00;"> <marquee direction="down" height="50"><center> <b>Teks Bergerak Ke Bawah...</b></center> </marquee> </div> <div style="color: #FFFF00;"><marquee direction="right"><b>Teks Bergerak Ke Kanan...</b></marquee> </div>
<div style="color: #FFFF00;"><marquee direction="left"><b>Teks Bergerak Ke Kiri...</b></marquee> </div> <br /> <div style="color: #FFFF00;"> <marquee direction="up" height="50"><center> <b>Teks Bergerak Ke Atas...</b></center> </marquee> </div> <br /> <a name='more'></a><br /><br /><span style="font-size: large;"><font color='#00FFFF'><b>1.</b></span> Seperti yang anda lihat di atas, Teks ini bergerak ke kiri dan ke kanan. Anda boleh gunakan kode dibawah ini untuk melakukan tricks tersebut.</font><br /> <br /> <div class="code"><br /><span style="color: white;"><marquee direction="</span> <b><span style="color: #FFFF00;">right</span></b><span style="color: white;">">This text scrolls right...</marquee></span></div><br /> <br /><font color='#00FFFF'>Apa yang anda perlukan, gantikan teks yang bewarna <b><span style="color:#FFFF00;">kuning</span></b> kepada arah mana anda akan teks tu Scroll. Anda boleh pilih sama ada - up, down, right, left.</font><br /><br /> <div style="color: #FF0000;"><marquee scrollamount="30"><b>Teks ini Macam Ferari..</b></marquee></div><br /><span style="font-size: large;"><font color='#00FFFF'><b>2.</b></span> Anda boleh mengubah kelajuan teks dengan menggunakan kod di bawah ni.</font> <br /><br /> <div class="code"><br /><span style="color: white;"><marquee scrollamount="</span><b><span style="color:#FF6600;">30</span></b><span style="color: white;">"></span><span style="color: #FF0000;">Teks ni Macam Ferari..</span><span style="color: white;"></marquee> </span></div><br /><br /><font color='#00FFFF'>Ubah nomer yang bewarna <b><span style="color:#FF6600;">Oren</span></b> untuk mengubah kelajuan.</font> <br /><br /> <div style="color: #f1c232;"><marquee scrolldelay="300"><b>Teks ini seperti Siput..</b></marquee></div><br /> <div class="code"><br/><span style="color: white;"><marquee scrolldelay="</span><b><span style="color:#00FF00;">300</span></b><span style="color: white;">">Teks ini seperti Siput..</marquee>
</span></div><br /><br /><b><span style="font-size: large;"><font color='#00FFFF'>3.</span></b> Ubah nomer yang bewarna <b><span style="color:#00FF00;">hijau</span></b> untuk mengubah kelajuan. </font><br /><br /><div style="color: #6600CC;"><marquee behavior="alternate"><b>Teks ini Melantun</b></marquee> </div><br /><font color='#00FFFF'>Untuk membuatkan teks anda melantun seperti di atas ini. Gunakan kode di bawah. </font><br /><br /> <div class="code"><br /><span style="color: white;"><marquee behavior="alternate"></span><b style="color: #6600CC;">Teks ini Melantun</b><span style="color: white;"></marquee> </span></div><br /><br /><b><font color='#00FFFF'>4.</b> Ok. Seterusnya cara untuk menetapkan ruangan untuk Marquee bergerak </font><br /><br /><div style="color: #0066FF;"> <marquee width="200"><b>Teks ini bergerak dalam kelebaran 200 width</b></marquee></div><br /><div class="code"><br /> <span style="color: white;"><marquee width="</span><span style="color: #00FF00;">200</span><span style="color: white;">">Teks ini bergerak dalam kelebaran 200 width</marquee></span></div> <br /><font color='#00FFFF'>Anda boleh tentukan width mengikut kesukaan anda dengan menukarkan nomer yang bewarna <b><span style="color: #00FF00;">hijau</span></b>. </font><br /><br /><span style="font-size: large;"><b><font color='#00FFFF'>5.</b></span> Seterusnya saya akan menggabungkan beberapa kode Marquee ini bersama. </font><br /><br /> <div style="color: #33FF33;"><marquee behavior=alternate scrollamount=30 width=400><b>Teks Paling Awesome</b></marquee></div> <br /><font color='#00FFFF'>Ini merupakan kode yang saya gunakan untuk membuat teks bergerak seperti yang di atas. </font><br /><br /> <div class="code"> <br /> <span style="color: white;"><marquee behavior="alternate" width="400" scrollamount="30"></span><b style="color: #33FF33;">Teks Paling Awesome</b><span style="color: white;"></marquee> </span></div> <br /> <br /><font color='#00FFFF'>Sekarang, anda boleh coba dalam blog anda, anda juga boleh gabungkan kode-kode marquee ini mengikut kesukaan anda masing-masing.<br /></font><br /></td> <td width='200' height='700' bgcolor='' valign='top'> <table align="left" width='200' border='0' bgcolor='' bordercolor='green'> <tr align='center'>
<td><p><a href="http://www.facebook.com/" target="_blank" title="Masuk ke Facebook"> <img src="gambar/facebook.ico" border="0" width="90" height="70"/></a></td><td><p><a href="http://www.youtube.com/" target="_blank" title="Masuk ke youtube"> <img src="gambar/youtube.ico" border="0" width="90" height="70"/></a><td> </p></tr></table> <table align='left' width='200' border='0' bgcolor='' bordercolor='green'> <center> <td width="200" valign="top"><font color="#FFFF00" face="Cooper Std Black"> <b>TUTORIAL HTML</b> <ul><li><a href="buat%20ayat%20bergerak.html" title='membuat tulisan bergerak'><font color='#0000FF' face='Times New Roman'>Cara membuat tulisan bergerak</a></font></li> <li><a href='Menbuat%20from%20komentar.html' title='membuat from komentar'><font color='#0000FF' face='Times New Roman'>Cara membuat from komentar</a></font></li> <li><a href='Membuat%20login.html' title='membuat halaman login'><font color='#0000FF' face='Times New Roman'>Cara membuat halaman login</a></font></li> </ul></font></table></td></tr><tr height="50"><td colspan='2' background='gambar/zz.jpg'><center><b><marquee><font face="Cooper Std Black" color="#00CCFF" size="7">~ Meskipun banyak kendala dalam pembuatan desain web, tapi tetap berusaha untuk mencapai hasil yang terbaik ~</font></b></marquee></center></td> </tr> </table> <div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"> <img border="0" src="gambar/twitter.ico" title="follow my twitter" alt="animasi bergerak gif" /></a><small><center> </div> <div style="position: fixed; bottom: 0px; right: 0px;width:100px;height:100px;"><a href='#top'> <img border="0" src="gambar/top.png" width='50' height='50' title="Kembali ke atas" alt="animasi bergerak gif" /></a><small><center></div> <div style="position: fixed; TOP: 0px; right: 10px;width:130px;height:160px;"><a href='login.html'> <img border="0" src="gambar/c.png" width='40' height='40' title="Kembali ke login" alt="animasi bergerak gif" /></a><small><center></div><body background='gambar/yy.jpg'> </body>
<EMBED SRC="MP3/A7x_Afterlife.swf" AUTOSTART="TRUE" LOOP="TRUE" WIDTH="1" HEIGHT="1" ALIGN="CENTER"></EMBED> </html> Langkah selanjutnya simpan dalam format HTML dan buka file dengan firefox atau sejenisnya, anda bisa menganti gambar-gambarnya sesuai yang anda inginkan, dan anda juga dapat menganti background dan animasi yang sesuai dengan anda. Hasilnya akan seperti pada gambar 12 berikut:
Gambar 13. Artikel tulisan bergerak Posted by rian hidayat at 11:31 PM Email ThisBlogThis!Share to TwitterShare to Facebook 80 comments: 1. AnonymousMarch 4, 2013 at 11:32 PM tutorial yang bagus mas. Reply 2. AnonymousMay 8, 2013 at 8:36 PM trimaksih atas tutorialnya saudara...tgs dari dosen untuk buat web samkin lancar...he..he... Reply
3. Andre Rizqi WigunaMay 16, 2013 at 9:45 AM Bro ente mah ngajarin cara INSTANT, kalau kayak gini gk akan KREATIF bagi para PEMULA Reply Replies 1. AnonymousMay 20, 2013 at 5:10 AM jadi dimana mas saya bisa dapet basic referensi tuk buat website,karna saya masih belum mengerti sama sekali tentang bahasa ato kode yang harus digunakan mohon infonya :) Reply
4. tarhadi tabureMay 22, 2013 at 10:47 PM Ijin copas gan.. Reply
5. Ary WidiantaraJune 15, 2013 at 9:49 AM makasih mas :) law buat coment gini gimana caranya mas????? Reply 6. AnonymousJune 24, 2013 at 7:19 AM ok Reply 7. RyoJune 24, 2013 at 8:07 PM Thank'zzz brooo ilmunya,,
Reply 8. June 25, 2013 at 4:34 AM untuk offline bisa maksudnya pribadi/tanpa dipublikasikan ke publik Reply kan?
9. faiq ashshidiqJune 26, 2013 at 10:26 PM Thanks gan Visit and Follow http://asfa-id.blogspot.com/ Reply 10. Alat Tulis MurahJuly 17, 2013 at 8:16 AM my blog ;-) !!
Sedikit sedikit saya coba tutorialnya.mudah mudahan berhasil Reply
11. afif assyihabJuly 18, 2013 at 4:53 PM izin coba mas Reply
12. Windha Kurnia SariJuly 23, 2013 at 8:07 AM bagus mas, lebih dari membantu. terimakasih Reply
13. Ayu Nur AisyahJuly 24, 2013 at 9:47 PM web yg keren,,, sangat membantu Reply 14. DeCocozJuly 24, 2013 at 10:00 PM mo coba belajar oprek2 ah. nice sharing mas Reply
15. Stevensaya GerradJuly 28, 2013 at 4:39 AM mantep bgt tuhhh,, makasihhh Reply 16. AnonymousJuly 31, 2013 at 4:35 AM gimana cara jadiin web online?? :D Reply 17. auqJuly 31, 2013 at 3:13 PM makasih cara jadiin web onlinenya gimana ilmunya...
Reply
18. yogi indra liadiJuly 31, 2013 at 10:53 PM keren dah (y) Reply
19. yogi indra liadiJuly 31, 2013 at 10:53 PM izin copas gan untuk nambah pengetahuan :D Reply 20. Erwin KumanAugust 24, 2013 at 2:13 AM sering-sering keren, tks Reply 21. teguh putraAugust 28, 2013 at 11:07 PM yaa share yg ginian. keren,
thank's gan jadi bisa ene ngerjain tugas sekolah Reply 22. AdminAugust 31, 2013 at 9:57 PM Makasih banyak infonya gan.... banyak sekali pengetahuan yang saya dapat di sini Reply 23. AnonymousSeptember 5, 2013 at 6:12 AM klo mengatur rata kiri gimana min?? Reply
24. Albert CouSeptember 6, 2013 at 8:58 PM
kok ysng bikin koment pas diklik sumbit nggak muncul ya comment nya itu knp ? Reply
25. Rezko FudzhiSeptember 8, 2013 at 3:08 AM Makasih gan. sukses Reply 26. AnonymousSeptember 14, 2013 at 5:48 AM kunjungi segera killerbee8.blogspot.com download anime one piece.......sub indo Reply
27. ardian fatkhurSeptember 14, 2013 at 10:48 PM permisi , mau tanya memasukan gambar dan background gimana yah ? Reply
28. shidiq andhikaSeptember 21, 2013 at 1:04 AM terimakasih atas infonya kang.. mudah mudahan bisa sangat berguna bagi saya.. Reply 29. AnonymousSeptember 21, 2013 at 11:19 PM ijin copas gann Reply
30. Ilham Akbar AhmadiSeptember 24, 2013 at 5:29 PM mas, kalau bisa di kasih warna beda untuk yang harus di ganti seperti nama gambar atau link link Reply
31. jose rachelSeptember 25, 2013 at 6:16 AM Salut banget sumpah ... ngeliatnya aja jadi cengo gitu... ribet .. tapi oke hasilnya.. terima kasih untuk artikelnya .. sangat membantu ... :D Reply 32. AnonymousSeptember 30, 2013 at 2:22 AM oke,,, bagus n membantu saya banget,, tapi jujur sampai sekarang sya belum mengerti,, Reply 33. AnonymousOctober 1, 2013 at 4:33 AM Bagus2 Makasih
Reply 34. Ega WahyuOctober 2, 2013 at 12:08 AM Makasiih yah atas info nya lumayan buat ngulik dannambah pengetahuan.. Reply
35. nana rizkianOctober 6, 2013 at 1:43 PM ijin kopas ya kakaaakk,, diajarin lebih mau bangetss :-) tx Reply 36. fatimaaa fjgOctober 6, 2013 at 5:29 PM mkasi.. brow, tk jajal e
Reply 37. safriOctober 7, 2013 at 8:54 PM ijin copy gan... Reply 38. AnonymousOctober 9, 2013 at 8:13 AM kalo tu gambar ga ada di pc or laptop kita tampilannya blank kita mesti rubah dulu di ling gambar nya ya kalo ga salah. Reply 39. Angga PramadjayaOctober 14, 2013 at 4:34 AM Keren gan, scriptnya banyak banget gan.. izin copas yah gan Reply
40. yoga ekaOctober 16, 2013 at 9:39 AM mantap bro,bisa buat nambah wawasan , Reply 41. AnonymousOctober 17, 2013 at 12:59 AM Thanks Broo, Sangat membantu buat awal eksplorasi :D Reply 42. AnonymousOctober 17, 2013 at 3:41 AM thanks gan for ilmunya Reply
43. AnonymousOctober 19, 2013 at 5:36 AM keren gan ilmunya saya salut (y) Reply
44. efendy adaOctober 20, 2013 at 6:46 AM woo ada lagi gan Reply kereen gan
45. Febrianus JannesOctober 24, 2013 at 5:33 AM tutorial nya gampang dipahami,gan ! Reply 46. AnonymousOctober 28, 2013 at 6:07 AM makasih yah buat ilmunya bermanfaat banget :D Reply 47. siti rohmahOctober 30, 2013 at 1:45 AM makasih banget tutorialnya sangat membantu saya,,, Reply
48. Raden HarisOctober 30, 2013 at 2:11 AM canggih mas keren abis (y) Reply 49. facebookOctober 31, 2013 at 2:38 AM thanks ya kk,tutorialnya sangat membantu saya dalam belajar web desain... Reply 50. VladxxxOctober 31, 2013 at 5:50 AM saran saya sih, jgn suruh orang copy paste HTMLny ke notepad mereka itu cara instant dan orang dijamin bakal gak ngerti, lebih
baik uraikan dan jelaskan masing" fungsi HTML yang panjang itu, thx anyway Reply
51. Akhmad BukhoriNovember 3, 2013 at 12:35 AM ijin copas... Reply 52. MI Islamiyah MulyoagungNovember 4, 2013 at 7:40 AM ijin copas gan buat belajar Reply 53. SuharyantoNovember 4, 2013 at 11:37 PM
makasih sangat :) Reply
gan... bermanfaat..
54. elza suprayogyNovember 5, 2013 at 1:27 AM kk kalo menguba kursor di blog menggunakan html kayk mna kk...? Reply
55. Afif tampanNovember 13, 2013 at 5:26 AM gan ijin copas ya. Reply
56. rizal maulanaNovember 17, 2013 at 12:37 AM mantaf kakak. Reply
57. kelvin slowNovember 22, 2013 at 3:46 AM nilai tugas 100 semua ini Reply 58. AnonymousNovember 24, 2013 at 7:29 PM ga ngerti cara naro fotonya ni kaka Reply 59. AnonymousNovember 26, 2013 at 4:03 AM ijin copas ya gan, mw belajar bwt website Reply
60. AnonymousNovember 26, 2013 at 5:14 AM tutorialnya sangat membantu terima kasih atas informasinya. . Reply 61. mymulyaNovember 27, 2013 at 1:39 AM mantab gan, mksih tutorial nya, sangat2 membantu ... Reply 62. cikinifloristNovember 27, 2013 at 11:40 PM wah..wah.. ini artikel bagus bangat, ane uda nyari kemana2 tp teorinya susah karena kurang detil... tp yg satu ini patut diajungkan 2 jempol... saya pribadi masih ingin banyak belajar.. kl bisa hub. saya di 085715335476... ya mas/mba.. berapa saya harus bayar ?? Reply
63. Ristya SyabillaNovember 28, 2013 at 3:11 AM lagunya ... enggak sukses diputar Reply 64. NinoNovember 30, 2013 at 1:01 AM cara pasang gambar background nya gmna,kok ini gak ada ya,malah ijo semua warnanya Reply
65. dinda arumsariNovember 30, 2013 at 4:20 AM keren turorial nya (y) Reply 66. AnonymousDecember 4, 2013 at 12:21 AM Keren gan Reply 67. isnu ridwanDecember 4, 2013 at 2:45 AM bagus tenan jhon.. Reply
68. ridho elangDecember 4, 2013 at 6:48 AM bagus bermanfaat thanks gan Reply
69. Dr.Fridho Setyo HerlantoDecember 5, 2013 at 1:03 AM gan cara bikin link nya gi mana, Reply
70. andi deddy PurwantoDecember 6, 2013 at 1:04 AM sipp deh,,,lumayan nambah2 ilmu :-) Reply
71. fauzi aquillotiDecember 10, 2013 at 10:50 PM makasih atass infonya ya
semoga ilmunya makin keren Reply 72. AnonymousDecember 14, 2013 at 4:01 PM sangat bermanfaat bro .. :) Reply 73. faiqa_ekatrisnawatiDecember 22, 2013 at 4:57 AM syukron...Alhamdulillah bermanfaat....
Reply 74. Robi DoankDecember 23, 2013 at 12:14 AM gak ngeri xlo ktk gini mas.. Reply
75. laura faurinaDecember 24, 2013 at 7:26 PM Trima kasih ya mas.. atas pengajarannya.. saya mau nanya mas,, waktu saya nyoba buat nya berhasil tapi kenapa wktu mau mmbuat halaman awal,, bacaan profil, home saya tidak keluar ya mas.. mohon penjelasan nya... Reply
76. Kide KideDecember 26, 2013 at 8:06 PM mantap masbrow Reply
77. soleh subarjahDecember 31, 2013 at 3:22 AM makasih gan untuk infonya sangat bermanfaat sekali Reply 78. AnonymousJanuary 3, 2014 at 4:29 AM terima kasih banget gan tutorialnya ... sangat bermanfaat buat tugas kuliah saya ... Reply
79. Vian hasbiJanuary 3, 2014 at 11:28 AM super keren banget gan. .^^ Reply Home Subscribe to: Post Comments (Atom) JAM Pages

Beranda download MP3
Blog Archive 2013 (1) o February (1) Membuat Desain Website Berbasis HTML Dengan Notepa... About Me
rian hidayat View my complete profile Google+ Followers Travel template. Template images by enot-poloskun. Powered by Blogger.

Kkpi 2

Diunggah oleh

Informasi Dokumen

Judul Asli

Hak Cipta

Format Tersedia

Bagikan dokumen Ini

Bagikan atau Tanam Dokumen

Opsi Berbagi

Apakah menurut Anda dokumen ini bermanfaat?

Apakah konten ini tidak pantas?

Hak Cipta:

Format Tersedia

Kkpi 2

Diunggah oleh

Hak Cipta:

Format Tersedia

Membuat Desain Website Berbasis HTML Dengan Notepad++ Pengenalan Tag Pada HTML Dalam HTML tag merupakan

Penataan Letak Kepala Tabel Warna Kepala Tabel

Gambar 7 link halaman web lain

AUTOSTART="TRUE" LOOP="TRUE" ALIGN="CENTER"></EMBED> </html>

4. tarhadi tabureMay 22, 2013 at 10:47 PM Ijin copas gan.. Reply

Sedikit sedikit saya coba tutorialnya.mudah mudahan berhasil Reply

24. Albert CouSeptember 6, 2013 at 8:58 PM

makasih sangat :) Reply

56. rizal maulanaNovember 17, 2013 at 12:37 AM mantaf kakak. Reply

71. fauzi aquillotiDecember 10, 2013 at 10:50 PM makasih atass infonya ya

76. Kide KideDecember 26, 2013 at 8:06 PM mantap masbrow Reply

Beranda download MP3

Anda mungkin juga menyukai