Monday 16 July 2012

HTML Scripting – Tingkat Dasar

No comments


A.    Definisi HTML
OK kita bahas satu persatu…mulai dari pengertian..
“ HTML adalah sekumpulan kode logika (markup) yang diapit oleh tag (tanda kurung siku) untuk mengatur bagaimana penampilan sebuah dokumen web dan kandungan informasinya. Pemrograman HTML berbeda dengan pemrograman Pascal yang kalian sedang pelajari. “ Jadi HTML kode2 untuk  membuat web…
-  HTML disajikan dalam web browser oleh web server
-  HTML pada umumnya berisi  informasi ataupun interface, bukan merupakan murni source code asli.
-  HTML bisa hasil dari representasi bahasa pemrograman server side seperti PHP, JSP,NET, ruby dll
 B.    HTML5
HTML5 adalah next generation dari HTML 4.01 / XHTML 1.x. HTML5 akan menjadi standarbaru HTML, XHTML dan HTML DOM. HTML5 merupakan hasil kerjasama dari W3C (WorldWide Web Consortium) dan WHATWG (Web Hypertext Application Technology Working Group.Browser modern kebanyakan sudah mendukung HTML5, seperti Safari, Opera 10.6,Mozilla Firefox 3.5, Google Chrome 6.0, dll.
fitur baru yang ada di HTML5 :
1. Elemen Canvas
Untuk menggambar objek di halaman web tanpa menggunakan flash maupun apletjava.
2. Elemen audio dan video
Dengan elemen ini, plugin pemutar audio dan video tidak dibutuhkan lagi karena
sudah ada tag  khusus dan codec OGG sudah langsung mengenalinya
3. Local offline storage
Local storage ini bukan sekedar cookies biasa. Fitur ini mampu menyimpan data dalamukuran besar sekaligus.Konten elemen baruSeperti article, footer, header, nav, section, calendar, date, time, email, url, search
C.    Format Content dalam HTML
Dalam menulis HTML diperlukan pemformatan yang sesuai sehingga ada pemisahanantara satu kata, kalimat , paragraf dengan  yang lainnya. Berikut beberapa format untukkonten teks webpage.
  1. Heading
Adalah format teks tertentu yang digunakan sebagai judul dari suatu paragraph. Headinglebih tepat digunakan untuk tulisan berkedudukan sebagai judul atau sub bab. Ada 6tingkatan heading.

merupakan tingkatan dengan ukuran font paling besar, sedangkan

sebaliknya.
1. Paragraph
Jika kita ingin menampilkan dokumen yang cukup panjang, misalnya pada suatu postinganblog, maka kita perlu pemisah antar kalimat yang biasa kita sebut paragraph,
contoh:
2. Break
Adalah tag yang digunakan untuk memenggal atau memotong kalimat atau konten HTML. Penulisan brak yaitu
3. Horizontal Rule
Digunakan untuk membuat garis batas horizontal. Atribut yang dapat digunakan antara lain seperti align, width, size, noshade, color. Penulisan horizontal rule yaitu

.
D.   Format Text
Format text dalam HTML berfungsi menunjukkan perbedaan dan penekanan terhadap isidan maksud dari teks tersebut. Perbedaan ditampilkan dengan bentuk huruf tebal, miring,garisbawah dan semacamnya.
  1. Font
Untuk mengatur huruf pda HTML. Namun pada HTML5 sudah tidak support lagi.
  1. Size
Untuk mengatur besarnya huruf, paling kecil 1 dan paling besar 7. Tetapi bisa
juga menggunakan ukuran pixel dengan max tidak terbatas
  1. Face
Untuk mengatur jenis huruf, bisa juga dituliskan lebih dari satu yang artinya
mempunyai prioritas yang berbeda-beda.
  1. Color
Untuk memberi warna pada font.
Ada 2 cara yaitu, pertama menuliskan nama
warnanya seperti red, green atau blue. Dan cara kedua dengan menggunakan
nilai RGB (Red Green Blue) dari suatu warna yang dinyatakan dalam angka
hexadecimal.
  1. Blockquote dan Address
Blockquote digunakan untuk menulis kutipan teks, sehingga tulisan akan menjorok
kekanan layar browser. Sedangkan Address merupakan salah satu elemen yang  umum di
dalam suatu dokumen, untuk penulisan alamat perusahaan, personal atau instansi.
  1. List
Berfungsi untuk menjabarkan point-point informasi.
ada 2 buah jenis list
yaitu ordered list
    , dan unordered list
      .  Selain itu, list juga bisa digunakan sebagai
      dasar dalam pembuatan menu dengan menggabungkan CSS atau javascript.
      • Ordered list (list terurut), penomeran menggunakan angka 1,2,3,4,…dst ataupun
      menggunakan sejumlah item dalam list tersebut.
      • Unordered list, bisa diartikan seperti bulleted list dalam aplikasi “Office”,
      defaultnya berupa noktah.
      • Neste list. Merupakan unordered list yang digunakan secara bersarang,
      maksudnya di dalam list ada list lagi.
      1. Link
      Link berfungsi untuk memberikan sebuah hubungan kepada sebuah konten ataupun
      dokumen lain baik dalam satu web page ataupun berbeda bahkan ke seluruh konten yang
      berada pada satu jaringan yang sama. Atribut href sering dipakai. Href merupakan
      kepanjangan dari hypertext reference.
      Ketika link ditekan, maka halaman baru akan muncul sesuai value yang dipilih. Dengan
      menggunakan attribute target, kita bisa menentukan value nya yang berfungsi Valuenya yaitu :
      • _blank   : target URL akan dibuka di tab/ jendela baru
      • _self  : target URL akan dibuka di tab yang sama
      • _parent   : target URL akan dibuka di tab/ dokumen sebelumnya.
      • _top  : target URL akan dibuka di tab/ jendela secara full
      Ada beberapa jenis link, yaitu sbb:
      • Link Absolute : Digunakan untuk membuat link ke web page lain yang berada di situs lain.
      • Link Relative : Digunakan untuk membuat link ke web page lain yang berada di dalam web tersebut, atau masih berada dalam public_html / htdocs yang sama.
      • Bookmark : Digunakan untuk menghubungkan dengan bagian-bagian  tertentu yang ada pada dokumen yang sama. Ada 2 tag yang diperlukan dalam mebuat bookmark,
      1.  Media pada HTML
      Memasukkan konten media  selain  image  sangat memungkinkan pada HTML, dengan
      menggunakan  tag    maka  beberapa  media  yang  didukung  oleh  browser
      memungkinkan  untuk  dimunculkan  mulai  dari  sebuah  file  music  sampai  sebuah  file  office.
      Beberapa atribut pada tag embed:
      • src : alamat resource untuk di masukkan ke tag embed.
      • width : lebar area untuk resource yang akan dimunculkan.
      • height : tinggi area untuk resource yang akan ditampilkan.
      • align : posisi pada embed misalnya left, right, center.
      • name : nama untuk identitas objek.
      • pluginspage : identitas untuk menandakan dimana software untuk plugins yang di  embedkan.
      • pluginurl: url untuk instalasi plugin.
      • hidden : untuk menyembunyikan atau tidak objek.
      • href : membuat link pada objek.
      • target:  target pada objek yang akan di tampilkan.
      • autostart: jika konten atau objek yang ditampilkan berjenis music atau film maka akan  otomatis dijalankan (start).
      • loop dan playcount : jumlah untuk perulangan pada musik atau film.
      • volume : untuk menset besar suara.
      • control : untuk menampilkan posisi peletakan control
      • controller : untuk menampilkan control pada objek.
      • mastersound : untuk mengidentifikasikan music yang akan digunakan dalam
      SELESAI….!!!Alhamdulillah…

No comments :

Post a Comment