| Week |
Topics Covered |
|
Week 1
1/25
|
Introduction to the course
- Go over syllabus
- What you'll learn
- What you need
- Assignments
- Grading
- Expectations
- Lab time
- Edinboro Network
- Take roll
- Make sure all of us can run the Adobe software
- Make sure you all want to learn about making web pages!!
- Take notes because all the necessary information is not in the book.
Your Homework Website:
Implement the following:
- Create the initial web page for every student that has a link to all future homework
- Make it live on the eup web server
- Briefly explain how internet works as it relates to Edinboro and your web pages.
- Make sure we can all get to the EUP WebDir directory
For example, if your login name was dt123456:
When taking the course on campus:
In File Explorer -> \\eup\dfs\webdir\dt123456
When taking the course from home:
Using FTP-> in file explorer type into the address bar:
ftp://webstorage.edinboro.edu
Then login using your EUP login. Then you'll have access to your webspace
You then create your webpages on your computer, when finished you copy them up to the webstorage directory. Make sure you use good directory strutucure.
- Open File Explorer
- type in ftp://webstorage.edinboro.edu in the adresss bar up top.
- Login
- This will open up the folder containing your files
- Open another instance of File Explorer
- Use drag-and-drop to copy your files to the web server
To see your web page live on the Internet:
In a browser -> http://users.edinboro.edu/dt123456
Web Site Work flow:
- Define scope of project, objectives, target audience, schedule & available resources
- Develop Design strategy and establish the look and feel of the web pages
- Develop Prototype (This will be our actual site)
- Present to client
- Assemble & create the web site.
Start Chapter 1 - How the internet works
Zoom recording of 1/27
Zoom recording of 1/29
|
|
2/1
|
Chapter 1 - Internet and web page basics
- Chapter 1 Notes
- Discuss what we'll use to create web pages.
- Notepad vs. Dreamweaver vs. Brackets
- Work on making our homework page
- Introduce Brackets (hopefully)
Steps to Create a Web Site
- Create the folders you will need in Windows Explorer
- Create a new HTML document
- Create your first page (index.html) in your web site.
- Notes on how to start your web pages
*** Don't forget to make Folders!! ***
*** Don't forget "No spaces in folders or web page names!!" these become URLs ***
Chapter 2 - HTML Basics
- Finish Chapter 1 notes
- Create a template.html page for trying new things
<!DOCTYPE html>
<html lang="en">
<head>
<title>Page Title Goes Here</title>
<meta charset="utf-8">
</head>
<body>
</body>
</html>
- Start Chapter 2 Notes if time
- Heading
- Paragraph
- Line break vs. new paragraph
- Lists
- Special Characters
- HTML syntax validation
- Anchor
- Hyper-link
- e-mail link
- Let's do some hands-on exercises from the book in chapter 2. (Maybe 2.4)
Zoom recording of 2/1/2021
Zoom recording of 2/3/2021
Zoom recording of 2/5/2021
|
| 2/8 |
Chapter 2 - HTML Basics
- Finish Chapter 2 Notes
- Make a page using heading elements for our fonts
- show example of <br> vs. <p>
- Make ordered and unordered lists
- Use of anchors
- hyper-links
- make an e-mail hyper-link
- Talk about Yoga Studio Case Study
Chapter 3 Web Design Basics
Zoom recording of 2/8/2021
Zoom recording of 2/10/2021
Zoom recording of 2/12/2021
|
|
2/15
|
Chapter 4 - Cascading Style Sheets
- Chapter 4 Notes
- Finish the discussion on HTML
- Work on the Pacific Trails in-class example
- If time - Open our Template & make CSS styles
- Inline
- Embedded
- External
- Class Selector
- ID Selector
- Descendant Selector
- Hands-On Practice 4.1 → template.html (download or use the one you made earlier)
- Hands-On Practice 4.3
- Hands-On Practice 4.4 → embedded.html
- Hands-On Practice 4.5 → starter.html
Zoom recording of 2/15/2021
|
| 2/22 |
Chapter 4 - Cascading Style Sheets
- Continue with some examples
- Discuss the exam
- Create a simple HTML pages according to some specs I give you.
- Read the chapters again for review
- Practice CSS
- Practice Exam
- HTML
- Design
- Review Page
Exam 1:
Feb 26th
Zoom recording of 2/24/2021 - Review for Exam 1
|
| 3/1 |
Chapter 5 - Web Graphics Styling Basics
Solution to Pacific Trails up to Chapter 4
Zoom recording of 2/15/2021 - Chapter 5 (we jumped ahead)
Zoom recording of 2/17/2021 - Chapter 5 (we jumped ahead)
Zoom recording of 2/19/2021 - Chapter 5 (Ch-5 1st part of Pacific Trails)
Zoom recording of 2/22/2021 - Chapter 5 (Ch-5 2nd part of Pacific Trails)
|
| 3/8 |
Chapter 6 - More CSS
Image Map (not in the book)
Zoom recording of 3/1/2021 - Going over the Chapter 6 notes
Zoom recording of 3/3/2021 - Going over the Chapter 6 Questions & Start Pacific Trails
Zoom recording of 3/5/2021 - Going over the Chapter 6 Questions & Finish Pacific Trails
|
| 3/15 |
Chapter 7 - Page Layout Basics
- Vertical and horizontal navigation
- Using CSS
- Using DIV and their placement
Zoom recording of 3/8/2021 - Going over the notes for chapter 7
Zoom recording of 3/10/2021 - Finish Chapter 7 notes then start Chapter 7 Pacific Trails case study
Zoom recording of 3/12/2021 - Finish Chapter 7 Pacific Trails case study
|
| 3/22 |
Chapter 8 - More on Links, Layout, and Mobile
- Chapter 8 Notes
Zoom recording of 3/15/2021 - Go over the notes for Chapter 8
Zoom recording of 3/17/2021 - Answer questions and start the Ch8 Pacific Trails
Zoom recording of 3/19/2021 - Work on Ch8 Pacific Trails
Zoom recording of 3/22/2021 - Answer some Homework Questions & Finish Ch8 Pacific Trails
Zoom recording of 3/24/2021 - Work on Ch 9 Pacific Trails CSS file
Zoom recording of 3/26/2021 - Finish Ch 9 Pacific Trails
|
| 3/29 |
Review for the Exam
Discuss the exam
- Chapter 5 - Graphics and Styling
- Chapter 6 - More CSS
- Chapter 7 - Page Layout
- Chapter 8 - More on Links, Layout, and Mobile
I'm thinking a practical exam, create a web site and e-mail me the URL.
Review: Exam 2 Notes
Review Practice Sheet
Exam 2 - Chapters 5 through 8
April 5th
Zoom recording of 3/29/2021 - Review for Exam - Part 1
Zoom recording of 3/31/2021 - Review for Exam - Part 2
|
| 4/5 |
Chapter 9 - Table Basics
Zoom recording of 4/7/2021 - Chapter 10 notes
Zoom recording of 4/9/2021 - Chapter 10 notes & Start Ch10 Pacific Trails (and modify notepad++)
|
| 4/12 |
Chapter 10 - Form Basics
- Our server doesn't support server side programming though
- Chapter 10 Notes
- Work on Form
Zoom recording of 4/12/2021 - Finish the Ch10 Pacific Trails Case Study
Chapter 11 - Media and Interactivity Basics
Zoom recording of 4/14/2021 - Start Ch 11 Notes
Zoom recording of 4/16/2021 - Finish Ch 11 Notes & start the Ch11 Pacific Trails Case Study
|
| 4/19 |
Working with MS Word
Zoom recording of 4/19/2021 - Finish the Ch11 Pacific Trails Case Study & Discuss web hosting
Zoom recording of 4/21/2021 - Start Word Processing Example - Features for MS Word
Zoom recording of 4/23/2021 - Finish Word Processing Example - Features for MS Word
|
| 4/26 |
Java Script
Lets Make a web page that caclulates something, like maybe a temperature converter. We'll use forms.
Link to the Javascript page
Zoom recording of 4/26/2021 - Start Javascript Page
Zoom recording of 4/28/2021 - Finish Javascript Page
Review for Final
Review Notes
Zoom recording of 4/30/2021 - Review for Final Exam
|
| 5/3 |
Final Exam
Final Exam , Wednesday May 5th @ 10:15 - 12:15
|
|
|
Is on Fridays !
|
Assignments |
| Due Date |
Description |
| Some Notes |
Homework Files → Files for the Hands-On Exercises
Author's web page where you can download the files and unzip them
Notes on how to start your web pages
My Sample Homework page
|
|
2/5
|
Chapter 2 - Hands on Practice Exercises staring with 2.3
** Skip hands on 2.10
**
Case study Path of Light Yoga Studio - starts on Page 65
|
|
2/12
|
Chatper 3 - Hands on Exercise number 1 only. → Make a simple web page for your answer and link to your homework page. For part ' g. ' just list the Best Practices that they did not follow. If you don't like any of the ones listed you can choose your own.
* No Path of Light Yoga Studio for Chapter 3 * |
|
2/19
|
Chapter 4 Hands-On Practice Exercises except 4.8.
Chapter 4 Modify your Path of Light Yoga Studio web page.
|
|
2/26
|
Chapter 5 Hands-On Practice Exercises
Path of Light Yoga Studio for chapter 5
|
|
3/5
|
Chapter 6 Hands-On Practice Exercises
Chapter 6 Path of Light Yoga Studio
|
|
3/12
|
Chapter 7 Hands-On Practice Exercises
Chapter 7 Path of Light Yoga Studio
|
|
3/26
|
Chapter 8 Hands-On Practice Exercises
Note: in 8.7 you need to delete the "nav" from the bottom list of style declarations for the print to work correctly (taking out the menu) in the BistroPrint.css
Chapter 8 Path of Light Yoga Studio
|
|
4/9
|
Chapter 9 Hands-On Practice Exercises
Chapter 9 Path of Light Yoga Studio
|
|
4/16
|
Chapter 10 Hands-On Practice Exercises
Chapter 10 Path of Light Yoga Studio
|
|
4/23
|
Chapter 11 Hands-On Practice Exercises
Chapter 11 Path of Light Yoga Studio
|
|
4/30
|
Word assignment |
| 5/4 |
Java Program |
