HTML

1
HTML

• Hyper Text Markup Language

Hyper Text Markup Language
Hyper Text Markup Language
ADVANCE
2
HTML DOCTYPE

• Sebuah deklarasi DOCTYPE mengacu pada
  aturan-aturan untuk bahasa markup, sehingga
  browser membuat konten dengan benar.
• Contoh document dongan doctype 4.01 Transitional
  
• lt!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01
  Transitional//EN""http//www.w3.org/TR/html4/loos
  e.dtd"gtlthtmlgtltheadgtlttitlegtTitle of the
  documentlt/titlegtlt/headgtltbodygtThe content of
  the document......lt/bodygtlt/htmlgt

3
HTML DOCTYPE

• Deklarasi DOCTYPE bukanlah tag HTML, melainkan
  adalah perintah kepada web browser tentang versi
  HTML yang ditulis.
• Deklarasi DOCTYPE mengacu pada Dokumen Type
  Definition (DTD). DTD menetapkan aturan untuk
  bahasa markup, sehingga browser dapat membuat
  konten dengan benar.
• Deklarasi DOCTYPE harus dituliskan pertama dalam
  dokumen HTML, sebelum tag lthtmlgt.

4
HTML DOCTYPE

• HTML 4.01 Strict
• DTD ini berisi semua elemen HTML dan atribut,
  tetapi tidak termasuk elemen presentasi atau
  elemen khusus (seperti font dan center).
  Framesets disini tidak diperbolehkan
• lt!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML
  4.01//EN""http//www.w3.org/TR/html4/strict.dtd"gt
  
• HTML 4.01 Transitional
• DTD ini berisi semua elemen HTML dan atribut,
  TERMASUK elemen presentasi dan elemen khusus
  (seperti font). Framesets disini tidak
  diperbolehkan
• lt!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01
  Transitional//EN""http//www.w3.org/TR/html4/loos
  e.dtd"gt

5
HTML DOCTYPE

• HTML 4.01 Frameset
• DTD ini sama dengan HTML 4.01 Transitional, namun
  memungkinkan penggunaan Frameset
• lt!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01
  Frameset//EN""http//www.w3.org/TR/html4/frameset
  .dtd"gt

6
HTML STYLES

• External Style Sheet
• Sebuah style sheet eksternal lebih mudah
  digunakan ketika style diterapkan untuk banyak
  halaman. Dengan style sheet eksternal, kita dapat
  mengubah tampilan sebuah situs web keseluruhan
  dengan mengubah satu file. Setiap halaman harus
  link ke style sheet menggunakan tag ltlinkgt. Tag
  ltlinkgt masuk ke dalam bagian ltheadgt
• ltheadgt ltlink rel"stylesheet"
  type"text/css" href"mystyle.css" /gtlt/headgt

7
HTML STYLES

• Internal Style Sheet
• Sebuah style sheet internal dapat digunakan jika
  satu dokumen tunggal memiliki style yang unik.
  Style internal didefinisikan dalam ltheadgt dari
  sebuah halaman HTML, dengan menggunakan tag
  ltstylegt, seperti ini
• ltheadgt ltstyle type"text/css"gt body
  background-coloryellow p colorblue lt/styl
  egtlt/headgt

8
HTML STYLES

• Inline Styles
• Style inline dapat digunakan jika style yang unik
  yang akan diterapkan ke satu kejadian tunggal
  dari suatu elemen.Untuk menggunakan style
  inline, menggunakan atribut style pada tag yang
  relevan. Atribut style dapat berisi properti CSS.
  Contoh di bawah ini menunjukkan cara mengubah
  warna teks dan margin kiri paragraf
• ltp style"colorbluemargin-left20px"gtThis is a
  paragraph.lt/pgt

9
HTML HEAD

• Elemen head adalah wadah untuk semua elemen
  kepala. Elemen dalam ltheadgt dapat termasuk
  script, menginstruksikan browser di mana bisa
  menemukan style sheet, memberikan informasi meta,
  dan banyak lagi. Tag berikut dapat ditambahkan
  pada bagian head lttitlegt, ltbasegt, ltlinkgt,
  ltmetagt, ltscriptgt, dan ltstylegt.
