Lab 10 is due in Vista on May 8

The final exam (comprehensive, 25%) will be held on May 15 at 8am

CS 110 - Introduction to Internet Programming and Applications

Spring-2008

Catalog description: Skill Area II Examination of physical infrastructure of local and wide area networks, internet protocol implementation, world-wide web interface programming, interactive Java applet, and Visual Basic web programming.

Course objectives: Upon successful completion of the course the student will be able to

• understand the basic concepts of the Internet, the Web and online communication;
• use the basic features of web browsers, such as Internet Explorer;
• use email, ftp, and Web search engines;
• understand the implications of Internet on society, such as communication, commerce, crime, ethics, and privacy;
• create simple web pages using HTML and CSS;
• write simple programs using JavaScript.

Web Resources

• Companion web site of the course textbook
• World Wide Web Consortium
• W3Schools Online Web Tutorials
• Tryit Editor
• Information Retrieval and Web Search - Chapter 1 from Data Mining the Web: Uncovering Patterns in Web Content, Structure, and Usage by Zdravko Markov and Daniel T. Larose, Wiley, 2007.

Grading: The final grade is based 50% on test grades(midterm and final) and 50% on lab assigmnets and will be affected by classroom participation, conduct and attendance. The letter grade will be calculated according to the following table:
 

A	A-	B+	B	B-	C+	C	C-	D+	D	D-	F
95-100	90-94	87-89	84-86	80-83	77-79	74-76	70-73	67-69	64-66	60-63	0-59

Honesty policy: It is expected that all students will conduct themselves in an honest manner (see the CCSU Student handbook), and NEVER claim work which is not their own. Violating this policy will result in a substantial grade penalty, and may lead to expulsion from the University.

Attendance: All students are expected to attend class sessions regularly. In case of missed classes and work due to plausible reasons (such as illness or accidents) limitted assistance will be offered. Unexcused absences will result in the student being totally responsible for the make-up process.
 

Tentative schedule of classes, assignments and tests (by week)

