Pages
Showing posts with label HTML. Show all posts
Showing posts with label HTML. Show all posts

Perbedaan TAG h1,h2,h3,h4,h5,h6

 

Tag Judul (heading)


HTML menyediakan 6 buah tag, yaitu tag h1,h2,h3,h4,h5,h6 yang digunakan untuk mengatur ukuran teks yang dijadikan sebagai judul dalam badan dokumen.

HTML menyediakan enam tingkat heading, yaitu tag h1,h2,h3,h4,h5,h6. Tetapi bagi yang belum pernah mencoba menggunakan heading pasti bingung dengan apa yang dimaksud dengan h1,h2,h3,h4,h5,h6 dan apakah perbedaan dari tag h1,h2,h3,h4,h5,h6 ?



Contoh Heading:
<h1>Heading one</h1>
<h2>Heading two</h2>
<h3>Heading three</h3>
<h4>Heading four</h4>
<h5>Heading five</h5>
<h6>Heading six</h6>

Contoh Kasus
Ketikkan script berikut:
<!DOCTYPE html>
<html>
<head>
<title>Judul Halaman</title>
</head>
<body>

<h1>Heading one</h1>
<h2>Heading two</h2>
<h3>Heading three</h3>
<h4>Heading four</h4>
<h5>Heading five</h5>
<h6>Heading six</h6>

</body>
</html>

Berikut hasilnya:

*Selamat mencoba.. ^_^


Lihat juga:
  1. Cara Membuat Full Screen Command Prompt (Windows 7) 
  2. Cara merubah @author di Netbeans 
  3. Cara membuat Hello World Console (Java) 
  4. Cara membuat Hscrollbar dan Vscrollbar (VB 6.0)
  5. Cara membuat Frame dan OptionButton (VB 6.0)

Cara membuat Website Link

 

Apa itu Link ?


Link ditemukan di hampir semua halaman web. Link memungkinkan pengguna untuk membantu mereka menuju dari halaman ke halaman. Link HTML disebut juga  hyperlink. Sebuah hyperlink adalah teks atau gambar yang dapat di klik, sehingga pengguna dapat melompat ke dokumen lain.

Terdapat beberapa jenis link:
  • Link absolute : link pada web page yang berada di internet.
  • Link local       : link yang dibuat untuk menuju pada bagian tertentu pada web page.

Dalam HTML, link didefinisikan dengan tag <a>:
<a href="url">link teks</a>

Keterangan:
  • The url menentukan alamat tujuan
  • The link teks adalah bagian yang terlihat

*Mengklik pada link teks, akan mengirimkan ke alamat yang ditentukan.
*Teks link tidak harus berupa teks. Hal ini dapat gambar HTML atau elemen lain HTML.

Contoh link absolute:
<a href="http://www.atwiwit.net/html/">Lihat tutorial HTML</a>
Contoh link local:
<a href="gambarHTML.jpg">Contoh gambar HTML</a>
Contoh link gambar:
<a href="profil.html">
<img src="gambarku.gif" alt="profil" style="width:42px;height:42px;border:0">
</a>

Link HTML juga memiliki atribut target yang menentukan dimana letak untuk membuka dokumen terkait.
Nilai Target
Deskripsi
_blank
Opens the linked document in a new window or tab
_self
Opens the linked document in the same frame as it was clicked (this is default)
_parent
Opens the linked document in the parent frame
_top
Opens the linked document in the full body of the window
framename
Opens the linked document in a named frame

Contoh link dengan atribut target _blank:
<a href="http://www.atwiwit.com/html/" target="_blank">Tutorial HTML5!</a>


http://www.atwiwit.net/2016/02/cara-membuat-website-link.html

*Selamat mencoba.. ^_^

Pengenalan HTML

 

Apa itu HTML ?


HTML adalah bahasa markup yang mendeskripsikan dokumen web (halaman web).
  • HTML merupakan singkatan dari Hyper Text Markup Language
  • Sebuah bahasa markup adalah sekumpulan tag markup
  • Dokumen HTML dideskripsikan oleh tag HTML
  • Setiap tag HTML mendeskripsikan konten dokumen yang berbeda


Contoh HTML:

<!DOCTYPE html>
<html>
<head>
<title>Judul Halaman</title>
</head>
<body>

 <h1>Heading pertama</h1>
<p>Paragraf pertama</p>

 </body>
</html>

Penjelasan contoh diatas:
  • Deklarasi DOCTYPE mendefiniskan tipe dokumennya HTML
  • Teks diantara <html> dan </html> mendeskripsikan sebuah dokumen HTML
  • Teks diantara <head> dan </head> menyediakan informasi tentang dokumen
  • Teks diantara <title> dan </title> menyediakan sebuah judul untuk dokumen
  • Teks diantara <body> dan </body> mendeskripsikan konten halaman yang terlihat
  • Teks diantara <h1> dan </h1> mendeksripsikan heading
  • Teks diantara <p> dan </p> mendeskripsikan paragraf

