Download presentation
Presentation is loading. Please wait.
1
How the Web Works 2/19/2019
2
Objectives The Internet Computer hardware and software
Components of web application User interface design Development HTML5 (Hyper text markup language) CSS (cascading style sheets) JS (javascript) Lets create a simple web page All you need is an editor: lets pick notepad++ And a browser to view your web application: Lets pick Firefox 2/19/2019
3
The Internet Here is the definition from Wikipedia:
The Internet is the global system of interconnected computer networks that use the Internet protocol suite (TCP/IP) to link billions of devices worldwide. It is a network of networks that consists of millions of private, public, academic, business, and government networks of local to global scope, linked by a broad array of electronic, wireless, and optical networking technologies. The Internet carries an extensive range of information resources and services, such as the inter-linkedhypertext documents and applications of the World Wide Web (WWW), electronic mail, telephony, and peer-to-peernetworks for file sharing. 2/19/2019
4
The Web The web (or world wide web) is an application that runs on the Internet. One of the ways information can be shared over the Internet. It allows documents (containing information) to be linked via hypertext link It commonly uses a protocol called Hyper Text Transfer Protocol (HTTP: also the prefix for most links) More recently HTTPS: HTTP Secure for accessing web pages that require authentication 2/19/2019
5
Web Servers Web servers are computers that host or “store” the web documents. Each device connected to the Internet has an address called the IP address. Web server has an IP address that is usually codified into a meaning sequence of words: has an IP address of 2/19/2019
6
Web Browser The information server up by a web server is consumed/processed by a web browser. Web browser is an application that runs on the Internet. Examples of web browser are: Internet Explorer, Mozilla Firefox, Google Chrome 2/19/2019
7
Document name first.html
Web Page addresses Web page addresses are defined by Uniform Resource Locator or (URL). Lets look at a URL and understand its parts: http protocol Domain & host name 2012/samples Directory name Document name first.html 2/19/2019
8
How does the URL work? It is somewhat like the address you write on surface mail: Country, state, city, street, house# Postal service figures out these in a sequence and finally the mail arrives at your home. The same way computers called “routers” and domain name servers interpret the URL and direct the request appropriately to a server. 2/19/2019
9
Anatomy of a Web page: jan29.html
<!DOCTYPE html> <html> <head> <title>Jen's Kitchen</title> <link rel="stylesheet" href=“jan29.css" type="text/css" > </head> <body> <h1><img src="foods.gif" alt="food illustration"> Jen’s Kitchen</h1> <p>If you love to read about <strong>cooking and eating</strong>, would like to find out about some of the best restaurants in the world, or just want a few choice recipes to add to your collection, <em>this is the site for you!</em></p> <p><img src="spoon.gif" alt="spoon illustration"> Your pal, Jen at Jen's Kitchen</p> <hr> <p><small>Copyright 2011, Jennifer Robbins</small></p> </body> </html> 2/19/2019
10
Style file: jan29.css body { font: normal 1em Verdana; margin: 1em 10%;} h1 { font: italic 3em Georgia; color: rgb(23, 109, 109); margin: 1em 0 1em;} img { margin: 0 20px 0 0; } h1 img { margin-bottom: -20px; } small { color: #666666; } 2/19/2019
11
Images We need two images to complete this web page.
Lets get these from the internet and complete the project. 2/19/2019
12
Putting it all together
2/19/2019
Similar presentations
