Modul Web Bikas

Pengertian singkat tentang HTML HTML (Hyper Text Markup Language) merupakan bahasa standar untuk membuat suatu dokumen HTML (halaman web) yang terdiri dari kode-kode singkat tertentu, dimana dengan kode-kode tersebut akan memerintahkan Web browser bagaimana untuk menampilkan halaman Web yang terdiri dari berbagai macam format file seperti teks, grafik, animasi, link maupun audio-video. Sedangkan Web browser adalah sebuah progam yang dapat menterjemahkan kode perintah dari dokumen HTML tersebut sehingga dapat kita lihat, baca dan dengar. Contoh dari Web Browser adalah Internet Explorer, Netscape Navigator, Mozilla Firefox, Opera, Safari dll. HTML mempunyai file perluasan (extention) htm atau html. Dimana kedua perluasan tersebut adalah sama, jadi anda boleh menyimpan file dokumen HTML dengan extention ".htm" atau ".html". Untuk mulai belajar HTML kita akan menggunakan Texs Editor, Notepad. Di bawah ini adalah contoh suatu dokumen HTML yang sangat sederhana. Buka Notepad, silahkan mulai dengan mengetikkan (copy/paste) kode di bawah ini: Ini adalah dokumen HTML pertamaku Supaya lebih lengkap modulnya,anda bisa buka file PDF dibawah ini Modul Web Bikas

Membuat Formulir Pendaftaran Menggunakan HTML

Gan....Postingan ini adalah tugas HTML yang saya buat menggunakan MACROMEDIA DREAMWEAVER 8
Nih Gan Scriptnya.....


<form action="@" method="post">
<font size="+3">Biodata Pribadi</font>
<table border="0">
    <tr>
        <td>Nama</td><td>:</td>
        <td><input size="30" type="text" value="Isikan Nama Anda Di Sini"/></td>
    </tr>
    <tr>
        <td>Alamat</td><td>:</td>
        <td><input size="40" type="text" Value="Isikan Alamat Anda Di Sini"/></td>
    </tr>
    <tr>
        <td>TTL</td><td>:</td>
      <td><input size="26" type="text" value="Nama Kota" />&nbsp;<select size="1" name="select">
                <option>1</option>
                <option>2</option>
                <option>3</option>
                <option>4</option>
                <option>5</option>
                <option>6</option>
                <option>7</option>
                <option>8</option>
                <option>9</option>
                <option>10</option>
                <option>11</option>
                <option>12</option>
                <option>13</option>
                <option>14</option>
                <option>15</option>
                <option>16</option>
                   <option>17</option>
                <option>18</option>
                <option>19</option>
                <option>20</option>
                <option>21</option>
                <option>22</option>
                <option>23</option>
                <option>24</option>
                  <option>25</option>
                <option>26</option>
                <option>27</option>
                <option>28</option>
                <option>29</option>
                <option>30</option>
                <option>31</option>
               </select>
               <select size"1"name="select">
                <option>January</option>
                <option>Febuary</option>
                <option>Maret</option>
                <option>April</option>
                <option>Mei</option>
                <option>Juni</option>
                <option>Juli</option>
                <option>Agustus</option>
                <option>September</option>
                <option>Oktober</option>
                <option>November</option>
                <option>Desember</option>
                </select>
                <select size="1" name="select">
                <option>2011</option>
                <option>2010</option>
                <option>2009</option>
                <option>2008</option>
                <option>2007</option>
                <option>2006</option>
                <option>2005</option>
                <option>2004</option>
                <option>2003</option>
                <option>2002</option>
                <option>2001</option>
                <option>2000</option>
                <option>1999</option>
                <option>1998</option>
                <option>1997</option>
                <option>1996</option>
                   <option>1995</option>
                <option>1994</option>
                <option>1993</option>
                <option>1992</option>
                <option>1991</option>
                <option>1992</option>
                <option>1991</option>
                <option>1990</option>
                  <option>1989</option>
                <option>1988</option>
                <option>1987</option>
                <option>1986</option>
                <option>1985</option>
                <option>1984</option>
                <option>1982</option>
                <option>1981</option>
                <option>1980</option>
                </select>
                </td>
            <tr>
                <td>Kelamin</td><td>:</td>
                <td><input size="1" type="radio" name="Kelamin"/>Perempuan <input size="1" type="radio" name="Kelamin" />Laki-Laki</td>
            </tr>
            <tr>
                <td>Agama</td><td>:</td>
                <td><select name="Agama">
                <option>Islam</option>
                <option>Kristen</option>
                <option>Buddha</option>
                <option>Hindu</option>
                <option>-</option>
                </select></td>
            </tr>
            <tr>
                <td>Hobi</td><td>:</td>
                <td><input size="1" type="checkbox"/>Olah Raga &nbsp;<input size="1" type="checkbox"/>Belajar &nbsp;<input size="1" type=                "checkbox"" />Komputer &nbsp;<input size="1" type="checkbox"/>Musik &nbsp;<input size="1" type="checkbox"/>Lain-Lain</td>
            </tr>
            <tr>
                <td>Moto</td><td>:</td>
                <td><textarea>Isikan Moto Anda Di Sini</textarea></td>
            </tr>
            <tr>
                <td colspan="2"></td>
                <td><input Size="1" Type="reset"value="Ulangi">
                <input size="1" type="submit" Value="Daftar"></td>
            </tr>
