2. Web sites are developed with files stored in one common folder.
index.html
<html>
<head>
<title>My Page</title>
style.css <link href="style.css" rel="stylesheet" type="text/css" />
</head>
profile.html <body>
me.jpg
<img src=“seal.gif” />
index.html
seal.gif
<a href=“profile.html”>My Profile</a>
mysite
</body>
</html>
3. WEB SERVER
Web site files are transferred to a
Web server maintaining the relative
locations of connected files. iSpace.ci.fsu.edu
SFTP:// Secure File Transfer Protocol
username
html personal
SFTP
mysite
4. In the browser, you request resources using a URL:
http://ispace.ci.fsu.edu/~username/mysite/index.html
Your html
Domain/Server Location in html WEB SERVER
Web folder
Client
iSpace.ci.fsu.edu
HTTP REQUEST
username
html personal
Web pages are requested by users
mysite
using a URL or link.
HTTP://
Hyper Text Transfer Protocol
URL
Uniform Resource Locator
5. HTTP RESPONSE WEB SERVER
iSpace.ci.fsu.edu
seal.gif
username
style.css
index.html
html personal
An HTML page and referenced files
are delivered to client PC where they
are cached and rendered in a web
browser.
6. WEB CLIENT WEB SERVER
Client/Server
Communication
index.html
<html>
<head><title></title>
<script type="text/javascript">
<!--var value1 = 45;
var value2 = 60;
var sum = value1 + value2;
var str = value1;
document.write(str);
//-->
</script></head> Javascript code may be embedded in
<body> HTML, interpreted and run by the
</body> client.
</html>
See www.fsu.edu
7. WEB CLIENT WEB SERVER
Client/Server
Communication
index.html
<html>
<head><title></title></head>
<body>
<form name="rez" method="post"
action="http://service.cs.fsu.edu/cgibin/testing/ers.cgi">
HTML Forms may be used to collect
user data and send it to the server for
<input type="submit" name="Submit"
value="Continue">
processing.
</form)
</body>
</html>
8. WEB CLIENT WEB SERVER
HTTP REQUEST w/DATA
http://iSpace.ci.fsu.edu/username/mysite/index.html?name=geo
Including data (after the ? in a URL) is
an HTTP GET request.
Data sent in an HTTP Request that is
hidden is an
HTTP POST request
9. WEB CLIENT WEB SERVER
HTTP REQUEST w/DATA
PHP
PHP code (or other programming
language) runs on server,
manipulating input and creating HTML
output.
10. WEB CLIENT WEB SERVER
HTTP REQUEST w/DATA
PHP
PHP code is embedded in html code
and stored in a .php file.
PHP code cannot run on the client browser,
PHP is processed server-side
11. WEB CLIENT WEB SERVER
HTTP REQUEST w/DATA
Other
Programming
Languages
Other programming languages like Perl,
Java, C++, Python, Ruby can also be used
to process HTTP requests.
12. WEB CLIENT WEB SERVER
HTTP REQUEST w/DATA
DB
PHP +
MySQL
Programs may access data in a database
using a database manipulation language
(DBML) like MySQL.
13. WEB CLIENT WEB SERVER
HTTP Response
Program Output as HTML
DB
HTML PHP +
CSS MySQL
Javascript
Images A Web page is created “on the fly” as
output from server side software.
14. REVIEW
WEB CLIENT WEB SERVER
Client/Server
Communication
HTTP DB
In the web browser:
HTML
HTML FORMS On the web server:
IMG: JPG/GIF/PNG Stores files
CSS PHP & OTHER PL’S
JAVASCRIPT MYSQL & OTHER DBML’S
