Minggu, 30 September 2012

jQuery Install

Menambahkan jQuery untuk Halaman Web Anda

Untuk menggunakan jQuery, Anda perlu men-download jQuery library (dijelaskan di bawah), dan menyertakannya pada halaman yang ingin menggunakannya.

jQuery library adalah file JavaScript tunggal, dan Anda referensikan dengan menggunakan tag HTML <script>:

Perhatikan bahwa tag <script> harus berada di dalam bagian <head> halaman.

Apakah Anda bertanya-tanya mengapa kita tidak mengetikkan = "text / javascript" di dalam tag <script>?

Hal ini tidak diperlukan dalam HTML5. JavaScript adalah bahasa scripting standar HTML5 dan di semua browser modern!

Contoh jQuery Dasar

Contoh berikut menunjukkan hide jQuery () metode.

Ketika pengguna mengklik tombol, semua elemen <p> akan disembunyikan:

<!DOCTYPE html>
<html>
<head>
<script src="jquery.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("p").hide();
});
});
</script>
</head>

<body>
<h2>Ini adalah Heading</h2>
<p>Ini adalah paragraf.</p>
<p>Ini adalah paragraph yang lain</p>
<button>Klick Saya</button>
</body>
</html>

Men-download jQuery

Ada dua versi dari jQuery tersedia untuk download:

* Versi Produksi - ini adalah untuk situs Anda karena telah minified dan dikompresi
* Versi Pengembangan - ini adalah untuk pengujian dan pengembangan (kode tidak terkompresi dan bisa dibaca)

Kedua versi dapat didownload dari jQuery.com.

Tip: Tempatkan file download di direktori yang sama seperti halaman di mana Anda ingin menggunakannya.

Alternatif untuk Men-Download

Jika Anda tidak ingin men-download dari jQuery.com, Anda dapat memasukkannya dari CDN (Content Delivery Network).

Baik Google dan Microsoft jQuery host.

Untuk menggunakan jQuery dari Google atau Microsoft, gunakan salah satu cara berikut:

Google CDN :
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js">
</script>
</head>

Dapatkan versi terbaru dengan Google CDN:

Jika Anda melihat URL Google di atas - versi jQuery ditentukan dalam URL (1.8.0). Jika Anda ingin menggunakan versi terbaru dari jQuery, Anda dapat menghapus nomor versi akhir dari string (misalnya 1.8), maka Google akan mengembalikan versi terbaru yang tersedia dalam seri 1.8 (1.8.0, 1.8. 1, dll), atau Anda dapat mengambil itu ke seluruh nomor (1), dan Google akan kembali versi terbaru yang tersedia di seri 1 (dari 1.1.0 ke 1.9.9).

Microsoft CDN :
<head>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.0.js">
</script>
</head>

Salah satu keuntungan besar dari menggunakan jQuery host dari Google atau Microsoft:

Banyak pengguna telah men-download jQuery dari Google atau Microsoft. hasilnya, akan disimpan di cache ketika mereka mengunjungi situs Anda, yang menyebabkan waktu loading lebih cepat. Juga, CDN sebagian besar akan memastikan bahwa sekali permintaan penggunaan file itu, maka akan dilayani dari server terdekat mereka, yang juga menyebabkan waktu loading lebih cepat.

Artikel Sebelumnya .....

Artikel Selanjutnya .....

AJAX Tutorial

AJAX Tutorial

AJAX = Asynchronous JavaScript dan XML.

AJAX bukanlah bahasa pemrograman baru, tetapi sebuah cara baru untuk menggunakan standar yang ada.

AJAX adalah seni bertukar data dengan server, dan memperbarui bagian-bagian dari suatu halaman web - tanpa reload seluruh halaman.

AJAX Pendahuluan

AJAX adalah tentang memperbarui bagian-bagian dari suatu halaman web, tanpa reload seluruh halaman.

Apa yang Anda Sudah Harus Ketahui

Sebelum melanjutkan, anda harus memiliki pemahaman dasar sebagai berikut:

     * HTML / XHTML
     * CSS
     * JavaScript / DOM

