If the Internet is magic, this class will give you superpowers! The actual process for getting up and running is amazingly simple. We’ll start with an intro to the course and hit the ground running with our first xHTML page. (Insert magic wand and glitter here!) We’ll also set up our blogs so we can see our progress throughout the class.

Make sure to bookmark some amazing online resources:

• W3schools
• Tag Reference
• CSS Guide

First, The Animated History of the Internet

• Discuss key terms (many definitions provided by wikipedia and the w3consortium)
• ARPANET: The ARPANET (Advanced Research Projects Agency Network) developed by ARPA of the United States Department of Defense, was the world’s first operational packet switching network, and the predecessor of the global Internet. First link was established in 1969.
  • The first message ever to be sent over the ARPANET (sent over the first host-to-host connection) occurred at 10:30 PM on October 29, 1969. It was sent by UCLA student programmer Charley Kline and supervised by UCLA Professor Leonard Kleinrock. The message was sent from the UCLA SDS Sigma 7 Host computer to the SRI SDS 940 Host computer. The message itself was simply the word “login.” The “l” and the “o” transmitted without problem but then the system crashed. Hence, the first message on the ARPANET was “lo”. They were able to do the full login about an hour later.
• Packet Switching: Packet switching, now the dominant basis for both data and voice communication worldwide, was a new and important concept in data communications. Previously, data communication was based on the idea of circuit switching, as in the old typical telephone circuit, where a dedicated circuit is tied up for the duration of the call and communication is only possible with the single party on the other end of the circuit.
  • Analogy of buffet
• TCP/IP: is the set of communications protocols used for the Internet and other similar networks. It is named from two of the most important protocols in it: the Transmission Control Protocol (TCP) and the Internet Protocol (IP), which were the first two networking protocols defined in this standard. Today’s IP networking represents a synthesis of several developments that began to evolve in the 1960s and 1970s, namely the Internet and LANs (Local Area Networks), which emerged in the mid- to late-1980s, together with the invention of the World Wide Web in 1989.
• HTML: an acronym of HyperText Markup Language, is the predominant markup language for Web pages. It provides a means to describe the structure of text-based information in a document — by denoting certain text as links, headings, paragraphs, lists, and so on —and to supplement that text with interactive forms, embedded images, and other objects. HTML is written in the form of tags, surrounded by angle brackets.
• XML: The Extensible Markup Language (XML) is a general-purpose specification for creating custom markup languages.[1] It is classified as an extensible language, because it allows the user to define the mark-up elements.
• xHTML: can be thought of as the intersection of HTML and XML in many respects, since it is a reformulation of HTML in XML. (will talk about differences when coding)
• HTML5: ext major revision of HTML (Hypertext Markup Language), the core markup language of the World Wide Web. It aims to reduce the need for proprietary plug-in-based rich Internet application (RIA) technologies such as Adobe Flash,Microsoft Silverlight, and Sun JavaFX.
• W3C: The World Wide Web Consortium is the main international standards organization for the World Wide Web (abbreviated WWW or W3). It is arranged as a consortium where member organizations maintain full-time staff for the purpose of working together in the development of standards for the World Wide Web.
• Routers: an electronic device used to connect two or more computers or other electronic devices to each other, and usually to the Internet, by wire or radio signals.
• Servers: the term typically refers to a computer which may be running a server operating system, but is also used to refer to any software or dedicated hardware capable of providing services.
• Local host: The computer on the local network that is hosting your files (the computer that you are working on)
• Remote host: The computer on the external network that is hosting your files (mysite.pratt.edu)
• DNS: The Domain Name System (DNS) is a hierarchical naming system for computers, services, or any resource participating in the Internet. It associates various information with domain names assigned to such participants. Most importantly, it translates domain names meaningful to humans into the numerical (binary) identifiers associated with networking equipment for the purpose of locating and addressing these devices world-wide. An often used analogy to explain the Domain Name System is that it serves as the “phone book” for the Internet by translating human-friendly computer hostnames into IP addresses. For example, www.example.com translates to 208.77.188.166.

Range of Interactivity

• Complexification.net
• Type Flash
• PaperRad
• Learning to Love You More
  • We’ll talk about the range of interaction available.
  • Why learn HTML/Programming now? Why make things interactive?

Let’s Begin!

FTP Upload

1. login to my.pratt.edu
2. go to “file storage” (when the menu pops up, click “allow).
3. open public_html on the right.
4. navigate to your helloworld.html page on the left, select on the file.
5. click the arrow in the middle pointing right.

YOUR HELLO WORLD PAGE SHOULD LOOK LIKE THIS.

Some More Tips

• .html and .htm are different, but both are fine. Just be consistent: Pick one and stick to it!
• capital letters are different from lowercase, so HelloWorld.html and helloworld.html are two different files.
• Don’t put spaces in your file names. Use an underscore (_) or a dash (-) instead.

Assignment:

• Sign up on wordpress for your own blog.
• Using the Hello World page that you created the first day and the tags that you have learned, create an online resume. Post it to your my.pratt.edu webspace. Test it to make sure that it works.
• Reading A List Apart: In Defense of Eye Candy. Write a paragraph response to the reading before next class on your blog including an example from the internet that proves or disproves one of the points.
• Post a comment on the end of this page with your blog address and the link to your resume.
• Order “Don’t Make Me Think” and one of the other reference books from the list above or buy them at a bookstore.
• If you don’t have Dreamweaver at home, download the following:

For Mac:

• Textwrangler (Text program)
• Fetch (FTP Program, get the educational license for free)

For PC:

• E-Text Editor (Text program)
• Smart FTP (FTP Program)