Contoh elemen : head, body, title, paragraf, dan list.
Elemen
Element terdiri atas tiga bagian, yaitu tag pembuka, isi, dan tag penutup. Sebagai contoh untuk menampilkan judul dokumen HTML pada web browser digunakan element title, dimana:
<title> ini adalah tag pembuka judul dokumen HTML
Disini Judul Dokumen HTML ini adalah isi judul dokumen HTML
</title> ini adalah tag penutup judul dokumen HTML
Tag-tag yang ditulis secara berpasangan pada suatu element HTML, tidak boleh saling tumpang tindih dengan pasangan tag-tag lainnya.
Untuk membuat paragraf digunakan tag
Elemen
Element terdiri atas tiga bagian, yaitu tag pembuka, isi, dan tag penutup. Sebagai contoh untuk menampilkan judul dokumen HTML pada web browser digunakan element title, dimana:
<title> ini adalah tag pembuka judul dokumen HTML
Disini Judul Dokumen HTML ini adalah isi judul dokumen HTML
</title> ini adalah tag penutup judul dokumen HTML
Tag-tag yang ditulis secara berpasangan pada suatu element HTML, tidak boleh saling tumpang tindih dengan pasangan tag-tag lainnya.
Element HEAD Merupakan kepala dari dokumen HTML. Tag <head> dan tag </head> terletak di antara tag <html> dan tag </html>.
Sintaks:
<head>
...........
</head>
Element BODY
Element ini untuk menampilkan isi dokumen HTML. Tag <body> dan tag </body> terletak di bawah tag <head> dan tag </head>.
Element BODY mempunyai attribute-attribute yang menspesifikasikan khususnya warna dan latarbelakang dokumen yang akan ditampilkan pada browser.
Element ini untuk menampilkan isi dokumen HTML. Tag <body> dan tag </body> terletak di bawah tag <head> dan tag </head>.
Element BODY mempunyai attribute-attribute yang menspesifikasikan khususnya warna dan latarbelakang dokumen yang akan ditampilkan pada browser.
Sintaks:
<body text="v" bgcolor="w" background="uri" link="x" alink="y" vlink="z">
..............
</body>
Element TITLE Merupakan judul dari dokumen HTML yang ditampilkan pada judul jendela browser. Tag <title> dan tag </title> terletak di antara tag <head> dan tag </head>.
Sintaks:
<title>Paragraf
.........
</title>
<P>. Setelah tag <P> Anda bisa menulis isi paragraf dan paragraf tersebut harus diakhiri dengan penutup </P>. Anda bisa mengatur posisi paragraf dengan attribut ALIGN. Atribut ALIGN diikuti dengan posisi yang diinginkan.LEFT untuk rata kiri, CENTER untuk rata tengah dan RIGHT untuk rata kanan.Atribut
Atribut merupakan informasi tambahan yang dapat kita berikan untuk sebuah elemen. Setiap elemen memiliki atribut yang berbeda-beda, meskipun terdapat beberapa atribut standar yang dapat digunakan oleh semua elemen.
Atribut khusus elemen dibuat ketika nilai atribut tersebut memang hanya pantas digunakan untuk elemen tersebut. Misalnya, untuk elemen
img yang digunakan untuk menampilkan gambar, terdapat atribut untuk menentukan di mana sumber gambar yang akan ditampilkan di simpan. Atribut ini tentunya tidak akan berguna untuk elemen p, yang hanya menampilkan teks.
Atribut standar yang dimiliki oleh semua elemen sendiri merupakan atribut yang umumnya dapat diimplementasikan oleh semua elemen, misalnya atribut “id” untuk identifikasi elemen, atau “class” untuk klasifikasi elemen.
Kode di bawah menunjukkan contoh elemen
a yang digunakan dengan atribut wajib elemen tersebut (href):<a href=``http://www.bertzzie.com''>Ini adalah sebuah link</a>
Kode di atas memberikan contoh atribut
href yang dimiliki oleh elemen a. Atribut ini berguna untuk memberikan referensi hyperlink dari sebuah elemen (karenanya namanya “href” - hyperlink reference). Atribut-atribut yang dimiliki oleh tiap-tiap elemen akan dibahas lebih lanjut ketika pembahasan dari sebuah elemen dilakukan.
Tag
HTML
Adalah teks khusus (markup) berupa dua karakter "<" dan ">", sebagai contoh <body> adalah tag dengan nama body. Secara umum tag ditulis secara berpasangan, yang terdiri atas tag pembuka dan tag penutup (ditambahkan karakter "/" setelah karakter "<"), sebagai contoh <body> ini adalah tag
pembuka isi dokumen HTML, dan </body> ini adalah tag penutup isi dokumen HTML.
pembuka isi dokumen HTML, dan </body> ini adalah tag penutup isi dokumen HTML.
Syarat
Penulisan Tag HTML
• Tag html diapit dua karakter kurung sudut
• Tag html secara normal selalu berpasangan
• Tag html tidak case sensitive
• Tag akhir tidak boleh bersilang dan harus
berurutan.
TAG-TAG
DASAR HTML
• <html>Mendefinisikan bahwa dokumen HTML
• <head> tentang dokumen web yang ditampilkan
• <title> untuk menuliskan judul dari dokumen
HTML
• <body> untuk section utama dalam dokumen
HTML
• <p> Paragraf
• <br> Line Break atau ganti baris
• <h1>s/d<h6> Heading untuk judul dan
sub judul
• <hr> Penggaris Mendatar align:[left | center| right] default center, size:pixel(tebal
garis, default 2) width:panjang(lebar garis, pixel atau persen,
default 100%) noshade (garis solid)
• <!-- komen di html --> Komentar pada HTML
Contoh struktur kode HTML :
<html>
<head>
<title> Judul </title>
<meta name="description" content="tulis penjelasan singkat tentang situs anda">
<meta name="keyword" content="tulis kata kunci">
</head>
<body>
isi halaman anda
</body>
</html>
Contoh ini mungkin sangat mendasar dan tentu saja anda tidak puas dengan ini. Masih banyak kode-kode source lainnya untuk bisa menampilkan sebuah halaman web supaya lebih cantik dan seperti yang kita inginkan. Saatnya anda mulai untuk menyiapkan diri baik fisik maupun mental yang siap untuk untuk memepelajari html ini.
Mengenal Struktur HTML Dasar
Jika anda benar-benar sangat pemula, maka setidaknya anda harus mengerti dan mengetahui contoh dan strukturnya si HTML ini. Secara dasar, anda bisa melihat bagaimana struktur HTML tersebut seperti dibawah ini.
Contoh Halaman Web dengan Bahasa HTML dasar:
<html>Dari struktur tersebut terlihat jelas bahwa sebuah HTML. Menampilkan tulisan pada halaman website dengan menggunakan kode-kode atau source. Dimana Kode source HTML tersebut tidak akan ditampilkan pada browser (tidak terlihat pleh si pembaca), namun kode2 HTML inilah yang akan memerintahkan browser untuk menampilkan seperti apa halaman yang kita buat. Seperti kode source diatas jika ditampilkan maka akan terlihat:
<head>
<title>Judul Belajar TML Pemula</title>
</head>
<body>
Selamat pagi pemirsa, nama saya pemula. Saya mau belajar agar pintar HTML. dimanakah tempat belajar HTML yang terlengkap, terbaik dan pas buat saya?
</body>
</html>
Title = Judul Belajar TML Pemula
Isi = Selamat pagi pemirsa, nama saya pemula. Saya mau belajar agar pintar HTML. dimanakah tempat belajar HTML yang terlengkap, terbaik dan pas buat saya?
Contoh ini mungkin sangat mendasar dan tentu saja anda tidak puas dengan ini. Masih banyak kode-kode source lainnya untuk bisa menampilkan sebuah halaman web supaya lebih cantik dan seperti yang kita inginkan. Saatnya anda mulai untuk menyiapkan diri baik fisik maupun mental yang siap untuk untuk memepelajari html ini.
FORMAT KARAKTER
Format terhadap karakter yang di tampilkan akan sangat berguna untuk membuat sebuah dokumen HTML yang menarik. Pemformatan karakter mencakup beberap hal:
• Logical Format akan menerapkan layout dokumen secara logis dan terstruktur.
• Physical format adalah format terhadap fisik suatu font.
LOGICAL FORMAT
Tag-tag yang termasuk logical format adalah sbb:
• <cite> untuk menandai suatu kutipan (citation)
• <code> untuk menampilkan kode-kode program
• <em> untuk memberi tekanan pada teks (emphasize)
• <kbd> untuk menandai suatu teks yang harus dimasukkan oleh user melaui keyboard
• <samp> untuk menandai suatu teks yang dimaksudkan sebagai contoh
• <strong> untuk menandai bagian yang terpenting dari suatu teks
• <var> untuk menampilkan nama variabel
• <dfn> untuk menandai sebuah subdefinisi dari daftar definisi.
Tag berikut untuk memasukkan gambar format .jpg dan caption-nya:
<img scr= »/files/XXXX XXXXX.jpg » title= »CAPTION (CREDIT) » alt= »CAPTION CREDIT) »>
Berbagai tag yang lebih panjang dapat memasukkan audio, foto, dan video. Demikianlah, sharing platforms menyediakan embedding code yang juga berupa HTML untuk di-copy dan di-paste dalam konten anda sendiri.
PHYSICAL FORMAT
Tag-tag yang termasuk logical format adalah sbb:
• <b> untuk menampilkan huruf tebal
• <i> untuk menampilkan huruf miring
• <u> untuk menampilkan garis bawah pada teks
• <tt> untuk menmpilkan huruf seperti huruf mesin ketik
• <strike> untuk menampilkan garis horizontal pada bagian tengah huruf
• <big> untuk menampilkan ukuran huruf yang lebih besar
• <small> untuk menampilkan ukuran huruf yang lebih kecil
• <sub> untuk menampilkan subscript
• <sup> untuk menampilkan superscript(di cetak naik)
FORMAT TEKS BLOCKQUOTE
• Fungsinya browser akan menampilkan teks menjorok ke dalam PERFORMATTED TEXT <PRE>
• Fungsinya untuk menampilkan teks sama seperti yang ada ketikkan dalam dokumen HTML
LIST
List item merupakan perintah yang di gunakan dalam HTML untuk membuat daftar atau pengelompokkan kata [list].
Unordered List (Bullet)
• <ul>: Digunakan membuat list dengan tanda bullet. Type Atribut yang menyertai yaitu:
– Circle (Default)
– Disc
– Square
Ordered List (Numbering)
• <ol> : Digunakan membuat list dengan numbering. Type atribut yang menyertai:
I : Menggunakan romawi huruf besar
i : Menggunakan romawi huruf kecil
a : Menggunakan abjad huruf kecil
A : Menggunakan abjad huruf besar
1 : Default
1.
Link
HTML
Dokumen HTML menggunakan hyperlink
(anchor) untuk menghubungkan kepada dokumen lain. Dokumen ini bisa berupa teks
dan / atau gambar yang saling menghubungkan menuju ke dokumen atau bagian lain
dalam suatu dokumen. Browser web akan menyorot teks atau gambar yang di identifikasi
sebagai link dengan warna atau garis bawah untuk menunjukkan bahwa itu adalah
hyperteks link sering di singkat hyperlink atau link saja.
Link
html terdapat 3 jenis yaitu diantaranya sebagai berikut:
·
Link
Relatif
Dibuat
apabila anda membuat suatu link pada page anda ke page lain pada komputer yang
sama, tidak memerlukan menggunakan alamat internet yang lengkap.
·
Link
Absolut
Dibuat
apabila anda membuat link ke page web lain yang berada pada web site lain di
internet. Dalam hal ini anda harus menuliskan alamat internet secara lengkap.
·
Link
ke Bagian Lain dalam Dokumen
Link
jenis ini di buat untuk dokumen yang panjang sekali, sehingga apabila di
tampilkan dalam browser web akan mengharuskan kita melakukan scroll layar
berulang-ulang. Navigasi untuk penelusuran dokumen dapat dimudahkan dengan
membuat link antarbagian, dengan menandai setiap bagian tersebut dengan
memberinya nama.
Bagaimana, apakah anda sudah siap Belajar HTML?
Pertanyaan ini sederhana tapi cukup semangat. Ini tentu saja adalah keinginan seorang pemula untuk bisa belajar HTML. lalu dimanakah kita bisa mempelajarinya?
Tempat belajar HTML terlengkap dan benar-benar bisa membuat anda lebih dalam untuk pintar bahasa pemograman web adalah di www.w3schools.com/html/ atau bisa juga di www.w3.org/html/.
Written by Unknown
We are Creative Blogger Theme Wavers which provides user friendly, effective and easy to use themes. Each support has free and providing HD support screen casting.
0 komentar:
Posting Komentar