Apa AJAX?

AJAX = Asynchronous JavaScript dan XML.

AJAX adalah teknik untuk membuat halaman web yang cepat dan dinamis.

AJAX memungkinkan halaman web yang akan diperbarui asynchronously dengan bertukar sejumlah kecil data dengan server di belakang layar. Ini berarti bahwa adalah mungkin untuk memperbarui bagian-bagian dari suatu halaman web, tanpa reload seluruh halaman.

Halaman web klasik, (yang tidak menggunakan AJAX) harus reload seluruh halaman jika konten harus berubah.

Contoh aplikasi yang menggunakan AJAX: Google Maps, Gmail, Youtube, dan tab Facebook.

Bagaimana AJAX Bekerja

AJAX Berdasarkan Standar Internet

AJAX didasarkan pada standar internet, dan menggunakan kombinasi:

     * XMLHttpRequest object (untuk pertukaran data asynchronous dengan server)
     * JavaScript / DOM (untuk menampilkan / berinteraksi dengan informasi)
     * CSS (style data)
     * XML (sering digunakan sebagai format untuk mentransfer data)

AJAX aplikasi browser dan platform-independent!
Google Suggest

AJAX dibuat populer pada tahun 2005 oleh Google, dengan Google Suggest.

Google Suggest menggunakan AJAX untuk membuat antarmuka web yang sangat dinamis: Ketika Anda mulai mengetik di kotak pencarian Google, sebuah JavaScript mengirimkan ke server dan server mengembalikan sebuah daftar saran.
Mulai Menggunakan AJAX Hari

AJAX didasarkan pada standar yang ada. Standar-standar ini telah digunakan oleh pengembang selama beberapa tahun. Baca bab berikutnya untuk melihat cara kerjanya!

jQuery Tutorial

jQuery adalah JavaScript Library.

jQuery sangat menyederhanakan pemrograman JavaScript.

jQuery mudah dipelajari.

jQuery Pendahuluan

Tujuan dari jQuery adalah untuk membuat lebih mudah menggunakan JavaScript pada website Anda.
Apa yang Harus Anda Sudah Ketahui

Sebelum Anda mulai mempelajari jQuery, Anda harus memiliki pengetahuan dasar dari:

     * HTML
     * CSS
     * JavaScript

Apa jQuery?

jQuery adalah lebih ringan, "sedikit menulis, berbuat lebih banyak", JavaScript library.

Tujuan dari jQuery adalah untuk membuat lebih mudah untuk menggunakan JavaScript pada website Anda.

jQuery membutuhkan banyak tugas umum yang membutuhkan banyak baris kode JavaScript untuk menyelesaikan, dan membungkus menjadi metode yang dapat Anda hubungi dengan satu baris kode.

jQuery juga menyederhanakan banyak hal-hal rumit dari JavaScript, seperti AJAX dan manipulasi DOM.

jQuery Library berisi beberapa fitur berikut:

     * Manipulasi HTML / DOM
     * Manipulasi CSS
    * HTML Event Methods
     * Efek dan animasi
     * AJAX
     * Utilitas

Tip: Selain itu, jQuery memiliki plugin untuk hampir semua tugas di luar sana.

Mengapa jQuery?

Ada banyak JavaScript Framework lain di luar sana, tapi jQuery tampaknya menjadi yang paling populer, dan juga yang paling berkembang luas.

Banyak perusahaan besar yang menggunakan jQuery, seperti:

     * Google
     * Microsoft
     * IBM
     * Netflix

Akankah JQuery bekerja di semua browser?

Tim jQuery tahu semua tentang isu lintas-browser, dan mereka telah menulis pengetahuan ini ke jQuery library. jQuery akan berjalan persis sama di semua browser utama, termasuk Internet Explorer 6!...

Artikel Selanjutnya .....

PHP 5 Tutorial

PHP Tutorial

PHP adalah alat yang ampuh untuk membuat halaman Web dinamis dan interaktif.

PHP adalah alternatif yang banyak digunakan, gratis, dan efisien untuk pesaing seperti Microsoft ASP.

