Membuat web HTML
Dalam membuat web dengan format HTML kita harus
menggunakan program Notepad++ / notepad, tag pertama adalah tag <html>
dan di akhiri dengan </html>. tag <html> tag ini
merupakan tag standar pembentuk utama suatu halaman web. Tag tersebut akan
memberitahukan browser bahwa dokumen yang kita buat merupakan dokumen HTML. Dan
tag terakhir yang kita
jumpai adalah </html> tag tersebut akan memberi tahukan bahwa tag HTML
sudah selesai. Text diantara tag <head> dan tag </head> merupakan
tag informasi header, informasi tersebut tidak akan ditampilkan di browser
window.
Text
diantara tag <title> dan tag </title> merupakan title atau judul
dari sebuah dokumen. Text tersebut akan ditampilkan di browser’s caption.
Cara menampilkan text di browser
bisa menempatkan diantara tag <body> dan </body>, jadi tag tersebut
akan memberi tahu browser tentang isi dari dokumen tersebut.
1.membuat
judul web.
- Membuat background web
Membuat background ini bisa menggunakan
gambar,bisa menggunakan warna. Jika menggunakan
warna,sebagian ada yang menggunakan kode-kode warna yang telah ada dan sebagian
ada yang bisa haya dengan menuliskan warna apa yang bisa dibaca oleh html.
Untuk
membuatnya kita tempatkan ke tag body, pokoknya segala mengenai isi web nya
baik itu background,bentuk tulisan,font,gambar, dan lain-lain kita letakan di
tag body.
Contoh
beckground dengan warna biru muda seperti contoh web yang saya buat. Formatnya
<body bgcolor=”white and red”>
- Selanjutnya kita buat judul besar di web kita seperti contoh:
Judulnya bisa kita atur sesuai
keinginan kita,yaitu letak nya ditengah,warnanya kuning, font gaya tulisanya
juga ukuran hurufnya.
- Selanjutnya kita akan membuat garis tengah dibawah judul besar dengan warna biru, maka formatnya <HR aligh=center color=”blue” size=20>
·
Membuat
tulisan berjalan kita menggunakan rumus <MARQUEE> dan diakhiri dengan
</MARQUEE> contohnya:
isi
dari marquee itu rerserah kita mau kita bikin apa saja,di contohnya pada baris
pertama saya bikin UKM CYBERTECH dan
baris kedua POLITEKNIK NEGERI PADANG dengan warna dan font yang berbeda.- Selanjutnya kita akan membuat modifikasi teks pada dalam html.
untuk
membuat tulisan tebal formatnya <b> diakhiri dengan </b> untuk
memiringkan <i> diakhiri </i> untuk garis bawah <u> diakhiri
</u>.
Format
·
Heading
Sebagai contoh Heading didefinisikan dengan tag
<h1> hingga <h4> dengan tag <h1> merupakan heading terbesar.
Untuk melihat perbedaannya cobalah script berikut
·
Line Breaks
Tag <br> digunakan saat kamu ingin mengakhiri
suatu baris tapi tidak mau membuat paragraphs baru. Tag ini bisa kamu tempatkan
dimana aja.
·
Paragraphs
Dalam format text paragraf didefinisikan dengan
tag <p> cobalah tag berikut ini untuk mengetahui tag paragraphs:
- HTML List
Dalam dokumen HTML mendukung penggunaan list baik
list menggunakan angka (ordered list) ataupun list yang menggunakan simbol
(unordered list).
Unordered Lists
Unordered
list biasanya ditandani dengan lingkaran kecil berwarna hitam. Sebuah list yang
tidak terurut menggunakan tag <ul> dan setiap list item menggunakan tag
<li>
Ordered lists
Ordered
biasanya ditandai dengan angka, tag yang digunakan untuk membuat ordered list
adalah tag <ol> dan setiap item menggunakan <li>.
- HTML Table
Fungsi tabel dalam dokumen HTML sangatlah penting,
tabel bisa digunakan untuk mendisain lay out dari halaman web, atau hanya
sekedar untuk menampilkan data. Namun fungsi tabel yang paling sering digunakan
pada dokumen HTML adalah untuk membuat lay out design web. Dengan tabel kita
bisa mengatur tata letak elemen halaman web sehingga tampil menarik. Tabel
didefinisikan dengan tag <table> dan sebuah tabel dibagi dalam baris
dengan menggunakan tag <tr> dan kolom dengan menggunakan tag <td>.
Tag tr merupakan kependekan dari “table row” sedangkan td merupakan kependekan
dari “table data”. Dalam table data tersebut disebut sell, dan didalam sell
tersebut kita bisa memasukkan berbagai macam elemen dokumen html seperti: text,
images, lists, paragraphs, forms, dan table itu sendiri.
hasilnya
untuk tambahan lainnya;
- Hyperlink
Saat kita surfing didunia internet kita akan
sering berpindah-pindah halaman untuk membaca atau mencari informasi yang kita
butuhkan. Kita akan mengakses suatu halaman web dan kita harus berpindah ke
halaman baru untuk mengakses informasi lain.
- HTML Table
Fungsi tabel dalam dokumen HTML sangatlah penting,
tabel bisa digunakan untuk mendisain lay out dari halaman web, atau hanya
sekedar untuk menampilkan data. Namun fungsi tabel yang paling sering digunakan
pada dokumen HTML adalah untuk membuat lay out design web. Dengan tabel kita
bisa mengatur tata letak elemen halaman web sehingga tampil menarik. Tabel
didefinisikan dengan tag <table> dan sebuah tabel dibagi dalam baris
dengan menggunakan tag <tr> dan kolom dengan menggunakan tag <td>.
Tag tr merupakan kependekan dari “table row” sedangkan td merupakan kependekan
dari “table data”. Dalam table data tersebut disebut sell, dan didalam sell
tersebut kita bisa memasukkan berbagai macam elemen dokumen html seperti: text,
images, lists, paragraphs, forms, dan table itu sendiri.
Tabel and Atribute
Tabel mempunyai banyak atribut yang bisa
diterapkan untuk memformat tabel tersebut, atribut yang sering digunakan antara
lain:
Border :
menyatakan besarnya border dari sebuah tabel.
Cellpadding : jarak isi sell dari border-nya
Cellspacing : jarak antar sell
Width :
untuk menyatakan lebar tabel
Dan atribut-atribut lain yang biasa
diterapkan pada tag <body>
Sebagai contoh dibawah ini kita akan membuat tabel
dengan border 2, jarak isi dari border 2, jarak antar sell 2, dengan lebar
100%. Jika kita mengatur lebar tabel dengan nilai yang inherit (contoh: persen)
maka lebar tabel tersebut akan menyesuaikan dengan lebar window browser:
Tabel Heading
Heading dalam tabel didefinisikan dengan tag
<th> sebagai contoh:
Colspan dan rowspan,
colspan digunakan untuk menggabungkan beberapa
kolom menjadi satu kolom sedangkan rowspan digunakan untuk menggabungkan
beberapa baris menjadi satu baris, pada contoh dibawah ini kita akan membuat
tabel dengan 3 kolom dan 3 baris dimana terdapat 2 kolom yang digabungkan dan 2
baris yang digabungkan.
Definition Lists
Definition
list bukan merupakan list dari item. List ini menunjukkan penjelasan dari suatu
hal. Definition list dimulai dengan tag <dl> setiap hal yang akan
dijelaskan dimulai dengan tag <dt> dan setiap definition list (definisi)
dimulai dengan <dt>.
- HTML Forms and Input
HTML forms digunakan user untuk memberikan inputan
pada sebuah dokumen HTML. Inputan tersebut akan diproses sesuai dengan bahasa
pemrograman yang sesuai.
Forms
Form adalah sebuah area yang dapat berisi
element-element dari form. Elemet dari form memungkinkan user untuk memasukkan
informasi (seperti text fields, texarea fields, drop-down menus, radio buttons,
checkboxes, dsb.) pada sebuah form. Sebuah form didefinisikan dengan tag
<form>
Input
Tag form yang paling sering digunakan adalah input
tag <input>. Tipe input yang lebih spesifik dijelaskan lagi dengan
attribute. Dan yang biasanya dipake akan dijelaskan dibawah ini:
Text Fields
Text digunakan saat kamu ingin user memasukkan
huruf, angka, dsb dalam form :
Radio Buttons
Radio buttons digunakan untuk memberikan inputan
dengan jumlah yang terbatas. User hanya bisa memilih salah satu dari pilihan
yang ada.
Checkboxes
Kalo kita menginginkan user bisa memberikan
pilihan lebih dari satu maka kita bisa menggunakan checkboxes.
Submit Button
Saat user menekan tombol “Submit”, maka isi dari
form tersebut akan segera dikirimkan ke file yang dituju. Pada form terdapat
attribute yang dapat memberikan parameter kemana file tersebut akan dikirimkan.
Parameter yang biasa digunakan menggunakan “post” hal ini digunakan untuk
mengirimkan data.
Textarea
Pada contoh kali ini menggambarkan gimana membuat
text-area (input text yang mendukung banyak baris). User bisa menulis text pada
text area tersebut. Pada text-area user bisa menuliskan karakter yang tidak
terbatas:
·
Gambar pada HTML
Pada dokumen HTML, kita bisa memasukkan image
untuk memperindah tampilan.
Images didefinisikan dengan tag <img>, tag
ini merupakan tag yang kosong, artinya hanya bisa terdiri dari attribute dan
tidak harus ditutup. Untuk menampilkan sebuah image kamu memerlukan attribute
src (source).
Terimakasihhhhh,,,
Sumber;
pribadi dan tetangga sebelah J .. please comment!!
