The PI Spring 2004 Comp082 Class return to portal

taught by Vance Stevens
Lecturer of Computing at Petroleum Institute, Abu Dhabi

Assignment

Last day of class

Your end of term typing scores are given at right according the last test you took Wed May 26, 2004 marked on the scheme presented to computing teachers in a meeting yesterday (not my marking scheme). If you want to retake the test (if you think that's a good use of your time) then you can during this period (choose a lesson greater than 45).

You can work on the HTML practice from yesterday

HTML final practice: You will have to correct HTML code to make an exam portal that links to your ppt, xls, and doc files (for your final). Here's one you can play with: EOSpractice082s.htm. Here's what you should do with this (sample target here):

1. Put your name in the title bar
2. Close the </head>
3. Put your name in the H1 heading
4. Put your class in the H2 heading
5. Make the text white (look for a missing ' quote mark)
6. Make the bottom left and right cells appear in a second row of the table
7. change the picture link to another picture on the L drive
8. Close the </H2> heading to make text beneath table normal size
9. Close the </Center> so the bullets line up
10. Put the list of favorites as demoted bullets under favorite things, like this:
    • Favorite thing 1
    • Favorite thing 2
    • Favorite thing 3

Last week, in addition to preparation for the Final Exam, we'll be working on Web Presence.

• You can work on your blogs (make picture links and hyperlinks)
• Put your Portal on the Internet and improve it there. Click on more information and follow the links.

End of Semester projects due June 2, 2004

• Metric conversions: http://www.metric-conversions.org/
• Yahoo site for comparing 4 cars: http://autos.yahoo.com/newcars/comparison/select.html
• See how your final projects will be marked here
• More information on the projects here

HTML portal pages. Be sure your pages are complete and link to one another

• Check here to see what your portal pages must include.
• Here is the marking scheme for your portal pages

Typing quiz Wednesday on Keyboard Tutor up to lesson 45

Students were shown how their final projects will be marked today.

Please check the links at right and see if your HTML portal pages display correctly on the PI Intranet. Then check here and make sure they display correctly on the Internet: 082a | 082c | 082e

Typing progress reports are due by end of period today. There will be a typing quiz Wednesday on Keyboard Tutor up to lesson 45

You have three tasks in class today

• Typing progress - Update the chart attached to your name tent and create a new Excel document in the same format with data filled in. Create a chart from that showing your keyboarding progress for your last ten exercises this month (date and exercise on X axis and speed and accuracy on Y axis). Submit the result to Work Finished. See an explanation of what to do here.
• Work on your End of Semester projects
• Make your HTML files match the criteria given here

Projects are to be done as follows. Here are the steps:

1. Prepare the 4 files you will need: Word, PowerPoint, Excel, and HTML
2. Put the text you find here in the four files created in Step 1
3. Follow these instructions to complete the project.
4. All comparisons are to be of 2004 model cars. You can see your car assignments here.. If you need to change your car assignment, see your teacher.

Your MyHTML has a PORTAL page and a TABLE page. Here is a summary of requirements for this project:

• All your project files should be in an MyHTML folder in your home folder and there should be nothing but project files in that folder .
• All filenames submitted to Work Finished in form ID#etc no spaces, parentheses, etc in filenames
• At least two html documents so far: Both files should link to each other.
  • One should have two pictures and two texts in 4 quadrants of a table.
  • One should have at least one bulleted list (with more than one level for full credit)
  • One should have a colored background One should have an image background
  • The text color should be easily readable for each background, and the text color should be different in each of the two pages
• Put a <H1> title and <H2> subtitle on all pages in your project and <CENTER> at least one of them.
• Put a Form effect on one of your Web pages (riddle or guest sign-in box or some other effect from Response-o-Matic.
• Embed a 'borrowed' JavaScript effect in ONE of your Web pages.
• Put your name and date on each of your current web pages (just as you look for when you evaluate web pages)
• Your favorite sites cannot be the same as anyone else's. Ten points off if you link to exactly the same My Favorite sites as someone else, or use exactly the same JavaScript, and so on.

Learn how to put some simple effects in Web pages with Forms and JavaScripts

Forms

• Learn how to put form code on your web page and have responses emailed to you here: http://www.response-o-matic.com (for example, make a text box window that lets visitors 'sign' your guestbook). Check out a sample form generated by the wizard here.
• Make a Riddle Game out of the Form code you find here / same thing but formatted in a table ...

Like this ...

JavaScript

• Try ONE of these effects (too many is too much, do you think?) . To see how to create the effect for your page, right click on the link and open it in a NEW window, then View / Source:
  • Make your browser window shake
  • Make your background change through a spectrum of colors
  • Make an announcement on your page with a textbox marquee.
    This one is actually a combination form and javascript
• 'Borrow' from free javascript libraries such as:
  • JavaScript Planet
  • JavaScript City
  • JavaScript search
  • Find more by searching on free javascripts in Google

Homework:

• Put a <H1> title and <H2> subtitle on your portal page and <CENTER> them.
• Put a Form effect on one of your Web pages (riddle or guest sign-in box or some other effect from Response-o-Matic.
• Embed a 'borrowed' JavaScript effect in ONE of your Web pages.

Teacher evaluation, last 10 min of this class

In this lesson you will make a 'portal' page that introduces you and the web projects you have started at the PI and placed in your MyHTML folder.

You will learn how to make a 'bulleted' or 'unordered' list (no numbers). You can learn how to make a bulleted list here (or follow the pattern here). For this lesson, you need to know how to start an unordered list with <UL> and start each bullet with <LI> (the code before"Modifying the Bullet"). Note how the list items are 'nested' to get the promoted and demoted bullet effects.

Your new page will have a bulleted list of links to:

• Your own web projects
  • Your blog (the one you want marked)
  • The page with the pics in a table that you were working on last lesson
  • Work on the Internet from any of your other PI computing classes
  • Any other web sites you have on the Internet
• Any other 'favorite' sites you want to point us to on the Internet
  • You should list your first 'favorite' here
  • Your second 'favorite' goes here

The ° items should be hyperlinked. That means that when they are clicked on, the browser opens the target sites. To recall how to make links, review:

• Step 7 Linking to documents
• Step 8 - Linking to URLs in the HTML tutorial

You should now have two web pages and perhaps some images in your MyHTML folder (there should be no files in that folder except your working project files).

• Both files should link to each other.
• One should have two pictures and two texts in 4 quadrants of a table.
• One should have at least one bulleted list (with more than one level for full credit)
• One should have a colored background
• One should have an image background
• The text color should be easily readable for each background, and the text color should be different in each of the two pages

Making Tables:

• Have a look at the explanation
• Open the sample file and follow instructions there.
• Make your web page from the previous lesson so that the pictures appear diagonally opposite in a 2 x 2 table. Make your text descriptions refer to the picture 'to the right' and 'to the left'. (Here's an example here)

Add a background image, change text color -

• Use this worksheet
• Search Google for 'background images' (to find sites like http://www.backgroundcity.com/ or http://www.sdsu.edu/graphics/backgrounds/)
• Find a small image and save it in your MyHTML folder. The best images for this purpose are small 'tiles' which will make a consistent background for your page. Also, the best backgrounds are 'soft' ones, not 'loud' ones that will dominate your page and distract from its content (these are background images, remember? not foreground).
• Set up your web page so that the image becomes a background.
• You may have to change your text color so you can read it against your background. Review HTML Tutorial #11 to see how.

What do do today:

• Housekeeping - make a work space, do the two quizzes ...
• Take the HTML Review - complete the quiz, then do the review exercise. Follow the instructions carefully. Place your file in you MyHTML folder.
• Expand your file to have two pictures and two descriptions.

This is your work for today. To see where this is going, check the plan for Saturday

Worksheet 23 - Mail Merge - do Luminous and Karaoke in class. Save your work in your home folder (not to Work Finished). Then for homework create an Excel spreadsheet and a Mail Merge document to promote your new CD store with branches in all cities and towns across the UAE. (Those indicated at right have done the homework below)

Submit THREE files to Work Finished

• The Excel spreadsheet 000name082sn_cdadvert
• The Word template.doc with the merge <<labels>> 000name082sn_cdadvert_template
• The resulting merged Word letters.doc 000name082sn_cdadvert_results

This is an invitation to a GRAND OPENING so make your letter attractive. Try to SELL your store to people in your database.

When I open your document and click on Merge the letter should appear, and when that happens, your number will appear in blue here to the right -->>

Complete worksheet Word Review (Racing) - finish in class Wednesday and complete by next Saturday

Special instructions:

• Font at top of document up through "clinching his first podium finish" in the table is Times New Roman 10
• The font after that from "It was a closely fought race ... " is Verdana 8.5
• The Final Results table is auto-formatted to Elegant, auto-fit all items. If the table is still too big to fit on one page, don't worry, submit it to Work Finished and forget it. We've tried everything to make it fit. It works on some computers, not on others.

Complete worksheet about inserting pictures in Word (Birds) - finish in class Wednesday and complete by next Saturday

For Class and Homework ...

• Do an image search on Google for an image of your choice
• Right click on the image to get its properties. You need its URL and its dimensions (in pixels)
• Log On to your blog in Blogger
• In your blog, write why you chose this picture (why it appeals to you). Make a new post that displays the picture (if you edit an old post you'll have to change its date)

• Use <IMG SRC="http://www.pictureURLhere">
• If necessary, resize the picture, like this ...
  <IMG SRC="http://www.pictureURLhere" HEIGHT="hxx" WIDTH="wxx">
• Important: reduce height and width by dividing each value by the same number

In class Monday, we will go on to YahooGroups and click on your blog. You will get credit for the assignment if

• Your correct blog is listed as a bookmark under your class at http://groups.yahoo.com/group/pi082spring/
• Your blog has a posting with a picture dated April 9 or later (to find your posting, we may have to click on Archives and see if we can get the 4/1/04-4/31/04 archives to appear, or try Current Postings) - you should have your Archives set to 'monthly'

Assignment

The next typing quiz will be Saturday April 10, up to lesson 40

If you get free time after doing worksheet 6 today, here's what you can do:

1. Practice your typing (try to reach 25 wpm on lesson 40, 97% accuracy)
2. Make sure your class blog is listed at http://groups.yahoo.com/group/pi082spring/links
3. Link that blog to any other blogs or web pages you have on the Internet
4. Have a look at http://www.bloki.com . Try to make a bloki like this one: http://vstevens.bloki.com
5. Have fun!

PPT Worksheet 4 - Improve your slide show from Worksheet 3a with Excel file in Lessons/vstevens, save to your Home folder as 000name-4x4-xls-082sn and submit it to work finished. When you're done with that, work on your typing or your blog (see below).

PPT Worksheet 03a - Create the slide show (6 or 7 slides from the 6 paragraphs on the back of the handout and title slide and conclusion slide), save to your Home folder as 000name-4x4sales-082sn and submit it to work finished. When you're done with that, work on your typing or your blog (see below).

By now you should have put a bookmark to your blog in our YahooGroups folder. Now post your new introduction to your blog. It's a new semester. Say hi to your new teacher. Tell me (and the world) who you are and

• where you come from (what city or town in the UAE).
• what you like to do on weekends or in your spare time (when you're not studying)
• what your plans are for the near future

If you want to WORK on your blog, you can find some help pages here:

• Learn how to post and edit in Blogger: Posting and editing posts, steps 9 - 10
• Learn how to change the template to put your own photos and links on your blog

In my Comp082a class today we looked at some free javascript libraries such as JavaScript Planet and JavaScript search. JavaScript City is being blocked by Websense at the PI today (but try reaching it from home).

IMPORTANT: Before you change your template, back up the old one. -

• Get the template in Blogger
• Hi-lite ALL of it and use ctrl-C to copy it to your computer's buffer or pasteboard
• Open Start / Programs / Accessories / Notepad
• Copy the old template from your computer memory to the Notepad document
• Save the old template in your Home folder

If you make any mistakes that prevent your blog from displaying correctly, then simply copy the template from your Home folder to replace the one saved at blogger The template tells Blogger how to display your blog entries.

In case of accidents with the template, don't worry. Your blog entries are OK. You can also see them after accidents by selecting a NEW template. This will restore your blog entries, but if you do this you will lose any changes you made to your template up to then.

QUIZ on PowerPoint

• Create a presentation to look like one in a handout
• Make suggestions to improve a 'bad' presentation

PPT Worksheet 03 - Create the slide show (8 slides from the 6 paragraphs on the back of the handout and title slide and conclusion slide), save to your Home folder as 000name-picomputing-082sn and submit it to work finished. Hand in a printed handout if possible.

Marking (each item 4 points):

1. Work submitted to WF by Feb 23
2. Filename is in format 000name-picomputing-082sn
3. There are 8 slides in the presentation
4. Title slide is simple and clear
5. Title slide shows info on other slides
6. Title slide has a subtitle
7. Title slide has your name
8. Title slide shows PI logo
9. Title slide has no transition or effect
10. Next 7 slides have same transition
11. Next 7 slides have same effect
12. Slide 2 is bulleted correctly (appropriate topics and subtopics)
13. Slide 2 outlines main points of Paragraph 1
14. Slide 3 is bulleted correctly (appropriate topics and subtopics)
15. Slide 3 outlines main points of Paragraph 2
16. Slide 4 is bulleted correctly (appropriate topics and subtopics)
17. Slide 4 outlines main points of Paragraph 3
18. Slide 5 is bulleted correctly (appropriate topics and subtopics)
19. Slide 5 outlines main points of Paragraph 4
20. Slide 6 is bulleted correctly (appropriate topics and subtopics)
21. Slide 6 outlines main points of Paragraph 5
22. Slide 7 is bulleted correctly (appropriate topics and subtopics)
23. Slide 7 outlines main points of Paragraph 6
24. Concluding slide shows presentation has ended
25. You submit a printed handout

If you don't already have one, get a Yahoo ID. Sign on to our YahooGroup at http://groups.yahoo.com/group/pi082spring/ and fix it so that all the links on the left hand side are blue and hyperlinked. To do this at the YahooGroup site:

• Click on My Account (and enter password)
• Member Information -- EDIT
• Email Information - Enter Alternate Email and VERIFY it

When you've done that, visit the LINKS section, open the folder for your class, and ADD A BOOKMARK for the blog you will use for this class.

First open your correct class folder and in that folder Add a Bookmark. Follow this format:

• Title: 007 Vance Stevens (last 3 digits of your ID and your name - id first please)
• URL: http://your_blog_name.blogspot.com
• Description: My blog for this class

PPT Worksheet 01 (review) - Work through the worksheet if necessary and/or simply produce a set of 3 or 4 PPT slides to introduce yourself.

Submit your introduction to Work Finished (computing/Vance_Stevens/ and the correct Comp082sn folder). Your work will be graded on:

• (50 pts) submitting PPT to Work Finished on time
• (5 pts) name the file 000name_intro082sn as per instructions
• (5 pts) using any design template
• (10 pts) text in the slide about yourself, proofread (no mistakes, like mis-spelling, that proofreading tools would pick up)
• (10 pts) having at least one bulleted list
• (5 pts) having at least one demoted level bulleted list
• (5 pts) having a footer
• (5 pts) animated bullet points
• (5 pts) transition between slides

Enroll in the pi082spring YahooGroup. Either visit the web site directly, or send blank email, as shown here:

• http://groups.yahoo.com/group/pi082spring/
• pi082spring-subscribe@yahoogroups.com