PEMROGRAMAN WEB

artikel pemrograman web

Pengertian Web StatisdanDinamis

Pengertian Web StatisdanDinamis - Padakesempatan kali inisayamencobamemberikaninformasiPengertian Web StatisdanDinamis.SetelahbeberapasaatlalusayamemberikaninformasiCiri - CiriProtokol TCP/IP dan Cara Kerja TCP/IP kali inisayaakansedikitmemberikaninformasimengenaiPengertian Web StatisdanDinamis.

Pengertian Web Statis

  Web Statisadalah web yang content atauisinyatidakberubah – ubah. Maksudnyaadalahisidaridokumen yang ada di web tersebuttidakdapatdiubahsecaramudah. Inidikarenakankarena script yang digunakanuntukmembut web statistidakmendukunguntukmengubahisidokumen.

Karena script yngdigunakanuntukmembuat web statisiniseperti HTML dan Cascading Style Sheet ataubiasadisebutdengan CSS. Makadariituuntukperubahanisidokumenpada web statisharusmengubahisi file HTML atau CSS tersebut. Tentunyabagi orang awamatau orang yang tidakmengertisoal program atau script HTML dan CSS akansangatsulitsekalidilakukan. Untukitujikakitainginmengubahdokumen web statisharusmengertibenarscipt HTML atau CSS atauseringdisebut programmer yang dapatmelakukanperubahanisidokumensebuah web statis.

Web statisinibiasanyadigunakanoleh website yang menggunakan HTML, Web Search Engine, atau web Company Profile.

Pengertian Web Dinamis

  Web Dinamisadalah Web yang content atauisinyadapatberubah – ubahsetiapsaat. Karenadalamteknologipembuatan web dinamissudahdirancangsemudahmungkinbagi user yang menggunakan web dinamistersebut.

Untukperubahan content atauisidokumendalamsebuah web dinamisdibilangmudahketimbang web statis yang harusmemilikikeahliankhususpadabagian scripting web tersebut. Ketikakitaakanmengubah content atauisidarisebuah web dinamiskitahanyaperlumasukkebagian control panel ataubagian administrator web yang telahdisediakanoleh script web dinamis.

Jadiuntukpengubahan content atauisidokumendalamsebuah web dinamistidakperlumemilikikeahlian programming atauseorang programmer saja yang dapatmengubahisidokumenpada web dinamis. Untukmembuat web dinamisdiperlukanbeberapakomponenyaitu client side scripting ( HTML, JavaScript, Casing Style Sheet atau CSS) dan server side scripting seperti PHP dan program basis data seperti database MySQL untukmenyimpan data – data yang ada di web dinamis.

Web Dinamisinibanyaksekalibertebaran di internet seperti Web Berita, Personal Blog, Toko Online/Web PasngIklan, dll.SekianinformasisederhanasayamengenaiPengertian Web StatisdanDinamis.

Contoh HTML

Informasi di dalamWWW(Word Wide Web)menggunakan format HTML. Didalam HTML kitamengenal Hyper Text yaituadanya link kesuatudokumen, suatualamatmesinbahkankesuatugambar, suara. Banyak software yang digunakanuntukmembuat WWW dengan format HTML. Yang akankitabahasdisiniadalah yang paling dasaryaitumengunakan notepad, dimana notepad lah software yang biasanyalangsungudahadadikomputerpadasaatkomputeraktif, dan notepad biasanyaterletakpadaaccesories.

Langkahpertama yang dilakukanyaitu

•  Klik notepad

•  Simpan file dalamsuatu folder dalam format nama_file.HTML%htm

•  Kemudianjalankandengan Internet ExplorerCaramenjalakan

•  Klik Run, carinama file html/htm

•  KlikOkAdapunperintahperintahdasardari HTML adalahsebagaiberikut:

1.            <H1>sampai<H6>

<H1></H1>font ukuranbesar

<H2></H2>

 ....         ....

<H6></H6>font semakinkecil

2.            <HR>

Fungsi :perintahuntukmembuatgaris horizontal penuhlayar

cth :

________________________________________

3.            <I>

Fungsi :membuatteks miring

4.            <B>

Fungsi :membuattekstebal

5.            <U>

Fungsi :membuatteksbergarisbawah

6.            <CENTER>

Fungsi :membuat text ketengahlayar

7.            <ALIGN>

Fungsi :Membuatteks rata kiridan rata kanan

Sintak

<P ALIGN=right>untuk rata kanan

<P ALIGN=left>untuk rata kiri

<P ALIGN=center>untuk rata tengah

<P ALIGN=justify>untuk rata kiridan rata kananatau

<H?ALIGN=right>

<H?ALIGN=left>

<H?ALIGN=center>

<H?ALIGN=justify>

Contohpemakaian:

<H2 Align=right>SelamatDatangKe Website Kami <H2>

8.            <BR>

Fungsi :memasukkanfungsi enter

Cth :Jikaperintah<BR>diberikan di awalataudiakhirbaris, makakalimatberikutnyaakandicetakpadabarisberikutnya

9.            <!->

Fungsi :membuatkomentar

Semuateksatauperintah yang diapitolehperintahinitidakakandijalankan

10.          <P>

Fungsi :memisahkan paragraph yang satudengan paragraph yang lain

11.          <DD>