Dalam tutorial PHP kami Anda akan belajar tentang PHP, dan bagaimana mengeksekusi script pada server Anda.

PHP Pendahuluan

PHP adalah bahasa scripting server-side.

Apa yang Anda Sudah Harus Ketahui

Sebelum melanjutkan, anda harus memiliki pemahaman dasar sebagai berikut:

     * HTML / XHTML
     * JavaScript

Apa itu PHP?

     * PHP adalah singkatan dari PHP: Hypertext Preprocessor
     * PHP adalah server-side scripting language, seperti ASP
     * PHP script dieksekusi di server
     * PHP mendukung banyak database (MySQL, Informix, Oracle, Sybase, Solid, PostgreSQL, Generic ODBC, dll)
     * PHP adalah sebuah perangkat lunak open source
     * PHP adalah gratis untuk men-download dan digunakan
Apa yang dimaksud dengan file PHP?

     * PHP file dapat berisi teks, tag HTML dan script
     * PHP file dikembalikan ke browser sebagai HTML biasa
     * PHP file memiliki ekstensi file dari ". php", "php3.", Atau ". phtml"

Apa itu MySQL?

     * MySQL adalah database server
     * MySQL sangat ideal untuk aplikasi kecil dan besar
     * MySQL mendukung standar SQL
     * MySQL mengkompilasi pada sejumlah platform
     * MySQL gratis untuk di download dan digunakan
PHP + MySQL

     * PHP dikombinasikan dengan MySQL adalah cross-platform (Anda dapat mengembangkan di Windows dan pada platform Unix)
Mengapa PHP?

     * PHP berjalan pada platform yang berbeda (Windows, Linux, Unix, dll)
     * PHP kompatibel dengan hampir semua server yang digunakan saat ini (Apache, IIS, dll)
     * PHP adalah gratis untuk men-download dari sumber daya PHP resmi: www.php.net
     * PHP mudah dipelajari dan berjalan efisien pada sisi server
Darimana di Mulai?

Untuk mendapatkan akses ke server web dengan dukungan PHP, Anda harus:

     * Instal Apache (atau IIS) di server Anda sendiri, menginstal PHP, dan MySQL
     * Atau menggunakan web hosting dengan dukungan PHP dan MySQL

Artikel Selanjutnya .....

JavaScript Tutorial

JavaScript Tutorial

JavaScript adalah bahasa scripting dari Web.

JavaScript digunakan dalam miliaran halaman Web untuk menambahkan fungsionalitas, memvalidasi form, berkomunikasi dengan server, dan banyak lagi.

JavaScript mudah dipelajari. Anda akan menikmatinya.

JavaScript Pendahuluan

JavaScript adalah bahasa scripting yang paling populer di dunia. Ini adalah bahasa standar web, dan banyak digunakan di server, desktop, dan ponsel.

Apa yang Anda Sudah Harus Anda Ketahui

Sebelum Anda melanjutkan, Anda harus memiliki pemahaman dasar berikut:

* HTML dan CSS

JavaScript adalah Bahasa Scripting

Sebuah bahasa scripting adalah bahasa pemrograman ringan yang mendukung penulisan skrip.

JavaScript dirancang untuk menambah interaktivitas halaman HTML.

JavaScript kode pemrograman yang dapat dimasukkan ke dalam halaman HTML yang akan dijalankan oleh browser web.

Desainer HTML banyak yang tidak programmer, tapi JavaScript adalah bahasa dengan sintaks yang sangat sederhana. Hampir setiap orang dapat menempatkan "potongan" kecil dari kode JavaScript ke halaman HTML.

JavaScript vs Java

JavaScript dan Java adalah dua bahasa yang sama sekali berbeda, baik dalam konsep dan desain.

Java (dikembangkan oleh Sun Microsystems) adalah bahasa pemrograman yang lebih kompleks dalam kategori yang sama seperti C dan C + +.

JavaScript = ECMAScript

ECMA-262 adalah nama resmi dari standar JavaScript.

JavaScript diciptakan oleh Brendan Eich di Netscape, dan muncul untuk pertama kalinya di Netscape Navigator (web browser tidak lagi ada) in1995.

