Assalamualaikum Wr. Wb.
Selamat datang di blog saya ini. Ini merupakan
postingan ketiga saya di blog ini. pada kesempatan kali ini saya akan
membahas apa itu HTML. silahkan langsung di baca saja. semoga bisa
dimengerti dan di pahami. silahkan berkomentar jika ada kesalahan/kekurangan atau
ada yang kurang di mengerti. trimakasih
<HTML>
○PENGERTIAN
HyperText Markup Language
(HTML) adalah sebuah bahasa markah yang digunakan untuk membuat sebuah
halaman web, menampilkan berbagai informasi di dalam sebuah penjelajah web
Internet dan pemformatan hiperteks sederhana yang ditulis dalam berkas format
ASCII agar dapat menghasilkan tampilan wujud yang terintegerasi. Gampangnya
HTML adalah bahasa dasar dalam pembuatan halaman web, lebih tepatnya sebenarnya
HTML digunakan untuk melayout dan mengintegrasikan antara halaman web yang satu
dengan halaman web yang lainnya, sementara agar tampilan web dapat menjadi
lebih bagus dan menarik biasanya dipadukan dengan bahasa CSS (Cascading Style Sheets) yang
berfungsi untuk mengatur style content pada halaman web.
Bermula dari sebuah bahasa yang
sebelumnya banyak digunakan di dunia penerbitan dan percetakan yang disebut
dengan SGML (Standard Generalized Markup Language), HTML adalah sebuah
standar yang digunakan secara luas untuk menampilkan halaman web. HTML saat ini
merupakan standar Internet yang didefinisikan dan dikendalikan penggunaannya
oleh World Wide Web Consortium (W3C).
○KEGUNAAN
ü Mengintegerasikan gambar dengan
tulisan.
ü Membuat Pranala.
ü Mengintegerasikan berkas suara dan rekaman gambar hidup.
ü
Membuat
form interaktif.
○MACAM2
TAG HTML
Tag Utama
|
||
<html>
|
Awal pernyataan sebuah dokumen
HTML
|
|
<head>
|
Kepala suatu halaman web (hukumnya
wajib)
|
|
<title>
|
Membuat judul halaman(ditempatkan
di dalam <head>
|
|
<body>
|
Membuat body HTML / badan halaman
web
|
|
Modifikasi Teks
|
||
<b>
|
Membuat teks tebal
|
|
<i>
|
Membuat teks miring
|
|
<u>
|
Membuat garis bawah pada teks
|
|
<sub>
|
Subscrip teks
|
|
<sup>
|
Suppersript teks
|
|
<h1>
|
Heading 1 pada teks (menentukan
ukuran berdasarkan heading)
|
|
<h2>
|
Heading 2 pada teks (menentukan
ukuran berdasarkan heading)
|
|
<h3>
|
Heading 3 pada teks (menentukan
ukuran berdasarkan heading)
|
|
<h4>
|
Heading 4 pada teks (menentukan
ukuran berdasarkan heading)
|
|
<h5>
|
Heading 5 pada teks (menentukan
ukuran berdasarkan heading)
|
|
<h6>
|
Heading 6 pada teks (menentukan
ukuran berdasarkan heading)
|
|
<strong>
|
Menjadikan teks besar
|
|
<small>
|
Menjadikan teks kecil
|
|
Formating
|
||
<ul>
|
Membuat list teks dengan bullet
|
|
<ol>
|
membuat list teks dengan penomoran
|
|
<li>
|
Membuat list teks (diletakan
setelah <ul> atau <ol>
|
|
<p>
|
Menyatakan suatu paragraf baru
|
|
<br>
|
Untuk ganti baris pada teks
|
|
<hr>
|
Membuat garis horizontal
|
|
<link>
|
menentukan sumber link
|
|
Tabel
|
||
<table>
|
Membuat tabel
|
|
<td>
|
Membuat cell tabel
|
|
<tr>
|
Membuat baris / row table
|
|
<tfoot>
|
Membuat footer tabel
|
|
<th>
|
Membuat header tabel
|
|
<thead>
|
Membuat header tabel
|
|
<tbody>
|
Mengatur Body tabel
|
|
<col>
|
Atribut pada tabel untuk mengatur
kolom
|
|
<colgroup>
|
Membuat grup kolom
|
|
Form
|
||
<form>
|
Untuk membuat Form / Formulir
|
|
<input type = >
|
Form inputan
|
|
“text”
|
Input field
|
|
“submit”
|
Tombol
|
|
“checkbox”
|
Check Box
|
|
“radiobutton”
|
Radio Button
|
|
<select name>
|
Membuat List/Menu (combo box)
|
|
<textarea>
|
Membuat teks area (untuk
menampilkan teks)
|
|
Perkembangan HTML saat ini telah
mencapai pada bahasa HTML5 yang baru dikeluarkan pada tahun 2011, dimana di
dalamnya terdapat tag-tag baru yang berfungsi agar dalam membuat halaman web
lebih mudah dan singkat, boleh dibilang agar lebih simple. Berikut adalah
beberapa tag baru tang disediakan HTML5 :
<article>
|
Membuat content artikel
|
<aside>
|
Membuat sidebar pada halaman web
|
<audio>
|
Menambahkan file audio pada
halaman web
|
<datalist>
|
Membuat dropdown list
|
Menyisipkan sesuatu dari luar
halaman web
|
|
<footer>
|
Membuat area footer pada halaman
web
|
<header>
|
Membuat area header pada halaman
web
|
<hgroup>
|
Heading group, membuat grup untuk
beberapa heading
|
<nav>
|
Membuat area navigasi
|
<source>
|
Menentukan sumber media
|
<time>
|
Menampilkan waktu pada halaman web
|
<video>
|
Menambahkan file Video pada
halaman web
|
○CARA MEMBUAT PROGRAM HTML
tag <>
digunakan untuk menuliskan sintak, ada dua jenis, yaitu tag container dan tag biasa.
Tag container adalah tag yang berisi text yang akan ditampilkan setelah tag ditutup. Contoh: <td> text yang ditampilkan </td>.
Tag biasa, yahh…tag aja, contoh <BR> (break). <br> kaga perlu ditutup oleh tag </br>, tapi jika sintak yang digunakan tag container, contoh: <h1>, yah mesti ditutup dengan </h1>.
Tag yang digunakan untuk mengakhiri sintak punya karakter / (slash) sebelum sintaknya, contohnya: <td> </td>
Kita juga dapat mengetik attribut di dalam sebuah tag, contoh: <body bgcolor=”red”> </body>. atau <input type=”text”>.
LANGKAH 1
* MEMBUKA NOTEPAD.
LANGKAH 2
* MENGETIKKAN SINTAK/SYNTAX.
Berikut ini adalah syntax dasar yang membentuk suatu HTML.
pertama, ketikkan
<html>
tekan enter, kemudian ketik
<head>
Dalam container head, kita bisa mengetikan beberapa sintak, tapi yang paling penting jangan lupa mengetikan sintak <title> judul halaman web </title>. Untuk sintak lain nanti saja.
Sekarang ketikkan sintak title tadi, jadi seperti ini:
<head> <title> judul halaman web </title> </head>
Kemudian ketikkan <body>. Tag body merupakan badan/tubuh/inti dari halaman web, tampilan web yang kita lihat itu berasal dari <body>.
Body tuh tag container, jadi mesti ditutup. Hasil sampai sekarang:
<html>
<head>
<title> Judul Halaman Web </title>
</head>
<body>
</body>
?
Selanjutnya bagaimana cara menampilkan tulisan ke dalam HTML??? Ketikan sembarang text ke dalam tag body, contohnya seperti ini :
<body>
Contoh text yang ditampilin di halaman web, By: C.H.I.P. Sensei
</body>
terus, jika sudah, ketikkan </html>, script lengkapnya seperti ini :
<html>
<head>
<title> Judul Halaman Web </title>
</head>
<body>
Contoh text yang ditampilkan di halaman web, By: C.H.I.P. Sensei
</body>
</html>
kalo udah, sekarang save dengan nama dasarHTML.
kalo udah disave, buka data yang tadi di save.
<hr>
<marquee direction="up" behaviour="scroll"> what's up...?</marquee>
digunakan untuk menuliskan sintak, ada dua jenis, yaitu tag container dan tag biasa.
Tag container adalah tag yang berisi text yang akan ditampilkan setelah tag ditutup. Contoh: <td> text yang ditampilkan </td>.
Tag biasa, yahh…tag aja, contoh <BR> (break). <br> kaga perlu ditutup oleh tag </br>, tapi jika sintak yang digunakan tag container, contoh: <h1>, yah mesti ditutup dengan </h1>.
Tag yang digunakan untuk mengakhiri sintak punya karakter / (slash) sebelum sintaknya, contohnya: <td> </td>
Kita juga dapat mengetik attribut di dalam sebuah tag, contoh: <body bgcolor=”red”> </body>. atau <input type=”text”>.
LANGKAH 1
* MEMBUKA NOTEPAD.
LANGKAH 2
* MENGETIKKAN SINTAK/SYNTAX.
Berikut ini adalah syntax dasar yang membentuk suatu HTML.
pertama, ketikkan
<html>
tekan enter, kemudian ketik
<head>
Dalam container head, kita bisa mengetikan beberapa sintak, tapi yang paling penting jangan lupa mengetikan sintak <title> judul halaman web </title>. Untuk sintak lain nanti saja.
Sekarang ketikkan sintak title tadi, jadi seperti ini:
<head> <title> judul halaman web </title> </head>
Kemudian ketikkan <body>. Tag body merupakan badan/tubuh/inti dari halaman web, tampilan web yang kita lihat itu berasal dari <body>.
Body tuh tag container, jadi mesti ditutup. Hasil sampai sekarang:
<html>
<head>
<title> Judul Halaman Web </title>
</head>
<body>
</body>
?
Selanjutnya bagaimana cara menampilkan tulisan ke dalam HTML??? Ketikan sembarang text ke dalam tag body, contohnya seperti ini :
<body>
Contoh text yang ditampilin di halaman web, By: C.H.I.P. Sensei
</body>
terus, jika sudah, ketikkan </html>, script lengkapnya seperti ini :
<html>
<head>
<title> Judul Halaman Web </title>
</head>
<body>
Contoh text yang ditampilkan di halaman web, By: C.H.I.P. Sensei
</body>
</html>
kalo udah, sekarang save dengan nama dasarHTML.
kalo udah disave, buka data yang tadi di save.
<hr>
<marquee direction="up" behaviour="scroll"> what's up...?</marquee>
Silahkan di coba
#malasmencobasesatdijalan
0 komentar:
Posting Komentar