konsep pembangunan & pengurusan tapak & laman web

KonsepKonsep Pembangunan & Pembangunan & PengurusanPengurusan TapakTapak & &

LamanLaman WEBWEBOlehOleh

Ahmad Faizar Ahmad Faizar JaafarJaafarJabatan Pengurusan Sistem & Teknologi MaklumatJabatan Pengurusan Sistem & Teknologi Maklumat, ,

PTARPTAR

KonsepKonsep Pembangunan Pembangunan sertasertaPengurusanPengurusan TapakTapak & & LamanLaman

WEBWEBTahapTahap : : AsasAsas

JangakaJangaka MasaMasa KursusKursus : 3 : 3 harihari

ObjektifObjektif KursusKursusUntukUntuk mengetahuimengetahui konsepkonsep--konsepkonsep asasasas

pembanguanpembanguan sesebuahsesebuah tapaktapak & & lamanlaman webwebMenyediakanMenyediakan satusatu tapaktapak & & lamanlaman web web

dengandengan menggunakanmenggunakan aplikasiaplikasi web page web page editor editor

s ta r t d e s ig n in g P R O F E S S IO N A L W E B S IT E S in 5 d a y s

W e b W e b W e b D e s ig n e rD e s ig n e rD e s ig n e r

S p ec ia l S p ec ia l S p ec ia l T ra in in g P rog ra mT ra in in g P rog ra mT ra in in g P rog ra m

N o t a A s ia S u b -F ra n c h is e O f:

N O T A A S IA (M ) S D N B H D (4 1 3 0 8 1 A ) C T 8 .0 1 L e ve l 8 , S u ban g S q uar e C o r po r a te To w e r , J alan

S S 1 5 /4 G , 47 50 0 S ubang J aya , S e lang o r .

5 d a y s t r a in in g R M 1 5 0 0 o n ly

c o u r se m a te r ia l in c lu d e d ( n o r m a l p r ic e R M 1 9 5 0 )

C a ll u s to d ay to b o o k yo u r p la c e !

te l 5 6 3 6 2 0 8 0 o r e m a i l h e llo @ n o t a a s ia .c o m

I t ’s e a s y o n c e y o u k n o w h o w

• B e g in w it h H T M L st a tic p a g e s .

• T h e n s e t u p y o u r w e b s ite u sin g D re a m W e a v e r , in c o rp o ra t in g s p e c ial e ffe c ts : d ro p d o w n m e n u , ro l lo v e rs , h o t s p o t s , a n d e tc .

• U s e P h o t o S h o p fo r e x p e rt g ra p h ic /p h o t o e d it in g a n d t o u c h -u p s .

• C re a t e m ult im e d ia a n im a t io n s w it h M a c ro m e d ia F la s h .

M A C R O M ED IA D R EA M W E A V E R 4

M A C R O M E D IA F L A S H 5

P H O T O SH O P 6

Overview Of InternetOverview Of Internet

Classful IP AddressingClassful IP AddressingSubnetting a NetworkSubnetting a NetworkPlanning IP AddressingPlanning IP AddressingAssigning TCP/IP Assigning TCP/IP AddressesAddresses

••ClassfulClassful IP AddressingIP Addressing

IP AddressesIP AddressesIP Address ClassesIP Address Classes

IP AddressesIP Addresses

192.168.1.0192.168.1.0 192.168.3.0192.168.3.0

192.168.1.100192.168.1.100 192.168.2.101192.168.2.101

192.168.2.100192.168.2.100 192.168.3.100192.168.3.100

192.168.2.0192.168.2.0

192.168.1.100192.168.1.100192.168.1.100IPAddress

Host IDHost ID

Network IDNetwork ID

IP Address ClassesIP Address Classes

ww xx yy zz

Class A Network IDNetwork IDNetwork ID Host IDHost ID

Class B Network IDNetwork IDNetwork ID Host IDHost ID

Class C Network IDNetwork IDNetwork ID Host IDHost ID

••SubnettingSubnetting a Networka Network

SubnetsSubnetsSubnet MasksSubnet MasksDetermining Local and Remote Determining Local and Remote HostsHosts

SubnetsSubnets

RouterRouter

Subnet 1 Subnet 2

111 222

HubHub HubHub

Subnet MasksSubnet Masks

IPAddress

Host IDNetwork ID

192.168.192.168.192.168. 2.200

SubnetMask 255.255.255.255.255.255. 0.00.0

192.168.

IPAddress 10.10.10. 50.100.20050.100.200SubnetMask 255.255.255. 0.0.00.0.0NetworkID 10.10.10. 0.0.00.0.0

