HTML PEMROGRAMAN INTERNET
Apakah File HTML itu? HTML singkatan dari Hyper Text Markup Language File HTML adalah file teks yang tersusun dari markup tags (penanda) Markup tags memberitahukan Web browser bagaimana menampilkan halaman File HTML harus mempunyai ekstensi htm atau html File HTML bisa dibuat menggunakan editor teks sederhana (notepad, wordpad, editplus, dll)
Membuat File HTML Ketikkan script berikut pada teks editor 2. Simpan file dengan nama “mypage.html” <html> <head> <title>Judul halaman</title> </head> <body> Ini adalah homepage pertamaku <b>teks ini dibold</b> </body> </html>
Membuat File HTML 3. Buka file HTML menggunakan Internet Browser untuk menampilkan homepage yang telah dibuat.
Penjelasan Script HTML Tag pertama <html> memberitahukan browser sebagai permulaan dari dokumen HTML. Tag terakhir </html> memberitahukan browser sebagai akhir dari dokumen HTML. Teks diantara tag <head> dan tag </head> adalah informasi header yang tidak ditampilkan di jendela browser. Teks diantara tag <title> dan tag </title> adalah judul dokumen yang ditampilkan pada caption browser. Teks diantara tag <body> dan tag </body> adalah teks yang akan ditampilkan di jendela browser. Teks diantara tag <b> dan tag </b> akan ditampilkan dengan font bold.
TAG HTML Tag HTML digunakan untuk menandai elemen HTML Tag HTML diapit oleh dua karakter < dan > Tag HTML normalnya berpasangan seperti <b> dan </b> Tag pertama disebut start tag, tag kedua disebut end tag Teks diantara start dan end tag adalah element content Tag HTML tidak bersifat case sensitive, <b> sama maknanya dengan <B>
Elemen HTML Contoh elemen HTML : <b>teks ini dibold</b> Elemen HTML dimulai dgn start tag: <b> Content elemen HTML : teks ini dibold Elemen HTML diakhiri dgn end tag: </b> Tag <b> mendefinisikan elemen HTML yang harus ditampilkan dgn bold.
Elemen HTML Contoh lain elemen HTML: <body> Ini adalah homepage pertamaku <b>teks ini dibold</b> </body> Elemen HTML dimulai dgn start tag <body> dan diakhiri dgn end tag </body>. Tag <body> mendefinisikan elemen HTML yang merupakan tubuh dari dokumen HTML.
Atribut Tag Tag bisa memiliki atribut yg memberikan informasi tambahan tentang elemen HTML. Atribut tag mendefinisikan elemen dari body halaman HTML <body>. Dgn tambahan atribut bgcolor, browser diberitahu informasi ttg background color. misal: Bacground color merah, <body bgcolor="red">. Atribut tag selalu berpasangan, nama/nilai seperti : nama=“nilai’ Atribut selalu ditambahkan pada start tag dari elemen HTML.
Tag Dasar HTML Tag paling penting pada HTML adlh tag heading, paragraf dan line break. 1. Heading Heading didefinisikan dgn tag <h1> s.d <h6> <h1> adlh heading terbesar & <h6> adlh heading terkecil. HTML otomatis memberi spasi pada setiap heading <h1>Ini adalah heading</h1> <h2>Ini adalah heading</h2> <h3>Ini adalah heading</h3> <h4>Ini adalah heading</h4> <h5>Ini adalah heading</h5> <h6>Ini adalah heading</h6>
Tag Dasar HTML 2. Paragraf Paragraphs didefinisikan dgn tag <p> HTML otomatis memberi spasi pada setiap heading 3. Line break Tag <br> digunakan untuk mengakhiri baris, tetapi masih dalam satu paragraf. Tag <br> adlh empty tag. Tidak memiliki end tag. <p>Ini adalah paragraf</p> <p>Ini adalah paragraf yang lain</p> <p>Ini <br> adalah <br>paragraf dengan line break</p>
Tag Dasar HTML 4. Comment/Komentar Tag comment digunakan untuk menyisipkan komentar pada HTML source code. Komentar akan diabaikan oleh browser. Komentar dapat digunakan untuk menjelaskan source code. Tanda seru hanya digunakan diawal. <!– Ini adalah komentar -->
Tag Dasar HTML TAG Deskripsi <html> Define dokumen html <body> Define dokumen body <h1> s.d <h6> Define header1 s.d header 6 <p> Define paragraf <br> Define line break <hr> Define garis horisontal <!--> Define comment
HTML Text Formatting Sintaks untuk memformat teks pada HTML:
Bagaimana cara melihat source HTML Bagaimana cara melihat source HTML?? Pada halaman web klik option view pada browser dan pilih SOURCE atau PAGE SOURCE. Akan terbuka halaman yang menunjukan source HTML aktual dari web page.
HTML Character Entity Untuk menampilkan karakter-karakter yang memiliki makna khusus/digunakan pada script HTML seperti tanda < (less than) Contoh character entity yang sering digunakan :
Contoh lain character entity :
Link HTML HTML menggunakan hiperlink untuk berhubungan dgn dokumen lain di web HTML menggunakan tag anchor <a> untuk menciptakan link ke dokumen lain Anchor dapat me-link ke berbagai resource di web : halaman HTML, gambar, file suara, film, dll. Sintaknya : <a href=“url”>Teks yang akan ditampilkan</a>
Link HTML Contoh link : Sintaks diatas akan menampilkan pada browser: website Universitas Brawijaya Target atribut : Mendefinisikan dimana dokumen link akan dibuka. Script berikut akan membuka dokumen di halaman lain: <a href=“http://www.brawijaya.ac.id/”>website Universitas Brawijaya</a> <a href=“http://www.brawijaya.ac.id/” target=“_blank”> website Universitas Brawijaya</a>
Name Attribute : Mendefinisikan nama anchor yang dapat digunakan untuk menciptakan link yang dapat melompat secara langsung ke section spesifik dari web page. Contoh: Kemudian untuk memanggil link tersebut dgn script : <a name=“label”>Teks yang akan ditampilkan</a> <a name="html">HTML</a> merupakan teks standar untuk pembuatan web <a href="#html">HTML</a>
Link ke email sintaks : <a href="mailto:dewi@brawijaya.ac.id">Kirim ke Email </a>