</form>

Hasilnya Ini Gan...

Biodata Pribadi

Nama	:
Alamat	:
TTL	:
Kelamin	:	Perempuan Laki-Laki
Agama	:
Hobi	:	Olah Raga  Belajar  Komputer  Musik  Lain-Lain
Moto	:	Isikan Moto Anda Di Sini

HTML Dasar

HTML = Hyper Text Markup Language
Dokumen HTML (web pages) merupakan file teks murni yang dapat dibuat dengan sembarang editor teks.
Penamaan Dokumen
Nama : sembarang
Ekstensi : ".htm" atau ".html"
Elemen, Tag, Attribut
Dokumen HTML disusun oleh elemen-elemen, contoh : head, body, paragraf, table, list, dsb. Penandaan berbagai elemen dalam suatu dokumen HTML menggunakan Tag (Markup).
Format penulisan tag terdiri atas tanda "<", ">", " /" yaitu
<namatag> ………. </namatag> Penulisan Tag umumnya berpasangan
Contoh:
<P> -> untuk mengawali suatu paragraf.
</P>-> untuk mengakhiri suatu paragraf.
Setiap tag dapat dilengkapi dengan attribut, attribut setiap tag berbeda-beda.
Format penulisan :
<namatag atr1="nilai-atr1" atr2="nilai-atr2"> …… </namatag> Struktur file HTML
<Format HTML> =
<Blok identifikasi><Tag HTML><Blok Head><Blok Body><Tag /HTML>
<Blok identifikasi> tidak mutlak harus ada, dan kalau ada biasanya diisi dengan informasi pembuat page dan dibuat dengan apa page tersebut

    <html>
    <head>
      <TITLE> ……………………  </TITLE>
    </head>
    <body>
 ……………………………
 ……………………………
 ……………………………
    </body>
    </html>

Contoh :

    <html>
    <head>
    <TITLE>Contoh HTML sederhana</TITLE>
    </head>
    <body>
    <H1>HTML itu mudah dipelajari</H1>
    <P>Selamat datang di dunia HTML. 
    Ini adalah paragraph pertama. Meskipun pendek kalimat
    Ini juga bagian dari paragraph!</P>
    <P>Dan ini adalah paragraph kedua.</P>
    </body>
    </html>

Cara Mudah Membuat Shortcut Alamat Web dengan Notepad

Malam Sobat Blogger, kali ini Saya akan share tentang Menyimpan alamat suatu website/blog., sebenarnya sih bisa dilakukan dengan browser dengan menggunakan fitur bookmark. Bookmark sendiri bertujuan agar mempermudah mengunjungi kembali suatu website atau blog yang disukai.

Lalu sobat, bagaimana membuat shortcut dari suatu alamat website atau blog dengan menggunakan notepad, dengan sekali klik maka akan langsung menuju ke alamat website atau blog yang disukai.

Cara Mudah Membuat Shortcut Alamat Web dengan Notepad

1. buka Notepad klik Start menu > All Program > Accecories pilih Notepad

2.. Masukkan kode berikut

[InternetShortcut]
URL=http://ahmedtnj.blogspot.com

3.Kemudian Save As, untuk Save as type dipilih All files dan beri nama akhiran .url misalkan contoh Goresan IT Ku.url seperti gambar berikut

 

Untuk hasilnya silahkan diliat sendiri, akan ada shorcut baru dan ketika di klik akan menuju ke halaman website atau blog yang sudah dibuat shortcutnya tadi,hehe..

Untuk icon nya bisa diganti, klik kanan > Properties > Web Document > Change Icon, silahkan ganti dengan icon sesuai selera sobat.

Ok selamat mencoba Membuat Shortcut Alamat Web dengan Notepad, Semoga Bermanfaat