Senin, 04 November 2013

Belajar Pembuatan web berbasis HTML


HTML(Hyper Text Markup Language) adalah sekumpulan simbol-simbol atau tag-tag yang
dituliskan dalam sebuah file yang dimaksudkan untuk menampilkan halaman pada web
browser. Tag-tag tadi memberitahu browser bagaimana menampilkan halaman web dengan
lengkap kepada
pengguna.
Tag-tag HTML selalu diawali dengan <x> dan diakhiri dengan </x> dimana x tag HTML seperti
b, i, u dan sebagainya.
Oke langsung aja yaah , saya kasi coding dan screenshotmya mengenai pembelajaran HTML dasar,

Note : copy coding dibawah ini kemudian pastekan di notepad ++(sejenisnya) kemudian simpan dengan nama - halaman awal.html
Feature: ada tulisan bergerak kekiri-kekanan,-mp3 dan link offline maupun online.
Add caption
<html>
<head>
<title>Home</title>
</head>
<body>
<center><table width='1000' height='400' border="0" background='slick-droid-wallpapers_30110_1366x768.jpg' cellpadding="0" cellspacing="<tr>
<td colspan="2" color="white" align='center'>
<img src="droids-wallpapers_33174_1366x768.jpg" width="1000" height="400">
<!--tulisan bergerak selamat datang di web saya-->
 <marquee behavior="alternate" body background="depapepe_thumb.jpg" style="45"><p align="left"><font size="6" color="white"><b>--SELAMAT DATANG DI WEBSITE PERTAMA SAYA--</b></font></p></marquee></a>
<!--isi web-->
<td width='796' height='700' background='slick-droid-wallpapers_30110_1366x768.jpg' valign='top' >
<p><font color="yellow" size="5">~PENGALAMAN SAYA DI IAIN RADEN FATAH PALEMBANG~</font>
<p align="lift"><font color="white">
<br />
Pada waktu saya Ikut Tes seleksi untuk masuk sebagai Mahasiswa di IAIN Raden Fatah Palembang<div>
Alhamdulillah saya lulu tes untuk masuk bangku kuliah di IAIN RF ini,</div>
<div>
tepatnya saya sekarang sudah semester III, tentu belum begitu banyak pengalaman saya di IAIN RF.</div>
<div>
Saya kuliah di jurusan Sistem informasi, dimana jurususan ini berhubungan erat dengan pengoprasian komputer.</div>
<div>
<br /></div>
<div>
Pengalaman saya duduk di bangku kuliah ini, saya dituntut belajar mandiri siap dan pintar berbicara,</div>
<div>
yaaah, "deadline pelan-pelan" kyak kata si "vicky-29 my age yeaah" hhehe,.</div>
<div>
<img src="si2.jpg"
width="200" height="200"> <br>
saya duduk di kelas SI2 tahun ajaran 2012. banyak sekali kekompakkan yang terjadi antara kami, dari yang kecil sampai yang besar,</div>
<div>
pengalaman yang paling berkesan sampai saat ini buat saya adlaah,</div>
<div>
ceritanya begiini gan,:</div>
<div>
ini baru2 sekitar 2 minggu laaah, mata kuliah dasar akuntansi. kami kuliah pukul 17.00 WIB. dan pulang jam 18.30.</div>
<div>
waktu itu , dosen memberikan tugas individu dan harus diselesaikan pada hari itu juga,</div>
<div>
kami semua fokus kepada soal yang diberi dan sharing kpd teman2 satu kelas, tidak terasa waktu sudah mendekati shallat isa', selesai pukul 18.45 WIB. yang bikin saya berkesan adalah setelah tugas selesai, dan waktu mendekati isa' untuk shallat mgriib bersama, kami semua cari kelas kosoong , ambil wudhu dan shallat berjama'ah, &nbsp;alhamdulillah kekompakkan ini semoga di rahmati allah, &nbsp;</div>
<div style='clear: both;'></div>
</textarea>
<font="left" form method="post" action="home.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="FB.jpg" border="0" width="90" height="70"/></a></td>
<td><p><a href="http://www.youtube.com/" target="_blank" title="Masuk ke youtube"> <img src="YOURUBE.jpg" border="0" width="90" height="70"/></a><td>
</p>
</tr>
</table>
<!--tabel menu-->
<table align='left' width='200' border='0' bgcolor='' bordercolor='green'>
<center>
<td width="200" valign="top"><font color="#FFFF00" face="Cooper Std Black">
<b>MENU-MENU</b>
<ul>
<li><a href='CHORD GITAR.html' title='CHORD GITAR'><font color='#0000FF' face='Times New Roman'>CHORD GITAR</a></font></li>
<li><a href='BELAJAR GITAR.html' title='BELAJAR GITAR'><font color='#0000FF' face='Times New Roman'>BELAJAR GITAR</a></font></li>
<li><a href='TABLE HTML.html' title='TABLE HTML'><font color='#0000FF' face='Times New Roman'>TABEL HTML</a></font></li>
<li><a href='MY PROFIL.html' title='MY PROFIL'><font color='#0000FF' face='Times New Roman'>MY PROFIL</a></font></li>
<li><a href='profil teman.html' title='profil teman'><font color='#0000FF' face='Times New Roman'>PROFIL TEMAN</a></font></li>
</ul></font></table></td>
</tr>
<tr height="50">
<td colspan='2'background='glass-apple-wallpapers_10883_1366x768.jpg'><center><b><marquee><font face="Cooper Std Black" color="#00CCFF" size="7">~ Meskipun banyak kendala dalam pembuatan desain web SAYA , tapi SAYA tetap berusaha untuk mencapai hasil yang terbaik ~</font></b></marquee></center></td></tr>
<body background='depapepe_thumb.jpg'></body>
<object<br />
                  <td  align="center" width="">
    <audio controls="controls">
    <source src="Depapepe - Sky! Sky! Sky!.mp3" type="audio/mpeg"/>
    </audio>