Standar JavaScript diadopsi oleh standar industri asosiasi ECMA pada tahun 1997.

Pengembangan standar (ECMAScript-262) adalah suatu proses yang berkelanjutan.

Artikel Selanjutnya .....

Jumat, 28 September 2012

HTML 5 Format Teks

HTML Line Breaks

HTML Line Breaks (Baris Baru)

Gunakan tag <br /> jika Anda ingin membuat baris baru tanpa memulai paragraf baru:

<!DOCTYPE html>
<html>
<body>
<p>Ini adalah<br />paragra paragraf<br />dengan line breaks</p>
</body>
</html>

Tag <br /> merupakan elemen HTML yang kosong. Ia tidak memiliki tag akhir.
<br> atau <br />

Dalam XHTML dan XML, elemen tanpa tag akhir (tag penutup) tidak diperbolehkan.

Kedua <br> dan <br /> bekerja di semua browser HTML, tetapi untuk aplikasi XHTML dan XML Anda harus menggunakan <br />.

HTML Output - Tips Berguna

Anda tidak bisa memastikan bagaimana HTML akan ditampilkan. Layar besar atau kecil, dan ukuran jendelanya akan menciptakan hasil yang berbeda.

Dengan HTML, Anda tidak dapat mengubah output dengan menambahkan spasi ekstra atau baris ekstra dalam kode HTML Anda.

Browser akan menghapus spasi ekstra dan garis ekstra saat halaman ditampilkan. Setiap jumlah baris dihitung sebagai satu baris, dan sejumlah ruang dihitung sebagai satu spasi.

<!DOCTYPE html>
<html>
<body>
<p>
   My Bonnie lies over the ocean.
    My Bonnie lies over the sea.
   My Bonnie lies over the ocean.
    Oh, bring back my Bonnie to me.
</p>
<p>Note that your browser ignores the layout!</p>
</body>
</html>

Artikel Sebelumnya .....
Artikel Selanjutnya .....

Kamis, 27 September 2012

HTML 5 Paragraf

HTML Paragraf

Dokumen HTML dibagi ke dalam paragraf.

HTML Paragraf

Paragraf didefinisikan dengan tag <p>.

<!DOCTYPE html>
<html>
<body>
<p>Ini adalah paragraf</p>
<p> Ini adalah paragraf </p>
<p> Ini adalah paragraf</p>
</body>
</html>

Catatan: Browser secara otomatis menambahkan baris kosong sebelum dan sesudah paragraf.

Jangan Lupakan Tag Akhir

Kebanyakan browser akan menampilkan HTML dengan benar bahkan jika Anda lupa tag akhir:

<!DOCTYPE html>
<html>
<body>
<p>Ini adalah paragraf.
<p> Ini adalah paragraf.
<p> Ini adalah paragraf.
<p>Jangan lupa menutup HTML tag !</p>
</body>
</html>

Contoh di atas akan bekerja di hampir semua browser, tetapi tidak bergantung pada itu. Melupakan tag akhir dapat menghasilkan hasil yang tidak diharapkan atau kesalahan.

Catatan: HTML versi kedepan tidak mengijinkan Anda untuk melewatkan tag akhir.

Artikel Sebelumnya .....

Artikel Selanjutnya .....

HTML 5 Komentar

HTML Komentar

Komentar dapat dimasukkan ke dalam kode HTML untuk membuatnya lebih mudah dibaca dan dimengerti. Komentar diabaikan oleh browser dan tidak ditampilkan.

Komentar ditulis seperti ini:

<!DOCTYPE html>
<html>
<body>

<p>Ini adalah paragraf</p>
</body>
</html>

Catatan: Ada tanda seru setelah kurung buka, tetapi tidak sebelum kurung penutup.

Tip HTML - Cara Melihat Source Code HTML

Pernahkah Anda melihat halaman Web dan bertanya-tanya "Hei! Bagaimana mereka melakukan itu?"

Untuk mengetahuinya, klik kanan di halaman tersebut dan pilih "View Source" (IE) atau "View Page Source" (Firefox), atau serupa untuk browser lainnya. Ini akan membuka jendela yang berisi kode HTML halaman tersebut.

