Pengenalan HTML

1.1.
Pengenalan HTML
HTML atau HyperText Markup Language merupakan salah satu format yang digunakan dalam pembuatan dokumen dan aplikasi yang berjalan dihalaman web. HTML adalah file text murni yang dapat dibuat dengan editor text apapun. Dokumen ini dikenal sebagai web page, dokumen HTML merupakan dokumen yang disajikan pada web browser. Ada dua cara dalam menulis sebuah dokumen HTML yang nantinya mejadi sebuah halaman browser. Yang pertama menggunakan HTML editor atau Web editor, dan yang kedua menggunakan teks editor biasa seperti menggunakan notepad.
Saat ini sudah banyak sekali paket aplikasi yang dapat digunakan untuk membuat halaman web secara WYSIWYG ( What You See Is What You Get ) seperti FrontPage,Dreamweaver dan lain sebagainya, Anda tetap harus menguasai tag-tag HTML terutama yang dipergunakan untuk membuat aplikasi di internet kerena mau tidak mau Anda akan bekerja dalam mode text editor bilamana hendak menyisipkan setiap script HTML.



1.1.1.
Dokumen HTML dan penamaan HTML
Dalam penamaan sebuah dokumen yang akan ditampilkan pada web browser maka nama yang digunakan harus diakhiri dengan ektensi (.html) atau (.htm). Ekstensi dokumen HTML awalnya 3 karakter, adalah untuk mengakomodasi sistem penamaan dalam DOS. Dalam pemberian nama sebuah dokumen bersifat case sensitive sehingga dokumen dengan nama a.html akan berbeda dengan dokumen A.html.
Sebelum lebih jauh mempelajari tag-tag HTML ada baiknya terlebih dahulu melihat kode warna yang sering digunakan di penulisan tag-tag HTML. Pengaturan warna dihalaman HTML menggunakan mode kombinasi RGB (red, green, blue) yang mana setiap warna ditampilkan dalam dua digit nilai heksadesimal (0,1,2,...F).Setiap bagian dua digit kode menunjukkan banyaknya intensitas dari kombinasi warna merah, hijau dan biru. Sebagai contoh 00 pada 2 digit pertama berarti tidak ada warna merah dan seterusnya.
Warna
Heksadesimal
White
#FFFFFF
Black
#000000
Red
#FF0000
Green
#00FF00
Blue
#0000FF
Magenta
#FF00FF

1.1.2.
Definisi Elemen dan Tag HTML
Sebuah dokumen HTML disusun oleh beberapa Elemen atau lebih dikenal dengan komponen-komponen dasar. Elemen dapat berupa teks murni, atau bukan teks, atau keduanya. Elemen atau komponen tersebut misal head, body, paragraf, list dll.
Untuk menandai sebuah elemen dalam suatu dokumen HTML digunakan tag. Tag HTML terdiri dari sebuah kurung sudut kiri (<,lebih kecil), nama tag, kurung sudut kanan(>,lebih besar), contoh

, tag pada umumnya berpasangan (misalnya

dengan

), tanda / pada tag pasangan memberikan tanda bahwa tag tersebut merupakan pembatas akhir elemen yang dibuka oleh tag awal.
Nama elemen ditunjukkan oleh nama dari tagnya. Suatu elemen biasanya ditandai dengan pasangan tag, walaupun ada beberapa nama elemen yang ditandai dengan satu tag tanpa harus berpasangan. Diantaranya adalah:
􀀹
Paragraf tagnya


􀀹
Ganti baris – line break tagnya

􀀹
Garis datar – horizontal rule tagnya



