Sabtu, 01 November 2008

Dasar HTML

Entri kali ini aku pingin sedikit membahas tentang Dasar HTML. Tag HTML yang penting ialah yang mendefenisikan judul, paragraf, dan ganti baris. Cara terbaik dalam penggunaan Tag HTML ialah dengan banyak berlatih, ya tentu saja dengan menggunakan NOTEPAD (ya iyalah masa' ya iya dong).

Judul

Judul didefinisikan dengan menggunakan tag <h1> sampai >h6>. <h1> mendefinisikan huruf judul yang paling besar, dan <h6> yang terkecil. Untuk latihan coba kamu bikin file HTML berikut ini dan perhatikan hasilnya.
<h1>Ini Judul</h1>
<h2>Ini Judul</h2>
<h3>Ini Judul</h3>
<h4>Ini Judul</h4>
<h5>Ini Judul</h5>
<h6>Ini Judul</h6>
HTML secara otomatis akan menambahkan baris kosong sebelum dan sesudah judul.

Paragraf

Paragraf didefinisikan dengan menggunakan tag <p>.
<p>Ini adalah sebuah paragraf</p>
<p>Ini paragraf lainnya</p>
Sama seperti judul, HTML secara otomatis akan menambahkan baris kosong sebelum dan sesudah paragraf.

Jangan lupa Tag penutup

Kamu pastinya udah pernah ngeliat bahwa paragraf dapat ditulis tanpa tag penutup </p> kayak ginii:
<p>Ini adalah sebuah paragraf
<p>Ini paragraf lain
Contoh barusan dapat digunakan pada hampir semua jenis browser, tapi jangan ngandelin hal itu. Versi-versi HTML ke depan kayaknya ndak akan ngijinin kamu untuk melewatkan tag penutup.
Menutup semua elemen HTML dengan tag penutup adalah cara yang ampuh untuk menulis HTML yang kompatibel dengan smeua browser dan pengembangan ke depan. Hal ini juga membuat kode kita lebih mudah dimengerti (baik dibaca maupun di browse).

Ganti Baris

Tag <br> digunakan pada saat kamu pengen membuat baris baru, tapi belum ingin ganti paragraf. Tag <br> akan membuatkan sebuah baris baru buat kamu dimanapun kamu letakkan tag itu.
<p>Ini <br> adalah sebuah pa<br>ragaraf dengan ganti baris </p>
Tag <br> adalah tag yang kosong. Nah, karena itu dia tidak punya tag penutup seperti misalnya </br>, karena jadi ndak masuk akal. Ya tho?

<br> atau <br />

Kamu akan makin sering melihat penulisan tag <br> dengan cara begini: <br />
Karena tag <br> tidak memiliki tag penutup, maka tag tersebut melanggar salah satu aturan dasar dalam penulisan HTML ke depannya (XHTML yang berbasis XML), di mana semua elemen harus ditutup.
Menuliskan penggantian baris dengan cara <br/> ini menjamin bahwa file HTML kamu akan kompatibel dengan XML maupun cara penulisan HTML di masa datang.

Menuliskan Komentar dalam HTML

Tag komentar digunakan untuk menyisipkan sebuah komentar dalam kode sumber HTML. Sebuah komentas akan diabaikan oleh browser. Kamu bisa menggunakan komentar untuk menjelaskan kode yang kamu bikin, dan tentu saja hal ini akan membantu kamu saat kamu perlu melakukan perubahan pada kode kamu kapan-kapan.
<!-- Ini adalah sebuah komentar -->
Perhatikan bahwa kamu perlu menuliskan tanda seru setelah kurung buka, tetapi tidak sebelum kurung tutupnya.

Ingat hal-hal berikut!

  • Setiap tag HTML memiliki sebuah nama elemen (body, h1, p, br)
  • Tag pembuka adalah nama yang dilingkupi oleh tanda kurung siku: <h1>
  • Tag penutup adalah tanda garis miring dan nama yang dilingkupi oleh tanda kurung siku </h1>
  • Isi elemen berada di antara tag pembuka dan tag penutup
  • Beberapa elemen HTML tidak memiliki isi elemen
  • Beberapa elemen HTML tidak memiliki teg penutup

Beberapa Tips Yang Bermanfaat

Waktu kamu menulis teks HTML, maka kamu tidak akan pernah bisa yakin bagaimana teks itu ditampilkan oleh browser lain. Beberapa orang memiliki monitor yang lebih besar, dan yang lainnya. Teks akan diatur ulang setiap kali pengunjung mengubah ukuran windownya. Jangan pernah mencoba untuk membantuk teks yang memiliki baris kosong atau spasi dekat dengan teks itu.
HTML akan menghapus spasi dalam teks kamu. Berapa banyakpun kamu tuliskan spasi, tetap akan dihitung satu. Satu lagi, dalam HTML sebuah baris baru dihitung sebagai satu spasi.
Menggunakan paragraf kosong <p> untuk menyisipkan baris kosong adalah kebiasaan yang kurang baik. Gunakan tag <br> sebagai penggantinya. (tapi jangan juga gunakan tag <br> untuk membuat daftar. Tunggu sampai pelajaran tentang daftar dimulai ya).
HTML secara otomatis akan menambah baris kosong sebelum dan sesudah beberapa elemen, seperti sebelum dan sesudah paragraf dan judul.

Tag HTML Dasar

Berikut adalah tag-tag penting yang akan sangat sering kamu pakai. Dan kamu akan mempelajari masing-masing secara lebih detil terutama yang menyangkut atributnya.
Tag

Description
<html>
Mendefinsikan sebuah dokumen HTML
<body>
Mendefinisikan isi utama
<h1> to <h6>
Mendefinisikan judul 1 sampai 6
<p>
Mendefinisikan paragraf
<br>
Menyisipkan sebuah baris
<hr>
Mendefinisikan garis horisontal
<!-->
Bikin komentar

Good Luck!

FrontPage vs NotePad

Setelah berulang kali mengepost beberapa artikel yg kurang berguna dengan segala macam kalimat hasil copy-paste (ampun ketahuan deh), kali ini kami (tepatnya c aku sendiri, karena ngetikny sendirian nih,huhuhuhu) akan benar-benar mengepost dalam bentuk bahasa yang telah lulus sensor,heheheh..(zigh..)
Dalam entri kali ini, kami akan membahas tentang FrontPage dan Notepad.. Kami ulangi sekali lagi, FrontPage and Notepad. Dua aplikasi ini memang biasa di gunakan untuk membuat web. Namun each of these application memiliki keuntungan yg berbeda, trgantung cara orang memandang juga bung.
Well, first of all, i want to talk about FrontPage. Memang kalo kita pikir-pikir, yaa.. Frontpage absolutely much easier than Notepad.. How come? ya tentu saja, coz we don't need to learn HTML which can make our minds blow up,hahahahaha. Mulai ngaco deh ah. Back to the topic, Frontpage can automatically convert a file which you have made into HTML code. So simple isn't it? well i did say that FrontPage is easy. FrontPage can generates any tag HTML extensions termasuk cascading style sheets, frames, dan ActiveX Controls. Wow sangat mudah, singkat, padat, dan jelas. So, the advantages of using FrontPage is FrontPage can develop a web quickly cause FrontPage generates HTML code automatically sehingga tidak perlu repot-repot membuat HTML code.Tapi tetep aja, segala sesuatu yang ada di dunia ini memiliki kelebihan dan kekurangan. FrontPage bersifat visual yang biasa disebut WYSIWYG (What You See Is What You Get). Yang terlihat hanyalah objeknya, sedangkan script tidak terlihat. Hal inilah yang menyebabkan FrontPage memiliki kekurangan yakni If we want to change the script, we must use NotePad. FrontPage cannot be used for script editing, semisal kita mau menambahkan javascript pada tag head, kita tidak bisa langsung mengeditnya lewat FrontPage namun kita harus menggunakan Text Editor seperti NotePad.
Sekarang bagaimana dengan NotePad? Bagi pengguna NotePad, sudah jelas bahwa NotePad identik dengan kata ''NJLIMET'' alias rumit alias complicated alias ra karuan alias acakadul,hehehehe. Saya akan memberi contoh membuat web menggunakan Text Editor Notepad.
Mulailah dengan membuka Notepad (di Windows XP bagi yang belum pernah klik Start, Program, Accessories, Notepad).
Ketikkan teks berikut:

<html>
<head>
<title>Judul Halaman</title>
</head>
<body>
Ini halaman pertama saya. <b>Teks ini ditebalkan</b>
</body>
</html>


Simpan dengan nama “halamanku.htm” (dont forget tambahkan tanda kutip ganda pada nama filenya. Kalau lupa maka nama filenya akan menggunakan ekstensi default .txt sehingga menjadi halamanku.htm.txt).
Buka Browser kamu (misalnya internet explorer). Kilk File, Open, Browse dan pilih cari file halamanku.htm yang tadi kamu bikin. Klik OK, dan browser akan menampilkan halaman yang tadi kamu buat.
Gampang kan? Njilmet kan? Atau masih bingung? Aku juga bingung,hahahaha. Ok, kita akan melihat penjelasan dari contoh di atas.

Setiap tag diapit oleh tanda lebih kecil dan lebih besar. Kamu bisa melihat bahwa tag pertama adalah <html>. Tag HTML pada umumnya selalu memiliki pasangan yang memiliki tag sama dengan sedikit tambahan tanda garis miring “/”, dan kamu bisa melihat pasangan tag <html> di akhir script yaitu </html>

-Tag <html> memberitahu browser bahwa inilah awal dari dokumen HTML. Tag pasangannya yaitu </html> menyatakan bahwa inilah akhir dari dokumen HTML.

-Teks di antara <head> dan </head> adalah teks informasi header. Informasi header ini tidak ditampilkan pada jendela browser.

-Teks di antara <title> adalah judul dokumen kamu. Judul ini akan ditampilkan di caption browser (lihat di bagian paling atas kanan dari browser kamu).

-Teks di antara tag <body>  adalah teks yang akan ditampilkan pada jendela browser kamu.

-Dan terakhir, teks di antara <b> dan </b> akan ditampilkan dalam huruf tebal.

Sebagaimana sudah disampaikan di awal, we can make HMTL file in 2 extensions yaitu .htm dan .html. Nah ekstension .htm ditujukan untuk operating sistem jaman dulu yang hanya mensupport ekstensi 3 huruf. Sedangkan ekstensi .html akan lebih aman digunakan jika OS dan aplikasinya support karena lebih jelas menunjukkan bahwa ini adalah file HTML.
Sebagai catatan, setiap kamu melakukan perubahan pada file HTML kamu, maka kamu harus me-refresh browser untuk melihat perubahan tampilannya. With this explanation, i can guarantee that all of you understand.
So, The Advantages of using Notepad is we can know the detail of source code of HTML, so we can change and edit the code whatever and whenever we want. Inti nya ialah kalo menggunakan NotePad harus mau ketik ini itu, harus teliti, dan njlimet. Kekurangan dari penggunaan NotePad ialah memerlukan waktu yang lama untuk membuat web karena kita harus membuat secara manual dan one by one.

Memang kedua aplikasi menjadi kontroversi para pembuat web, kalau mau pake Notepad harus begini begini dan lama pula, kalau mau pake FrontPage emang cepet tp ga bisa begini begini. Nah kan bingung? so do i.hahaha. Memang bener kata pepatah ''Nobody's Perfect'', segala sesuatu yang tercipta dari karya dunia tidak ada yang sempurna, karena kesempurnaan ialah kesombongan tanpa ujung. Hehehehehe, jadi sok pepatah deh. Tapi kalo saya di suruh milih antara NotePad dengan FrontPage, jujur lebih pilih FrontPage karena memang yang paling mudah bung.. Semua jawaban relative dan tergantung dengan kemauan serta kebutuhan. Bagaimana dengan anda?

Kamis, 30 Oktober 2008

Difficulties in archieving WYSIWYG

A given HTML document will have an inconsistent appearance on various platforms and computers for several reasons:

Different browsers and applications will render the same markup differently.
The same page may display slightly differently in Internet Explorer and Firefox on a high-resolution screen, but it will look very different in the perfectly valid text-only lynx browser. It needs to be rendered differently again on a PDA, an internet-enabled television and on a mobile phone. Usability in a speech or braille browser, or via a screen-reader working with a conventional browser, will place demands on entirely different aspects of the underlying HTML. Printing the page, via different browsers and different printers onto various paper sizes, around the world, places other demands. With the correct use of modern HTML and CSS there is no longer any need to provide 'Printable page' links and then have to maintain two versions of the whole site. Nor is there any excuse for pages not fitting the user's preferred paper size and orientation, or wasting ink printing solid background colours unnecessarily, or wasting paper reproducing navigation panels that will be entirely useless once printed out
Browsers and computer graphics systems have a range of user settings.
Resolution, font size, colour, contrast etc can all be adjusted at the user's discretion, and many modern browsers allow even more user control over page appearance. All an author can do is suggest an appearance.
Web browsers, like all computer software, have bugs.
They may not conform to current standards. It is hopeless to try to design Web pages around all of the common browsers' current bugs: each time a new version of each browser comes out, a significant proportion of the World Wide Web would need re-coding to suit the new bugs and the new fixes. It is generally considered much wiser to design to standards, staying away from 'bleeding edge' features until they settle down, and then wait for the browser developers to catch up to your pages, rather than the other way round In this regard, no one can argue that CSS is still 'cutting edge' as there is now widespread support available in common browsers for all the major features even if many WYSIWYG and other editors have not yet entirely caught up

What you see may be what most visitors get, but it is not guaranteed to be what everyon

HTML Editor

An HTML editor is a software application for creating web pages. Although the HTML markup of the web page can be written by any text editor, specialized HTML editors can offer convenience and added functionality. For example, many HTML editors work not only with HTML, but also with related technologies such as CSS, XML and Java script or ECMAScript.