Artikel Sebelumnya .....

Artikel Selanjutnya .....

HTML 5 Line

HTML Lines (Garis)

Tag <hr /> menciptakan garis horizontal di halaman HTML.

Element <hr /> dapat digunakan untuk memisahkan isi:

<!DOCTYPE html>
<html>
<body>
<p> tag hr mendefinisikan garis horizontal</p>
<hr /><p>Ini adalah paragraf</p>
<hr /><p> Ini adalah paragraf </p>
<hr / ><p> Ini adalah paragraf </p>
</body>
</html>

Artikel Sebelumnya .....

Artikel Selanjutnya .....

Rabu, 26 September 2012

HTML 5 Heading

HTML Heading (Judul)

Heading dalam dokumen sangat penting HTML.

HTML Headings

Heading didefinisikan dengan <h1> sampai <h6> tag.

<h1> mendefinisikan heading yang paling penting. <h6> mendefinisikan heading yang tidak terlalu paling tidak penting.

<!DOCTYPE html>
<html>
<body>
<h1>Ini heading 1</h1>
<h2> Ini heading 2</h2>
<h3> Ini heading 3</h3>
<h4> Ini heading 4</h4>
<h5> Ini heading 5</h5>
<h6> Ini heading 6</h6>
</body>
</html>

Catatan: Browser secara otomatis menambahkan beberapa ruang kosong (margin) sebelum dan sesudah masing-masing heading.

Apakah Heading Penting

Gunakan HTML heading untuk judul saja. Jangan gunakan heading untuk membuat teks besar atau tebal.

Mesin pencari menggunakan heading Anda ke struktur indeks dan isi dari halaman web Anda.

Karena pengguna dapat mengetahui halaman Anda dengan heading, oleh sebab itu adalah penting untuk menggunakan heading untuk menunjukkan struktur dokumen.

Heading H1 harus digunakan sebagai judul utama, diikuti dengan judul H2, H3, dan seterusnya.

Artikel Sebelumnya ....

Artikel Selanjutnya ....

HTML 5 Atribut

HTML Atribut

Atribut memberikan informasi tambahan tentang elemen HTML.
HTML Atribut

     * Elemen HTML memiliki atribut
     * Atribut memberikan informasi tambahan tentang elemen
     * Atribut selalu ditentukan dalam tag awal
     * Atribut memiliki pasangan nama / nilai seperti: name="value"
Contoh atribut

<a href="http://www.yupocom.co.cc">Ini adalah link</a>

HTML Link didefinisikan dengan tag <a>. Alamat link ditetapkan dalam atribut href:
Nilai Atribut Selalu Ditutup Tanda Kutip

Nilai atribut harus selalu ditutup dengan tanda kutip.

Kutip ganda adalah yang paling umum, tetapi tanda kutip tunggal juga diperbolehkan.

Tip: Dalam beberapa situasi, ketika nilai atribut itu sendiri berisi tanda kutip, maka perlu menggunakan tanda kutip tunggal: name = 'John "shotgun" Nelson'

HTML Tip: Gunakan huruf kecil pada atribut

nama atribut dan nilai atribut bersifat case-insensitive.

World Wide Web Consortium (W3C) merekomendasikan nama atribut / nilai atribut ditulis dengan huruf kecil dalam HTML 4.

Versi yang lebih baru (X) HTML juga mengharuskan atribut di tulis dengan huruf kecil.

Artikel Sebelumnya .....

Artikel Selanjutnya .....

Selasa, 25 September 2012

HTML 5 Elemen

HTML Elemen

Sebuah elemen HTML adalah segalanya dari tag awal sampai akhir tag:

* Tag Awal	Isi Elemen	*Tag Akhir
<p>	Ini adalah paragraf	</p>
<a href=”index.html”	Ini adalah link	</a>
<br />

