Kamis, 13 November 2008

Dreamweaver, and NotePAd,

Adobe Dreamweaver merupakan program penyunting halaman web keluaran Adobe Systems yang dulu dikenal sebagai Macromedia Dreamweaver keluaran Macromedia. Program ini banyak digunakan oleh pengembang web karena fitur-fiturnya yang menarik dan kemudahan penggunaannya. Macromedia meluncurkan versi terakhir Macromedia Dreamweaver yaitu versi 8.

Notepad++ adalah penyunting kode sumber bebas yang mendukung berbagai bahasa pemrograman yang berjalan di sistem operasi Windows. Proyek ini dilayani oleh Sourceforge.net. Program ini dibuat dengan dasar Scintilla dan ditulis dengan bahasa C++.

Rabu, 05 November 2008

Entitas Karakter



Beberapa entitas karakter yang sering dipakai:

Hasil

Penjelasan
Nama Entitas
Nomor Entitas
 
Spasi
 
 
<
Kurang dari
&lt;
&#60;
>
Lebih dari
&gt;
&#62;
&
Dan
&amp;
&#38;
"
Tanda kutip
&quot;
&#34;
'
Kutip tunggal
&apos; (Ndak berlaku di IE)
&#39;

Selasa, 04 November 2008

Membuat Tabel

Baru2 ini abis dapet request untuk cara pembuatan tabel, kemaren2 mo nge-post ga sempet,hohohoho sok sibuk deh. Sebenar ny simple aj c, beberapa elemen yang di gunakan ialah:
  • <table> - membuat table
  • <td> - kolom pada table/sel pada table
  • <tr> - baris pada table/row pada table

<TABLE>

Pelengkapnya :
  • align - meratakan tabel ke kiri, ke tengah atau ke kanan.
  • bgcolor - menunjukkan warna background pada tabel
  • border - lebarnya batas border dalam satuan pixel
  • cellpadding - luas yang tak terlihat antara isi sel dan aktual dinding sel
  • cellspacing - luas yang aktual (dalam pixel) antara dua sel
  • width - menunjukkan luas dari tabel dalam satuan pixel atau presentase
Contoh : <table align=''center'' bgcolor=''blue'' border=''3'' cellpadding=''3'' cellspacing=''5'' width=''90%''>

<TR>
Pelengkapnya:
  • align - meratakan isi dari baris (row) yaitu ke kiri, kanan, dan tengah
  • bgcolor - menunjukkan warna background dari baris (row)
  • valign - meratakan secara vertikal isi dari baris (row) ke atas, tengah, dan bawah
Contoh : <TR align="right" bgcolor="pink" valign="top">

<TD>

Pelengkapnya:
  • align - meratakan isi dari baris (row) yaitu ke kiri, kanan, dan tengah
  • background - tempat dari gambar background di dalam sel
  • bgcolor - menunjukkan warna background semua tabel
  • colspan - menambah panjang dari sel ke angka 2 atau lebih
  • height - menunjukkan tinggi dari sel dalam satuan pixel
  • nowrap - perlengkapan untuk mengunci isi yang kita buat agar tetap pada garis yang sama
  • rowspan - menambah ketinggian menambah panjang dari sel ke angka 2 atau lebih
  • valign - meratakan secara vertikal isi dari baris (row) ke atas, tengah, dan bawah
Contoh yang paling simple dalam membuat table ialah :

<table width="200" border="1" cellspacing="0" cellpadding="0">
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>



note: &nbsp; bermakna spasi (dapat di ganti dengan text yg kamu inginkan). Apabila kamu ingin text yg berada table tersebut "center" maka <tr> (tag pembuka) di ganti dengan <tr align="center"> maka otomatis semua text yang kita masukkan ke dalam kolom (<td>) tersebut akan menjadi center sampai akhir tag penutup dari elemen (</tr>) kita memang belom mempelajari tentang entitas karakter, tapi aku akan mengepost ny as soon as possible,hehehehhehehh

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?