PENGENALAN HTML



Apa dan mengapa belajar HTML


HTML atau Hyper Text Markup Language merupakan sebuah bahasa markah untuk membuat halaman web , HTML akan memberitahu komputer bagaimana untuk menampilkan sebuah halaman web. .HTML adalah bahasa pertama yang harus dipelajari jika ingin menjadi seorang Developer karena  Setiap halaman web ditulis dalam bahasa yang disebut HTML jadi dengan kata lain  HTML merupakan bahan dasar seseorang untuk membuat web.Kita juga Bisa menyebutnya kerangka yang memberi struktur penanda atau markah pada halaman Web.pada tahap awal nanti kita akan belajar menggunakan HTML untuk membuat paragraph ,judul , gambar dan link pada halaman web.

Bab pelajaran dasar dari HTML diharapkan kita bisa mempelajari daripada hal berikut :• Menggunakan editor teks untuk penulis HTML dokumen.• Dapat menggunakan tag dasar untuk menandakan paragraf, penekanan atau khusus tipe.• Membuat hyperlink lain dokumen.• Membuat email link.• Menambahkan gambar untuk Anda dokumen.• Menggunakan meja untuk tata letak.• Menerapkan warna untuk HTML Anda dokumen.

Catatan :

HTML adalah singkatan dari Hyper Text Markup bahasaFile HTML adalah file teks yang berisi markup kecil TagMarkup Tag memberitahu Web browser bagaimana untuk menampilkan halamanFile HTML harus memiliki htm atau html file extension

Membuat file HTML
Satu hal untuk membantu ddalam belajar adalah kita harus  menghindari penggunaan pengolah kata (seperti Microsoft Word) untuk authoring dokumen HTML .Anda Untuk membuat File HTML kita dapat menggunakan text editor seperti notepad, Sublims text,atom , Vim atau Text editor lainnyadan akan lebih baik Lebih baik jika kita menggunakan teks editor yang memiliki fitur syntax highlighter. File HTML disimpan dengan ekstensi html atau htm.

Berikut adalah isi dari html  :

Tag, Atribut dan Elemen : Hal-hal yang membuat HTML.
Judul halaman                 : Judul. Untuk Pages. Sebuah konsep yang sulit, kita tahu ...
Paragraf                            : Penataan konten Anda dengan paragraf.
Judul                                 : The enam tingkat dari pos.
Daftar                                : Bagaimana untuk menentukan daftar memerintahkan dan                                                      unordered.
Link                                   : Cara membuat link ke halaman lain, dan di tempat lain.
Gambar                             : Menambahkan sesuatu yang sedikit lebih dari teks ...
Tabel                                 : Cara menggunakan tabel data.
Form                                 : Kotak teks dan thingamajigs user-input lain.

cobalah buka text editor dan ketikan text seperti dibawah ini

<html>
<head>
<title>halaman web</title> 
</head> 
<body> Ini adalah halaman pertama saya <b>This text is bold</b> 
</body> 
</html>


Simpanlah file tersebut dengan nama apa saja , misalnya halamanku.html kemudian jalankan di browser Sobat , seharusnya nanti akan muncul halaman seperti ini 





Contoh selanjutnya, kita akan berkenalan dengan tag <head> dan tag <title>. Tag <head> merupakan kepala dokumen. Agar lebih mudah memahami, cantoh yang tadi kita modifikasi. Tambahkanlah tag <head> dan tag <title> Sehingga kodenya menjadi seperti di bawah ini.


[code hl="1, 4, 7"] <!DOCTYPE html> <html> <head><title>halaman dua</title></head> <body>ini halaman kedua saya</body> </html> [/code]

Tag <title> berfungsi untuk membuat judul website. Sementara itu tag <head> berfungsi untuk membuat kepala dokumen. Tag <title> harus diletakkan di dalam tag <head>. Perhatikanlah hasilnya, teks yang ada di tag <title> akan ditampilkan sebagai judul website.

Elemen Head

Contoh berikutnya, kita akan berkenalan dengan tag <h1> dan tag <p>. tag <h1> berfungsi untuk membuat judul artikel. H1 adalah ukuran judul terbesar di HTML. Sementara itu, tag <p> berfungsi untuk membuat paragraf. Modifikasi lagi kode tadi, sehingga menjadi seperti berikut ini:


[code hl="1, 4, 7"] <!DOCTYPE html> <html> <head><title>web lain</title></head> <body><h1>Tentang halaman lainnya </h1> <p>pada pembelajaran pertama ini saya belajar mengenal htlml.html sangat mudah untuk dipahami dalam sintaks yang sederhana </p> </body> </html> [/code]

Perhatikanlah  tag  yang ditandai H1 akan ditampilkan lebih besar. Karena teks itu adalah sebuah judul artikel. Sementara itu, teks yang berada di tag <p> akan ditampilkan dengan ukuran normal. Untuk latihan silahkan tambahkan paragraf baru agar Sobat yang baru memuli bisa lebih mengenal HTML


Tag HTML dasar



Tag
Deskripsi
< html >
Mendefinisikan sebuah dokumen HTML
<body >
Mendefinisikan dokumen body
< h1 > ke < h6 >
Mendefinisikan header 1 header 6
< p >
Mendefinisikan sebuah paragraf
< br >
Menyisipkan satu baris istirahat
< hr >
Mendefinisikan sebuah garis horizontal
<!-->
Mendefinisikan komentar



Tag
Deskripsi


Tag
Deskripsi
< abbr >
Mendefinisikan singkatan
< b >
Mendefinisikan teks tebal
< akronim >
Mendefinisikan akronim
< besar >
Mendefinisikan besar teks
< alamat >
Mendefinisikan elemen alamat
< mengutip >
Mendefinisikan kutipan
< i >
Mendefinisikan teks miring
< kode >
Mendefinisikan kode komputerteks
< kecil >
Mendefinisikan teks kecil
< sup >
Mendefinisikan superscripted teks
< blockquote >
Mendefinisikan quotation panjang
< sub >
Mendefinisikan subscripted teks
< del >
Mendefinisikan teks
< tt >
Mendefinisikan teks teletype
< dfn >
Mendefinisikan istilah definisi
< u >
Usang. Menggunakan gaya bukan
< em >
Mendefinisikan menekankan teks



Entitas karakter yang paling umum :


Hasil
Deskripsi
Nama badan
Entitas nomor

Ruang bebas-melanggar
& nbsp;
& #160;
kurang dari
& lt;
& #60;
lebih besar dari
& gt;
& #62;
&
ampersand
& amp;
& #38;
"
tanda petik
& quot;
& #34;
'
tanda kutip
& apos; (tidak bekerja di IE)
& #39;

Entitas karakter yang paling umum:


Hasil
Deskripsi
Nama badan
Entitas nomor

Ruang bebas-melanggar
& nbsp;
& #160;
kurang dari
& lt;
& #60;
lebih besar dari
& gt;
& #62;
&
ampersand
& amp;
& #38;
"
tanda petik
& quot;
& #34;
'
tanda kutip
& apos; (tidak bekerja di IE)
& #39;


sekian dulu pengenalan  dasar mengenai HTML semoga dapat sedikit menggambarkan pada pertemuan selanjutnya kita akan membahas seputar warna pada HTML
.

IDIARSO
IDIARSO

Menulis adalah kegiatan saya disela rutinitas kerja,silahkan berkomentar dibawah ini sebagai bahan masukan

Tidak ada komentar:

Posting Komentar