Home

Web Authoring 1
All video content created by Daniel Ouellette

Dan's Video Intro to Course

 

SUBMITTING ASSIGNMENTS


ZIP UP THE ROOT FOLDER & UPLOAD TO CANVAS.

 

Suggested Software for Text Editing:
Mac :
Text Edit
PC:
NotePad++

 

Classes

1a. Orientation Week


2a. HTML Basics - Using a Text Editor -  page 1  page 2   page 3     Coding assignment    Download assets   5%


3a. HTML Applied - Using a Text Editor - How to create ID link   Tables   spec sheet check list    Video Instructions    Download assets      5%


What is a SELECTOR?

4a. Create HTML page with CSS  - Using a Text Editor -   Video Instructions    spec sheet instructions   Download assets   5%


Useful Resources

Full List of CSS Properties:  CSS Keyword Index

Awesome Colour Tool - Adobe Color Creator for Web


5a. Create HTML Page with CSS - Using a Text Editor -    CSS Demo   instructions   Download assets   6%


6a. Layout using Absolute Position Div Tags - Using a Text Editor -   Video Instructions    Download assets     6%

6b. Layout using Div Tags & CSS - Using a Text Editor -  Video Instructions    spec sheet instructions   Download assets     6%


7a. Photoshop - Image formats and sizing   Format images  create web page   set background color code  Download assets      5%


Mid Break


8a. Review HTML & CSS - instructions    Download assets    - 5%


9a. In-Class Test   20%    
Link to Test will be provided in class.                                                                               

      Hand in zipped root folder to CANVAS before end of class.

In-Class Test Prep:

  1. Create a root folder with images folder and css folder nested.
  2. Create an external CSS file and save in CSS folder.
  3. Create HTML pages and save in root folder.
  4. Create CSS Tag styles, class styles and ID styles with properties set according to instructions
  5. Apply various styles as instructed
  6. Create HTML Headings, paragraphs, Lists, images and tables
  7. Create Hypertext links as well as images that behave as links.

make sure you are set to Design mode not Live mode.

10a. Setting Up a Site in Dreamweaver tutorial 

10b. Dreamweaver basic content assignment   checklist   Download assets     5%


11a. CSS in Dreamweaver  assignment   Download assets   6%

11b. CSS Layout in Dreamweaver   CSS Layout using DIV tags   create 3 distinct areas with borders using div tags and absolute positions.   6%


12b. Final Assignment    final assignment criteria   20%


13a. - Work on Final Assignment.


14a. - Final Assignment - DUE TODAY.


 

Optional Bonus Assignment

B01. Layer based Slices in PhotoShop   tutorial    assignment   Download assets     5%


©2024 Daniel Ouellette                  

Contact Dan:
douellette@loyalistcollege.com

Check Your Grade
All Marks on CANVAS

Loyalist Animation
winner - Canadian New Media Awards
"Educator of the Year"

"Educator of the Year"
produced by DJO Studios

My musical alter-ego
©2023 DJO Studios