Scribd Logo
Unggah

Selamat datang di Scribd!

  • Buku Saku Pemrograman Web

    Diunggah oleh

    ChamdanYuwafi
    10 tayangan12 halaman
    MODUL HTML

    Hak Cipta

    © © All Rights Reserved

    Format Tersedia

    DOCX, PDF, TXT atau baca online dari Scribd

    Apakah menurut Anda dokumen ini bermanfaat?

    Apakah konten ini tidak pantas?

    Laporkan Dokumen Ini
    MODUL HTML

    Hak Cipta:

    © All Rights Reserved
    Unduh sebagai DOCX, PDF, TXT atau baca online dari Scribd
    Tandai sebagai konten tidak pantas
    10 tayangan12 halaman

    Buku Saku Pemrograman Web

    Diunggah oleh

    ChamdanYuwafi
    MODUL HTML

    Hak Cipta:

    © All Rights Reserved
    Unduh sebagai DOCX, PDF, TXT atau baca online dari Scribd
    Tandai sebagai konten tidak pantas
    dari 12

    MODUL PEMROGRAMAN WEB

    HTML

    DISUSUN OLEH
    MOCH CHAMDAN YUWAFI, S .ST

    REKAYASA PERANGKAT LUNAK


    2016
    1

    HTML
    Hypertext Mark-up Language adalah bahasa
    markah yang digunakan untuk membuat halaman
    web, web sendiri adalah sebuah halaman yang
    berisikan data teks, multimedia (gambar, animasi,
    audio dan video) yang dapat diakses menggunakan
    aplikasi web browser dari jaringan lokal maupun
    jaringan internet.
    Untuk membuat dokumen HTML haruslah
    memahami penggunaan tanda (tag). Berikut
    struktur dokumen HTML
    :
    <html>
    <head>
    <title></title>
    </head>
    <body></body>
    </html>
    2

    Definisi tag sendiri adalah sebuah tanda yang


    menyatakan kondisi sebuah obyek, dimana tag
    dibuat secara berpasangan terdapat tag awal dan
    tag akhir, ada juga tag yang tidak berpasangan.
    Berikut adalah contoh struktur tag:
    <body bgcolor=orange text=white>
    </body>
    Tag
    = body
    Atribut
    = bgcolor dan text
    Value
    = orange dan white
    Berikut adalah tag yang sering digunakan dalam
    pembuatan halaman web
    :
    1.
    2.
    3.
    4.
    5.
    6.

    Manipulasi Teks
    Manipulasi Table
    Manipulasi Daftar
    Manipulasi Form
    Manipulasi Gambar
    Hyperlink

    Manipulasi Teks
    3

    a) Tag Heading (h1 - h6)


    Tag ini digunakan untuk menyatakan teks
    tersebut adalah judul, subjudul dan
    seterusnya . Tag h1 adalah judul level 1 hingga
    h6 adalah sub judul akan terdapat perbedaan
    disisi ukuran.
    Penulisan umum :
    <h1>Hello World!</h1>
    b) Tag Paragraph (p)
    Tag ini digunakan untuk menyatakan teks
    tersebut adalah sebuah paragraf
    Penulisan umum :
    <p>Teks yang dinyatakan sebagai
    paragraf</p>

    Manipulasi Table
    Untuk membuat table pada dokumen HTML tag
    yang digunakan adalah sebagai berikut
    <table>
    <tr>
    4

    <td>Nomor</td>
    <td>Nama</td>
    </tr>
    <tr>
    <td>1</td>
    <td>Lubna</td>
    </tr>
    </table>
    Nomor
    1

    Nama
    Lubna

    Manipulasi Daftar

    Tag ini sering dipakai untuk membuat navigasi /


    menu pada sebuah halaman web dikombinasikan
    dengan hyperlink. Ada dua macam daftar yaitu
    daftar urutan <ol> dan tidak urutan </ul>.
    Daftar urutan (ordered list)
    <ol>
    <li>Mulai</li>
    <li>Inisiasi r</li>
    <li>Hitung L</li>
    <li>Cetak L</li>
    </ol>
    1.
    2.
    3.
    4.

    Mulai
    Inisiasi
    Hitung L
    Cetak L

    Daftar tidak urutan (unordered list)


    <ul>
    6

    <li>Pepaya</li>
    <li>Mangga</li>
    <li>Nanas</li>
    </ul>

    Pepaya
    Mangga
    Nanas

    Manipulasi Form
    Kita sering menjumpai form / formulir dari
    beberapa situs seperti form pendaftaran, login dan
    lain sebagainya. Dimana masing-masing kotak
    isian beraneka sesuai dengan jenis data yang
    diminta.
    Aneka kotak isian tersebut sebagai berikut :
    a) Input
    b) Select
    7

    c) Textarea

    Tag form sebagai berikut


    <form
    method=POST></form>

    action=

    Di dalam tag form terdapat atribut action dan


    method. Atribut action digunakan untuk
    menentukan file server script tujuan untuk
    memproses data, sedangkan method digunakan
    untuk menentukan metode pengiriman data ke file
    tujuan. Method bisa diisikan dengan POST (data
    yang di pass ke file tujuan disembunyikan dalam
    address bar), GET (data yang di pass ke file tujuan
    ditampilkan dalam address bar).

    Tag input
    <input type= name=>
    8

    Tag input memiliki atribut type dan name, atribut


    type digunakan untuk menentukan tipe kotak isian
    sedangkan name digunakan untuk menentukan
    nama variable yang akan di pass (masing-masing
    kotak isian diharuskan berbeda name nya).

    Type dalam tag input


    text
    number

    password

    submit
    date
    file

    untuk kotak isian berupa teks 1


    baris
    untuk kotak isian berupa numeric
    dimana dapat menentukan min
    dan max nya
    untuk
    kotak
    isian
    berupa
    password dimana setiap teks yang
    dimasukkan akan di konversi
    menjadi symbol titik
    untuk
    membuat
    tombol
    proses/OK
    untuk membuat kotak isian
    berupa tanggal
    Untuk membuat kotak isian untuk
    9

    upload file
    Untuk kotak pilihan dimana
    hanya dapat memilih 1 item
    semisal jenis kelamin
    checkbox
    Unutk kotak pilihan dimana dapat
    memilih lebih dari 1 item semisal
    hobi dan lain-lain
    Dan masih banyak lagi tapi yang sering dipakai
    seperti daftar tersebut.
    radio

    Tag select
    Digunakan dalam form yang menyatakan pilihan
    seperti kota lahir.
    <select name=kota>
    <option value=Pati>Pati</option>
    <option value=Tayu>Tayu</option>
    </select>
    10

    Tag textarea
    Digunakan untuk kotak masukkan multi baris
    <textarea
    name=alamat></textarea>

    Manipulasi Gambar
    Untuk menambahkan gambar pada dokumen
    HTML tag yang digunakan adalah
    <img src=nama_gambar.ekstensi>
    Tag
    Atribut
    Value

    = Img
    = Src
    (untuk pencarian
    gambar)
    = nama
    gambar
    beserta
    ekstensi
    nya
    semisal
    gambar.jpg

    Hyperlink
    11

    Digunakan untuk memberi tautan ke halaman web


    lainnya.
    <a href=hal2.html>Menuju Hal 2</a>
    Tag
    Atribut

    = a (anchor)
    = href (menyatakan halaman
    tujuan dari link tersebut)

    12

    Anda mungkin juga menyukai