IPAddress 10.50.10.50.10.50. 100.200100.200SubnetMask 255.255.255.255.255.255. 0.00.0NetworkID 10.50.10.50.10.50. 0.00.0

IPAddress 10.50.100.10.50.100.10.50.100. 200200

SubnetMask 255.255.255.255.255.255.255.255.255. 00

NetworkID 10.50.100.10.50.100.10.50.100. 00

Determining Local and Determining Local and Remote HostsRemote Hosts

Example 1111

192.168.1.100192.168.1.100

Local Hosts

192.168.2.100192.168.2.100

222

RouterRouter

255.255.0.0255.255.0.0255.255.0.0Subnet Mask

AA

BB

CC

DD

EE

FF

Example 2111

192.168.1.100192.168.1.100

222

Remote Hosts

192.168.2.100192.168.2.100

RouterRouter

255.255.255.0255.255.255.0255.255.255.0Subnet Mask

AA

BB

CC

DD

EE

FF

Lab A: Determining Class Addresses and Subnet Masks

••Planning IP AddressingPlanning IP Addressing

Addressing GuidelinesAddressing GuidelinesAssigning Network IDsAssigning Network IDsAssigning Host IDsAssigning Host IDs

Addressing Addressing GuidelinesGuidelines

The Host ID Cannot Be All Zeros The Host ID Cannot Be All Zeros

The Host ID Cannot Be All 255sThe Host ID Cannot Be All 255s

The First Number in the Network ID Cannot Be 127The First Number in the Network ID Cannot Be 127

The Host ID Must Be Unique to the Local Network IDThe Host ID Must Be Unique to the Local Network ID

Assigning Network IDsAssigning Network IDs111 222

333

RouterRouter

10.0.0.010.0.0.0 192.168.2.0192.168.2.0 172.16.0.0172.16.0.0

Assigning Host IDsAssigning Host IDs111 222

RouterRouter

172.16. 0.12172.16. 0.12

172.16. 0.11172.16. 0.11

172.16. 0.10172.16. 0.10

10.0.0.1210.0.0.12

10.0.0.1110.0.0.11

10.0.0.1010.0.0.10

192.168.2.11192.168.2.11

192.168.2.10192.168.2.10

192.168.2.1192.168.2.1

10.0.0.110.0.0.1 172.16. 0.1172.16. 0.1

333

10.0.0.010.0.0.0 192.168.2.0192.168.2.0 172.16.0.0172.16.0.0

Lab B: Identifying Valid IP Addresses

••Assigning TCP/IP Assigning TCP/IP AddressesAddresses

Static IP AddressingStatic IP AddressingAutomatic IP AddressingAutomatic IP AddressingViewing TCP/IP ConfigurationViewing TCP/IP ConfigurationViewing TCP/IP ConfigurationViewing TCP/IP Configuration Using Using IpconfigIpconfig

Static IP AddressingStatic IP AddressingInternet Protocol (TCP/IP) Properties

General

You can get IP settings assigned automatically if your network supports this capability. Otherwise, you need to ask your network administrator for the appropriate IP settings.

Obtain an IP address automatically

Use the following IP address:IP address:

Use the following DNS server addresses:

Preferred DNS server:

Obtain DNS server address automatically

Advanced...

Alternate DNS server:

192 . 168 . 1 . 200

192. 168 . 1 . 1

255 . 255 . 255. 0Subnet mask :

Default gateway:

OK Cancel

Automatic IP AddressingAutomatic IP AddressingInternet Protocol (TCP/IP) Properties

General

You can get IP settings assigned automatically if your network supports this capability. Otherwise, you need to ask your network administrator for the appropriate IP settings.

Obtain an IP address automatically

Use the following IP address:IP address:

Use the following DNS server addresses:

Preferred DNS server:

Obtain DNS server address automatically

Advanced...

Alternate DNS server:

Subnet mask :

Default gateway:

OK Cancel

Viewing TCP/IP Viewing TCP/IP ConfigurationConfigurationInternet Protocol (TCP/IP) Properties

General

You can get IP settings assigned automatically if your network supports this capability. Otherwise, you need to ask your network administrator for the appropriate IP settings.

Obtain an IP address automatically

Use the following IP address:IP address:

Use the following DNS server addresses:

Preferred DNS server:

Obtain DNS server address automatically

Advanced...

Alternate DNS server:

192 . 168 . 1 . 200

192. 168 . 1 . 1

255 . 255 . 255. 0Subnet mask :

Default gateway:

OK Cancel

