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 ^-^
0 Komentar