Struktur Dasar HTML dan Tag-tag yang digunakan di html
Pengertian HTML
HTML kependekan dari Hyper Text Markup Language. Dokumen HTML adalah file text murni
yang dapat dibuat dengan editor teks sembarang. Dokumen ini dikenal sebagai web page. File-file HTML
ini berisi instruksi-instruksi yang kemudian diterjemah oleh browser yang ada
di komputer client (user) sehingga isi informasinya dapat ditampilkan secara
visual dikomputer pengguna (user).
HTML dikenal sebagai bahasa yang digunakan untuk
menampilkan dokumen web. Yang bisa dilakukan dengan HTML yaitu :
1.
Mengontrol
tampilan dari web page dan contennya.
2.
Mempublikasikan
dokumen secara online sehingga bisa diakses dari seluruh dunia.
3.
Membuat
online form yang bisa digunakan untuk menangani pendaftaran, transaksi secara
online.
4. Menambahkan
obyek-obyek seperti image, audio, video dan juga jaya applet dalam dokumen
HTML.
Browser dan Editor
Ada dua cara untuk membuat sebuah web page yaitu
dengan HTML editor atau dengan editor text bisa (misalnya notepad atau
editplus). Untuk latihan atau mencoba materi sebaiknya menggunakan notepad,
setelah itu pada bagian mendekati akhir dapat menggunakan editor HTML, hal ini
dimaksudkan agar mudah memahami dan terbiasa secara primitif membuat dokumn
web. Sedangkan HTML editor dapat menggunakan software DreamWeaver. Software ini
merupakan salah satu software untuk mendesain website atau homepage, selain
software front page yang sering kita dengar.
Untuk melakukan penamaan dokumen maka pilih satu
nama, sembarang nama kemudian tambahkan sebuah ekstensi “.htm” atau “.html” (tanda
kutip tidak perlu ditulikan karena digunakan sebagai penjelas saja). Dan
dokumen HTML disusun oleh elemen-elemen. “Elemen” merupakan istilah bagi
komponen-komponen dasar pembentuk dokumen HTML. Beberapa contoh elemen adalah :
head, body, table, paragraf dan list. Elemen dapat berupa teks murni atau bukan
teks atau keduanya. Untuk itu komponen-komponen yang diperlukan dalam mendesain
web adalah :
1.
Sebuah
komputer yang siap web. Komputer dengan windows 95/98/NT, Mac atau Unix.
2.
Editor
text, notepad atau yang lainnya.
3.
Koneksi
ke server web (kalau mungkin koneksi ke internet).
4.
Browser
web, direkomendasi Internet Explorer atau Netscape Navigator.
5.
Langkah
berikutnya adalah surfing Internet, melihat-lihat website untuk mendapatkan dan
membangun ide dari apa yang dilihat.
Struktur dasar HTML
Elemen yang dibutuhkan untuk membuat suatu dokumen HTML, dinyatakan dengan
tag-tag sebagai berikut :
·
HTML
Setiap dokumen HTML selalu diawali dan ditutup dengan tag HTML.
·
HEAD
Bagian head biasanya berisikan tag TITLE, meta tag dan semua script java
atau yang lain yang akan dieksekusi di browser. Dibagian inilah kita memberikan
bookmark untuk keperluan pencarian (searching) dengan keyword.
·
BODY
Bagian body digunakan untuk menampilkan text, image link dan semua yang
akan ditampilkan pada web page.
Semua umum dokumen web dibagi menjadi dua section (bagian), yaitu section
head dan section body. Sehingga setiap dokumen HTML harus mempunyai pola dasar
sebagai berikut :
Setiap dokumen HTML harus diawali dengan
menuliskan tag <html> dan </html> diakhir dokumen. Tag ini menandai
elemen HTML, yang berarti dokumen ini adalah dokumen HTML. Dalam satu dokumen
hanya ada satu lemen HTML.
Section atau elemen head dimulai dengan tag
<head> diawal dan tag </head> diakhir. Section ini berisi informasi
tentang dokumen htmlnya. Minimal informasi yang dituliskan dalam elemen ini
adah judul dari dokumen, judul ini akan ditampilkan pada caption bar dari
window browser, ditandai dengan menggunakan tag <title> dan diakhiri
</title>. Sehingga bagian yang diapit oleh tag HEAD merupakan header dari
halaman HTML dan tidak ditampilan pada browser. Sedangkan tag TITLE yang berfungsi
untuk mengeluarkan judul pada title bar window web browser.
Section atau elemen body ditandai dengan tag
<body> diawal dan tag </body> diakhir. Section body merupakan
elemen terbesar didalam dokumen HTML. Pada bagian ini anda akan menuliskan
semua jenis informasi berupa teks dengan bermacam format maupun gambar yang
ingin disampaikan pada pengguna nantinya.
Baca Juga : Tutorial Blog SEO
Baca Juga : Tutorial Blog SEO
Tag-tag dalam <body>:
1. Warna latar belakang
Menggunakan warna
<body bgcolor=#nnnnnn>
. . . </body>
2. Menggunakan gambar
<body
background=”nama_file_gambar”> . . . </body>
3. Heading
Untuk judul atau sub judul dalam dokumen HTML
<h1
[align=”left”|”center”|”right”|> . . . </h1>
<h2
[align=”left”|”center”|”right”|> . . . </h2>
<h3
[align=”left”|”center”|”right”|> . . . </h3>
4. Paragraph
Untuk mengatur perataannya (kiri, tengah, kanan).
<p
[align=”left”|”center”|”right”|> . . . </p>
5. Preformatted
text
Untuk menampilkan teks sama seperti yang diketikkan dalam dokumen HTML :
<pre> . . .
</pre>
6. Block
quote
Untuk mempilkan teks sama seperti yang diketikkan dalam dokumen HTML
<blockquote> . . .
</blockquote>
7. Break
Untuk menulis teks pada baris berikutnya
<br>
8. Font
Ukuran font
<font size=”n”> . . .
</font>
Jenis font
<font size=”n”face=”jenis_font”>
. . . </font>
Warna font
<font
size=”n”face=”jenis_font” color=”warna”> . . . </font>
9. Untuk format
dokumen
Bold
<b> . . . </b>
Emphasized
<em> . . . </em>
Italic
<i> . . . </i>
Superscript
<sup> . . .
</sup>
Subsripted
<sub> . . .
</sub>
Struck trough
<del> . . .
</del>
10. Gambar
Untuk memuat gambar ke dalam halaman web
<img scr =”URL”|”name” height=”n” width=”n” align=”top”|”center”|”bottom”]/>
11. Untuk hypertext
link
Format
<a href=”address”> . .
. </a>
Link ke dokumen lain
<a
href=”nama_dokumen”> . . . </a>
Link ke bagian tententu dalam dokumen yang sama
<a href=”#target”> . .
. </a>
<a href=”target”> . .
. </a>
Link ke alamat URL atau WebSite
<a href=”alamat_URL”>
. . . </a>
Link ke alamat E-mail
<a
href=”malto:alamat_email”> . . . </a>
Link File yang akan didownload
<a href=”nama_file”> .
. . </a>
Semoga bisa bermanfaat gan ^-^
Semoga bisa bermanfaat gan ^-^
terimakasih atas infonya
ReplyDeleteelemen solder uap