Viewing TCP/IP Configuration Viewing TCP/IP Configuration Using c:Using c:\\>>ipconfigipconfig

Command Prompt

Microsoft Windows 2000 [version 5.00.2195](C) Copyright 1985-1999 Microsoft Corp.

C:\>ipconfig

Windows 2000 IP Configuration

Ethernet adapter Local Area Connection:

Connection-specific DNS Suffix . :IP Address. . . . . . . . . . . . : 192.168.1.200Subnet Mask . . . . . . . . . . . : 255.255.255.0Default Gateway . . . . . . . . . : 192.168.1.1

C:\>_

Lab C: Examining the Configuration of TCP/IP

••Identifying Internet ConceptsIdentifying Internet Concepts

The InternetThe InternetInternet ServicesInternet ServicesIntranetsIntranetsDomain NamingDomain Naming

OverviewOverview

Identifying Internet ConceptsIdentifying Internet ConceptsUsing Client TechnologiesUsing Client TechnologiesConnecting to the InternetConnecting to the InternetIdentifying Web Server ConceptsIdentifying Web Server Concepts

History of the Web History of History of the Web History of the Webthe Web

•• Tim Tim BernersBerners-- Lee Lee ““inventedinvented”” the Web the Web in 1990 writing the first Web server in 1990 writing the first Web server and browser.and browser.

•• Marc Marc AndreesenAndreesen exposed the Web to exposed the Web to the masses with Mosaic the first GUI the masses with Mosaic the first GUI Web browser in 1993.Web browser in 1993.

•• The rest is history...The rest is history...History Internet & WWWHistory Internet & WWW

SejarahSejarah Internet & WWWInternet & WWWhttp://www.netvalley.com/intval1.htmlhttp://www.netvalley.com/intval1.html

Bagaimana World Wide Web berfungsi

WWW ServerWWW ServerBrowser

Internet Explorer

Browser

Internet Explorer

Methods to Use to Connect:Home user – Direct ModemOrganization - LAN

PCPC

Lab B: Identifying Web Concepts

ReviewReview

Identifying Internet ConceptsIdentifying Internet ConceptsUsing Client TechnologiesUsing Client TechnologiesConnecting to the InternetConnecting to the InternetIdentifying Web Server ConceptsIdentifying Web Server Concepts

Hypertext Markup LanguageHypertext Markup Language<HTML><HEAD><TITLE>Sales Report</TITLE></HEAD>

<BODY><H2>Q3 Sales by Region</H2>

</BODY></HTML>

Hypertext Markup Language ( HTML )

Hypertext Markup LanguageHypertext Markup LanguageGenerally text is unformatted in your Web Generally text is unformatted in your Web documents. However, to emphasize specific documents. However, to emphasize specific letters, words, or phrases you can use some text letters, words, or phrases you can use some text formatting options including boldfacing and formatting options including boldfacing and italicizing. Depending on your browser, you may italicizing. Depending on your browser, you may also be able to add underlining to emphasize also be able to add underlining to emphasize characters. The following examples show the characters. The following examples show the code for boldfacing and italicizing. code for boldfacing and italicizing. <B><B>This is bold.This is bold.</B></B><STRONG><STRONG>This is also bold.This is also bold.</STRONG></STRONG><I><I>This is italics.This is italics.</I></I><EM><EM>This is also italics.This is also italics.</EM> </EM>

Heading StylesHeading StylesHeading styles are used to emphasize different levels of informaHeading styles are used to emphasize different levels of information tion

in Web documents. Heading style level one (H1) is the largest. in Web documents. Heading style level one (H1) is the largest. The phrase "formatting basics" at the top of this page is an The phrase "formatting basics" at the top of this page is an example of heading one. Heading styles range from level one example of heading one. Heading styles range from level one (the largest) to the level six (the smallest). In addition to th(the largest) to the level six (the smallest). In addition to the e font size, heading styles also include boldfacing and/or italicifont size, heading styles also include boldfacing and/or italicizing zing and some paragraph spacing. and some paragraph spacing.

Text Formatted as Heading Level with Code Sample Text Formatted as Heading Level with Code Sample

<H1>Heading 1</H1><H1>Heading 1</H1>Heading 1Heading 1<H4>Heading 4</H4><H4>Heading 4</H4>Heading 4Heading 4<H2>Heading 2</H2><H2>Heading 2</H2>Heading 2Heading 2<H5>Heading 5</H5><H5>Heading 5</H5>Heading 5Heading 5<H3>Heading 3</H3><H3>Heading 3</H3>Heading 3Heading 3<H6>Heading 6</H6><H6>Heading 6</H6>Heading 5Heading 5

