mondrugz
Pengantar Web Modern
Bagaimana tutorial ini bekerja
Tutorial ini berusaha menjelaskan secara singkat dan padat tentang pembuatan halaman web dimulai dari pengenalan dokumen HTML5 yang merupakan konten dasar dari sebuah halaman web. Dalam tutorial ini juga disajikan tentang penggunaan CSS3 untuk menyusun layout dan disain halaman web dan dilanjutkan dengan pemanfaatan JQuery sebagai bahasa pemrograman HTML5 yang merupakan kumpulan kode dari Javascript untuk membuat halaman web menjadi lebih menarik dan interaktif.
Pada bagian selanjutnya akan disajikan secara detail elemen elemen penyusun halaman web dengan mengkombinasikan tag-tag HTML5, CSS3 dan JQuery baik berupa teks, formulir, tata letak, navigasi, animasi, grafis dan multimedia dengan beberapa contoh yang menarik dengan harapan memudahkan untuk memahami penggunaan HTML5, CSS3 dan JQuery sebagai suatu kerangka kerja halaman web. Pada bagian contoh ini dapat diubah, dieksekusi dan ditampilan hasilnya pada browser sehingga mempermudah untuk mencoba penggunaan tag HTML5, properti CSS3 dan perintah-perintah JQuery.
Pada bagian akhir halaman ini akan disajikan referensi dan sumber daya HTML5, CSS3 dan JQuery disertai contoh sebagai acuan untuk memperdalam pemahaman tentang HTML5, CSS3 dan JQuery.
Pada bagian selanjutnya akan disajikan secara detail elemen elemen penyusun halaman web dengan mengkombinasikan tag-tag HTML5, CSS3 dan JQuery baik berupa teks, formulir, tata letak, navigasi, animasi, grafis dan multimedia dengan beberapa contoh yang menarik dengan harapan memudahkan untuk memahami penggunaan HTML5, CSS3 dan JQuery sebagai suatu kerangka kerja halaman web. Pada bagian contoh ini dapat diubah, dieksekusi dan ditampilan hasilnya pada browser sehingga mempermudah untuk mencoba penggunaan tag HTML5, properti CSS3 dan perintah-perintah JQuery.
Pada bagian akhir halaman ini akan disajikan referensi dan sumber daya HTML5, CSS3 dan JQuery disertai contoh sebagai acuan untuk memperdalam pemahaman tentang HTML5, CSS3 dan JQuery.
Referensi HTML
| Tag | Keterangan | HTML5 | Pengganti |
| <!--...--> | Mendefinisikan komentar | ||
| <!DOCTYPE> | Mendefinisikan tipe dokumen | ||
| <a> | Mendefinisikan hyperlink | ||
| <abbr> | Mendefinisikan singkatan | ||
| <acronym> | Mendefinisikan akronim | X | <abbr> |
| <address> | Mendefinisikan informasi kontak untuk penulis / pemilik dokumen | ||
| <applet> | Mendefinisikan sebuah applet tertanam | X | <object> |
| <area> | Mendefinisikan area dalam sebuah image-map | ||
| <article> | Mendefinisikan sebuah artikel | V | |
| <aside> | Mendefinisikan konten selain dari konten halaman | V | |
| <audio> | Mendefinisikan isi suara | V | |
| <b> | Mendefinisikan teks tebal | ||
| <base> | Menentukan basis URL / target untuk semua URL relatif dalam dokumen | ||
| <basefont> | Menentukan warna default, ukuran , dan font untuk semua teks dalam dokumen | X | CSS |
| <bdi> | Isolat bagian dari teks yang dapat diformat dalam arah yang berbeda dari teks lain di luar itu | V | |
| <bdo> | Mengganti arah teks saat ini | ||
| <big> | Mendefinisikan teks besar | X | CSS |
| <blockquote> | Mendefinisikan sebuah bagian yang dikutip dari sumber lain | ||
| <body> | Mendefinisikan tubuh dokumen | ||
| <br> | Mendefinisikan garis break | ||
| <button> | Mendefinisikan sebuah tombol diklik | ||
| <canvas> | Digunakan untuk menggambar grafik , on the fly , melalui scripting ( JavaScript biasanya ) | V | |
| <caption> | Mendefinisikan judul tabel | ||
| <center> | Mendefinisikan teks berpusat | X | CSS |
| <cite> | Mendefinisikan judul karya | ||
| <code> | Mendefinisikan sebuah bagian dari kode komputer | ||
| <col> | Menentukan sifat kolom untuk setiap kolom dalam elemen <colgroup> | ||
| <colgroup> | Menentukan kelompok dari satu atau lebih kolom dalam sebuah tabel untuk memformat | ||
| <datalist> | Menentukan daftar pilihan yang telah ditetapkan untuk kontrol input | V | |
| <dd> | Mendefinisikan deskripsi / nilai istilah dalam daftar deskripsi | ||
| <del> | Mendefinisikan teks yang telah dihapus dari dokumen | ||
| <details> | Mendefinisikan rincian tambahan bahwa pengguna dapat melihat atau menyembunyikan | V | |
| <dfn> | Mendefinisikan sebuah istilah definisi | ||
| <dialog> | Mendefinisikan sebuah kotak dialog atau jendela | V | |
| <dir> | Mendefinisikan sebuah daftar direktori | X | <ul> |
| <div> | Mendefinisikan sebuah bagian dalam sebuah dokumen | ||
| <dl> | Mendefinisikan daftar deskripsi | ||
| <dt> | Mendefinisikan istilah / nama dalam daftar deskripsi | ||
| <em> | Mendefinisikan teks menekankan | ||
| <embed> | Mendefinisikan sebuah wadah untuk ( non - HTML ) aplikasi luar | V | |
| <fieldset> | Elemen grup terkait dalam bentuk | ||
| <figcaption> | Mendefinisikan sebuah caption untuk elemen <figure> | V | |
| <figure> | Menentukan konten mandiri | V | |
| <font> | Mendefinisikan font, warna , dan ukuran untuk teks | X | CSS |
| <footer> | Mendefinisikan sebuah footer untuk dokumen atau bagian | V | |
| <form> | Mendefinisikan sebuah form HTML untuk input pengguna | ||
| <frame> | Mendefinisikan sebuah window ( frame ) dalam sebuah frameset | X | |
| <frameset> | Mendefinisikan satu set frame | X | |
| <h1> to <h6> | Mendefinisikan judul HTML | ||
| <head> | Mendefinisikan informasi tentang dokumen | ||
| <header> | Mendefinisikan sebuah header untuk dokumen atau bagian | V | |
| <hr> | Mendefinisikan perubahan tematik dalam konten | ||
| <html> | Mendefinisikan akar dari sebuah dokumen HTML | ||
| <i> | Mendefinisikan sebuah bagian dari teks dengan suara alternatif atau suasana hati | ||
| <iframe> | Mendefinisikan frame inline | ||
| <img> | Mendefinisikan sebuah image | ||
| <input> | Mendefinisikan sebuah kontrol input | ||
| <ins> | Mendefinisikan teks yang telah dimasukkan ke dalam dokumen | ||
| <kbd> | Mendefinisikan input keyboard | ||
| <keygen> | Mendefinisikan bidang key generator -pair ( untuk formulir ) | V | |
| <label> | Mendefinisikan label untuk sebuah elemen <input> | ||
| <legend> | Mendefinisikan sebuah caption untuk elemen <fieldset> | ||
| <li> | Mendefinisikan item daftar | ||
| <link> | Mendefinisikan hubungan antara dokumen dan sumber daya eksternal ( yang paling digunakan untuk link ke style sheet ) | ||
| <main> | Menentukan isi utama dokumen | V | |
| <map> | Mendefinisikan client -side image-map | ||
| <mark> | Mendefinisikan ditandai / teks yang disorot | V | |
| <menu> | Mendefinisikan daftar / menu perintah | ||
| <menuitem> | Mendefinisikan item perintah / menu bahwa pengguna dapat memanggil dari menu popup | V | |
| <meta> | Mendefinisikan metadata tentang dokumen HTML | ||
| <meter> | Mendefinisikan pengukuran skalar dalam kisaran dikenal ( alat ukur ) | V | |
| <nav> | Mendefinisikan link navigasi | V | |
| <noframes> | Mendefinisikan sebuah alternate content untuk pengguna yang tidak mendukung frame | X | |
| <noscript> | Mendefinisikan sebuah alternate content untuk pengguna yang tidak mendukung script sisi klien | ||
| <object> | Mendefinisikan obyek tertanam | ||
| <ol> | Mendefinisikan ordered list | ||
| <optgroup> | Mendefinisikan sekelompok opsi terkait dalam daftar drop-down | ||
| <option> | Mendefinisikan pilihan dalam daftar drop-down | ||
| <output> | Mendefinisikan hasil penghitungan | V | |
| <p> | Mendefinisikan paragraf | ||
| <param> | Mendefinisikan parameter untuk sebuah objek | ||
| <pre> | Mendefinisikan teks terformat | ||
| <progress> | Merupakan kemajuan tugas | V | |
| <q> | Mendefinisikan sebuah kutipan pendek | ||
| <rp> | Mendefinisikan apa yang harus ditampilkan di browser yang tidak mendukung penjelasan ruby | V | |
| <rt> | Mendefinisikan penjelasan / pengucapan karakter ( untuk tipografi Asia Timur ) | V | |
| <ruby> | Mendefinisikan sebuah penjelasan ruby ( untuk tipografi Asia Timur ) | V | |
| <s> | Mendefinisikan teks yang tidak lagi benar | ||
| <samp> | Mendefinisikan contoh output dari program komputer | ||
| <script> | Mendefinisikan sebuah script sisi klien | ||
| <section> | Mendefinisikan sebuah bagian dalam sebuah dokumen | V | |
| <select> | Mendefinisikan daftar drop-down | ||
| <small> | Mendefinisikan teks yang lebih kecil | ||
| <source> | Mendefinisikan sumber daya beberapa media untuk elemen media ( <video> dan <audio> ) | V | |
| <span> | Mendefinisikan sebuah bagian dalam sebuah dokumen | ||
| <strike> | Mendefinisikan teks strikethrough | X | <del> |
| <strong> | Mendefinisikan teks penting | ||
| <style> | Mendefinisikan informasi style untuk dokumen | ||
| <sub> | Mendefinisikan teks subscript | ||
| <summary> | Mendefinisikan sebuah heading terlihat untuk elemen <Detil> | V | |
| <sup> | Mendefinisikan teks superscripted | ||
| <table> | Mendefinisikan tabel | ||
| <tbody> | Grup isi tubuh dalam sebuah tabel | ||
| <td> | Mendefinisikan sel dalam sebuah tabel | ||
| <textarea> | Mendefinisikan input kontrol multiline ( area teks ) | ||
| <tfoot> | Grup konten footer dalam sebuah tabel | ||
| <th> | Mendefinisikan sel header tabel | ||
| <thead> | Grup isi header dalam sebuah tabel | ||
| <time> | Mendefinisikan tanggal / waktu | V | |
| <title> | Mendefinisikan judul untuk dokumen | ||
| <tr> | Mendefinisikan baris dalam tabel | ||
| <track> | Mendefinisikan trek teks untuk elemen media ( <video> dan <audio> ) | V | |
| <tt> | Mendefinisikan teks teletype | X | CSS |
| <u> | Mendefinisikan teks yang harus Gaya yang berbeda dari teks biasa | ||
| <ul> | Mendefinisikan daftar unordered | ||
| <var> | Mendefinisikan variabel | ||
| <video> | Mendefinisikan sebuah video atau film | V | |
| <wbr> | Mendefinisikan kemungkinan garis -break | V |
Subscribe to:
Posts (Atom)