Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

How the web_works

314 views

Published on

  • Be the first to comment

How the web_works

  1. 1. How the web works
  2. 2. Anatomy of a web page• HTML or XHTML is the language used to write web pages.• HTML stands for Hypertext Markup Language which is basically a language that you can use to markup or format hypertext.• XHTML or HTML pages can be written in word processing programs or in WYSIWYG programs like Dreamweaver.• All information in a web page is saved as text including links to other pages and images.
  3. 3. Anatomy of a web page Text paths indicate where images can be foundLive text is included as textColors are indicated by number
  4. 4. Anatomy of a web pageblog.html The text file is edited and saved on your local computer. The files and folders of your website are uploaded to a web server via an ftp program. blog.html QuickTime™ and a decompressor blog.html are needed to see this picture. ~sweeneys QuickTime™ and a decompressor are needed to see this picture. ~sweeneys Your local computer Remote web server
  5. 5. How a web page is delivered Domain QuickTime™ and a decompressor Name are needed to see this picture. ServerWebServer Users QuickTime™ and a decompressor blog.html are needed to see this picture. ~sweeneys Step 1 User enters in URL
  6. 6. URL: Uniform Resource Locator http://www.mccc.edu/~sweeneys/blog.htmlProtocol Domain name Directory File name &(hypertext (folder name) typetransferprotocol)
  7. 7. How a web page is delivered Step 2 Domain QuickTime™ and a decompressor User request is Name are needed to see this picture. routed to a Domain Server Name ServerWebServer Users QuickTime™ and a decompressor blog.html are needed to see this picture. ~sweeneys
  8. 8. How a web page is delivered Step 3 Domain Name Server translates domain Domain QuickTime™ and a decompressor name into IP address Name are needed to see this picture. and routes the request to correct Server web server 7 0 .1 3 3 .1 .1Web 1 98 u= c. ed UsersServer mc c w . ww QuickTime™ and a decompressor blog.html are needed to see this picture. ~sweeneys
  9. 9. How a web page is delivered Domain QuickTime™ and a decompressor Name are needed to see this picture. ServerWebServer Users QuickTime™ and a decompressor blog.html are needed to see this picture. ~sweeneys Step 4 198.133.170.1 Web server locates the correct folder & file. If no file is specified it will display the index.html file.
  10. 10. How a web page is delivered Domain QuickTime™ and a decompressor Name are needed to see this picture. ServerWebServer Users QuickTime™ and a decompressor are needed to see this picture. blog.html 198.133.170.1 Step 5 Web server sends the file back to user
  11. 11. How a web page is delivered Domain QuickTime™ and a decompressor Name are needed to see this picture. ServerWebServer Users QuickTime™ and a decompressor are needed to see this picture. Step 6 User’s web browser 198.133.170.1 interprets HTML and displays it
  12. 12. User display factors What are some of the factors that make a web page display differently?
  13. 13. User display factors Browser  Internet Explorer  Firefox  Safari  Chrome  Mozilla  Opera  Netscape  AOL  PDA Browsers Courtesy of W3.org
  14. 14. User display factors Screen size & resolution • 240x160 • 320x240 • 480x320 • 640x480 • 800 x 600 • 1024 x 768 • Larger Courtesy of W3.org
  15. 15. User display factors Color depth • Most computers 24/32 bits: 16,777,216 colors • Older computers/laptops 16bits: • 65,536 colors • Handheld 8 bit: 256 colors Courtesy of W3.org
  16. 16. User display factors Javascript • On - most computers • Off - some work computers Courtesy of W3.org
  17. 17. User display factors Gamma • PC - 2.2 (darker) • Mac - 1.8 (lighter) Courtesy of Creative Bits
  18. 18. User display factors Fonts Courtesy of Browser News
  19. 19. User display factors Disabilities • Blind using a screen reader • Difficulty reading small text • Color blind (5-8% males) • Hearing impaired

×