1. January 22 - 25: Overview of the Internet and the Web
• Topics (chp01_final.ppt)
• Client/server model
• Data and file transmission across the Internet
• URLs and IP addresses as unique Internet IDs
• Structure of e-mail addresses
• File protocols, compression and decompression
• Intranets and Extranets
• Internet connections
• Exercises
• IP addresses and DNS: ipconfig, ping, tracert in DOS window
• Client/server model: URL, protocols, file, http, ftp, telnet
• Assignments
• Read Zeid, Chapter 1
2. January 28 - February 1: Overview of the Internet and the Web (cont.)
• Topics (chp01_final.ppt)
• The Web
• Network share (M: drive)
• Vista course management system
• Exercises: Web browsing, using M: drive and Vista
• Lab 1: Using Vista course management system
• Assignments
• Read Zeid, Chapter 1
• February 3: Submit Lab1
3. February 4 - 8: Web Browsers and Email Tools
• Topics (chp02_final.ppt, chp03_final.ppt)
• Browser tasks
• Browser window structure
• Micorsoft Internet Explorer 6.0
• Managing browsers: cache, plug-ins, and customization
• Managing Web surfing: boomarks, privacy, and security
• E-mail protocols: SMTP, POP3, IMAP, MIME
• Content, attachments
• E-mail clients versus Web-based e-mail
• E-mail Software
• E-mail activities: receive, read, send, reply, autoreply, forward, delete, organize
• Exercises:
• Using browsers: managing windows, identifying different areas in the browser window (right click menu), saving/loading images and files, viewing page source.
• Managing browser settings: bookmarks, cache, history, plug-ins, cookies.
• Lab 2: Extracting information from web pages
• Assignments
• Read Zeid, Chapters 2, 3
• February 10: Submit Lab2
4. February 12 - 14: Using the Web, Web Search
• Topics (chp06_final.ppt, chp07_final.ppt)
• Web security and privacy issues
• The Web Challenges (How to turn the web data into web knowledge)
• Topic directories (Open Directory Project)
• Web crawlers and search engines
• Information Retrival
• Search techniques: words, exact phrase, Boolean operators, title, site, url, link
• Web page ranking (Vector Space Model)
• Intelligent Agents and Semantic Web
• Hyperlink Based Ranking
• Exercises
• Crawling theWeb (WebSPHINX)
• IR resources and demos: http://ir.exp.sis.pitt.edu/resources/
• Booelan queries
• Venn diagram demo
• Vector Space Model
• Using Google's advanced search
• Assignments
• Read Zeid, Chapters 6, 7
• Further reading (optional)
• Information Retrieval and Web Search - Chapter 1 from Data Mining the Web: Uncovering Patterns in Web Content, Structure, and Usage by Zdravko Markov and Daniel T. Larose, Wiley, 2007.
• The PageRank Citation Ranking: Bringing Order to the Web by Lawrence Page and Sergey Brin
• Is There an Intelligent Agent in Your Future?
5. February 19 - 21: Basics of HTML
• Topics (chp09_final.ppt)
• Three views of Web pages: URL, browser display, and document
• Web sites and Web pages
• Text formatting: titles, breaks, paragraphs, emphasis
• Exercises: Tryit Editor, Edit page source in IE
• Lab 3: Basic HTML text formatting
• Assignments
• Read Zeid, Chapter 9
• February 23: Submit Lab 3
6. February 26 - 28: Basics of HTML (cont.)
• Topics (chp09_final.ppt)
• Font size, color and face
• Background
• Ordered list
• Unordered list
• Nested list
• Exercises: Tryit Editor, Edit page source in IE
• Lab 4: Structuring HTML documents
• Assignments
• Read Zeid, Chapter 9
• HTML tutorial (http://w3schools.com/html/default.asp): Colors, Fonts, Background Color, Lists.
• March 1: Submit Lab 4
7. March 4-6: HTML Images and Links
• Topics
• Pixels and resolution
• Image format and software
• Image operations and use
• Links
• Exercises: Creating and using images in HTML documents, local and external links to images and HTML documents (Paint, Tryit Editor, IE)
• Lab 5: Create a web site with two web pages, images and links
• Assignments
• Read Zeid, Chapter 10
• Read HTML tutorial (http://w3schools.com/html/default.asp): Images, Links.
• Submit Lab 5
8. March 11, 25 (No classes on March 18-20, Spring Recess): Web design
• Topics
• Website planning
• Elements of Web design
• Navigation elements
• Layout design
• Website and page design
• Design tools
• Testing and validation
• Putting it altogether
• Exercises: Using HTML editors
• Microsoft FrontPage
• Blackboard Vista HTML creator
• Google Page Creator (googlepages.com)
• Assignments
• Read Zeid, Chapter 11
9. March 27: Midterm Test (25%)
10. April 1-3: HTML Tables
• Topics
• Structure and variables
• Layout design
• Rows and columns
• Headings and cells
• Rendering
• Nesting
• Tabulating data
• Formatting via tables
• Exercises: Creating tables (Tryit Editor, IE)
• Lab 6: HTML document with tables
• Assignments:
• Read Zeid, Chapter 12
• Read HTML tutorial (http://w3schools.com/html/default.asp): Tables
• April 5: Submit Lab 6
11. April 8-10: HTML Frames
• Topics
• Positioning and coordinate system
• Creation
• Layout
• Design
• Management
• Nesting
• Control
• Navigation
• Exercises: Creating HTML pages with frames (Tryit Editor, IE)
• Lab 7: Create a web site with frame-based navigation and multiple pages
• Assignments
• Read Zeid, Chapter 14
• Read HTML tutorial (http://w3schools.com/html/default.asp): Frames
• April 12: Submit Lab 7
12. April 15-17: HTML Forms
• Topics
• Data collection over the Web
• Name/value pairs
• Front and back ends
• Communication cycle
• Elements
• Using forms
• Formatting forms with tables
• Formatting forms with layers
• Exercises: Creating forms (Tryit Editor, IE)
• Lab 8: Create a web page with forms
• Assignments
• Read Zeid, Chapter 15
• Read HTML tutorial (http://w3schools.com/html/default.asp): Forms
• April 19: Submit Lab 8
13. April 22-24: Cascading Style Sheets
• Topics
• Separation of Webpage content and formatting
• CSS syntax
• Linking CSS and HTML
• Inheritance and Cascading order
• Box model
• Font properties
• Text properties
• Content positioning
• Exercises:
• Lab 9: Create an HTML page using a style sheet
• Assignments
• Read Zeid, Chapter 16
• Read HTML tutorial (http://w3schools.com/html/default.asp): HTML Styles (internal, external, inline)
• Read CSS Tutorial (http://w3schools.com/css/default.asp): Syntax, Background, Text, Font, List
• CSS Examples (http://w3schools.com/css/css_examples.asp)
• Submit Lab 9
14. April 29, May 1: JavaScript
• Topics: HTML scripts, JavaScript syntax, Statements, Comments, Variables, Operators, If...Else, Popup Boxes, For Loop, While Loops.
• Exercises: Tryit Editor, IE
• Assignments:
• Read HTML Scriptr (http://w3schools.com/html/html_scripts.asp)
• Read JavaScript Tutorial (http://w3schools.com/js/default.asp): JavaScript syntax, Statements, Comments, Variables, Operators, If...Else, Popup Boxes, For Loop, While Loop.
• Read Zeid, Chapter 19
15. May 6: JavaScript
• Topics: Functions
• Exercises:
• Lab 10: Create a simple JavaScript program
• Assignments:
• Read JavaScript Tutorial (http://w3schools.com/js/default.asp): Functions, Events, Math object, Date object
• Read Zeid, Chapter 19, 20
• May 8: Submit Lab 10
16. May 15 (8-10a): Final Exam (comprehensive, 25%)

Lab 1: Using Vista course management system (graded maximum 5 pts.)

Objective: Learn how to use Blackboard Vista course management system

What to do?

• Why you are taking this class
• What Internet/Web tools and programs you are familiar with
• What you expect to learn from this class

Due date: February 3

What to submit?

Use Blackboard Vista (CentralPipeline>Student>Blackboard Vista>CS-110) to submit the file with your essay as an attachment for Lab 1.

Lab 2: Extracting information from web pages (maximum 5 pts.)

Objective: Learn how to extract different types of information from web pages and use the Vista Mail tool

What to do?

• Extract all plain text (text not associated with links) and copy it into a text file (file extension ".txt"). Use Notepad to create the file.
• Extract all linked text (text associated with links) and copy it into another text file (file extension ".txt" created with Notepad). For each link include the text, the corresponding URL, the protocol name, and the server name.
• Extract all images and copy them into an MS Word document. For each image include the corresponding link (if any).

Due date: February 9

What to submit?

Use Blackboard Vista (CentralPipeline>Student>Blackboard Vista>CS-110) to submit all three files as attachments to a mail sent to Zdravko Markov (markovz). Use the Mail tool in Vista.

Lab 3: Basic HTML text formatting (maximum 5 pts.)

Objective: Learn the basics of formatting HTML documents

What to do?

• <html>
• <head>
• <title>
• <body>
• <p>
• <br>
• <h1>
• <h2>
• <h3>
• <i>
• <u>
• <b>

Restrictions and implementation

Due date: February 23, 11:59 PM.

Use Blackboard Vista (CentralPipeline>Student>Blackboard Vista>CS-110) to submit the HTML file of your web page as an attachment to Lab3.

Lab 4: Structuring HTML documents (maximum 5 pts.)

Objective: Learn how to use font properties and structure HTML documents

What to do?

• Background color (bgcolor)
• Font size (use at least three different sizes, absolute or relative)
• Font color (use at least three different colors)
• Font face (use at least three different fonts)
• Ordered list
• Unordered list
• Nested list

Restrictions and implementation

Due date: March 1, 11:59 PM

Use Blackboard Vista (CentralPipeline>Student>Blackboard Vista>CS-110) to submit the HTML file of your web page as an attachment to Lab 4 (a link is available at the class home page in Blackboard Vista).

Lab 5: Create a web site with two web pages, images and links (maximum 5 pts.)

Objective: Learn how to use images and links in  HTML documents

What to do?

1. Create two HTML documents:
• Take a part of the web page that you created for Lab 4 and move it into a new page (HTML file)
• Or create a new page that includes some information related to your original web page.
2. Include at least one link in the original page to point to the new one and vice versa by using the <a> tag. Use anchor text with proper names (for example, "home page" and "favorite activities").
3. Include an external link in each of both pages that opens in a new browser window.
4. Use the <img> tag to include two images in your web site (one in each page):
• One local image: create an image in Paint, use your picture files or download a picture from the web. Use GIF or JPG format and save the image file in the same drive or folder where the HTML files are located.
• An image from the web: find an image on the web and use its URL in the <img> tag.
• Use width and height attributes in both <img> tags to adjust the image size and the align attribute to align the image properly with the text.

Restrictions and implementation

Due date: March 8, 11:59 PM

Use Blackboard Vista (CentralPipeline>Student>Blackboard Vista>CS-110) to submit all files for the web site inlcuding the two HTML files and the local image file. Attach all files as separateattachments to Lab 5 (a link is available at the class home page in Blackboard Vista).

Midterm (25%)

Topics

1. Internet and the Web
• Client/server model: URL, protocols, file, http, ftp, telnet
• Data and file transmission across the Internet
• URLs and IP addresses as unique Internet IDs
• IP addresses and DNS: ipconfig, ping, tracert in DOS window
2. Web Browsers
• Browser tasks
• Browser window structure
• Micorsoft Internet Explorer 6.0
• Using browsers: managing windows, identifying different areas in the browser window (right click menu), saving/loading images and files, viewing page source.
• Managing browser settings: bookmarks, cache, history, plug-ins, cookies
3. Using the Web, Web Search
• Topic directories (Open Directory Project)
• Web crawlers and search engines
• Search techniques: words, exact phrase, Boolean operators, title, site, url, link
• Web page ranking: content-based and hyperlink-based
4. Basics of HTML
• Three views of Web pages: URL, browser display, and document
• Web sites and Web pages
• Text formatting: titles, breaks, paragraphs, emphasis
• Font size, color and face
• Background
• Ordered list
• Unordered list
• Nested list
5. HTML Images and Links
• Pixels and resolution
• Image file format
• The image tag and its attributes
• Links
• The anchor tag and its attributes

Sample problems

1. Multiple choice questions


Which of the following tags can be used to create a heading
A. <h1>
B. <h2>
C. <h3>
D. All of the above
 

2. True/False questions


Each computer on the Internet has its own IP address
A. True    B. False
 

3. HTML coding questions


A. Add HTML tags to the following text so that the browser displays it exactly as shown below:

This is heading level 2

Here we start a paragraph. This line is broken here
and then continues on the next line.

This text is shown in italics. This text is shown underlined.

The following is an ordered list:

1. This is list item 1
2. This is list item 2. It is further broken down into subitems represented as an unordered list.
• Subitem 1
• Subitem 2
3. This is list item 3


B. Write an HTML fragment to insert in a web page the image from a file named "picture.jpg" in an area 100 pixels high and 200 pixels wide.

C. Write an HTML fragment to create a link to the web page with URL "http://www.ccsu.edu/" and link text "CCSU". The page should open in a new window.

Lab 6: Create a web page with tables, images and links (maximum 5 pts.)

Objective: Learn how to use tables in HTML documents

What to do?

1. Page title
2. Document header (level 1)
3. A table with at least for cells
• A picture with a caption below it in each cell.
• The pictures should be included preferably as external links. If you use local image files, they must use relative URL and be attached to the lab submission.
• The picture should be also a link to a bigger image that opens in a new window.
• The table should have a thick border and enough spacing between the cells to separate the pictures.
4. Some text before and after the table

Restrictions and implementation

Due date: April 5, 11:59 PM

Use Blackboard Vista (CentralPipeline>Student>Blackboard Vista>CS-110) to submit the HTML file and the image files (if you use local images). Attach all files as separate attachments to Lab 6 (a link is available at the class home page in Blackboard Vista).

Lab 7: Create a web site with frame-based navigation and multiple pages

Objective: Learn how to use frames in HTML documents

What to do?

1. Top frame: a web page heading with a short explanation text.
2. Bottom left frame: a navigation menu with at least three links, each one opening in the bottom right frame.
3. Bottom right frame: displaying the page selected from the navigation menu.

Restrictions and implementation

Due date: April 12, 11:59 PM

Use Blackboard Vista (CentralPipeline>Student>Blackboard Vista>CS-110) to submit the lab. Attach all HTML files (the main page with the three frames, the heading page, the navigation page, and all pages that open in the bottom right frame) as separate attachments to Lab 7 (a link is available at the class home page in Blackboard Vista).

Lab 8: Create a web page with forms

Objective: Learn how to use HTML forms

What to do?

1. Drop down boxes
2. Text fields
3. Radio buttons
4. Checkboxes
5. Submit and Reset buttons

Restrictions and implementation

• Use a plain text editor (e.g. Notepad) to create the HTML files and test the web page in a browser.
• The form components must have proper name and value attributes so that when the Submit button is pressed the selections are displayed in the browser address window.
• Pressing the Reset button must clear the form.
• Page text and form components must be arranged in a table. You may use this template to create the HTML document.

Due date: April 19, 11:59 PM

Use Blackboard Vista (CentralPipeline>Student>Blackboard Vista>CS-110) to attach the HTML file to the submission of  Lab 8 (a link is available at the class home page in Blackboard Vista).

Lab 9: Create an HTML page using a style sheet

Objective: Learn how to use Cascading Style Sheets

What to do?

Then create a CSS file and use it the HTML document above. The CSS file should include the following style definitions:

• Body background color yellow
• Heading level 1 color red
• Heading level 2 right aligned, background color green
• Paragraph font family courier
• Paragraph class selector for right alignment
• Paragraph class selector for center alignment
• Ordered list class selector for list style type upper-roman
• Ordered list class selector for list style type lower-alpha
• Ordered list class selector for list style type upper-alpha

Due date: April 26, 11:59 PM

Use Blackboard Vista (CentralPipeline>Student>Blackboard Vista>CS-110) to attach the HTML file and the CSS file to the submission of  Lab 9 (a link is available at the class home page in Blackboard Vista).

Lab 10: Create a web page with Javascript (maximum 5 pts.)

Objective: Learn how to write simple Javascript programs and use them in HTML documents

What to do?

Create an HTML document that displays in a browser as shown below and works as follows:

1. When loaded in the browser a window pops up asking for the user name
2. Then it shows a greeting (with the name entered) and your name (instead of John Doe) on the page title and heading
3. When the "Display date" button is pressed it shows the current date in the format "Today is 2/6/2008"
4. When the "Display time" button is pressed it shows the current time in the format "The time is 8:37"
5. When the "Display calendar" button is pressed it shows the calendar of your birthday month in 2008.

Restrictions and implementation

Due date: May 8, 11:59 PM

Use Blackboard Vista (CentralPipeline>Student>Blackboard Vista>CS-110) to submit the HTML file as an attachment to Lab 10 (a link is available at the class home page in Blackboard Vista).