• Tag lttitlegt untuk mendefinisikan judul pada
  dokumen.
• Tag ltbasegt menentukan alamat default atau target
  standar untuk semua link pada halaman
• ltheadgt ltbase href"http//www.w3schools.com/image
  s/" /gt ltbase target"_blank" /gtlt/headgt

10
HTML HEAD

• Tag ltlinkgt mendefinisikan hubungan antara dokumen
  dan sumber eksternal. Tag ltlinkgt paling digunakan
  untuk link ke style sheet
• Tag ltstylegt digunakan untuk mendefinisikan
  informasi gaya untuk dokumen HTML. Di dalam
  elemen style yang Anda tentukan bagaimana elemen
  HTML harus render di browser
• Tag ltmetagt menyediakan metadata tentang dokumen
  HTML.

11
HTML META

• Metadata adalah informasi tentang data.Tag
  ltmetagt menyediakan metadata tentang dokumen HTML.
  Metadata tidak akan ditampilkan pada halaman,
  Meta elemen biasanya digunakan untuk menentukan
  halaman deskripsi, kata kunci, penulis dokumen,
  terakhir dimodifikasi, dan metadata lainnya.Tag
  ltmetagt selalu berjalan di dalam elemen
  head.Metadata ini dapat digunakan oleh browser
  (bagaimana menampilkan konten atau reload
  halaman), mesin pencari (kata kunci), atau
  layanan web lainnya.

12
HTML META

• Keyword untuk Search Engine
• Beberapa mesin pencari akan menggunakan atribut
  nama dan isi elemen meta untuk mengindeks halaman
  Anda.Elemen meta berikut mendefinisikan suatu
  deskripsi halaman
• ltmeta name"description" content"Free Web
  tutorials on HTML, CSS, XML" /gt
• Elemen meta berikut mendefinisikan kata kunci
  untuk halaman
• ltmeta name"keywords" content"HTML, CSS, XML" /gt
  
• Maksud dari atribut nama dan konten adalah untuk
  menjelaskan konten halaman.
• Catatan Banyak webmaster telah menggunakan tag
  ltmetagt untuk spamming, seperti kata kunci
  mengulangi (atau menggunakan kata kunci yang
  salah) untuk peringkat lebih tinggi. Oleh karena
  itu, kebanyakan mesin pencari telah berhenti
  menggunakan tag ltmetagt ke indeks / halaman
  peringkat.

13
HTML ENTITIES

• Beberapa karakter dalam HTML telah tersedia. Hal
  ini tidak mungkin untuk menggunakan kurang dari
  (lt) atau lebih besar dari (gt) tanda-tanda dalam
  teks Anda, karena browser akan bercampur dengan
  tag. Untuk benar-benar menampilkan karakter
  reserved, kita harus menggunakan entitas karakter
  dalam kode sumber HTML.Sebuah entitas karakter
  terlihat seperti ini
• entity_name OR entity_number

14
HTML URLs

• URL adalah kata lain untuk suatu alamat
  web.Sebuah URL dapat terdiri dari kata-kata,
  seperti "w3schools.com", atau Internet Protocol
  (IP) alamat 192.68.20.50. Kebanyakan orang
  masukkan nama situs web ketika browsing, karena
  nama lebih mudah diingat daripada angka.
• Ketika Anda mengklik link dalam halaman HTML,
  sebuah poin mendasar tag ltagt ke alamat di web di
  seluruh dunia.Sebuah Uniform Resource Locator
  (URL) digunakan untuk alamat dokumen (atau data
  lain) di world wide web.Sebuah alamat web,
  seperti ini http//www.w3schools.com/html/default
  .asp aturan sintaks berikut ini
• scheme//host.domainport/path/filename

15
HTML URLs

• skema - menentukan jenis layanan Internet. Jenis
  yang paling umum adalah http
• host - mendefinisikan host domain (host default
  untuk http www)
• domain - menentukan nama domain Internet, seperti
  w3schools.com
• port - mendefinisikan nomor port di host (port
  default untuk http adalah nomor 80)
• jalan - menentukan jalur di server (Jika
  diabaikan, dokumen tersebut harus disimpan pada
  direktori root dari situs web)
• filename - menentukan nama dokumen / sumber daya.