University of Illinois, Urbana-Champaign
Topics
Fundamentals
Browsers and HyperText Markup Language (HTML)
The Five Most Common Browsers
Internet Explorer (comes with every Windows installation since Windows 95, not available for any other operating system) - Microsoft productHyperText Mark-up Language (HTML)
Internet Explorer screen captureSafari (comes with the Mac OS, but stilll available for Windows in an old (i.e. 2012) version.) - Apple product
Safari screen captureMozilla Firefox (comes with Linux, but is available for Windows, Mac O/S, Linux, and Android) - Open Source
Open Source means that the programming code is freely available to everyone.Google Chrome (Google product, available for Windows, Mac O/S, Linux, Android, and iPhone iOS) - Google product
Anyone may use it free for non-commercial purposes, with very few restrictions.
Everyone is encouraged to contribute to the improvement of the code.
Open Source grew out of the "Gnu" open source free software initiative among colleges and universities in the 1980's.
Firefox screen capture
Designed for speed and security. It has historically had very few vulnerabilities that have been exploited by hackers, and they have been fixed very quickly.Opera (Windows, Mac OS, Linux, Android, iPhone iOS, Windows Mobile, Blackberry, and a number of other devices) - long history, but currently supported by Google
Google hired Mozilla developers and also incorporated a number of other Open Source features and features it developed.
Google Chrome is based on earlier Unix browser engines (the part of the browser actually paints the web page inside the window). Firefox and Safari also came from similar Unix sources.
Google Chrome screen capture
An outgrowth of Google Chrome with some alterations from Google's requirements.All five browsers side-by-side screen capture
Opera screen capture
Up and Coming: Smart phone browsers packaged with the smart phone operating systems.
Market share of the five browsers, plus smart phone browser usage - from Wikipedia
"HyperText" is text designed for a computer Web Browser with click-able links in it to another web page or media presentation.
The concept of a "mark-up language" comes from the old "mark-up" symbols human editors would use when proofreading a writer's manuscript.
In the context of a computer language, mark-up's are embedded text inside special symbols where are not shown to the viewer of the web page.
Here is the HyperText file that creates this web page, at exactly the point when I was writing this line as I created this web page: this page under development.
And here what the HyperText looks like as a web page: this page under development as it looks like in a browser.
You'll notice that everything below this line is just a skeleton where I could add content, which I obviously did.
The "mark-up's" in HTML are enclosed in angle bracket characters: < >
A mark-up starts with a specific word or characters inside angle brackets: <strong>
and it ends with the same specific word or characters inside angle brackets, but with a forward slash added: </strong>
Any text between the beginning mark-up and its associated end mark-up will be changed by that mark-up pair.
For instance this hypertext phrase:
She replied, "I absolutely will <strong>not</strong> do that!"
Looks like this on the web page:
She replied, "I absolutely will not do that!"
This is what a hypertext link to a local page looks like:
There is <a href="Session1/nothing_much.html">nothing much</a> here.
and it appears like this on the web page (try it):
There is nothing much here.
Finally, this is what a hypertext link to an external web page looks like:
If you want the news, try the <a href="http://www.nytimes.com">New York Times</a> website.
and, again, it appears like this on the web page (use your browser's back button to get back here):
If you want the news, try the New York Times website.
Universal Resource Locators
Uniform Resource Locators
The web page address you type into the address bar of your browser.
Example: www.nytimes.com
www stands for "World Wide Web" and tells the web server computer that you are using a desktop computer browser.Your browser will automatically add http:// in the front of your typed address.
Try typing mobile.nytimes.com in your desktop browser and you will see the version of the web page created for mobile phones.nytimes is the text name that represents the address of the web server.
Most browsers will add the www automatically in the front of your typed address. Try typing just nytimes.com into the address bar and it will still take you to the New York Time's desktop web pages.
It will be turned into a numeric Internet Protocol (IP) address by the Domain Name Server (DNS), as described below.com is the domain of the web server.
.com means "commercial"
Domains both categorize the web server for human beings, and narrow down the search for the electronic switching equipment of the Internet.
http stands for "hypertext transfer protocol".Anything added after the domain with an added forward slash, /, tells the web server computer which directory and file to access on that computer.
The :// is always required.
Other possibilities are:mailto, a concatenation of the words "mail" and "to".
Try typing mailto://scottbadman.com in your desktop browser and you will get an e-mail window to send mail to my website. (Note: I don't check those e-mails.)ftp, which stands for "file transfer protocol".
Try typing ftp://scottbadman.com in your desktop browser and you will get a pop-up window to log into my website's file transfer protocol service. (Note: I don't have this service activated, and there are no valid usernames or passwords.)file, which finds a file on your computer's disk drives. You must add the full drive and path to the file with some extra forward slashes, /
For example, this file was located on my computer at file:///I:/OLLI/1'sAnd0's/Session1.htm before I uploaded it to my website.
For example, this file is located at http://www.scottbadman.com/OLLI/1'sAnd0's/Session1.htmAnything added after the domain and file path, with an added question mark, ?, is information that is given to the specific web page you are accessing.
This means that the file that creates this web page is located in the OLLI directory, the 1'sAnd0's subdirectory, and the Session1.htm file.
For example, this URL: http://www.autospecs.com/Specifications/car_specs.html?1957%32Chevy would send the text "1957 Chevy" to the car_specs.html web page in the Specifications directory at the www.autospecs.com website. (Note: this website doesn't exist.)
Domain Name Service (DNS) and IP Version 4 Addresses
When you type in a web page address in your browser's address bar and then press "Enter", the browser sends a message to a special computer called a "Domain Name Server" (DNS).
The Domain Name Server resolves the human readable typed address into a special number called the Internet Protocol Address (IP Address).
The IP address is just a number from 0 to 4,294,967,295, but it is written in a very unique and strange way as a convenience for technicians.
The number is broken down to four numbers from 0 to 255, separated by periods.Since there already are more than 4.2 billion computers on the Internet, the world has run out of IP Version 4 addresses.
For example, the DNS server resolves www.cnn.com into 157.166.239.177
Try typing 157.166.239.177 in your desktop browser. It will go to the same web page as www.cnn.com
157.166.239.177 is actually just the number 2,644,963,249 but you will never see IP addresses written that way.
The Internet is using some sophisticated techniques to attach more than one computer to a single IP address.
One of these techniques, called Network Address Translation (NAT), is how your home router can connect multiple computers to the single IP address that your Internet Service Provider gives you.
The Internet is slowly switching to IP Version 6 addresses.
There are more IP Version 6 addresses than there are atoms in the Universe. We won't run out of them.
IP Version 6 addresses are written in an even more weird and complex way than IP Version 4 addresses.
Here is the IP Version 6 address of my computer at home: fe80::4c90:9675:6a94:f257
(10 to 15 Minute Break)Practical Tips and Techniques
Which Internet Browser Should I Use and How Do I Best Use It?
Class discussion and demonstration