Static Static Static Static vsvsDynamic Web SiteDynamic Web Site

Static Web SiteStatic Web Site•• HTML page content is HTML page content is

same for each requestsame for each request•• Change to content Change to content

requires HTML page editrequires HTML page edit•• No user interactionNo user interaction•• No access to live dataNo access to live data•“•“ Web SiteWeb Site””

Static Static Static Static vsvsDynamic Web SiteDynamic Web Site

Dynamic Web Site• HTML pages dynamically enerated for each request• Content changes based on data, user login, etc.• Allows user interaction• Access to data real- time• “Web Application”

Dynamic Web SitesDynamic Web Sites•• Web serverWeb server•• responds to HTTP requests and retrieves responds to HTTP requests and retrieves

resourcesresources•• Expand Web server capabilities by Expand Web server capabilities by

providing a gateway between it and providing a gateway between it and external programsexternal programs

•• Common Gateway Interface (CGI)Common Gateway Interface (CGI)•• uses standard I/ Ouses standard I/ O•• new process for each requestnew process for each request•• slow and inefficientslow and inefficient

Dynamic Web Sites cont.Dynamic Web Sites cont.•• NSAPI, ISAPINSAPI, ISAPI•• Web Server APIWeb Server API•• runs inruns in-- process, making it faster than CGIprocess, making it faster than CGI•• Java Java ServletsServlets

The InternetThe Internet

Client

Connection UsingTCP/IP Protocol

Internet

Server

Text, Audio, Video,and Graphics Data

Internet ServicesInternet Services

Internet

Electronic MailElectronic Mail (e(e--mail)mail)World Wide Web (WWW)World Wide Web (WWW)ChatChatInternet NewsInternet NewsFile Transfer Protocol (FTP)File Transfer Protocol (FTP)TelnetTelnet

IntranetsIntranets

Intranet

Extranet

Internet

Domain NamingDomain Naming

Domain Name (Domain Name (istudent.uitm.edu.myistudent.uitm.edu.my))•• TopTop--level domain (level domain (eduedu))•• SecondSecond--level domain (level domain (uitm.eduuitm.edu))•• Subdomain (Subdomain (istudent.uitm.edu.myistudent.uitm.edu.my))

eduedu

Istudent.uitm.edu.myIstudent.uitm.edu.my

uitm.eduuitm.edu

••Using Client TechnologiesUsing Client Technologies

NewsreadersNewsreadersWeb BrowsersWeb BrowsersInternet ProtocolsInternet ProtocolsUniform Resource Locator (URL)Uniform Resource Locator (URL)

NewsreadersNewsreadersmsnews.microsoft.com - Outlook Express

File Edit Tools Message Help

New Post Reply GroupReply Group ReplyReply ForwardForward PrintPrint StopStop Send/Recv Addresses Find Newsgroups

msnews.microsoft.comFolders

msnews.microsoft.comSynchronization of Newsgroups on msnews.microsoft.comTo change offline settings, first select a newsgroup, then click Settings

Synchronize Account Newsgroups... SettingsSettings

Newsgroup Unread Total

microsoft.public.ddk.win2000.general (18)microsoft.public.ddk.win2000.networkmicrosoft.public.ddk.win2000.setup (3)microsoft.public.win2000.accessibilitymicrosoft.public.win2000.advancedservmicrosoft.public.win2000.announcemenmicrosoft.public.win2000.app_deploymicrosoft.public.win2000.applicationsmicrosoft.public.win2000.clusterservicemicrosoft.public.win2000.networkingmicrosoft.public.win2000.outlook.expiresmicrosoft.public.win2000.printingmicrosoft.public.win2000.radiusmicrosoft.public.win2000.ras_routingmicrosoft.public.win2000.securitymicrosoft.public.win2000.setupmicrosoft.public.win2000.setup.deploymmicrosoft.public.win2000.setup.upgrademicrosoft.public.win2000.storagemicrosoft.public.win2000.system_adminmicrosoft.public.win2000.terminal_srvmicrosoft.public.win2000.terminal_srv_hmicrosoft.public.win2000.user_interface