* Tag awal sering disebut tag pembuka. Tag akhir sering disebut tag penutup.
Sintaks Elemen HTML

     * Sebuah elemen HTML dimulai dengan tag awal / tag pembuka
     * Sebuah elemen HTML diakhiri dengan tag akhir / penutup akhir tag
     * Isi elemen adalah segalanya antara tag awal dan tag akhir
     * Beberapa elemen HTML memiliki isi yang kosong
     * Elemen Kosong ditutup pada tag awal
     * Sebagian besar elemen HTML dapat memiliki atribut

Tip: Anda akan belajar tentang atribut dalam bab selanjutnya dari tutorial ini.
Elemen HTML bersarang

Sebagian besar elemen HTML dapat bersarang (dapat berisi elemen HTML lainnya).

Dokumen HTML terdiri dari elemen HTML bersarang.
Contoh Dokumen HTML

<!DOCTYPE html>
<html>

<body>
<p>Ini adalah paragraph pertama saya.</p>
</body>

</html>

Contoh di atas mengandung 3 elemen HTML.
Menjelaskan Contoh HTML

elemen <p>:

<p>Ini adalah paragraf pertama saya.</p>

Elemen <p> mendefinisikan sebuah paragraf dalam dokumen HTML.
Elemen ini memiliki tag awal <p> dan tag akhir </ p>.
Isi elemen adalah: Ini adalah paragraf pertama saya.

elemen <body>:

<body>
<p>Ini adalah paragraph pertama saya.</p>
</body>

Elemen <body> mendefinisikan tubuh dari dokumen HTML.
Elemen ini memiliki tag awal <body> dan tag akhir </ body>.
Isi elemen adalah elemen HTML yang lain.

elemen <html>:

<html>
<body>
<p>Ini adalah paragraph pertama saya.</p>
</body>
</html>

Elemen <html> mendefinisikan dokumen HTML secara keseluruhan.
Elemen ini memiliki tag awal <html> dan tag akhir </ html>.
Isi elemen adalah elemen HTML lainnya (yang ada di elemen body).
Jangan Lupakan Tag Akhir

Beberapa elemen HTML mungkin akan ditampilkan dengan benar bahkan jika Anda lupa tag akhir:

<p>Ini adalah paragraph pertama saya.

Contoh di atas bekerja di hampir semua browser, karena tag penutup dianggap opsional.

Jangan lakukan hal diatas. Banyak elemen HTML akan menghasilkan hasil yang tidak diharapkan atau error jika Anda lupa tag akhir.
Elemen Kosong HTML

Elemen HTML tanpa isi disebut elemen kosong.

<br> adalah elemen kosong tanpa tag penutup (tag <br> mendefinisikan satu baris).

Tip: Dalam XHTML, semua elemen harus ditutup. Menambahkan garis miring dalam tag awal, seperti <br />, adalah cara yang tepat untuk menutup elemen kosong di XHTML (dan XML).
HTML Tip: Gunakan huruf kecil pada Tag

Tag HTML tidak case sensitif: <P> berarti sama dengan <p>. Banyak situs web menggunakan tag HTML dalam huruf besar.

World Wide Web Consortium (W3C) merekomendasikan huruf kecil dalam HTML 4, dan XHTML.

Artikel Sebelumnya .....

Artikel Selanjutnya .....

HTML 5 EDITOR

Menulis HTML Menggunakan Notepad atau TextEdit

HTML dapat diedit dengan menggunakan editor HTML profesional seperti:

Adobe Dreamweaver
Microsoft Expression Web
CoffeeCup HTML Editor

Namun, untuk belajar HTML kami merekomendasikan editor teks seperti Notepad (PC) atau TextEdit (Mac). Kami percaya menggunakan editor teks sederhana adalah cara yang baik untuk belajar HTML.

Ikuti 4 langkah di bawah ini untuk membuat halaman web pertama Anda dengan Notepad.
Langkah 1: Mulai Notepad

Untuk memulai Notepad :
Start
    All Programs
        Accessories
            Notepad

Langkah 2: Edit HTML Anda dengan Notepad

Ketik kode HTML Anda ke Notepad Anda:

Langkah 3: Simpan HTML Anda

Pilih Save as .. dalam menu file di Notepad.