</object><br />
 <param name="src" value="depapepe - kitto mata itsuka.mp3"><br />
       <param name="autoplay" value="true"><br />
       <param name="controller" value="true"><br />
                   <embed height="16" width="250" src="Depapepe - Sky! Sky! Sky!.mp3"><br />
                   <video width="375" height="225"


Cara memasukan vidio di HTML:
Note : copy coding dibawah ini kemudian pastekan di notepad ++(sejenisnya) kemudian simpan dengan nama – my proifil.html
Feature: ada tulisan bergerak kekiri-kekanan memantul,-mp4 vidio file-link

Add caption

                </table>
                <font color='#00FF00' face='Times New Roman'>
                <html>
<body>
<marquee  direction="right" scrollamount="9" align="center" behavior="alternate">  MY PROFIL </marquee>
</body>
</html>
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
<!--untuk vidio-->
<video width="550" height="400"
<video controls="controls">
    <source src="CIMG2454.mp4" type="video/mp4"/>
    </video>
   <br />
  <br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp;&nbsp;NAMA &nbsp; &nbsp; &nbsp; &nbsp; : IRIANTO MUBARAK<br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;NIML  &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; : 12540091<br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;KELAS &nbsp; &nbsp; &nbsp; &nbsp; : SI2<br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;  &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;HOBI &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;: GONJRANG-GONJRENG GITAR &amp;; BERENANG<br />
&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;CITA-CITA &nbsp;&nbsp;: NAK JADI WONK SUKSES TOK NGEDOPI ANAK BINI<br />
<marquee  direction="right" scrollamount="9" align="center" behavior="alternate">  MY PROFIL </marquee>
<div>
<br /></div>
<body background="FormatFactory9.jpg">
<td colspan="2" align="center"><a href="halaman awal.html">Kembali ke halaman utama</a></td>
<!--untuk vidio-->
<video width="375" height="225"
<video controls="controls">
    <source src="tiime.mp4" type="video/mp4"/>
    </video>
                <!--untuk vidio-->
                <video width="375" height="225"
<video controls="controls">
    <source src="Time.mp4" type="video/mp4"/>
    </video>
                <!--untuk vidio-->
                <video width="375" height="225"
<video controls="controls">
    <source src="horizon.mp4" type="video/mp4"/>
    </video>
                                <!--untuk vidio-->
                <video width="610" height="460"
<video controls="controls">
    <source src="kito mata itsuka.mp4" type="video/mp4"/>
    </video>
                                <!--untuk vidio-->
                <video width="610" height="460"
<video controls="controls">
    <source src="one.mp4" type="video/mp4"/>
    </video>

Oke itu dulu ya tutorial dari saya mengena pembuatan web HTML , semoga bermanfaat untuk orang banyak,.
Assalamu’alaikum.
               


    


Tidak ada komentar:

Posting Komentar