• Embed Doc
  • Copy Link
  • Readcast
  • Collections
  • 2
    CommentGo Back
Download
 
0
HTML & PHP
 
Oleh :Lusiana Soraya ( Nusa_Dharma2003@yahoo.com )
Supported by :HIMPUNAN MAHASISWA MANAJEMEN
INFORMATIKA DAN KOMPUTERISASI AKUNTANSI
 AMIK - BSI2005
Alga Musa
1 
PENDAHULUAN
Internet bukan lagi menjad kalimat yang asing bagi telinga kita.Bahkan orang awam sekalipun sudah mengenal apa yang dinamakaninternet, kata-kata world wide web (www) seakan-akan sudah menjadibagian yang tidak dapat dipisahkan dari kehidupan modern saat ini. Situs-situs web menampilkan berbagai informasi apapun yang ada di belahandunia tidak peduli seberapapun jauhnya.Untuk membuat suatu situs web yang menarik dan interaktif, yangtidak hanya sekedar menampilkan informasi, tetapi dapat berinteraksidengan user, sehingga suatu situs tidak bersifat statis, tetapi dapat menjadibersifat dinamis, membutuhkan kemampuan pemrograman web.Dalam pendahuluan ini akan diberikan pengantar tentangpemrograman web. Apa yang dimaksud server-side programming dan apayang dimaksud dengan server-side programming.
SERVER SIDE VS CLIENT SIDE
Teknologi yang digunakan dalam pemrograman web dibagimenjadi dua yaitu
server side
dan
client side
. Pada
server side
, perintah-perintah program dijalankan di server dan dikirimkan ke browser sudahdalam bentuk HTML. Sedangkan
client side
, proses akan dilakukan di webbrowser. Biasanya
client side
digunakan untuk hal-hal yang membutuhkaninteraksi user tetapi data yang ditampilkan tetap dan seragam.Aplikasi web berjalan pada protokol HTTP, dan semua protokol diinternet selalu melibatkan antara server dan client. Ketika seseorangmengetikkan suatu alamat di browser, maka browser akan mengirimkanperintah tersebut ke web server. Jika yang diminta oleh client adalah fileyang mengandung perintah
server side
maka server web akan menjalankandahulu program tersebut lalu mengirimkannya kembali ke browser dalambentuk HTML sehingga dapat diterjemahkan oleh browser. Sedangkan jikayang diminta oleh client adalah file yang mengandung file
client side
makaoleh server file tersebut akan langsung dikirimkan ke browser.Banyak sekali bahasa pemrograman yang dipakai padapemrograman web, diantaranya : CGI/Perl, Active Server Pages (ASP), JavaServer Pages (JSP), PHP, ColdFusion (CFM), dll, yang kesemuanya ituadalah program
server side
. Sedangkan untuk
client side
misalnya sajaJavaScript, VBScript, HTML.
 
 
Alga Musa
2 
HTML
 
Hypertext Markup Language
(HTML) adalah bahasa standar dalam menulis halaman web, HTML merupakan pengembangan dari standar pemformatan dokumen teks. HTML sebenarnya adalah dokumen dalambentuk ASCII atau teks biasa yang dapat diterjemahkan oleh browser webmenjadi suatu halaman yang menarik.
STRUKTUR DOKUMEN HTML
Sesuai dengan namanya yaitu
Hypertext Markup Language
 (HTML) maka dokumen HTML terdiri dari tanda-tanda (
markup
) untukmenandai perintah-perintahnya (yang selanjutnya akan kita sebut sebagai
tag
).
Tag
HTML biasanya adalah tag-tag yang berpasangan danditandai dengan simbol < dan >, sedangkan ‘pasangan’ atau akhir perintahdari sebuah
tag
ditandai dengan tanda ‘/’, misalnya pasangan dari tag <tag>adalah </tag>.Setiap dokumen HTML memiliki struktur sbb :
<HTML><HEAD><TITLE>Judul yang muncul pada title bar web</TITLE></HEAD><BODY>Text, gambar atau isi dokumen HTML anda</BODY></HTML>
untuk lebih jelasnya, anda buka editor anda (mis : NOTEPAD) lalu ketikkanbaris perintah HTML diatas dan panggil melalui browser web anda.
 