Dengan menggunakan deskripsi tadi, sebuah web browser dapat menampilkan dokumen dengan heading dan paragraf

Tags HTML

Tags HTML merupakan kata kunci (nama tag) yang dikelilingi oleh kurung sudut
<tagname>konten</tagname>
  • Tags HTML biasanya berpasangan seperti <p> dan </p>
  • Tag pertama merupakan tag awal, tag kedua merupakan tag akhir
  • Tag akhir ditulis seperti tag awal, tetapi dengan tambahan slash sebelum nama tag
  • Tag awal sering juga disebut dengan tag pembuka. Tag akhir sering juga disebut dengan tag penutup

Web Browser

Tujuan web browser (Firefox, IE, Chrome, Opera) adalah untuk membaca dokumen HTML dan menampilkannya.
Browser tidak menampilkan tags HTML, tetapi untuk menentukan bagaimana dokumen ditampilkan.

Struktur Halaman HTML

Dibawah ini adalah tampilan dari struktur HTML:

Hanya area <body> / area putih yang ditampilkan dalam browser

Deklarasi <!DOCTYPE>

Deklarasi <!DOCTYPE> membantu browser untuk menampilkan sebuah halaman web secara benar. Terdapat beberapa tipe dokumen dalam web. Untuk menampilkan dokumen secara benar, browser harus tahu type dan versi. Dekarasi doctype tidak bersifat case sensitive. Jadi huruf besar atau kecil tidak masalah.
<!DOCTYPE html>

 <!DOCTYPE HTML>

 <!doctype html>

 <!Doctype Html>

Dekarasi Umum


HTML5
<!DOCTYPE html>

HTML 4.01
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

XHTML 1.0
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Versi HTML



Lihat juga:

Cara Memformat Teks dalam HTML

 
Format Teks dalam dokumen HTML dapat diformat secara khusus untuk menunjukkan perbedaan dan penekanan terhadap isi dan maksud dari teks tersebut.

Terdapat dua macam format teks, yaitu:
  • Logical format akan menerapkan layout dokumen secara logis dan terstruktur.
  • Physical format adalah format terhadap fisik suatu font.

Daftar pemformatan teks yang dapat dilakukan dalam HTML:
Cara Memformat Teks dalam HTML

Contoh:
<!DOCTYPE HTML>
<html>
<head>
    <meta http-equiv="content-type" content="text/html" />
    <meta name="author" content="Wiwit Agus Triyanto" />

    <title>Untitled 2</title>
</head>

<body>

<b>Tergoda aku untuk berpikir</b>
<i>dia yang tecinta</i>
<u>mengapa telah lama tak nampak</u>
<big>dirimu disini</big>

<small>jangan inginku tersenyum</small>
<strike>tak ada gairah</strike>
<sub>kuingin slalu bersamamu</sub>

<em>kini kuresah</em>
<strong>diriku lemah tanpamu.. ohh</strong>

<del>gapai semua jemariku
rangkul aku dalam bahagiamu
kuingin bersama berdua selamanya</del>

<ins>jika kubuka mata ini
kuingin selalu ada dirimu
dalam kelemahan hati ini
bersamamku aku tegar</ins>

</body>
</html>
Berikut tampilan ketika dijalankan:
Cara Memformat Teks dalam HTML  

Selamat mencoba.. ^_^

Perbedaan HTML5 dan HTML 4

 
Spesifikasi HTML 5 menjabarkan vokabular yang dapat ditulis dalam dua sintak yaitu html dan XML yang disesuaikan dengan kebutuhan pemrogram,pasar atau aplikasi. Vokabular HTML dari jaman sebalumnya (HTML+,HTML 2.0, HTML 3.2) umumnya ditulis menggunakan aturan sintak SGML.

Pada HTML 4 telah diterapkan dua sintak yaitu: SGML (disebut sebagaiHTML 4.01) dan XML (disebut XHTML 1.0). Sementara itu, HTML 5 menenerapan dua sintak yaitu: html dan XML. Karena SGML nyaris tidak pernah didukung baik oleh browsers maupun kebanyakan tools untuk html authoring yang ada, maka HTML 5 mendefinisikan serialisasi baru (lihat diagram) dan disebut sebagai html, yang sepintas mirip dengan SGML seperti dikenal sebelumnya.

  • Dapat ditulis dalam sintaks HTML (dengan tipe media text/html) dan XML.
  • Tersedianya canvas pada HTML 5
  • Embed Audio Video Secara Langsung
  • Integrasi yang lebih baik dengan aplikasi web dan pemrosesannya.
  • Integrasi (’inline’) MathML dan SVG dengan doctype yang lebih sederhana. 
  • Penulisan kode yang lebih efisien.
  • Dapat dimengerti oleh browser lawas (backwards compatible). Sehingga istilah ‘deprecated’
  • tidak akan diperlukan lagi.
Perbedaan HTML5 dan HTML 4
Subscribe to Newsletter

Popular Posts

© Copyright 2011 ATwiwit.Net. Designed by Bloggertheme9.