microsoft.public.ddk.win2000.generalmicrosoft.public.ddk.win2000.networkmicrosoft.public.ddk.win2000.setup microsoft.public.win2000.accessibilitymicrosoft.public.win2000.advancedservermicrosoft.public.win2000.announcementsmicrosoft.public.win2000.applications microsoft.public.win2000.app_deploymicrosoft.public.win2000.clusterservicemicrosoft.public.win2000.networkingmicrosoft.public.win2000.outlook.expressmicrosoft.public.win2000.printingmicrosoft.public.win2000.radiusmicrosoft.public.win2000.ras_routingmicrosoft.public.win2000.securitymicrosoft.public.win2000.setupmicrosoft.public.win2000.setup.deploymentmicrosoft.public.win2000.setup.upgrademicrosoft.public.win2000.storagemicrosoft.public.win2000.system_admin

18536

1386

152

2163112113

84714

102

1812

36

1386

182

2164142113

84

1054

102

Web BrowsersWeb Browsers

Windows 2000 Server Overview - Microsoft Internet ExplorerFile Edit View Favorites Tools Help

Back Search Favorites HistoryAddress http://www.microsoft.com/windows2000/server/overview/default.asp Go

All products Support Search microsoft.com Guide

Windows Home PagesWindows 2000 Home Page

Product GuideWindows 2000 PlatformClientServer

Technical LibraryUpgrading to Window 2000Beta UsersIT ProsDevelopers

Search for: GoHome Product GuideWindows 2000 Server Family

ServerServer FeaturesSystem RequirementsWhat Others are SayingComparisons

With the Windows® 2000 Server operating system, Microsoft has accomplished a goal rarely achieved in the software industry: delivered a product that is evolutionary and revolutionary at the same time. Evolutionary in that Windows 2000 builds on the great things about the Windows NT® Server 4.0 operating system. Revolutionary in that Windows 2000 Server sets a new standard for how well am operating system can be integrated with Web, application, networking, communication, and infrastructureservices. For the first time, you have an easy choice to make about the next server

operating system you deploy - whatever your needs. Continued

Browse the features that make the Windows 2000 Server Family theleading solution for running more reliable and manageable file, print, intranet, communications, e-commerce, and infrastructure server.Find out what it takes to run Windows 2000 Server and Windows 2000 Advanced Server.Check out the buzz on Windows 2000 Server: reviews and commentary from technology journalists and industry analysts.See how Windows 2000 Server compares with other operating systems.

BrowserInternet Explorer

BrowserInternet Explorer

Internet ProtocolsInternet Protocols

Internet

HTTPHTTPHTTPSHTTPSFTPFTPSMTPSMTPNNTPNNTPHTMLHTMLDHTMLDHTML

Server

Data

Client

Connection Using anInternet Protocol

Uniform Resource Locator Uniform Resource Locator (URL)(URL)

