Rabu, 21 Desember 2016

Elemen HTML

Comment
Elemen HTML

Elemen HTML
Sebuah elemen HTML biasanya terdiri dari tag awal tag dan akhir, dengan konten yang dimasukkan di antara:
<namatag>konten ditempatkan disini</namatag>
Elemen HTML adalah segalanya dari awal tag ke tag akhir:
<p> paragraf pertama saya. </p>

Tag Awal Konten elemen Tag Akhir
<h1> Heading Pertama </h>
<p> Paragraf pertama saya. </p>
<br>


Elemen HTML yang tidak memiliki konten disebut elemen kosong. elemen kosong tidak memiliki tag akhir.

Elemen HTML Bertingkat
Semua dokumen HTML memiliki tingkatan.
Perhatikan Contoh berikut:
<!DOCTYPE html>
<html>
<body>

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

</body>
</html>

dari contoh diatas:
<html> mendefinisikan seluruh dokumen
dimulai dengan tag <html> dan diakhiri </html>
konten dari elemen nya adalah elemen html lainnya(elemen <body>)

<body> mendefinisikan body dokumen
dimulai dengan tag <body> dan diakhiri </body>
konten dari elemen nya adalah elemen html lainnya(<h1> dan <p>)

<h1> mendefinisikan heading
dimulai dengan tag <h1> dan diakhiri </h1>
konten dari elemen nya adalah: Heading pertama

<p> mendefinisikan paragraf
dimulai dengan tag <p> dan diakhiri </p>
konden dari elemen nya adalah: Paragraf pertama saya


Selasa, 20 Desember 2016

Dasar HTML

2 Comments

Contoh Dasar HTML
Berikut ini contoh dasar HTML. Jangan khawatir jika contoh-contoh ini menggunakan tag yang belum kamu mengerti. kamu akan mempelajarinya nanti.

HTML Documents
Semua dokumen HTML harus dimulai dengan deklarasi tipe: <!DOCTYPE html>
HTML sendiri dimulai dengan <html> diakhiri dengan </html>
bagian yang terlihat pada dokumen adalah antara <body> dan </body>
Contoh:
<!DOCTYPE html>
<html>
<body>
<h1>Judul pertama ku</h1>
<p>Paragraf pertama</p>
</body>
</html>

HTML Heading(Judul)
HTML Heading didefinisikan dengan tag <h1> sampai </h6>.
<h1> untuk judul yang paling besar(paling penting> dan <h6> untuk judul yang kecil(tidak terlalu penting).
Contoh:
<h1>Ini Heading 1</h1>
<h2>Ini Heading 2</h2>
<h3>Ini Heading</h3>

HTML Paragraphs
Paragraf HTML didefinisikan dengan tag <p> 
Contoh
<p>Ini sebuah Paragraf</p>
<p>Ini paragraf lainnya</p>
HTML Link
link pada HTML didefinisikan dengan tag <a>
Contoh
<a href="http://www.suryadroid.top">Ini sebuah link</a>

Link tujuan terdapat pada atribut href

HTML Images
Untuk memasukkan gambar pada HTML bisa menggunakan tag <img>
Sumber gambar(src), alternatif teks(alt), lebar dan tinggi didefinisikan dengan atribut Width dan height:
Contoh
<img src="suryadroid.jpg" alt="SuryaDroid" width="180" height="120">

Minggu, 18 Desember 2016

Editor HTML

2 Comments

Menulis HTML dengan menggunakan Notepad atau TextEdit
Kita dapat membuat dan memodifikasi HTML menggunakan HTML editor profesional seperti Notepad++.
Namun, untuk belajar HTML kami rekomendasikan untuk menggunakan text editor yang simpel seperti Notepad(PC) atau TextEdit(MAC).
Kami percaya akan lebih mudah belajar menggunakan text editor yang simpel. 

Ikut langkah dibawah ini untuk membuat halaman web pertama kamu menggunakan Notepad atau TextEdit.

Langkah 1: Buka Notepad (PC)
Windows 8 atau diatasnya:
Buka Start Screen(simbol Windows yang ada pada pojok kiri bawah layar), tulis Notepad.

Windows 7 atau dibawahnya:
Buka Start > Programs > Accessories > Notepad

Langkah 1: Buka TextEdit (MAC).
Buka Finder > Applications > TextEdit
juga mengubah pengaturan aplikasi agar bisa menyimpan dengan benar. pada Preferences > Format > pilih "Plain Text" 
kemudian dibawah "Open and Save", Ceklis pada "Ignore rich text commands in HTML files". 
Lalu buka sebuah dokumen baru untuk menempatkan kode.

Langkah 2: Tulis beberapa HTML
Tulis atau salin beberapa HTML ini: 
<!DOCTYPE html><html>
<body>
<h1>Judul</h1>
<p> Sebuah Paragrap</p>
</body>
</html>



Langkah 3: Simpan Halaman HTML
simpan file pada komputer mu. pilih File > Save as pada Notepad Menu.
beri nama "index.html" dan pilih encoding "UTF-8"










** Kamu dapat menyimpan dengan ekstensi ".html" atau ".htm".

Langkah 4: Lihat Halaman HTML pada Browsers mu
buka file html yang telah disimpan tadi. Gunakan Browsers favorit kamu.
Hasilnya akan terlihat seperti ini:


Jika kamu ingin menggunakan Notepad++ bisa download Disini

Mengenal HTML

Comment


Apa itu HTML?
HTML adalah bahasa markup standar untuk membuat halaman Web.

  • HTML adalah singkatan dari Hyper Text Markup Language
  • HTML menggambarkan struktur halaman Web menggunakan markup
  • elemen HTML adalah blok bangunan dari halaman HTML
  • elemen HTML diwakili oleh tag
  • HTML tag label potongan konten seperti "judul", "Paragraf", "table", dan sebagainya
  • Browser tidak menampilkan tag HTML, tetapi menggunakan mereka untuk membuat isi halaman
Sebuah dokumen HTML yang Simple
<!DOCTYPE html>
<html>
<head>
<title>Judul Halaman</title>
</head>
<body>

<h1>Judul</h1>
<p> Sebuah Paragrap</p>

</body>
</html>
Penjelasan:

  • <! DOCTYPE html> mendefinisikan dokumen akan menjadi HTML5
  • <html> elemen root dari html
  • <head> berisi informasi meta dari dokumen
  • <title> judul dari dokumen
  • <body> berisi konten yang akan ditampilkan
  • <h1> mendefinisikan judul
  • <p> mendefinisikan sebuah paragrap
Tag HTML
<namatag>Isi konten..... </namatag>
  • tag html biasanya berpasangan seperti <p> dan </p>
  • dalam 2 pasang tag, tag akhir selalu terdapat garis miring "/"
Web Browsers
Tujuan Web Browsers(Chrome, Firefox, Safari, IE) adalah untuk membaca HTML dan menampilannya. Web Browser tidak menampilan HTML dalam bentuk tag, tetap menggunakan nya untuk menampilkan sebuah dokumen :


Versi HTML
Sejak web pertama dibuat, ada banyak versi html:

  • HTML - Tahun 1991
  • HTML 2.0 - Tahun 1995
  • HTML 3.0 - Tahun 1997
  • HTML 4.01 - Tahun 1999
  • XHTML - Tahun 2000 
  • HTML5 - Tahun 2014
Langganan: Komentar (Atom)