Professional Documents
Culture Documents
Objectives
To describe the major architectural
components of the Internet that form
the infrastructure for E-Commerce
To discuss HTML Hypertext Markup
Language the language of ECommerce
Outline
Following the business evolution on
the web
The major architectural components
of the Internet
Intro to HTML
Functionality
Transactions
Web-enabled
applicatons
Interactivity
Dynamic web pages
Publishing
Static web pages
Time or Maturity
What is an internet?
Communication between two or more
potentially heterogeneous networks
(LANs)
Client
Comm.
Comm.
Protocol
Protocol
Server
Traditional Client-Server
Applications that use the
Internet
Telnet Window
FTP Client
eMail Client
TCP
IP
Network
Physical
Telnet Protocol
FTP
SMTP/POP
Internet
Internet
Telnet Server
FTP Server
eMail Server
TCP
IP
Network
Physical
Major Architectural
Components of the Web
Client 1
Browser
Client 2
HTTP
TCP/IP
Internet
Internet
Browser
Server A
HTTP
Server
App.
Server
URL index.html
Server B
Server C
Database
Server
HTTP
HyperText Transfer Protocol
The application protocol of the Web
Like FTP it is layered on top of TCP/IP
Web Browser
TCP
IP
Network
Physical
HTTP
Internet
Internet
HTTP Server
TCP
IP
Network
Physical
HTTP
HyperText Transfer Protocol
There is a 3 step process per transaction:
Browser accepts request from keyboard
1.
2.
3.
Client
Server
<protocol>://<machine>:<port>/<file>
Default port = 80
Default file = index.html
Machine = IP address.
HTTP Request/Response
Example you can try
> telnet eagle.acadiau.ca 8080
Trying 131.162.201.7...
Connected to eagle.acadiau.ca.
Escape character is '^]'.
MIME
HTTP uses a predefined set of document
formats borrowed from eMail (actually, HTTP
was modeled after an eMail protocol)
text/html
text/plain
image/gif
video/mpeg
application/msword
A Web session is
Connectionless
TCP/IP is connection-oriented
But each HTTP request/response makes
a new connection
Potentially, each browser/server
operation is unaware of any related
connections
Why do this? A sense of state is needed
for E-Commerce transaction processing
Well discuss this further next day!
HTML: A Primer
HTML
HyperText Markup Language
language used to represent webpages
HTML
HTML files end with either .html or
.htm
Can be created by
A text editor (Wordpad, Notepad, vi)
A Webpage editor (Netscape Composer)
A translation from another document
format (MS Word to HTML)
Comments
Background Color
Text Formatting
Lists
Images
Links to other documents
Tables
Frames
HTML - Comments
General:
<!-- comment -- >
Examples:
<!-- This is a comment -- >
<!-- <title>My First Page</title> -- >
HTML - Colours
By Color Name
By Pigment Mix
#rrggbb
rr, is the amount of red in the colour (00 is
none and FF is a lot)
gg is the amount of green
bb is the amount of blue
<BODY BGCOLOR= '#00ff00'> is very green
<BODY BGCOLOR= '#880088'> is purple
bold
italics
underlined
typewriter
face="Verdana">Verdana</font>
face="Arial">Arial</font>
face="Helvetica">Helvetica</font>
face="Impact">Impact</font>
face="Comic Sans MS">Comic Sans
HTML - Headings
<HTML>
<HEAD><TITLE>Size Tags</TITLE></HEAD>
<BODY>
<FONT FACE="Arial, Helvetica">
<H1> This is size H1 </H1><BR>
<H2> This is size H2 </H2><BR>
<H3> This is size H3 </H3><BR>
<H4> This is size H4 </H4><BR>
</FONT>
</BODY>
</HTML>
HTML Lists
Example:
Ordered Lists:
<OL>
Unordered List:
<UL>
<HTML><HEAD></HEAD>
<BODY>
Apples
<UL>
<LI>Red
<LI>Green
</UL>
Mangoes
<UL type=square>
<LI>Green
<LI>Yellow
</UL>
</BODY>
</HTML>
HTML - Images
Various digital image formats can
be embedded with in HTML: .gif,
.jpg
<BODY>
<H1>My new baby girl.</H1>
<IMG SRC=NicoleSilver.jpg>
</BODY>
HTML Links
Display in current browser window:
<HTML><HEAD></HEAD>
<BODY>
<A HREF='First.html'>Link to First.html</A>
</BODY>
</HTML>
Display in a new browser window:
<HTML><HEAD></HEAD>
<BODY>
<A HREF=First.html
target=anotherFrame>
Link to First.html</A>
</BODY>
</HTML>
HTML- Tables
<HTML>
<HEAD></HEAD>
<BODY>
<TABLE BORDER='2'>
<TH>Column 1</TH><TH>Column 2</TH>
<TR>
<TD>Cell 1</TD><TD>Cell 2</TD>
</TR>
<TR>
<TD>Cell 3</TD><TD>Cell 4</TD>
</TR>
</TABLE>
</BODY>
</HTML>