Gambar 1. Tampilan Latihan 1
Alga Musa
3 
Heading
Tag yang pertama kali akan kita pelajari adalah tag heading, yangberfungsi untuk memformat Heading (Judul/sub judul) dalam sebuahdokumen. Ada 7 buah heading yang dikenal dalam HTML yaitu <H1>sampai <H7>. Untuk mengetahui ukuran tiap heading, anda dapat mencobabaris-baris berikut :
<HTML>
 
<HEAD><TITLE>Latihan Heading</TITLE></HEAD><BODY><H1>Heading 1</H1><H2>Heading 2</H2><H3>Heading 3</H3><H6>Heading 6</H6><H7>Heading 7</H7></BODY></HTML>
Paragraf 
Untuk memformat paragraf kita bisa menggunakan tag <P>.Dengan tag ini kita bisa menentukan
alignment
(posisi) dari dokumen HTML.Untuk mengatur posisi tulisan kita menggunakan atribut ALIGN. AtributALIGN diikuti dengan posisi yang diinginkan.Selain tag <P> ada pula tag <BR> untuk pindah baris, <HR> untukmembuat garis, <BLOCKQUOTE> untuk membuat kutipan, <PRE> untukmenampilkan text sama dengan yang anda ketikkan dalam dokumen HTML,misal anda mengetikkan :
<HTML><HEAD><TITLE>TEST</TITLE><HEAD><BODY>HalloHalloHallo</BODY></HTML>
 Maka yang akan ditampilkan oleh browser adalah
HalloHalloHallo
 
Alga Musa
4 
Hal itu terjadi karena HTML tidak mengenali tombol
Enter 
sehingga tomboltersebut diabaikan. Untuk mengatasi hal tersebut maka kita menggunakantag <PRE> tersebut.
<HTML><HEAD><TITLE>Latihan Menggunakan Paragraf</TITLE></HEAD><P ALIGN=”right”>Tulisan ini rata kanan.<P ALIGN=”center”>Tulisan ini akan berada di tengah dokumen<P ALIGN=”left”>Tulisan ini rata kiri<P align=”left”>Hallo,<BR>Apakah anda sudah bisa HTML<BR>Kalau sudah bisa, baguslah<BR><PRE><--------->| u u || u || --- |<---------></PRE></BODY></HTML>
Gambar 2. Tampilan Latihan 2
Font
Alga Musa
5 
Untuk mengatur jenis, ukuran, warna suatu font, kita bisamenggunakan tag <FONT>, tag <FONT> ini memiliki beberap atributdiantaranya FACE dan COLOR.Atribut FACE digunakan untuk menentukan jenis font yang akankita gunakan, semisal kita akan menggunakan jenis font Comic Sans MS,maka kita dapat menuliskan <FONT FACE=”Comic Sans MS”>. SedangkanCOLOR berfungsi untuk menentukan warna font, bisa dengan caramenyebutkan nama warna seperti red, green dan blue atau menggunakannilai RGB (Red Green Blue) dari suatu warna, misalnya FF0000 untuk red,00FF00 untuk green dan 0000FF untuk blue. Ada juga atribut SIZE untukmenentukan ukuran font
<HTML><HEAD><TITLE>Latihan Font</TITLE></HEAD><BODY><FONT FACE=”Comic Sans MS” COLOR=”red” SIZ=1>Ini Menggunakan Font Comic Sans,warna merah dan ukurannya 1</FONT><BR><FONT FACE=”Monotype Corsiva” COLOR=”blue” SIZE=3>Ini menggunakan Font Monotype Corsiva,warna biru dan ukurannya 3</FONT></BODY></HTML>
 
Gambar 3. Contoh Latihan Font
of 00

Leave a Comment

You must be to leave a comment.
Submit
Characters: ...
syudas

thanx yac...

reply01 / 24 / 2010
agus_muhardi

Sama2 semoga bermanfaat,,,,,,,,,,,,,,,,,,,,,,,,,,,

01 / 27 / 2010
You must be to leave a comment.
Submit
Characters: ...