Download - Web Technology and Terminology
![Page 1: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/1.jpg)
Web Technology & Terminology
Bruce Clary, McPherson College, McPherson, Kansas
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 2: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/2.jpg)
Internet
• International network of computers used to share data.
• Includes e-mail, bulletin boards, IM, newsgroups, databases, streaming audio and video–almost all of which can now be delivered through the WWW.
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 3: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/3.jpg)
World Wide Web
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 4: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/4.jpg)
World Wide Web
• The graphical interface that uses the Internet to share information.
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 5: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/5.jpg)
World Wide Web
• The graphical interface that uses the Internet to share information.
• The WWW cannot exist without the Internet. The Internet can and does exist without the Web.
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 6: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/6.jpg)
ProtocolsSets of rules that allow data to be shared via the Internet
• HTTP: HyperText Transfer Protocol• FTP: File Transfer Protocol
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 7: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/7.jpg)
HTTPHyperText Transfer Protocol
The protocol, or rules, that move Web pages across the Internet and that link pages together
• One way transfer, server to browser• Stateless (which means no copy of the transfer is
saved on the server side)
![Page 8: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/8.jpg)
FTPFile Transfer Protocol
The rules that move digital files across the Internet• Two way• Copies of transfers on both server and client sides
![Page 9: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/9.jpg)
IPInternet Protocol
IP addresses are unique numbers that identify specific computers connected to the Internet.
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 10: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/10.jpg)
• The rules that identify specific files available on the Internet
• The address beginning with the transfer protocol http:// in a browser address bar
• See pg. 22 in Robbins for parts of a URL address
URLUniform Resource Locator
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 11: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/11.jpg)
http://bulldog.mcpherson.edu/~shordeo/ex_4-5.html
URLUniform Resource Locator
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 12: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/12.jpg)
Protocol
http://bulldog.mcpherson.edu/~shordeo/ex_4-5.html
URLUniform Resource Locator
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 13: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/13.jpg)
Protocol Host
http://bulldog.mcpherson.edu/~shordeo/ex_4-5.html
URLUniform Resource Locator
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 14: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/14.jpg)
Protocol DomainHost
http://bulldog.mcpherson.edu/~shordeo/ex_4-5.html
URLUniform Resource Locator
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 15: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/15.jpg)
Protocol
Site Name
DomainHost
http://bulldog.mcpherson.edu/~shordeo/ex_4-5.html
URLUniform Resource Locator
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 16: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/16.jpg)
Protocol
Site Name
DirectoryDomainHost
http://bulldog.mcpherson.edu/~shordeo/ex_4-5.html
URLUniform Resource Locator
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 17: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/17.jpg)
Protocol
Site Name
FileDirectoryDomainHost
http://bulldog.mcpherson.edu/~shordeo/ex_4-5.html
URLUniform Resource Locator
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 18: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/18.jpg)
Protocol
PathSite Name
FileDirectoryDomainHost
http://bulldog.mcpherson.edu/~shordeo/ex_4-5.html
URLUniform Resource Locator
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 19: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/19.jpg)
DNSDomain Name System
Connecting to computers and Web sites through the Internet would be far more laborious and error-prone if it had to be done with IP addresses—e.g., 10.0.1.197). The DNS translates domain names (e.g., www.mcpherson.edu) that have meaning into an IP address.
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 20: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/20.jpg)
• See pg. 31 in Robbins for illustration of HTTP requests and responses
How it all works
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 21: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/21.jpg)
Why are browsers different?
• Independently developed• Document Object Model (DOM) support varies• Each uses independent JavaScript engines• Multiple rendering engines drive layout &
appearance
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 22: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/22.jpg)
Multiple rendering engines
Trident Blink Gecko Web-Kit
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 23: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/23.jpg)
Browser consistency driven by Web Standards
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 24: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/24.jpg)
Browser consistency driven by Web Standards
• In 1990s, market share drives browser development
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 25: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/25.jpg)
Browser consistency driven by Web Standards
• In 1990s, market share drives browser development• Development of open-source browsers such as
Firefox and Opera in 2000s finally get attention of commercial browser developers
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 26: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/26.jpg)
Other ubiquitous Web technologies
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 27: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/27.jpg)
Other ubiquitous Web technologies
• JavaScript: A client-side scripting language (which means end-users can turn it off, disabling any parts of your Web page dependent upon scripting)
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 28: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/28.jpg)
Other ubiquitous Web technologies
• JavaScript: A client-side scripting language (which means end-users can turn it off, disabling any parts of your Web page dependent upon scripting)
• jQuery: A JavaScript library that can be called with just a few lines of code in your HTML pages
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 29: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/29.jpg)
Other ubiquitous Web technologies
• JavaScript: A client-side scripting language (which means end-users can turn it off, disabling any parts of your Web page dependent upon scripting)
• jQuery: A JavaScript library that can be called with just a few lines of code in your HTML pages
• PHP: Hypertext Preprocessor (originally, Personal Home Page
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 30: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/30.jpg)
Other ubiquitous Web technologies
• JavaScript: A client-side scripting language (which means end-users can turn it off, disabling any parts of your Web page dependent upon scripting)
• jQuery: A JavaScript library that can be called with just a few lines of code in your HTML pages
• PHP: Hypertext Preprocessor (originally, Personal Home Page
• CMS: Content Management System (e.g., Wordpress, Bulldog Connect, even Facebook)
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 31: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/31.jpg)
More essential Web technologies
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 32: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/32.jpg)
More essential Web technologies
• MySQL: Structured Query LanguageThe preceding “My” indicates that MySQL is Open Source and free for anyone to use
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 33: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/33.jpg)
More essential Web technologies
• MySQL: Structured Query LanguageThe preceding “My” indicates that MySQL is Open Source and free for anyone to use
• XML: eXtensible Markup Language
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 34: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/34.jpg)
More essential Web technologies
• MySQL: Structured Query LanguageThe preceding “My” indicates that MySQL is Open Source and free for anyone to use
• XML: eXtensible Markup Language• AJAX: Asynchronous JavaScript and XML
CM350 WEB DESIGN FOR EFFECTIVE COMMUNICATION
![Page 35: Web Technology and Terminology](https://reader033.vdocuments.us/reader033/viewer/2022051109/547bce60b4af9fda158b4f75/html5/thumbnails/35.jpg)