Thursday, September 8, 2016

Menyajikan Format Teks dalam Dokumen Web

Dasar-Dasar HTML


HTTP (Hypertext transfer protocol) merupakan protokol yang digunakan untuk mentransfer data antara web server ke web browser. Protocol ini mentransfer dokumen-dokumen web yang ditulis atau berformat HTML (Hypertext Markup Language). Dikatakan markup language karena HTML berfungsi untuk ‘memperindah’ file teks biasa untuk ditampilkan pada program web browser hal ini dilakukan dengan menambahkan elemen atu sering disebut sebagai tag-tag pada file teks biasa tersebut.

Saat ini sudah dikenal HTML5 yang menawarkan berbagai fitur menarik yang tidak didukung oleh HTML sebelumnya. Beberapa fitur yang tersedia pada HTML5 antara lain sebagai berikut.
o Canvas. Memungkinkan pembuatan gambar dalam kanvas. Jadi, gambar tidak lagi diambil dari
   gambar utuh, melainkan bisa disusun sendiri, bak menggunakan program Paint.
o Header. Berguna untuk menyatakan suatu judul, yang bisa diisi dengan elemen logo dan nama
   perusahaan.
o Footer. Merupakan kebalikan dari header. Sebagai catatan kaki, elemen ini berguna untuk menaruh
   informasi di bagian bawah halaman web.
o Time. Elemen ini berguna untuk menyajikan informasi tentang waktu.
o Audio. Memungkinkan penyajian player untuk memutar suara.
o Video. Memungkinkan player untuk memainkan film.

Secara prinsip, fitur pada HTML dapat dikelompokkan ke dalam :
   o Struktur halaman ;
   o Presentasi visual ;
   o Peranti penyaji gambar ;
   o Pendukung media ; dan
Peningkatan koneksi dengan JavaScript.

Tag HTML biasanya berupa tag-tag yang berpasangan dan ditandai dengan symbol lebih besar (<) dan (>). Pasangan dari sebuah tag ditandai dengan symbol garis miring (/). Misalnya pasangan dari tag <contoh > adalah</contoh>. Dalam hal ini <contoh> kita sebut sebagai elemen dan biasanya dalam suatu elemen terdapat atribut-atribut untuk mengatur elemen itu. Jadi misalnya elemen <contoh> bila ditulis dengan atributnya adalah sebagai berikut:
<contoh atribut1=”nilai_atribut1”atribut2=”nilai_atribut2=”…>.
Dalam penulisan tag HTML tidaklah case sensitive artinya pengguna huruf kecil ataupun capital tidaklah menjadi masalah.


Struktur Dasar Dokumen HTML

Setiap dokumen HTML memiliki struktur dasar atau susunan file sebagai berikut :

Seperti terlihat, struktur file HTML diawali dengan sebuah tag<html> dan ditutup dengan tag </html>. Di dalam tag ini terdapat dua buah bagian besar, yaitu yang diapit oleh tag<head>…</head> dan tag <body>…</body>.

Bagian yang diapit oleh tag HEAD merupakan header dari halaman HTML dan tidak ditampilkan pada browser. Bagian ini berisi tag-tag header seperti <tittle>… </tittle> yang berpungsi untuk mengeluarkan judul pada tittle bar window web browser.

Bagian kedua, yang diapit ole tag BODY merupakan bagian yang akan ditampilkan pada halaman web browser nantinya. Pada bagian ini anada akan menuliskan semua jenis informasi berupa teks dengan bermacam format maupun gambar yang ingin sampaikan pada pengguna nantinya.


Pengaturan Properti Dokumen
Properti document diatur melalui atribut-atribut yang terdapat dalam elemen <body>. Sebagai contoh adalah pengaturan warna latar belakng halaman, wana teks, warna link dan lain-lain.

Kode Warna
Dalam pengaturan warna menggunakan kode RGB yang mana ditampilkan dalam nilai heksadesimal. Setiap bagian dua gigit kode menunjukkan banyaknya intensitas dari kombinasi warna merah, hijau dan biru. Sebagai contoh 00 pada dua digit pertama berarti tidak ada warna merah dalam kobinasi warna berikut ini adalah contoh kode warna :


Atribut Elemen <body>

BACKGROUND = Lokasi dan nama file (latar belakng dokumen image dokumrn)
BGCOLOR = Warna (warna latar belakng dokumen, default putih)
TEXT = Warna (warna teks dokumen, default hitam)
LINK = Warna (warna link dokumen, default biru)
VLINK = Warna (warna visited link dokumen, default ungu)
ALINK = Warna (warna aktif link dokumen, default merah)

Elemen Heading <h1>… <h6>
Tag heading berfungsi untuk memformat heading (judul dan sub-judul) dari suatu halam web. Heading ini akan memperbesar ukuran huruf unruk setiap jenis heading. Ad 7 buah heading yang dikenal di HTML, yaitu dari <h1> sampai <h6>.

Elemen yang dihilangkan di HTML5
Berikut ini elemen HTML 4.01 yang dihilangkan di HTML5:
  • <acronym>
  • <applet>
  • <basefont>
  • <big>
  • <center>
  • <dir>
  • <font>
  • <frame>
  • <frameset>
  • <noframes>
  • <strike>
  • <tt>

Dokumen HTML5
Sebuah dokumen HTML5 seperti berikut ini, cukup ditulis dengan Text Editor ataupun HTML 
Editor :

                                  <! DOCTYPE HTML>

                                  <html> 
                                               <head>
                                                      <title>Tes HTML5</title>
                                               </head> 
                                               <body>
                                                Selamat belajar HTML5
                                               </body> 
                                </html>



Berikut ini penjelasan dari dokumen HTML5 di atas :
    o Sebuah dokumen HTML5 diawali dengan <!DOCTYPE HTML>.
    o Tanda seperti <html> disebut tag. Sebuah tag seperti itu menyatakan sebuah elemen 
       dalam dokumen html.
    o Beberapa tag berpasangan. Sebagai contoh, <head> berpasangan dengan </head>.
    o Namun, tidak semua tag berpasangan. Sebagai contoh, <br> tidak punya pasangan. Khusus 
       untuk tag seperti ini, tidak ada keharusan untuk menyertakan tanda / sebelum >. Pada 
       XHTML, tanda seperti / memang diharuskan untuk ditulis.
    o Pasangan <html>..</html> menyatakan awal dokumen HTML.
    o Di dalam <html>..</html> terdapat pasangan <head>..</head> dan <body>..</body>.
    o Pasangan <head>..</head> menyatakan bagian judul dokumen HTML. Isinya paling tidak 
       berupa pasangan <tittle>..</tittle>.
    o Pasangan <body>..</body> menyatakan bagian tubuh dokumen. 
       Pada contoh,  Selamat belajar HTML 5
Muncul pada badan dokumen. Apabila dibuka di web browser tampilannya sebagai berikut :
Gambar Tampilan Dokumen HTML di Web Browser

Gambar berikut ini memperlihatkan penjelasan secara visual terhadap dokumen HTML di depan.
Gambar Penjelasan dokumen HTML

** Untuk selain HTML5 diwajibkan tidak menggunakan kode html ini "<!DOCTYPE HTML>" karena kode tersebut khusus HTML5 jika kode html tersebut digunakan maka, format HTML kalian buat akan bermasalah atau error


THANK'S FOR IS COMING MY BLOG   ^_^

No comments:

Post a Comment