Fungsi :membuatteksatausebuah paragraph agakmasukkedalam

12.          <BASEFONT>

Fungsi :Mengubahukuran font

Contoh :

<BASEFONT SIZE=6>

WELCOME TO MY WEBSITE

<B>WELCOME TO MY WEBSITE DAN TEBAL</B>

13.          <FONT>

Fungsi :mengubahukuran font, tetapiangka yang terdapatdalam size yang merupakanukuran font harusdiberitandakutib

14.          <FACE>

Fungsi :mengubahjenis font

15.          <SUP>

Fungsi :membuatcetaknaiksuatuteks

Contoh :

Kami adalah yang pertama:1stin the world

16.          <SUB>

Fungsi :membuatsuatutekscetakturun

Contoh :

contoh-contohtekscetakturun :

H2O (Disebut Air) dan

C2127No (DisebutMethadon)

17.          <UL>atauUnorder List

Fungsi :membuat bullet

18.          <LI>

Fungsi : juga untukmembuat bullet

Catatan :perintah<LI>harusberadadalamperintahOL,UL,DIR,Menu

Contoh :

<UL>

<LI>

<H2>JawaTimur</H2>

<UL>

<LI> SURABAYA </LI>

<LI> MALANG </LI>

<LI> GRESIK </LI>

</UL>

</LI>

</BR>

<LI>

<H2>Jawa Barat </H2>

<UL>

<LI> Bandung </LI>

<LI>Sukabumi</LI>

<LI> Bogor </LI>

</UL>

</LI>

</UL>

19.          <IMGSRC>

Fungsi :memasukkangambarkedalam Website

Andadapat juga memasukkangambarberakhiran*.Jpg, *.Gif, *.Bmp dll

Sintak :<IMG BORDER="5">

"5" merupakanukuran border(Bingkai), gantiangkainisesuaikeinginananda

20.          <BGSOUND>

Fungsi :memasukkansuaraataumusikkedalam Website

Sintak :<BGSOUND loop=infiteSrc="d:/Selamat datang.WAV">

Link dengansorot

Berikutadalahcontoh program bagaimanamembuat link hanyadengansorotsaja (link takperludiklik, tetapicukupdisorotdengan mouse.

<HTML>

<HEAD>

<TITLE></TITLE>

<META Name="description"Content=" ">

<META Name="keywords"Content=" ">

<META Name="generator"Content="Cute HTML">

</HEAD>

<BODY BG Color="#FFFFFF"Text="#000000="#"0000FF"VLink="#800080">

<Center>

<A href=" "target=main on mouse over="Window.open('c:/html/keterangan.html'):">

<Font Size=3 FACE=Arial Color=#804000>Keterangan</FONT></e>

</CENTER>

</BODY>

</HTML>

Link dengantombol

Berikutadalahcontoh program link dengantombol

Sintak :

<Input type="button"Value="Nama Tombol"

On Click="parent.location="Link andadisini" >

Contoh

Buatlah link dengannama

tentang_kami.html

produk_kami.html

cara_memesan.html

< HTML >

< HEAD >

< TITLE ></TITLE>

< META name="description"Content=" ">

< META name="keywords"Content=" ">

< META name="generator"Content="Cute HTML">

< /HEAD >

< BODY BGCOLOR="#FFFFFF"Text="#000000"Vlink="#800080" >

< Center >

< h1 >PT.OCTA>

< Input Type="button"value="Tentang Kami"

on click="parent.location="c:/website/tentang_kami.html'" >

< Input Type="button"value="Produk Kami"

on click="parent.location="c:/gambar/produk_kami.html'" >

< Input Type="button"value="caramemesan"

on click="parent.location="c:/gambar/cara_memesan.html'" >

< /Center >

< /Body >

< /HTML >

Kolom

<tr>adalahperintahuntukmembuatkolompada notepad

Berikutadalahcontohperintahcaramembuatkolompada notepad

< html >

< head >

< title >Belajarmembuatkolom< /title >

< /head >

< H3 Align="Center" > DAFTAR MAHASISWA < H3 >

< table border="3" border color="red"

<tr>

< td > No

< td > Nama

< td >Alamat

< td > No. Phone

< td >Gambar

< /tr>

<tr>

< td > 1

< td >Octa

< td > Padang Bulan

< td > 8214773

< td ><Imgsrc="C:\Documents and Settings\XP\My Documents\My Webs\octa_pic1.JPG" >< /tr>

Hasilnyamenjadi

Membuat Frame

-Framecols :membagilayardalambentukkolom

-FrameRows :membagilayardenganbentukbaris

-Frame Src :menampilkan file dalam frame

Bentuknya

(Frame cols="30%,*")

(Frame Src="Nama.file Name="Teks")

(Frame Rows="40%,*")

(Frame Src="Nama.file"Nama="teks")

(Frame Src="Nama.file"Nama="Teks)

(/Frameset)

Contoh Program Frame

< Html >

< Head >

< Title >Melinkdengansorot< /Title >

< /Head >

< Frameset cols="30%,*" >

< Frame Src="Nama file"Nama="Teks" >

< Frame Rows="40%%,*" >

< Frame Src="GambarFile’Nama="Gambar" >

< Frame Src="Nama File"Nama="Teks>

< /Frameset >