HTML Dasar

HTML Hyper Text Mark Up Language Pemograman Web (2010/2011) - Feb 24, 2011 Teknik Informatika, Universitas Islam Indonesia Follow Hari Setiaji on Twitter

Agenda Pemograman Web (2010/2011) – Hari Setiaji, S.Kom

Tentang HTML ,[object Object],[object Object],[object Object],[object Object],Pemograman Web (2010/2011) – Hari Setiaji, S.Kom

Skema Dasar Dokumen HTML ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Pemograman Web (2010/2011) – Hari Setiaji, S.Kom

Contoh Isi Dokumen HTML <html> <head> <title>Homepage saya</title> </head> <body> <h1>Saya</h1> <h2>Perkenalan</h2> Perkenalkan, nama saya ..... Ini adalah homepage pertama saya, karena saya baru belajar tentang cara membuat homepage. </body> </html>  Pemograman Web (2010/2011) – Hari Setiaji, S.Kom

Daftar Tag ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Pemograman Web (2010/2011) – Hari Setiaji, S.Kom

Tag Judul ( Heading ) ,[object Object],[object Object],[object Object],<h1> Judul Tingkat 1 </h1> <h2> Judul Tingkat 2 </h2> <h3> Judul Tingkat 3 </h3> <h4> Judul Tingkat 4 </h4> <h5> Judul Tingkat 5 </h5> <h6> Judul Tingkat 6 </h6> Judul Tingkat 1 Judul Tingkat 2 Judul Tingkat 3 Judul Tingkat 4 Judul Tingkat 5 Judul Tingkat 6 Pemograman Web (2010/2011) – Hari Setiaji, S.Kom

Tag Paragraf ( Paragraph ) ,[object Object],[object Object],[object Object], Ini adalah homepage pertama saya, karena saya baru belajar tentang cara membuat homepage. Homepage ini masih dalam tahap pengembangan, oleh karena itu tampilannya masih terlalu sederhana. Saya akan berusaha untuk terus memperbaiki homepage saya ini, sehingga semakin lama semakin menarik untuk dilihat. Ini adalah homepage pertama saya, karena saya baru belajar tentang cara membuat homepage. Homepage ini masih dalam tahap pengembangan, oleh karena itu tampilannya masih terlalu sederhana. Saya akan berusaha untuk terus memperbaiki homepage saya ini, sehingga semakin lama semakin menarik untuk dilihat. Pemograman Web (2010/2011) – Hari Setiaji, S.Kom

Tag Atribut 1 ( Bold, Italic, Underline ) Kalimat yang dicetak tebal Kalimat yang dicetak miring Kalimat yang digarisbawahi Untuk menandai bagian kalimat agar dicetak tebal, miring, dan/atau digarisbawahi . Kata dapat dicetak tebal, miring , garis bawah , tebal miring , dan kombinasi di tengah huruf normal Kata dapat dicetak tebal , miring , garis bawah , tebal miring , dan kombinasi di tengah huruf normal Pemograman Web (2010/2011) – Hari Setiaji, S.Kom

Tag Atribut 2 ( Superscript, Subscript ) ,[object Object],[object Object],[object Object],(x 1 + x 2 ) 2 = x 1 2 + x 2 2 + 2x 1 x 2 2H 2 + O 2 = 2 H 2 O (x 1 + x 2 ) 2 = x 1 2 + x 2 2 + 2x 1 x 2 2H 2 + O 2 = 2 H 2 O Pemograman Web (2010/2011) – Hari Setiaji, S.Kom

Tag Ganti Baris (Break line) ,[object Object],[object Object],[object Object],[object Object],Perkenalkan, nama saya ..... Ini adalah homepage pertama saya, karena saya baru belajar tentang cara membuat homepage. Homepage ini masih dalam tahap pengembangan, oleh karena itu tampilannya masih terlalu sederhana. Paragraf Paragraf Ganti baris Perkenalkan, nama saya ..... Ini adalah homepage pertama saya, karena saya baru belajar tentang cara membuat homepage. Homepage ini masih dalam tahap pengembangan, oleh karena itu tampilannya masih terlalu sederhana. Pemograman Web (2010/2011) – Hari Setiaji, S.Kom

Tag Font (size) ,[object Object],[object Object],Ukuran satu, dua, tiga, empat, lima, enam , tujuh Ukuran satu, dua, tiga, empat, lima, enam, tujuh kalimat kalimat n = 1, 2, 3, 4, 5, 6, 7 (ukuran huruf) m = -2, -1, +0, +1, +2, +3, +4 (ukuran huruf) Ukuran Pemograman Web (2010/2011) – Hari Setiaji, S.Kom

