Steps in Making A Classrooom Web Page

© Jerry Belch

Overview of Project
  • The objective here is to:
    1. Create a web page for your virtual business class
    2. The web site will have 18 pages.
    3. Assignment is designed to last approximately three weeks.
    4. From the first page you will be able to access all pages
      • Getting Started - The first five week's of class assignments are listed here.
      • Our Company - A link to the seven department pages and their weekly assignments.
      • Ability to apply on line for a job in the Virtual Business Class
      • Grading Policy Page
      • Business Partner Page
      • Special Events Page
      • Photo Gallery
      • Quarter Tasks Pages
    5. The company pages include the following:
      • Administration Department
      • Accounting Department
      • Sales Department
      • Marketing Department
      • Human Resources Department
      • Information Technology Department
      • Fund Raising Department

    • Tutorial

  • As a prerequisite, you should have already completed the Cascading Style Sheet Assignment in the Steb by Steps

  • Using a web site to organize your class and weekly plans is an excellent way to work with all the components of a Virtual Business Class.

  • The class web site can also be used as promotional tool , a good source for parents who want to see what is done in a virtual business class

  • A tool to be used by school counselers for advertising and enrollment purposes

  • A excellent example for an IT Department member for a portfolio item.

  • The sample web pages given here are designed for Benicia High School Virtual Business class called the Cakery.

  • Currently there is no program at Benicia High School.

  • You will customize these forms for your school

  • You wil be given a template for each page.

  • It is designed so that it is easy to make changes to the site and assignments.

  • The assignements suggested are tied to the assignments at janetbelch.com web site

    Materials to Collect

    1. Student handbook for your school. Need for attendance and tardy policies
    2. Digital pictures of your school's logo.
    3. Address and telephone number of your school.
    4. Coordinator's e-mail address
    5. Email address of your company
    6. URL of company's web site
    7. Job descriptions and salaries of each employee if you want to make changes to what is already here.
    8. An organization chart for your company
    9. A list of all departments
    10. Pictures to be used
    11. Videos wanted as part of web page
    12. Animated gif's if you choose to use them.
    13. Decide on font family, colors, size, weight, headlines and lists formats, headers and footers for Cascading Style Sheet Page
    14. Quarter Tasks from VE website for each department are included
    15. Pictures of Your VE class members
    16. Pictures of activities that your VE company has participated, like open houses, grand openings, trade fairs, etc.
    17. Lesson plans not already determined from your instructor.

    Teacher's Responsibility

    1. Look at lessons already developed for the different departments.
    2. Decide how you want to modify lessons to fit your needs.
    3. Add new lessons for third and fourth quarter for your IT department to key in for each department.
    4. Hand out progress logs to department head
    5. Grade progress logs when returned from CEO
    6. There is quite a bit of JavaScript in these pages. If there no changes made to it by your students, you will NOT have to change some Internet Options
    7. If the pages do not perform properly do the following, like loading and assignment
      • Click Tools on the browser tool bar.
      • Select
      • Click on the Advanced tab
      • Under the browsing category, uncheck Disable script debugging Internet Explorer
      • Uncheck Disable scribt debugging other
      • Click Apply
      • Click OK

    Second Semester Ideas by Department

    Accounting
    • New General Ledger VB10
    • Stand alone payroll program
    • Stand alone Accounts Receivable
    • Invoicing
    • Personal Finance
    • Inventory unit
    • Accounting presentation to be given at grand opening
    • Annual report presentation including monthly financial statements

    Administration

    • Set up dates for open houses and grand opening
    • Determine which trade shows to attend
    • Transportation for events
    • Personal Finance
    • Grand Opening Presentation
    • Annual report

    Sales

    • Inventory
    • Invoicing
    • Inservice staff on sales procedures for grand opening and open houses
    • Personal Finance
    • Grand Opening Presentation
    • Annual report

    Marketing

    • Plan Grand Opening
    • Determine dates for Open Houses
    • Coordinate fundraising
    • Internet Advertisements
    • Inventory
    • Organize Open houses
    • Personal Finance
    • Grand Opening Presentation
    • Annual report

    Information Technology

    • Cascading Style sheets
    • Teacher Assignment Web site
    • Internet ads
    • Personal Finance
    • Grand Opening Presentation
    • Annual report

    Fundraising

    • Organize fundraising activities
    • Keep track of all monies collected
    • Personal Finance
    • Grand Opening Presentation
    • Annual report

    Human Resources

    • Monthly News letters
    • Employee of the Month
    • Personal Finance
    • Grand Opening Presentation
    • Annual report
    • Step-By-Step Instructions

    Teacher Assignment Web Site - Week 1

    There are seven major pages linked to the first page. Each page is used to help the VE teacher organize the assignments for each department. The categories are: Our Company which links the user to the Administration Department, the Accounting Department, The Human Resources Department, The Information Technology Department, The Marketing Department, The Sales Department and the Fundraising Department. Other links from the first page are: Grading Policy, Business Partners, Apply for a Job, Special Events, Quarter Tasks and a Photo Gallery.

      Day 1: Viewing template web page/Saving first page.

      Click Here to see Benicia High School's web page. You will use it as a template for your site.

    1. Go Through each page site
    2. The first page is composed of the following elements:
      • The header
      • The school's Logo
      • School's contact information
      • Name of the School and Virtual Enterprise
      • All the Links down the side to other pages
      • What is Virtual Enterprise?
      • A picture of the Virtual Business Team
      • The Logo for the VE company
      • A link to your Virtual Business Web site
      • The logo for California Virtual Enterprise
      • A link to the California VE website.
      • Some of these items you will change. Others you will leave alone.
    3. Saving the first page.
      • Display on your screen the beginning page, indexlp.html
      • Right-Click on the page.
      • Select "View Source" from drop-down menu
      • You will see the source code displayed in Notepad
      • Click File on the menu bar, then click "Save" - Save As Box appears.
      • Use Look-In Box to decide where to store your web page files.
      • I suggest making a new folder on your hard drive in My Documents section to keep all related documents in one place.
      • Use "indexlp.html" as your file name for this first page. Keep this name to save yourself a lot of work changing links from other pages.
      • Make sure that the file extension is ".html"
    4. By saving indexlp.html to as separate folder, we have the main body of the document.
    5. We did not however, transfer the following:
      • Getting started assignment
      • The style.css file
      • The Company Page
      • The job Application Page
      • The grading Policy
      • Business Partner Page
      • Special Events
      • Photos
      • Quarter Tasks

      Day 2: Tranhsferring the missing links to your student folder

    1. All of the items needing transfer except one are Microsoft Word documents.
    2. Look at the table below to see the files we will be downloading to your site

      Files that need to be downloaded
      Cascading Style Sheet File Getting Started Grading Policy
      Business Partners Special Events Quarter Tasks

    3. For the Cascading Style Sheet file. This one is not a Microsoft Word document
      • Click on the file name in the table above.
      • It will load automatically into Notepad.
      • Click "File" on the menu bar.
      • Click "Save As"
      • Select your student work folder for this project.
      • Key in file name to save "style.css" - Watch the file name. It is case sensitive. Do not type the quotation marks.
      • Click the Save button.
      • Close Notepad application
    4. Microsoft Word Documents - all other files in the table
      • If you have Windows 7 follow the instructions below.
      • In the table above, click on the file name.
      • Click "Save As"
      • Make sure that you are saving into your student work folder for this project.
      • File name to save is "gs.doc"
      • The .doc exenstion is for Word Files from older Microsoft Word versions.
      • The newer version of Microsoft Word will still be able to read this file.
      • The newer version uses a .docx extension. and cannot read a file with the newer extension.
      • If you do not have Windows 7, follow the same procedure. There are a few more steps to download the file
      • You need to actually open the file in Word.
      • When the file opens in Word, You need to use Save As to save the file to your student work folder for this project.
      • Follow the procedure above and transfer all the files in the table to your student work folder.
    5. Now it is time to check our work
    6. Go into your student folder and double click on "indexlp.html" to see the page.
    7. What is missing?
    8. Header, Footer, Logo, Company Picture, VE logo for California, Company Logo and link to your company web site.
    9. Getting the missing parts
      • We need to look at the code in the both the style.css file and the indexlp.html file.
      • Make sure that you are still in your student folder
      • Double-Click on the "style.css" file. It will open in Notepad.
      • The file appears below in the scroll box
      • Scroll down to the #header section
      • background :url(cropped-office.jpg); is where the picture for the header is named.
      • The picture is simply a .jpg picture called "cropped-office.jpg"
      • You may choose to keep this one and then no changes need to be made for the header picture.
      • If you want to use this header, go back to the step by Step tutorial
      • click here: header picture. Then right-click the picture, click on Save As and save it in your student folder under the file name of "cropped-offfice.jpg"
      • No changes need to be made to the style file since you are usung that file name as the picture header.
    10. If you choose to use a different picture
    11. Find a suitable picture and copy it into your student folder
      • If it is a small image, you can repeat the image multiple times. See the lines for the footer under background-repeat: repeat-x;
      • It takes some experimenting to find the right header that works with your class assignment web page.
      • There are numerous clip-art packages available: The Big Box of Art and Art Explosion, for example.
      • Make certain that when you save the name of the picture file that the name of the file is the same as the one specified in the style.css file.
      • Remember to save the style file after adjusting images for the header. Keep the same name for the file.
    12. Now scroll down to see the #footer section of he style file.
      • I used a minature picture of the school's mascot.
      • Microsoft Paint has a great feature that allows you to adjust the size of an image.
      • You will notice that the image is repeated horizontally. repeat-y would repeat the image vertically.
      • After finding your image and reducing it,copy it into your folder and make the name of the file match the one indicated in the style file.

      The style file is listed below.

    13. Now let's look at the indexlp.html file
    14. Double Click on "indexlp.html"
    15. Right click the Form
    16. Select "View Source"
    17. Your screen should look like the file listed below in the scroll box.
    18. Scroll down about 20 lines until you find the line that says <img src="cougar.jpg" height=200 width=250 border=3 vspace=10 hspace=10 align=center>Benicia High Cougars</TD>
    19. You want to insert the picture of your school's mascot and change the name of the school. Just replace"cougar.jpg" with a picture of your school's mascot.
    20. Replace your school's name and team name with where it says "Benicia High Cougars"
    21. Remember the name in the indexlp.html file must match the name of your school mascot file name.

      The indexlp file

    22. Now we need to change the contact information
    23. Scroll down until you see the line <Center>Benicia High School
    24. Key in your high school name
    25. Look at the lines that directly follow. Change phone, address, city, state and zip code.
    26. Substite either your teacher's email address or the email address of your VE company
    27. Find the line <FONT face="Helvetica" color=chocolate size=6> <Center>Virtual Business Benicia High School>
    28. Put in your school's name here.
    29. Scroll down to the line <Img height=200 width=200 src="5.jpg" border=3><BR><Center>Our company picture<//Center>
    30. Copy a picture of you company to your work folder.
    31. Use the file name of that picture in the indexlp.html page where is says src="5.jpg"
    32. Find the line <img height = 200 width=200 src="Company Logo.jpg" border= 3 ><BR><Center><A href="http://bhsve.com/the_cakery"</A>The Cakery Web Site<BR></Center></TD>
    33. This line contains a pictue of the company logo and a link to the company web site.
    34. Save a picture of your company's logo in your folder. Call it "Company Logo.jpg". It is case sensitive, so be careful. Make it match.
    35. The next part of that line contains the address of the Cakery's web site. <A href="http://bhsve.com/the_cakery"</A>The Cakery Web Site<BR></Center></TD>
    36. Substitute your company's URL here after the // A folder called called the_cakery was created in the domain name - bhsve.com
    37. When a user clicks on it, they will be directed to your company's web site.
    38. The cakery web site is no longer available
    39. Substiture the Cakery Web Site text with the name of your company.
    40. Find the line <TD><img height=200 src="VE Logo.gif" width = 220 border= 3 ><BR>
    41. Here is where the California VE logo goes on the page. Notice that it is a "gif" picture format.
    42. There is a newer version of this Logo. I believe that you can capture a copy of it on The VE Web site. Just right-click it and use "Save Picture As" method.
    43. The line that says <A href="http://www.virtualenterprise.org/index.aspx"</A>Virtual Enterprise WebSite
      is a link to the VE web site
    44. If you want to keep this link on your classroom page, leave the line unchanged.

      The Style File - Changing the Footer

    45. In the style file, find the line that states background:url(cougar2.jpg);
    46. Substitute your graphic here instead of cougar2.jpg
    47. This graphic can be almost anything. but keep it small and repeat it horizontally
    48. Remember to save the style.css file after making changes to it.

      Day 3: Modifying the Company Page

      Our company page

    1. The company page's main function is to be a link to all department pages.
    2. Find the line in the company.html page that states <FONT face=Helvetica><FONT color=chocolate size=6 > Virtual Business Benicia High School </Center >
    3. Key in the Virtual Business and the name of your school.
    4. Find the line that states <img src="Organization Chart.jpg" height=720 width=720 hspace=5>
    5. Copy your own company's organizational chart to your student folder. Rename it if necessary to match the file name above. Watch the case.
    6. Replace the line that states The Cakery is a bakery service that designs speciality cakes for companies and individuals for special events. We can create cakes for birthdays, anniversaries, office parties.
    7. Make this line about your company
    8. Replace this line with contact information about your school site Benicia High School  Phone (707) 747-8325  1101 Military West Benicia, CA 94510  <A href="mailto:veteacher@gmail.com">mailto: VE Teacher</A>
    Day 4 Modifying the Accounting Department's Page.

    Accounting Department Page

    1. Scroll back in this tutorial to Day 1 and click on the template for the web page.
    2. Click on the Accounting Page Link from the first page.
    3. Double Click on "accounting.html"
    4. Right click the form
    5. Select "View Source"
    6. You may also click in the text area box above, select the text, copy it then paste it into Notepad and save the file
    7. Make certain that you save the file under the name "accounting.html" in your student folder. Case matters.
    8. Your screen should look like the file listed above in the scroll box.
    9. Change the line below to reflect the name of your high school.
    10. <CENTER>Virtual Business Benicia High School <BR>Accounting
    11. If you want to change the department's description, do so at this time.
    12. You may also want to change the job descriptions of department menbers.
    13. Remember to save material into your student folder after making changes.
    14. Saving quarter tasks.
      • Return to the original template next to Day 1 in the tutorial.
      • Select link to take you to the Accounting Page.
      • Click on the link for each quarter.
      • Open the file
      • Use "Save AS" to save the file in your student folder.
      • Keep the same file name as before. Do not change it.
      • Switch back into your student folder and test the accounting page links for quarter tasks.
      • Test each link to see that it works. Note: These Microsoft Word files were saved as Word 97 - 2003
      • The extension is ".doc"
      • The newer version of Word uses a ".docx" extension. If you save it this way, you will have to modify the file name in the accounting page. the line below and the other quarter tasks links
      • <A href="q1accounting.doc" </A>Quarter 1 Accounting Tasks
    15. You will notice that this page of the web site is considerbly more complicated than the others
    16. It contains a way to select the actual assignments
    17. The code above the body is Javascript. Do not change any of the code between the beginning <Script> and ending </Script> tags. The lessons are for each quarter starting with quarter 2 and ending through quarter 4.
    18. There are 9 weeks in a quarter,
    19. The file names reflect the quarter and week of these assignments. Do not change these file names
    20. For example a file called "accq3w4.doc" is the accounting department file for the third quarter fourth week.
    21. We need to copy these assignments to your student folder. There is actual information in these files for the second quarter
    22. To copy these files to your student folder, follow these steps:
      • Use Scroll bar to see lesson
      • Click on lesson
      • A message box opens on your screen, telling you which lesson you selected
      • Click OK
      • Open the file or use the Save AS choice to put the file in your student folder
      • Continue until all accounting lessons and forms are coppied into your student folder.
      • Change the contact information at the bottom of the form so that it reflects your school.
      • Save accounting.html in your student folder.
    Day 5: Modifying the Administration Page

    Our Administration Page

    1. We need to copy and paste the page into our student folder
    2. The administrative page appears below in the textarea box.

    3. Select all the text above
    4. CTRL C for Copy
    5. Get into your student folder
    6. Open Notepad or Notepad++
    7. CTRL V to paste document into your folder
    8. Save your file as adm.html

    9. You need to change the name of the school. This line is just below the header.
    10. If you wish change Department Descriptions and Jobs in the Administrative Department. Ask your instructor.
    11. Change contact information about school. It is located on the bottom of this page
    12. Save your web page. Keep the name the same "adm.html"
    13. Go back top the template next to day 1 and click the link for the administrative page. We need to copy the quarter tasks and assignments into our student folder.
    14. To copy the Administrative tasks
      • Click on the link for Quarter 1 Adminisrative Tasks. Either use Save AS in Windows 7 or Open it and then use Save As
      • Remember keep the same file name and save them into your student folder.
      • Try the links out in your studnet folder to make sure that they all work.
    15. Administrative Department Assignments
    16. Click on the link and use either :Save As: into student folder or Open the file and Save AS in student folder.
    17. Follow the same procedure to copy all assignments into student folder.
    18. Check out the links in your student folder.

      Printer Friendly Version - Week 1

      Teacher Assignment Web Site - Week 2

        Day 1: Sales Department Page
      1. Now we are going to use the template for the sales department and modify if for our own school.
      2. Go back to day one, Click on the template, select company Link, then select the Sales Department Link
      3. This page, as you can see, is very much like the Administration Department and Accounting Department pages.
      4. You need to change The school name in the box just below the header.
      5. The contact information needs to be changed.
      6. It is located just above the header.
      7. The quarter tasks need to be saved into your student folder
      8. The assignments need to be saved into your school folder
      9. Follow the same instructions as demonstrated above for Accounting and Administration Departments.
        • Click on quarter task
        • Click Save As and put it into student folder
        • Use the same procedure for assignments.
        • Remember when these documents are open, your instructor may want to modify them
        • Just make the changes, use the same file name and save them into your student folder.
        • Change job descriptions and titles if you wish
        • Save and test

      Day 2: Marketing Department

      1. Now we are going to use the template for the marketing department and modify if for our own school.
      2. Go back to day one, Click on the template, select company Link, then select the Marketing Department Link
      3. This page, as you can see, is very much like the Administration Department and Accounting Department pages.
      4. You need to change The school name in the box just below the header.
      5. The contact information needs to be changed.
      6. It is located just above the header.
      7. The quarter tasks need to be saved into your student folder
      8. The assignments need to be saved into your school folder
      9. Follow the same instructions as demonstrated above for Accounting and Administration Departments.
        • Click on quarter task
        • Click Save As and put it into student folder
        • Use the same procedure for assignments.
        • Remember when these documents are open, your instructor may want to modify them
        • Just make the changes, use the same file name and save them into your student folder.
        • Change job descriptions and titles if you wish
        • Save and test

      Day 3: Human Resources Department

      1. Now we are going to use the template for the human resources department and modify if for our own school.
      2. Go back to day one, Click on the template, select company Link, then select the Human Resources Department Link
      3. This page, as you can see, is very much like the Administration Department and Accounting Department pages.
      4. You need to change The school name in the box just below the header.
      5. The contact information needs to be changed.
      6. It is located just above the header.
      7. The quarter tasks need to be saved into your student folder
      8. The assignments need to be saved into your school folder
      9. Follow the same instructions as demonstrated above for Accounting and Administration Departments.
        • Click on quarter task
        • Click Save As and put it into student folder
        • Use the same procedure for assignments.
        • Remember when these documents are open, your instructor may want to modify them
        • Just make the changes, use the same file name and save them into your student folder.
        • Change job descriptions and titles if you wish
        • Save and test

      Day 4: Information Technology Department

      1. Now we are going to use the template for the information technology department and modify if for our own school.
      2. Go back to day one, Click on the template, select company Link, then select the Human Resources Department Link
      3. This page, as you can see, is very much like the Administration Department and Accounting Department pages.
      4. You need to change The school name in the box just below the header.
      5. The contact information needs to be changed.
      6. It is located just above the header.
      7. The quarter tasks need to be saved into your student folder
      8. The assignments need to be saved into your school folder
      9. Follow the same instructions as demonstrated above for Accounting and Administration Departments.
        • Click on quarter task
        • Click Save As and put it into student folder
        • Use the same procedure for assignments.
        • Remember when these documents are open, your instructor may want to modify them
        • Just make the changes, use the same file name and save them into your student folder.
        • Change job descriptions and titles if you wish
        • Save and test

      Day 5: Fundraising Department

      1. Now we are going to use the template for the fundraising department and modify if for our own school.
      2. Go back to day one, Click on the template, select company Link, then select the Fundraising Department Link
      3. This page, as you can see, is very much like the Administration Department and Accounting Department pages.
      4. You need to change The school name in the box just below the header.
      5. The contact information needs to be changed.
      6. It is located just above the header.
      7. The quarter tasks need to be saved into your student folder
      8. The assignments need to be saved into your school folder
      9. Follow the same instructions as demonstrated above for Accounting and Administration Departments.
        • Click on quarter task
        • Click Save As and put it into student folder
        • Use the same procedure for assignments.
        • Remember when these documents are open, your instructor may want to modify them
        • Just make the changes, use the same file name and save them into your student folder.
        • Change job descriptions and titles if you wish
        • Save and test

      Printer Friendly Version - Week 2

      Teacher Assignment Web Site - Week 3

      Day 1: Applying For Your Virtual Enterprise Job

      1. The on-line job application form is a link from all pages
      2. the form appears below
      3. Go back to the beginning of the tutorial and load this page.
      4. Just a few changes are needed to customize the form.
      5. You will need to change the name of the school and where the form is sent when the user clicks the submit button
      6. You may want to change the logo as well.
      7. A complete listing in Notepad appears below.

      8. Find the following <Strong>Benicia High School Virtual Business</Strong><P> near the top part of the form
      9. Change it to your high school instead of Benicia High School and save it.
      10. The next line is responsible for displaying the logo <font size=4>Employment Application <img src="VE logo.gif" hspace=525 width=75 height=75 border=5 Align=top ><P>
      11. Just substitute the name of your logo file in between the quotation marks.
      12. Now we need to direct the application to an e-mail adddress when the Submit button is pressed.
      13. Find the line just below APPLICANT INFORMATION.
      15. Substitute your company'e e-mail address for jerrybelch@cox.net.
      16. Leave the rest of the line alone.
      17. Save the file and refresh the browser.
      18. There a number of different ways of submitting a form thru the Internet. The one illustrated here is the mailto approach.
      19. On most commercial servers there is a CGI script available from the web host to process a form.
      20. Most school servers do not have the ability to process a form using a CGI script.
      21. Here is an example of one of those scripts
      22. Another line is also necessary for the Form mail CGI script on a server. It is located at the bottom of the form.
      23. The apostrophe and the two dashes, comment out these lines. The browser ignores this line. It ends with two dashes and a >
      24. The mailtotag works on most browsers and email clients.
      25. However, I encountered difficulty using Windows 7 and Windows Live email.
      26. Windows Live email can receive the submission, but just can't send the contents of the form.
      27. I am still trying to resolve this issue.
      28. Now it is time to try our the form.
      29. Fill in the form with data and click the submit button.
      30. There are required fields before the form can be submitted: First name, Last Name, email address and student id number.
      31. The reset button clears the form.
      32. Try it out with just the required field for now.
      33. When the Submit button is pressed, all the information betweem the <Form> and </Form> will be submitted to the email address specified in the form tag.
      34. Note all fields were not filled in and consequently no information appears after the equal signs for those fields.
      35. Above is how the infomation will appear when the email is opened.
      36. To make a copy of the application for yourself or your instructor follow these steps.
        • Complete all lines of the job application.
        • Drag the whole application with the mouse. Make sure that you start at the very top and go all the way to the bottom
        • You can leave out the submit and Reset buttons
        • Hold down the Control Key along with the c key or click edit and select fopy
        • Open Microsoft Word
        • Use either CTRL-V or select edit and paste.
        • This process takes a while, so be patient
        • Sometimes copying and pasting from web pages to Word documents brings unwanted table lines and symbols.
        • These can be edited out using Word
        • Print out the document if you wish.
      Day 2: Photo Page
      1. This page allows the teacher to display photos and videos of the class, trade show booths, grand openings, etc. The page is set up to handle 12 photos/videos. Photos should be in the jpg format and saved under the following names. 1.jpg, 2.jpb, 3.jpf, 4.jpg --- 12.jpg
      2. The following depicts how this page might look.
      3. Photos
      4. Here is the code for the photo page.
      5. Replace the name of the high school and the cougar.jpg with you own information.
      6. Copy the pictures into the same directory as the one you are using for the web pages,
      7. Rename the pictures if needed.
      8. The size of the pictures is set at width=250 and height 250 pixels.
      9. The information contained in the "alt" part of the img src tag is a description of the picture. The user sees that information when they pass the cursor over the picture.
      10. Make your descriptions match your photos.
      11. Video can also be played here. Look in Photo.html
      12. You could feature your company video commercail here, grand opening videos, trade fair booth and sales, your company accepting an award.
      13. There are many video file format extensions. Some of the more common ones are:
        • .mpg
        • .AVI -Audio Video Interleave
        • .mov - Apple Quick tome
        • .wmv
        • .rm
        • .mp3
        • .mts AVCHD video
      14. Substitute the information after the href= for your movie clip file name.
      15. When you click on the movie, the default media player should open and then you can play, pause and fast forward your movie
      16. There are numerous formats for video. The examples listed below are AVI, Audio Video Interleave and AVCHD, Advanced Video Coding High Definition.
      17. Remember the files must be in the same directory or folder as your photo web page.
      18. If you right-click the video file, then click on Properties, you can change the program that opens the video file.
      19. Near bottom of page, replace name of high school and email address for your company.
      20. Save and Test.

      Day 3: Checking all links and pages

      1. Today we need to check spelling and all links
      2. Start with the first page and click on every link to navigate from page to page
      3. Check on the links in the first page to navigate to:
        • Our company
        • Apply on-line Job Application
        • Grading Policy
        • Business Partners
        • Special Events
        • Photos
        • Quarter tasks
        • Link to company web site
        • Link to VE web site
      4. Check links on company page
        • Accounting
        • Sales
        • Marketing
        • Human Resources
        • Information Technology
        • Fundraising
        • Home page link
      5. Administration Page
        • Home page link
        • Job application link
        • Quarter tasks for all quarters
        • All links to assignments
      6. Accounting Department
        • Home page link
        • Job Application link
        • All four quarter tasks links
        • All Assignments
      7. Human Resourcss
        • Home page link
        • Job Application link
        • All four quarter tasks links
        • All Assignments
      8. Sales Department
        • Home page link
        • Job Application link
        • All four quarter tasks links
        • All Assignments
      9. Fundraising
        • Home page link
        • Job Application link
        • All four quarter tasks links
        • All Assignments

      Day 4: Adding second semester assignments for all departments

      1. As you were copying the assignments for each department to your folder, you could see that the files were Microsoft word files with a .doc extension
      2. This is the older version of files for Microsft Word 97-2003. Save the new assignments in the same format to save changing the extensions for each file assignment
      3. Ask your instructor what assignments you are to copy to each department's assignment pages
      4. Just click on the assignment for the quarter and week desired.
      5. When the document opens, fill in each day's assignment.
      6. Ssve the file in the older Microsoft Word format so that the extension of .doc match the links on the web page.
      7. Look at second semester ideas for lessons in the tutortial

      Day 5: Test your knowledge.

      1. Take the computerized step by step test for teacher assinment web site.

      Printer Friendly Version - Week 3