Bila Anda menyimpan file HTML, Anda dapat menggunakan extension htm atau html. Tidak ada perbedaan, itu sepenuhnya terserah Anda.

Simpan file dalam satu folder.

Langkah 4: Jalankan HTML di Browser Anda

Memulai browser web Anda dan buka file html Anda dari menu, Open File, atau hanya menelusuri folder dan double-klik file HTML Anda.

Hasilnya akan terlihat seperti ini:

Artikel Sebelumnya .....

Artikel selanjutnya .....

Rabu, 19 September 2012

HTML 5

HTML 5 <!DOCTYPE>

Dalam HTML 5 hanya ada satu Deklarasi <!DOCTYPE>, dan itu sangat sederhana:

<!DOCTYPE html>

Minimum HTML 5 Dokumen

Di bawah ini adalah dokumen HTML 5 yang sederhana, dengan minimum tag yang dibutuhkan:

<!DOCTYPE html>
<html>
<head>
<title>Judul Dokumen</title>
</head>

<body>
Isi Dokumen ......
</body>

</html>

HTML 4.01 Strict

DTD ini berisi semua elemen HTML dan atribut, tapi TIDAK TERMASUK presentasional atau elemen usang (seperti font). Framesets tidak diperbolehkan.

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

HTML 4.01 Transitional
DTD ini berisi semua elemen HTML dan atribut, TERMASUK presentasional atau elemen usang (seperti font). Framesets tidak diperbolehkan.

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

HTML 4.01 Frameset

Ini sama dengan DTD HTML 4.01 Transitional, namun memungkinkan penggunaan Frameset.

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

XHTML Strict 1.0

DTD ini berisi semua elemen HTML dan atribut, tapi TIDAK TERMASUK presentasional atau elemen usang (seperti font). Framesets tidak diperbolehkan. Markup juga harus ditulis sebagai well-formed XML.

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

XHTML Transitional 1.0

DTD ini berisi semua elemen HTML dan atribut, TERMASUK elemen presentasional (seperti font). Framesets tidak diperbolehkan. Markup juga harus ditulis sebagai well-formed XML.

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

XHTML 1.0 Frameset

Ini sama dengan DTD XHTML 1.0 Transitional, namun memungkinkan penggunaan Frameset.

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

XHTML 1.1

Ini sama dengan DTD XHTML 1.0 Strict, tetapi memungkinkan Anda untuk menambahkan modul (misalnya untuk memberikan dukungan ruby untuk bahasa Asia Timur).

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

Deklarasi <!DOCTYPE> didukung di semua browser.

Definisi dan Penggunaan

Deklarasi <!DOCTYPE> harus menjadi hal yang pertama dalam dokumen HTML 5 Anda, sebelum tag <html>.
Deklarasi <!DOCTYPE> bukanlah tag HTML , Itu adalah instruksi ke web browser tentang versi HTML pada halaman yang ditulis.
Dalam HTML 4.01, semua Deklarasi <!DOCTYPE> memerlukan referensi untuk DTD, karena HTML 4.01 didasarkan pada SGML.

HTML 5 tidak didasarkan pada SGML, dan karenanya tidak memerlukan referensi ke DTD.
Tips dan Catatan

Tip: Selalu tambahkan Deklarasi <!DOCTYPE> untuk dokumen HTML Anda, sehingga browser tahu apa jenis dokumen yang dimaksud.

Catatan: tag <!DOCTYPE> tidak memiliki tag akhir.
Tip: Deklarasi <!DOCTYPE> TIDAK case sensitive.

Artikel Sebelumnya ....

Artikel Selanjutnya .....

Minggu, 16 September 2012

HTML 5 Tutorial

HTML5 adalah generasi berikutnya dari HTML

Apakah HTML5?

HTML5 akan menjadi standar baru bagi HTML.

Versi sebelumnya dari HTML, HTML 4.01, tahun 1999 dan Web telah berubah banyak sejak itu.

HTML5 masih terus dikembangkan. Namun, banyak browser yang telah mendukung elemen HTML5 baru dan API.
Versi HTML
Sejak awal pengembangan web, ada banyak versi HTML:

Versi	Tahun
HTML	1991
HTML +	1993
HTML 2.0	1995
HTML 3.2	1997
HTML 4.1	1999
XHTML 1.0	2000
HTML 5	2012
XHTML 5	2013

Bagaimana Memulai HTML5?

HTML5 merupakan kerjasama antara World Wide Web Consortium (W3C) dan Web Hypertext Application Technology Working Group (WHATWG).

WHATWG bekerja untuk web dan aplikasi, dan W3C bekerja untuk XHTML 2.0. Pada tahun 2006, mereka memutuskan untuk bekerja sama dan menciptakan sebuah versi baru dari HTML.

Beberapa aturan untuk HTML5 :

Fitur baru harus didasarkan pada HTML, CSS, DOM, dan JavaScript
Mengurangi kebutuhan untuk plugin eksternal (seperti Flash)
Lebih baik penanganan kesalahannya
Lebih markup untuk menggantikan scripting
HTML5 merupakan perangkat independen
Proses pengembangan harus dilihat oleh publik

Fitur Baru - HTML5

Beberapa fitur baru yang paling menarik di HTML5:

Unsur <canvas> untuk menggambar 2D
Elemen <video> dan elemen <audio> untuk media pemutaran video dan audio
Dukungan untuk penyimpanan lokal
Spesifikasi unsur-unsur konten baru, seperti <article>, <footer>, <header>, <nav>,<section>
Bentuk kontrol baru, seperti kalender, tanggal, waktu, email, url, search

Browser yang mendukungan untuk HTML5

HTML5 belum menjadi standar resmi, dan tidak ada browser yang memiliki dukungan HTML5 secara penuh.

Tapi semua browser utama (Safari, Chrome, Firefox, Opera, Internet Explorer) terus menambahkan fitur HTML5 baru untuk versi terbaru mereka.

Artikel Selanjutnya .....

Rabu, 12 September 2012

CSS 3 TUTORIAL

CSS TUTORIAL

Apa yang Harus Sudah Anda Ketahui ???

Sebelum melanjutkan, anda harus memiliki pemahaman dasar HTML atau XHTML

Apa itu CSS?

CSS singkatan dari Cascading Style Sheets

Styles mendefinisikan bagaimana menampilkan elemen HTML

Styles ditambahkan ke HTML 4.0 untuk memecahkan masalah

Style Sheets Eksternal dapat menyimpan banyak pekerjaan

Style Sheets Eksternal disimpan dalam file CSS

Styles Mengatasi Masalah Besar.

HTML tidak pernah dimaksudkan untuk berisi tag untuk memformat dokumen. HTML dimaksudkan untuk menentukan isi dari dokumen, seperti:

Ini adalah heading

Ini adalah sebuah paragraf.

Ketika tag seperti , dan atribut warna ditambahkan ke spesifikasi HTML 3.2, itu memulai sebuah mimpi buruk bagi pengembang web. Pengembangan situs web yang besar, di mana font dan informasi warna yang ditambahkan ke setiap halaman, menjadi proses yang panjang dan mahal.

Untuk mengatasi masalah ini, World Wide Web Consortium (W3C) menciptakan CSS.

Dalam HTML 4.0, semua format bisa dihapus dari dokumen HTML, dan disimpan dalam file CSS yang terpisah.

Semua browser mendukung CSS hari ini.

CSS Menyimpan Banyak Pekerjaan !

CSS mendefinisikan BAGAIMANA elemen HTML harus ditampilkan. Styles biasanya disimpan dalam file css eksternal. Style sheet eksternal memungkinkan Anda untuk mengubah tampilan dan tata letak dari semua halaman di situs Web, hanya dengan mengedit satu file tunggal!

Artikel Selanjutnya .....

Label

Minggu, 30 September 2012

Jumat, 28 September 2012

Kamis, 27 September 2012

Rabu, 26 September 2012

Selasa, 25 September 2012

Rabu, 19 September 2012

HTML 5 <!DOCTYPE>

Minggu, 16 September 2012

Rabu, 12 September 2012