Tag Font (face) ,[object Object],[object Object],Jenis huruf kalimat nama font = Times New Roman , Arial, Courier New , Verdana, dll. Homepage ini masih dalam tahap pengembangan Homepage ini masih dalam tahap pengembangan Homepage ini masih dalam tahap pengembangan Homepage ini masih dalam tahap pengembangan Homepage ini masih dalam tahap pengembangan Homepage ini masih dalam tahap pengembangan Homepage ini masih dalam tahap pengembangan Homepage ini masih dalam tahap pengembangan Pemograman Web (2010/2011) – Hari Setiaji, S.Kom

Tag Font (color) ,[object Object],[object Object],Warna Red Maroon Lime Green Blue Navy Yellow Fuschia Aqua Red Maroon Lime Green Blue Navy Yellow Fuchsia Aqua kalimat RR = 00 .. FF (intensitas warna merah dalam heksadesimal) GG = 00 .. FF (intensitas warna hijau dalam heksadesimal) BB = 00 .. FF (intensitas warna biru dalam heksadesimal) Pemograman Web (2010/2011) – Hari Setiaji, S.Kom

Tag Enumerasi ( List, Unordered List, Ordered List ) ,[object Object],[object Object],[object Object],Ada beberapa sektor potensial: <li> Pariwisata </li> <li> Seni </li> <li> Budaya </li> Sektor tersebut merupakan ... Fasilitas penginapan di Indonesia: <ol> <li> Losmen </li> Losmen merupakan tempat penginapan yang berskala kecil <li> Hotel </li> <ul> <li> Hotel melati </li> <li> Hotel berbintang </li> </ul> </ol> Perkembangan dalam ... ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Pemograman Web (2010/2011) – Hari Setiaji, S.Kom

Tag Garis Mendatar ( Horizontal Line ) ,[object Object],[object Object],[object Object],[object Object],Perkenalkan, nama saya ... Ini adalah homepage pertama saya, karena saya baru belajar tentang cara membuat homepage. <hr /> Homepage ini masih dalam tahap pengembangan, oleh karena itu tampilannya masih terlalu sederhana. Pemograman Web (2010/2011) – Hari Setiaji, S.Kom Perkenalkan, nama saya ... Ini adalah homepage pertama saya, karena saya baru belajar tentang cara membuat homepage. Homepage ini masih dalam tahap pengembangan, oleh karena itu tampilannya masih terlalu sederhana.

Tag Gambar ( Image ) ,[object Object],[object Object],[object Object],[object Object],<img src="cover.jpg" align="left" /> Perkenalkan, nama saya ... Ini adalah homepage pertama saya, karena saya baru belajar tentang cara membuat homepage. Homepage ini masih dalam tahap pengembangan, oleh karena itu tampilannya masih terlalu <img src="logo.gif" alt="Logo" /> sederhana. Saya akan berusaha untuk terus memperbaiki homepage saya ini, sehingga semakin lama semakin menarik untuk dilihat. Pemograman Web (2010/2011) – Hari Setiaji, S.Kom Perkenalkan, nama saya ... Ini adalah homepage pertama saya, karena saya baru belajar tentang cara membuat homepage. Homepage ini masih dalam tahap pengembangan, oleh karena itu tampilannya masih terlalu sederhana. Saya akan berusaha untuk terus memperbaiki homepage saya ini, sehingga semakin lama semakin menarik untuk dilihat.

Tag Link (Anchor) ,[object Object],[object Object],[object Object],[object Object],[object Object],Saya ingin melihat <a href="hal2.html"> halaman selanjutnya </a> . Saya ingin langsung menuju ke <a href="#akhir"> bagian akhir </a> . Saya ingin menuju ke <a href="hal2.html#bawah"> bagian bawah pada halaman selanjutnya </a> . <a href="http://www.detik.com"> <img src="gambar.gif" /> </a> Homepage detik.com. Ini bagian tengah. <a name="#akhir"> Ini bagian akhir. </a> Pemograman Web (2010/2011) – Hari Setiaji, S.Kom

Tag Tabel ( Table ) - layout ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Pemograman Web (2010/2011) – Hari Setiaji, S.Kom

Desain/Layout Halaman Pemograman Web (2010/2011) – Hari Setiaji, S.Kom

Let’s Play Pemograman Web (2010/2011) – Hari Setiaji, S.Kom

Finally Pemograman Web (2010/2011) – Hari Setiaji, S.Kom

HTML Dasar

Recommended

Recommended

More Related Content

What's hot

What's hot (7)

Similar to HTML Dasar

Similar to HTML Dasar (20)

More from Hari Setiaji

More from Hari Setiaji (15)

Recently uploaded

Recently uploaded (20)

HTML Dasar

Editor's Notes