􀀹
List item tagnya

  • Jadi secara umum penulisan sebuah tag adalah ... selain itu dalam penamaan tag tidak menganut case sensitive.
    Dalam pembuatan dokumen HTML elemen dasar yang harus dimiliki adalah tag html, tag body dan tag head. Elemen head berisi informasi tentang dokumen, sedangkan elemen body berisi teks dan atau elemen lainnya. Atau lebih jelasnya sebagai berikut:


    ....informasi dokumen....


    ....informasi yang di tampilkan
    pada halaman browser.....


    1.1.3.
    Penggunaan Tag dan Atribut Tag
    Dalam pembuatan dokumen HTML penulisan elemen yang diawali dan diakhiri tanda tag HTML, memiliki syarat penulisan yaitu:
    􀂾
    Tag HTML diapit dengan dua karakter kurung sudut ( < dan > )
    􀂾
    Tag HTML secara normal selalu berpasangan misal (...)

    􀂾
    Tag pertama dalam suatu pasangan adalah tag awal, dan tag yang kedua merupakan tag akhir.
    􀂾
    Tag html tidak ‘case sensitive’. sama dengan
    􀂾
    Jika dalam suatu tag ada tag lagi, maka penulisan tag akhir tidak boleh bersilang harus berurutan. Misalnya ..Tebal dan Miring..
    Tag dapat mempunyai atribut. Atribut menyatakan sesuatu tentang tag tersebut. Atribut digunakan untuk mengubah default pemformatan dokumen dengan tag yang bersangkutan.
    Tag berikut tidak mempunyai atribut: .Tag ini tidak menggunakan atribut, sehingga dokumen HTML ditampilkan sebagaimana default dari tampilan HTML.
    Tag . Maka tag ini memiliki atribut berupa warna background merah.Secara umum tag dengan atributnya adalah
    isi
    1.2.
    Tag-tag Dasar HTML
    1.2.1.
    HTML
    Merupakan tag dasar yang mendifinisikan bahwa dokumen adalah dokumen html. Tag ini merupakan suatu keharusan bagi pemrogram web untuk menuliskannya sebagai tag pertama dalam dokumen html.Penulisan tag seperti berikut ini :
    pada awal dokumen dan pada akhir dokumen
    1.2.2.
    Head
    Merupakan tag berkutnya setelah tag html, digunakan untuk menuliskan keterangan tentang dokumen web yang akan ditampilkan. Penulisan tag seperti berikut ini :
    di awal setelah dan di akhir section head.
    1.2.3.
    Tittle
    Merupakan tag di dalam head yang digunakan untuk menuliskan judul dari dokumen html, yang akan muncul pada caption halaman browser jika halaman tersebut di akses. Penulisan tag seperti berikut ini :
    Judul Dokumen
    1.2.4.
    Body
    Merupakan section utama dalam dokumen web. Pada section ini semua isi dokumen yang akan ditampilkan di dalam browser harus dituliskan.

    di awal setelah dan di akhir sebelum
    Sebagai latihan, ketiklah script HTML berikut ini, kemudian simpan pada folder Anda masing-masing.Atribut elemen body :
    background : latar belakang image dokumen
    bgcolor : warna latar belakang dokumen, default putih
    text : warna teks dokumen, default hitam
    link : warna link dokumen, default biru
    vlink : warnavisited link dokumen, default ungu
    alink : warna active link dokumen, default merah
    Latihan 1.html


    Ini Bagian Tittle


    Disini bagian isi


    Kemudian untuk mencobanya, Anda dapat langsung mencoba Internet Explorer, cukup dengan perintah File – Open , kemudian browse nama file dana lokasi dimana file HTML tadi disimpan.
    tittle
    body

    Sebagai latihan, buatlah script HTML untuk hasil seperti berikut ini :
    1.2.5.
    Heading
    Tag heading(hx) digunakan untuk memformat heading (judul dan sub judul ) dari suatu halaman web. Heading ini akan memperbesar ukuran huruf untuk setiap jenis heading.Ada enam buah heading yang dikenal HTML, yaitu dari (h1) sampai dengan (h6).Sebagai latihan, ketiklah latihan berikut dan jalankan dibrowser Anda.
    Latihan 2.html


    Latihan 5


    Ini Heading 1


    Ini Heading 2


    Ini Heading 3


    Ini Heading 4


    Ini Heading 5

    Ini Heading 6




    1.2.6.
    Horisontal Ruler
    Tag Horisontal ruler
    berfungsi untuk menampilkan garis horizontal tiga dimensi didalam halaman web Anda. Tag horizontal ruler juga tidak memerlukan elemen penutup .
    Atribut elemen horisontal ruler :
    align : [ left | center | right ] default center
    size : pixel ( tebal garis, default 2 )
    width : panjang ( lebar garis, pixel atau persen, default 100%)
    noshade ( garis solid )
    Latihan 3.html


    Latihan 3


    ::- NAZNEEN BOOKSTORE ONLINE -::







    1.2.7.
    Paragraph
    Tag paragraph

    berfungsi layaknya untuk pengaturan antar paragraf dalam halaman web Anda. Dalam elemen paragraf terdapat atribut : align=[ left | center | right ] yang berfungsi sebagai pengatur perataan paragraf, jadi Anda cukup memilih salah satu dari ketiga pilihan tanpa harus memberi kurung buka dan tutup, dan defaultnya adalah left. Anda dapat memilih perataan kiri, tengah dan kanan. Sebagai latihan bukalah Latihan 3.html yang sudah Anda buat, kemudian tambahkan script-script berikut dan simpan dengan nama Latihan 4.html.
    Latihan 4.html


    Latihan 3


    ::- NAZNEEN BOOKSTORE ONLINE -::




    Kami menyediakan :


    Alat Tulis


    Pensil





    1.2.8.
    Break
    Tag Break
    berfungsi untuk memberikan baris baru suatu paragraf dalam halaman web Anda. Tag break tidak memerlukan tag penutup break. Bukalah Latihan 4.html yang sudah Anda buat, kemudian tambahkan script-script berikut dan simpan dengan nama Latihan 5.html.
    Latihan 5.html


    Latihan 3


    ::- NAZNEEN BOOKSTORE ONLINE -::




    Kami menyediakan :


    Alat Tulis


    Pensil
    Ballpaoint
    Penggaris
    Buku Gambar
    Dan Lain-lain


    Buku-Buku Pelajaran


    Ilmu Pengetahuan Alam
    Ilmu Pengetahuan Sosial
    Bahasa Jawa
    Bahasa Inggris
    Dan Lain-lain





  • 0 komentar:

    Posting Komentar

     

    Pengikut