URL URL ((http://example.microsoft.com/tutorial/default.hhttp://example.microsoft.com/tutorial/default.html)tml)•• Protocol used (http://)Protocol used (http://)•• DNS address (DNS address (example.microsoft.comexample.microsoft.com))•• Path on the server (/Path on the server (/tutorial/default.htutorial/default.html)tml)

http://example.microsoft.com/tutorial/default.htmlhttp://example.microsoft.com/tutorial/default.html

Lab A: Accessing an FTP Site by Using Internet Explorer

••Connecting to the InternetConnecting to the Internet

Network Address Translators Network Address Translators (NATs)(NATs)Proxy ServersProxy ServersFirewallsFirewallsMicrosoft Proxy Server Microsoft Proxy Server

Network Address Translators Network Address Translators ((NATsNATs))

Internet

192.168.0.10192.168.0.10

w1.x1.y1.z1w1.x1.y1.z1

w2.x2.y2.z2w2.x2.y2.z2

Web Browser

NAT

Web Server

Proxy ServersProxy Servers

Internet

Proxy Server

AuthorizedWeb Site

Restricted Web Site

LAN

LAN

LAN

FirewallsFirewalls

LAN

LAN

LAN

Internet

Firewall

AuthorizedUser

Unauthorized User

Microsoft Proxy ServerMicrosoft Proxy Server

LAN

LAN

LAN

Internet

Microsoft Proxy Server

AuthorizedUser or Web Site

Unauthorized User or Web Site

Defining a Web ServerDefining a Web ServerMicrosoft Internet Information Microsoft Internet Information Services (IIS) Services (IIS)

••Identifying Web Server Identifying Web Server ConceptsConcepts

Defining a Web ServerDefining a Web Server

Web ServerClient with Web Browser

Network

TCP/IPTCP/IP TCP/IPTCP/IP

HTTPHTTP

IP AddressIP Address

Internet ExplorerInternet Explorer

HTTPHTTP

Features of IIS

Microsoft Internet Microsoft Internet Information Services (IIS)Information Services (IIS)

Indexing ServiceIndexing ServiceSecure Sockets LayerSecure Sockets LayerWindows Media ServicesWindows Media ServicesAdditional Developer SupportAdditional Developer Support•• Active Server PagesActive Server Pages•• VBScript and JavaScript supportVBScript and JavaScript support•• Remote administrationRemote administration

Internet

IIS

Big PictureBig Picture

User User Interface

user User interface Web server applicationserver

Database

KeperluanKeperluan host host lamanlaman webweb

PerkakasanPerkakasan / Hardware / Hardware •• AdaAda beberapabeberapa jenamajenama

PerisianPerisian / Software/ Software•• AdaAda beberapabeberapa jenamajenama•• http://www.serverwatch.com/stypes/http://www.serverwatch.com/stypes/•• http://search.about.com/fullsearch.htmhttp://search.about.com/fullsearch.htm

?terms=Internet%20%20HTTP%20%20?terms=Internet%20%20HTTP%20%20web%20%20serverweb%20%20server

Server DirectoryServer Directory

web Serversweb Servers(See a detailed list of all (See a detailed list of all Web serversWeb servers.).)At its core, a Web server serves static content to a Web browserAt its core, a Web server serves static content to a Web browser by loading a file from a disk and by loading a file from a disk and serving it across the network to a user's Web browser. This entiserving it across the network to a user's Web browser. This entire exchange is mediated by the re exchange is mediated by the browser and server talking to each other using Hypertext Transfebrowser and server talking to each other using Hypertext Transfer Protocol (HTTP). r Protocol (HTTP). application Serversapplication Servers(See a detailed list of all (See a detailed list of all app serversapp servers.) .) Sometimes referred to as a type of middleware, application serveSometimes referred to as a type of middleware, application servers occupy a large chunk of rs occupy a large chunk of computing territory between database servers and the end user, acomputing territory between database servers and the end user, and they often connect the two. nd they often connect the two. proxy Serversproxy Servers(See a detailed list of all (See a detailed list of all proxy serversproxy servers.).)Proxy servers sit between a client program (typically a Web browProxy servers sit between a client program (typically a Web browser) and an external server ser) and an external server (typically another server on the Web) to filter requests, improv(typically another server on the Web) to filter requests, improve performance, and share e performance, and share connections. connections. FTP ServersFTP Servers(See a detailed list of all (See a detailed list of all FTP serversFTP servers.).)One of the oldest of the Internet services, File Transfer ProtocOne of the oldest of the Internet services, File Transfer Protocol makes it possible to move one or ol makes it possible to move one or more files securely between computers while providing file securmore files securely between computers while providing file security and organization as well as ity and organization as well as transfer control. transfer control. mail Serversmail Servers(See a detailed list of all (See a detailed list of all mail serversmail servers.).)Almost as ubiquitous and crucial as Web servers, mail servers moAlmost as ubiquitous and crucial as Web servers, mail servers move and store mail over corporate ve and store mail over corporate networks (via LANs and WANs) and across the Internet. networks (via LANs and WANs) and across the Internet. list Serverslist ServersList servers offer a way to better manage mailing lists, whetherList servers offer a way to better manage mailing lists, whether they be interactive discussions they be interactive discussions open to the public or oneopen to the public or one--way lists that deliver announcements, newsletters, or advertisinway lists that deliver announcements, newsletters, or advertising. g. chat Serverschat ServersChat servers enable a large number of users to exchange informatChat servers enable a large number of users to exchange information in an environment similar to ion in an environment similar to Internet newsgroups that offers realInternet newsgroups that offers real--time discussion capabilities. time discussion capabilities.

ServerWatchServerWatch breaks down the Internet servers we review into 14 categories. breaks down the Internet servers we review into 14 categories. For more information about a For more information about a category, click on the server type for a comprehensive overview category, click on the server type for a comprehensive overview and a list of servers reviewed on the site.and a list of servers reviewed on the site.

Server DirectoryServer Directorygroupware Serversgroupware ServersIn many ways, groupware is the clearest way to show the true powIn many ways, groupware is the clearest way to show the true power of the World er of the World Wide Web Wide Web telnet Serverstelnet ServersA telnet server enables users to log on to a host computer and pA telnet server enables users to log on to a host computer and perform tasks as if erform tasks as if they're working on the remote computer itself. they're working on the remote computer itself. fax Serversfax ServersA fax server is an ideal solution for organizations looking to rA fax server is an ideal solution for organizations looking to reduce incoming and educe incoming and outgoing telephone resources but that need to fax actual documenoutgoing telephone resources but that need to fax actual documents. ts. news Serversnews ServersNews servers act as a distribution and delivery source for the tNews servers act as a distribution and delivery source for the thousands of public housands of public news groups currently accessible over the Usenet news network. news groups currently accessible over the Usenet news network. A/V ServersA/V ServersA/V servers bring multimedia capabilities to Web sites by enabliA/V servers bring multimedia capabilities to Web sites by enabling them to broadcast ng them to broadcast streaming multimedia content. streaming multimedia content. IRC ServersIRC ServersAn option for those seeking realAn option for those seeking real--time discussion capabilities, Internet Relay Chat time discussion capabilities, Internet Relay Chat consists of various separate networks (or 'nets') of servers thaconsists of various separate networks (or 'nets') of servers that allow users to t allow users to connect to each other via an IRC network. connect to each other via an IRC network. Platforms/Platforms/OSsOSsA term often used synonymously with 'operating system,' a platfoA term often used synonymously with 'operating system,' a platform is the rm is the underlying hardware or software for a system and is thus the engunderlying hardware or software for a system and is thus the engine that drives the ine that drives the server. server. Server Attic ServersServer Attic ServersIn the fastIn the fast--paced world of IT, servers come and go. This section is for thospaced world of IT, servers come and go. This section is for those servers e servers that are no longer sold or supported but that an organization, fthat are no longer sold or supported but that an organization, for whatever reason, or whatever reason, may be interested in learning more about. may be interested in learning more about.

DisplayDeliverDevelop

The DreamThe Dream

We will enable Web professionals to We will enable Web professionals to efficiently develop dynamic content and efficiently develop dynamic content and applications delivered on multiple devices.applications delivered on multiple devices.

Design

Flash PlayerShockwave Player

Macromedia ProductsMacromedia Products

DeliverDeliver DisplayDisplayDevelopDevelopDesignDesign

ColdFusion ServerJRun ServerGeneratorSpectra

ColdFusion Studio UltraDevHomeSite

JRun StudioDirector

DreamweaverFireworks

FlashFreeHand

Flash PlayerShockwave Player

WYSIWYGWYSIWYG

WYSIWYG (What You See Is What You Get) WYSIWYG (What You See Is What You Get) site building tool with an intuitive environmentsite building tool with an intuitive environmentfor building crossfor building cross--platform sites.platform sites.

What I See What I Get

Popular ToolsPopular Tools

DreamweaverNet ObjectFusion

Front PageExpress

Home SiteGoLive

WEB CONTENT MANAGEMENT SYSTEMWEB CONTENT MANAGEMENT SYSTEMWeb content management systemWeb content management system (WCMS or Web CMS) is (WCMS or Web CMS) is content content management systemmanagement system (CMS) software, usually implemented as a (CMS) software, usually implemented as a Web applicationWeb application, , for creating and managing for creating and managing HTMLHTML content. It is used to manage and control a large, content. It is used to manage and control a large, dynamic collection of Web material (HTML documents and their assdynamic collection of Web material (HTML documents and their associated images). ociated images). A WCMS facilitates A WCMS facilitates contentcontent creation, content control, editing, and many essential creation, content control, editing, and many essential Web maintenance functions.Web maintenance functions.

Usually the software provides authoring (and other) tools designUsually the software provides authoring (and other) tools designed to allow users ed to allow users with little or no knowledge of with little or no knowledge of programming languagesprogramming languages or or markup languagesmarkup languages to to create and manage content with relative ease of use.create and manage content with relative ease of use.

Most systems use a Most systems use a databasedatabase to store content, to store content, metadatametadata, and/or artifacts that , and/or artifacts that might be needed by the system. Content is frequently, but not unmight be needed by the system. Content is frequently, but not universally, stored iversally, stored as as XMLXML, to facilitate reuse and enable flexible presentation options., to facilitate reuse and enable flexible presentation options.[1][1][2][2]

A presentation layer displays the content to regular WebA presentation layer displays the content to regular Web--site visitors based on a site visitors based on a set of set of templatestemplates. The templates are sometimes . The templates are sometimes XSLTXSLT files.files.[3][3]

Administration is typically done through browserAdministration is typically done through browser--based interfaces, but some based interfaces, but some systems require the use of a systems require the use of a fat clientfat client..

Unlike WebUnlike Web--site builders like site builders like Microsoft FrontPageMicrosoft FrontPage or or Adobe DreamweaverAdobe Dreamweaver, a WCMS , a WCMS allows nonallows non--technical users to make changes to an existing website with litttechnical users to make changes to an existing website with little or no le or no training. A WCMS typically requires an experienced coder to set training. A WCMS typically requires an experienced coder to set up and add up and add features, but is primarily a Webfeatures, but is primarily a Web--site site maintenancemaintenance tool for nontool for non--technical technical administrators.administrators.

http://www.opensourcecms.com/

WORKFLOWWORKFLOW

Full Web Development Workflow

AsasAsas LamanLaman Web Web BerkualitiBerkualiti

ApaApaSiapaSiapaDimanaDimanaBagaimanaBagaimanaBilaBilaTemuramahTemuramah

PerkaraPerkara Yang Yang PerluPerlu Di Di AmbilAmbil KiraKira

Gaya Gaya LamanLaman WebWebImbanganImbangan GrafikGrafik dandan TeksTeksSusunSusun AturAtur LamanLaman WebWebJangkaJangka MasaMasa MuatMuat TurunTurunMengimbangMengimbang SetiapSetiap LamanLaman WebWebKonsistenKonsisten dandan IdentitiIdentitiIsuIsu HakciptaHakcipta

PrinsipPrinsip LamanLaman Web Web DalamDalam KonteksKonteks MAMPUMAMPU

http://mcsl.mampu.gov.my/bm/gphtml/gpkand.html

PrinsipPrinsip LamanLaman Web Web DalamDalamKonteksKonteks MAMPUMAMPU

PerancanganPerancangan Dan Dan StrukturStruktur PelaksanaanPelaksanaan LamanLaman WebWebPersediaanPersediaan AwalAwal Pembangunan Pembangunan LamanLaman WebWebPertimbanganPertimbangan DalamDalam PenyediaanPenyediaan LamanLaman WebWebStrukturStruktur Dan Dan PersembahanPersembahan LamanLaman WebWebPenyediaanPenyediaan DokumenDokumen Dan Dan RekaReka BentukBentuk LamanLamanWebWebMenerbitMenerbit, , MengelolaMengelola Dan Dan MempromosiMempromosi LamanLamanWebWebPenyenggaraanPenyenggaraan LamanLaman WebWebPenyelarasanPenyelarasan Dan Dan PemantauanPemantauanPenutupPenutupGlosariGlosari

Case StudyUniversity Library Web Site Discover

http://www.loc.gov/

http://www.lib.cam.ac.uk/

http://www.natlib.govt.nz/

http://library.tamu.edu/

http://www.uwec.edu/Library/

http://www.lib.umich.edu/

http://libpweb.nus.edu.sg/

http://www.nls.uk/

http://www.uwec.edu/Library/about.htm

Web Development PrepWeb Development Prep

http://faizar.freehosting.net/

Purpose: Purpose: Prepare material for web publishingPrepare material for web publishing

Web ServerYour PCTextDigitized picsURLs

Build Web Site Publish

Story board

TextTextPrepare in MS WordPrepare in MS WordSave it using short meaningful Save it using short meaningful

file name in your web folder file name in your web folder ((unitoneunitone))

Digitize graphics Digitize graphics -- Digital CameraDigital CameraPrepare graphics Prepare graphics -- crop, size in crop, size in Photoshop / Graphics programPhotoshop / Graphics programSave it as a jpg/gif Save it as a jpg/gif filefile yourname.jpgyourname.jpgSave in images folderSave in images folder

GraphicsGraphics

Linked ResourcesLinked Resources

http://faizar.onestop.net

Write a short notation about Write a short notation about the sitethe siteWrite the exact URL for the siteWrite the exact URL for the site

Checkout the SamplesCheckout the Samples

Home Page• Course Name• TOC • Samples - Portfolio Page / Tech Page• Components of Culminating Product• Samples -

StoryboardStoryboard

Humanities 101Humanities 101TOC

Syllabus

Forum

Resources

Portfolio

Home Page Portfolio

TOC

Intro

Context

Unit

PD Goals

Sample Work

Analysis, Concl

Next Steps

Implementation

Art Perspectives

Pics

Pics

IntroPics

Context

Unit.doc

Pics Picsdiscuss.jpg Present.jpg

NEXT STEPNEXT STEPBuild SiteBuild SitePublish SitePublish Site

http://faizar.onestop.net

BuatBuat LamanLaman WEBWEB

RujukRujuk NotaNota

http://faizar.onestop.net/courses.html or http://faizar.atspace.com/courses.html

DaftarDaftar lamanlaman web web percumapercumahttp://faizar.freehosting.net/http://faizar.freehosting.net/

http://http://www.fjoomla.comwww.fjoomla.com//