GDS 45 - Web Design - Online
Weekly Instructions
Fall 2020- Section 74823 - Partially Synchronous


Aug. 31 - Week 1 Instructions:

Recordings of the live meetings should be available in canvas un Conferzoom?

The weekly live demo files used in class will be here

Live topics for Monday and Wednesday this week

On your own

  1. Welcome to the class!
  2. Note: If you have not done this already, try to figure out a regular(maybe daily)time when you can work on the class. It can help in online classes. Procrastinating is not advised ;)
    There are some other good tips for online learning here at
    8 STRATEGIES FOR GETTING THE MOST OUT OF AN ONLINE CLASS
  3. Login to Canvas (https://wvm.instructure.com) and download the syllabus in Canvas from the class home page near the top if you don't have it.
  4. Optional if you attended the live session Monday:
    Watch the video orientation. The current syllabus will be slightly different from the one in the video.
  5. See the class links sidebar on this page for Canvas and online learning related links.
  6. Read the General Class Information in Canvas (https://wvm.instructure.com). It may be slightly different than the video or syllabus.
  7. Please let me know if you are confused or having trouble with the material. Your first option is to post in the question discussion forum in Canvas. Click on Discussions on the left in Canvas to find the forum. If your question is more personal, you can message me through Canvas (https://wvm.instructure.com), by logging in, clicking on the class, clicking on the inbox link on the left, and creating a message. It's like email inside the class.
  8. Optional Office hours: Generally Mondays 4:30PM - 6:00PM and Tuesdays 9:00AM - 11:00AM through Zoom. Check the Announcements section in Canvas for links to the zoom office hours. You can talk to me live at those times to ask questions, etc.
  9. Assignment:
    Post in the
    "Introductions" discussion forum in Canvas. Give a short introduction to yourself, and about your expectations for the class.
    You can find the discussion forum under the Discussions link on the left or the Content Links module. I will check this to verify you are in the class. Make sure to reply to the post as soon as possible to avoid being dropped.
  10. Assignment - Please take the opening day survey in the week 1 module in Canvas.
  11. Mission College tutoring is now online, and there is tutoring for some of our classes if you need it.
  12. We do use photoshop a bit in the class. See the syllabus for more options, but as far as I know at this time, the best deal for the complete Adobe CC can currently be found for $40/semester at http://store.collegebuys.org/
    • Adobe software like Photoshop and Lightroom are usually available in the Academic Support Center on Campus(not currently available due to Covid-19). Check their web site for current hours. http://missioncollege.edu/depts/academic_support/
    • Please let me know if you do not have adequate computer hardware, internet access, or can't afford the $40 for the Adobe software.
  13. Read Chapters 1 and 2 in Learning Web Design. You should be able to get FREE ACCESS to the books from Oreilly Safari Books Online. See below.
  14. Read the file under Day 1 Terms in the week 1 module.
  15. Assignment 1 - First Page: Create your first web page by watching the video on Creating a basic web page. Please recreate the page exactly. In later assignments, you will have more creative freedom. Before you send me your files, always make sure to check your file for errors by submitting it to the W3C validation service at:
    http://validator.w3.org/. Click on Validate File by Upload near the top, then click the browse button, locate your file, and submit. It will point out some coding errors, if you have any. Another thing to do is to view the code source in Firefox(PC:control-U/Mac:command-u). Mistakes will often show up there in red text. After correcting any mistakes, submit your final files. Drop the file in the Assignment 1 drop box in Canvas in the weekly module. Include your name in the file name as in firstname_lastname_page1.html. Have fun! Check the calendar for due dates.

Sept. 7 - Week 2 Instructions:

Recordings of the live meetings should be available under the conferzoom link in canvas

Here is the link to the Wednesday meeting recording

The weekly live demo files used in class will be here(if there are any)

Live topics for Wednesday this week(No class Monday)

On your own

  1. Read Chapter 3 and 4 in Learning Web Design. Do the Ch. 4 exercises for practice if you wish. You do not have to turn these in.
  2. Read pages 1-7 in the Principles of Beautiful Web Design. It is about the web design process. If you are reading the online version, you can read up until the "Defining Good Design" heading.
  3. Optional:
    Take a look at this video on the web design process
    and this page from GDS46 Web Design and Development 2 on the Web Design Process(youtube video).
  4. Assignment 2 - Text Formatting Tags: Create your second web page by watching the Text formatting tags video tutorial. Please recreate the page exactly. Don't forget to validate as you did with assignment 1 by checking the file at:
    http://validator.w3.org/
    Click on Validate File by Upload near the top, and then click the browse button, locate your file, and submit. Drop your file in the Assignment 2 drop box. Name the file page2.htm with your name in the file name as in firstname_lastname_page2.html. Check the calendar for due dates.

    Important note on the videos: Some videos and files are in html5, while some might occasionally be in XHTML. It's a good idea to know both syntaxes, since you will see both on the web and both are viable. They are not all that different. Check out page 761 of Learning Web Design for xhtml markup requirements. This is in Appendix D for those using the online version of the book.

Sept. 14 - Week 3 Instructions:

Recordings of the live meetings should be available under the conferzoom link in canvas

The weekly live demo files used in class will be here(if there are any)

Live topics for Monday and Wednesday this week

On your own

  1. Read Chapter 5 in Learning Web Design. It is about basic tags for text. Do the Ch. 5 exercises for practice if you wish. You do not have to turn these in.
  2. Read the rest of Chapter 1(you already read pages 1-7) and Ch. 2 of The Principles of Beautiful Web Design, 3rd Edition. They are about layout and color.
  3. Take a look at the file Dos and Don'ts of web design in the weekly module(Optional).
  4. You can also check out these articles (Optional):
    1. Biggest Mistakes in Web Design 1995-2015 - from Web Pages That Suck where you learn good web design
    2. Checklist of bad web design Part Two from Web Pages That Suck Learn good web design by looking at bad web design
  5. Watch the video on Web Design Mistakes(youtube video). Some of the featured awesome websites are linked below.
  6. Check out these example bad websites for things not to do.
    1. http://www.angelfire.com/super/badwebs/
    2. http://www.arngren.net/
    3. http://www.supervideo.com/
    4. http://www.gatesnfences.com/
    5. 20 Examples Of Bad Web Design
  7. Check out this site on Accessibility for Designers. Accessibility is very important, often deals with making sites easier to "see" for the vision impaired, and is mandatory on some some sites, such as government sites. Also see the section on "ONE WEB FOR ALL (ACCESSIBILITY)" in Chapter 3 of Learning Web Design.
  8. Find a website you think is poorly designed and talk about why you think it is poorly designed. Post/reply under the forum Poorly Designed Websites in the weekly module in Canvas. Try to post your first post by Friday, then comment on posts about websites posted by other students by the due date.
  9. Review pages 303-315 in Learning Web Design about color and the hexadecimal system. You can search for it in Ch. 13 if you are looking at the online version of the book. A bit of the same material is in Ch.2 of The principles of Beautiful Web Design.
  10. Watch the video on Color and Color Schemes.
    The sites below are in the video.
    1. http://www.color-wheel-pro.com/color-schemes.html
    2. https://color.adobe.com
      This is a cool color picker and theme collection from adobe.
    3. http://colorschemedesigner.com/
  11. Assignment 3 - Lists: Create a web page by watching the Lists, intro to colors, comments, and special characters video tutorial. The bullet3.png file needed for the page is in the weekly module and here. For this assignment, please recreate the page exactly. In later assignments, you will have more creative freedom. Drop your files into the Assignment 3 drop box. Don't forget to include the bullet3.png file with your submission. If you forget, I won't see it.

    To turn in assignments with multiple files or folders, it works best if you put all files in a folder and zip the folder. Canvas has changed how I receive files from students in submissions that are zipped. Because of this, it is important to name your folder correctly BEFORE you zip it to send, so I know who's folder it is. Please name you folder like this firstname_lastname_assignX where X is the assignment number. Then when you zip the folder, I will know it is yours.

    To zip the folder: To zip a folder on a PC, create the folder with your name on it like this firstname_lastname_assignX and put the files needed in it, then right click, select "send to," and finally "compresses (zipped) folder". On a mac, control click or right click on the folder and select compress. Remember to name the folder before compressing it, so I can see who's it is when it is uncompressed.
    1. Don't forget to zip your folder with your files(see above)
    2. Don't forget to validate your files BEFORE you send them at:
      http://validator.w3.org/
      This will affect your grades, as I will do it too, and see if you have any errors that show up. Check the calendar for due dates.
    3. Note: The dl tag in the video used to refer to a definition list. The meaning of the dl tag has been slightly modified to mean a description list in HTML5. Also, the dd tag now is a term description.
  12. Start Assignment 4 - Reading Summary which is:
    • Create 1 basic web page on your own with at least 6 different facts, opinions, or bits of information from the week 1 reading Ch 1-3 in Learning Web Design. Try to take at least 2 items from each chapter. Use the tags we we have gone over (html, head, body, h1, p, br, etc.). Check out Ch. 4 and 5 in Learning Web Design for help. There are samples to look at in the weekly module. Make sure to validate HTML at http://validator.w3.org/. You can validate CSS at http://jigsaw.w3.org/css-validator/. You should validate both to see if you can catch errors.
      Note:The validators may give you multiple error messages for 1 mistake, so you may not have as many errors as you think.
      Here are some examples to look at.
      They are also in the weekly module in Canvas.

      Requirements:
      You must use the following tags, elements, or css styles at least once.

      1. a heading, h1 for example
      2. blockquote
      3. strong
      4. background-color
      5. a list

Sept. 21 - Week 4 Instructions:

Recordings of the live meetings should be available under the conferzoom link in canvas

The weekly live demo files used in class will be here

Live topics for Monday and Wednesday this week

Monday

Wednesday

On your own

  1. Reading this week(I know I listed a lot, but do what you can when you have time):
    1. Important! Take a look at Ch. 11 of Learning Web Design for an intro to CSS.
    2. Take a good look at Chapters 1 and 2 of The Principles of Beautiful Web Design, 2nd Edition. They are about layout and color.
    3. For more detail and background, review Chapters 4 and 5 in Learning Web Design. Chapter 5 covers many of the text tags we have been using.
  2. Watch the video on HTML5 Semantic Elements. There is no assignment associated with this video, but the information could come up later...hint, hint ;)
  3. Optional: Learning Web Design exercises 11-1 and 11-2: Complete Exercises 11-1 and 11-2 from Learning Web Design. You do not have to turn this exercise in, but you do need the information for later assignments. All book related files can be downloaded from http://www.learningwebdesign.com
    Here is a link to a page on CSS
  4. Here are some good online references for CSS
  5. Assignment 5 - Basic Page with Containers: Follow along and create the page in the video GDES 45 Basic Page with HTML 5 Containers. You will also use the file you create as a starting point for later assignments. Don't forget to validate your file before you turn it in! http://validator.w3.org/
    • To turn in the assignment:
    • To turn in assignments with multiple files or folders, it works best if you put all files in a folder and zip the folder. Canvas has changed how I receive files from students in submissions that are zipped. Because of this, it is important to name your folder correctly BEFORE you zip it to send, so I know who's folder it is. Please name you folder like this firstname_lastname_assignX where X is the assignment number. Then when you zip the folder, I will know it is yours.

      To zip the folder: To zip a folder on a PC, create the folder with your name on it like this firstname_lastname_assignX and put the files needed in it, then right click, select "send to," and finally "compresses (zipped) folder". On a mac, control click or right click on the folder and select compress. Remember to name the folder before compressing it, so I can see who's it is when it is uncompressed.
    • Drop your zipped files into the Assignment drop box.
    • Check due dates on the calendar in Canvas.
  6. Finish Assignment 4 - Reading Summary which is:
    • Create 1 basic web page on your own with at least 6 different facts, opinions, or bits of information from the week 1 reading Ch 1-3 in Learning Web Design. Try to take at least 2 items from each chapter. Use the tags we we have gone over (html, head, body, h1, p, br, etc.). Check out Ch. 4 and 5 in Learning Web Design for help. There are samples to look at in the weekly module. Make sure to validate HTML at http://validator.w3.org/. You can validate CSS at http://jigsaw.w3.org/css-validator/. You should validate both to see if you can catch errors.
      Note:The validators may give you multiple error messages for 1 mistake, so you may not have as many errors as you think.
      Here are some examples to look at.
      They are also in the weekly module in Canvas.

      Requirements:
      You must use the following tags, elements, or css styles at least once.

      1. a heading, h1 for example
      2. blockquote
      3. strong
      4. background-color
      5. a list

Sept. 28 - Week 5 Instructions:

Recordings of the live meetings should be available under the conferzoom link in canvas

The weekly live demo files used in class will be here

Live topics for Monday and Wednesday this week

Monday

Wednesday

On your own

  1. Watch the video RGB and RGBa Color. There is no assignment to turn in for this video.
    The file in the lessons module on Color using the hexadecimal color or RGB, and background color transparency goes along with the video. Also look at CH. 13 and specifically page 271 of the printed version of Learning Web Design for a description of RGBa, which can be used to make your background colors partially transparent. Search for RGBa in the online version of the book.
  2. Reading this week: Review Chapters 6 in Learning Web Design on links. It will help on Assignment 6.
  3. Assignment 6 - Links and File Paths: Create 2 web pages by watching the Links and File Paths video. Recreate the site exactly as the one in the video. Chapter 6 in Learning Web Design also can help. Name the files as in the video. The names of your files must match the names in your links, or the links will not work.
    Make sure to check the code image in the weekly module for differences from the video since there may be a couple of code issues in the video.
    Always make sure to check your file for errors by submitting it to the W3C validation services at http://validator.w3.org/ and http://jigsaw.w3.org/css-validator/
    • To turn in the assignment:
    • Before you zip the folder with your files, test the site before you send it make sure all the links work.
    • To turn in assignments with multiple files or folders, it works best if you put all files in a folder and zip the folder. Canvas has changed how I receive files from students in submissions that are zipped. Because of this, it is important to name your folder correctly BEFORE you zip it to send, so I know who's folder it is. Please name your folder like this firstname_lastname_assignX where X is the assignment number. Then when you zip the folder, I will know it is yours.

      To zip the folder: To zip a folder on a PC, create the folder with your name on it like this firstname_lastname_assignX and put the files needed in it, then right click, select "send to," and finally "compresses (zipped) folder". On a mac, control click or right click on the folder and select compress. Remember to name the folder before compressing it, so I can see who's it is when it is uncompressed.
    • Drop your zipped files into the Assignment drop box.
    • Check due dates on the calendar in Canvas.
  4. Check out this page on using the html 5 figure and figcaption tags to place a caption next to an image. Using these tags also gives you more tags to use as hooks for CSS styles. Click the Try it Yourself link near the top to see it in action.
    You can see another example here.
  5. Start Assignment 7 - Resume or Reading Summary. There are examples in the weekly module.
    Full requirements and instructions listed here
    . Check due dates on the calendar.
    Note: The image of yourself is required, not optional
    . Make sure to do the images exercise first so you know how to do it. The requirements page has been updated.
    If you have general questions, ask them in the discussion forum in Canvas.
  6. Don't forget, if you have questions, or just interesting links or observations, post them in the discussion forum in Canvas. It is part of your grade ;)

Oct. 5 - Week 6 Instructions:

Recordings of the live meetings should be available under the conferzoom link in canvas

The weekly live demo files used in class will be here

Live topics for Monday and Wednesday this week

Monday

Wednesday

On your own

  1. Watch the video on Locations for CSS and basic selectors. There is no assignment to turn in for this video. It should be a bit of a review. It can also help with the assignment with external style sheets.
  2. Watch this video on image file formats and review this web page on image file formats.
  3. Chapters 7 and 23-25 of Learning Web Design have more detail on images.
  4. Read Chapter 24 of Learning Web Design for more detail on optimizing images.
    • Do exercises 24-1 and 24-2 to practice image optimization.
    • You do not have to turn these in.
  5. Check out this page on scanning if you don't feel comfortable with scanning.
  6. Optional: Here is a video on scanning that might help too.
  7. Check out this page with a salary guide put out by The Creative Group. It has information about salaries for designers and developers. You can make money doing this stuff!
  8. Assignment 8 - Adding Images to a Web Page: Recreate the page in the video by watching the video Adding Images to a Web Page. Recreate the page like the one in the video, although you can use different images than the ones in the video. Chapter 7 in Learning Web Design also can help. Make sure to start with the valid links site files from Assignment 7, with corrections made if needed. Of course, always make sure to check your files for errors by submitting it to the W3C validation services at http://validator.w3.org/ and http://jigsaw.w3.org/css-validator/
    • To turn in the assignment:
    • Before you zip the folder with your files, test the site before you send it make sure everything works, and validate the pages to catch errors.
    • Remember, to turn in assignments with multiple files or folders, it works best if you put all files in a folder and zip the folder. Also remember to name your folder correctly BEFORE you zip it to send, so I know who's folder it is. Please name your folder like this firstname_lastname_assignX where X is the assignment number. Then, when you zip the folder, I will know it is yours.

      To zip the folder: To zip a folder on a PC, create the folder with your name on it like this firstname_lastname_assignX and put the files needed in it, then right click, select "send to," and finally "compresses (zipped) folder". On a mac, control click or right click on the folder and select compress. Remember to name the folder before compressing it, so I can see who's it is when it is uncompressed.
    • Drop your zipped files into the Assignment drop box.
    • Check due dates on the calendar in Canvas.
  9. Finish Assignment 7 - Resume or Reading Summary. There are examples in the weekly module.
    Full requirements and instructions listed here
    . Check due dates on the calendar.
    Note: The image of yourself is required, not optional
    . Make sure to do the images exercise first so you know how to do it. The requirements page has been updated.
    If you have general questions, ask them in the discussion forum in Canvas.

Oct. 12 - Week 7 Instructions:

Recordings of the live meetings should be available under the conferzoom link in canvas

The weekly live demo files used in class will be here

Live topics for Monday and Wednesday this week

Monday

Wednesday

On your own

  1. Read Ch. 3 in The principles of Beautiful Web Design on texture.
  2. Be familiar with the information in Chapters 11 and Chapter 12 of Learning Web Design. They have more information on css and using css to format text.
  3. For practice, complete Exercises 12-1 through 12-6 from Learning Web Design. They are related to using selectors and formatting text which we covered. You do not have to turn in these files.
  4. Assignment 9 - Video quiz about CSS for text formatting (This may not be visible until Monday night) : We are trying something different with this one. There is an interacive video in the weekly module and in the Edpuzzle link in Canvas on text formatting with CSS. The video has questions embedded in it. Answer the questions in the video, which will be graded. You do NOT have to do the follow-along part of the exercise, but you can if you want to. Use this start file which has much of the code for the page(right click to download) if you want to do the follow along exercise.
  5. Assignment 10 - Image preparation and optimization: Clean up and optimize the image_processing_start.psd image by following the procedure in the video Processing and Exporting an Image. The original image is here and in this week's lessons module. It will not display in Canvas, but you can click on the filename to download. Here is the webpage in the video with some general steps, but follow the order in the video. Drop your finished, optimized, image file into the Assignment drop box. You only need to submit the regular, full size optimized file, image_processing_2.jpg, from the video, not the smaller .5x version or the PSD file. Check due dates on the calendar.
  6. Review Chapters 7, 23 and 24 of Learning Web Design. They have more information on web graphics and how to optimize them.
  7. Assignment 11 - Background Images (Optional Extra Credit):
    Watch and follow along with the video on Background image placement to recreate the page. Download the start files here. Be sure to include all image files with your submission. The images will not show up for me unless you send it along with your html files. See page 324 of Learning Web Design for more information. Drop your files into the Assignment 11 drop box. This assignment is optional and is worth 5 points extra credit. Check due dates on the calendar.
  8. Discussion:
    Find a site on the web that uses background images in an interesting, creative way. In the discussion forum in the weekly module, post the URL of the site by Thursday, and tell us why you think it is interesting. Also comment on a site posted by someone else by Monday. The discussion forum is called "Sites with interesting use of background images".

Oct.19 - Week 8 Instructions:

Recordings of the live meetings should be available under the conferzoom link in canvas

The weekly live demo files used in class will be here

Live topics for Monday and Wednesday this week

Monday

Wednesday

On your own

  1. Check out this page using opacity. View the source to see how it works.
  2. Check out this page using attribute selectors. View the source to see how it works.
  3. Be familiar with Ch. 13 of Learning Web Design. It covers more selectors, gradient backgrounds, opacity, and other goodies. Pay special attention to the Opacity attribute on page 315 of the print version and the Attribute Selectors on page 323 of the print version.
  4. There is a file in the weekly module on how to use min-width and max-width to limit the possible widths of your design, and also how to center your design. It should be somewhat of a review of Assignment 5. It has comments to explain what's going on, and it could be very useful on some assignments, like assignment 13 ;)
  5. Optional: Watch the video on Tables : Create a web page like the one in the video lecture by watching the video tutorial Tables and Practice with Background Images. You can use the image shown in the video for background images, or one of your own. Download the image to use for the exercise here. Always make sure to validate on http://validator.w3.org/ and http://jigsaw.w3.org/css-validator/. This exercise is optional, but some of the information may be on the final. There is nothing to turn in for this assignment.
    1. For more information on tables, read Chapter 8 of Learning Web Design.
  6. Optional: Watch the video on Adding Text to an Image in Photoshop.
    Here is the start file if you want to follow along. You do not have to turn anything in for this exercise.
  7. Watch the video on the CSS Box Model.
    Here are the files if you want to follow along.
    It will help with layout, borders, etc.
  8. Be familiar with the information in Chapter 14 of Learning Web Design. It has more information on the css box model.
  9. Optional: Complete Exercises 14-1 through 14-3 from Learning Web Design. They are related to the CSS box model and borders. You do not have to turn in these files, but will help a lot on later assignments.
  10. Optional: CSS Floats - Recreate the page from the video CSS Floats Basics.
    Use these start files which have much of the code for the page(right click to download). The start file may be slightly different from the video, accounting for some errors that were corrected. Don't worry about it. This is an optional exercise, and you do not have to turn in these files.
  11. Assignment 12 - 2 Column Layout with floats and flexbox:
    Part 1: Watch the video on Basic 2 Column Responsive Layout.
    Here is the start file(right click to download). Recreate the page in the video using the start file. The CSS float video on the video page can help if you are confused about floats. You can use the finished version of this exercise or the basic 2 column layout exercise as a start for Assignment 13. Make sure to validate HTML and CSS. Drop your files into the Assignment drop box. (Check due dates on the calendar.)

    Part 2: After creating the 2 column layout using floats by following the video above, complete the Basic 2 Column Responsive Layout with Flexbox exercise. Turn in BOTH versions in your submission.
  12. Assignment: Take the Midpoint Survey in the weekly module

Oct. 26 - Week 9 Instructions:

Office hours this week are slightly different - Mon 4:30PM - 6:00 and Thursday 10:30AM - 12:30PM
(No Tuesday Hours)

Recordings of the live meetings should be available under the conferzoom link in canvas

The weekly live demo files used in class will be here

Live topics for Monday and Wednesday this week

Monday

Wednesday

On your own

  1. Watch the video on Basic Inline Responsive Images.
    • If you use narrow columns, like in the 2 column layout we did earlier, it can help prevent your images from leaking out of the columns.
    • There is no exercise due for this video.
  2. Make sure you are familiar with the information in Chapter 15 of Learning Web Design. It has more information on the css positioning and CSS Floats. Doing the exercises in that chapter helps too, although it in not required.
  3. Watch the video on CSS Positioning.
    • Here is a page on CSS positioning mentioned in the video.
    • There is no exercise due for this video, but you do need to know the material.
    • Not in the video is sticky positioning, which makes the element change between relative and fixed. You can use it to make top navigation bars that do not scroll offscreen when the page is scrolled. Check it out in your Learning Web Design book and here.
  4. Watch this video on Using Web fonts. (There is a little surprise in this one. See if you can find it.) You do not have to turn anything in for this video, but it will help if you want to use custom web fonts. Feel free to use web fonts on Assignment 13, but it is not required.
  5. Here is an article on using Google Fonts, which is also covered in the video above.
  6. Start Assignment 13 - 2 Page Site: Create a 2 page web site about an item in the news. An item in the news would be something like elections, or a budget crisis. Create and use at least 1 "hero" image for the site. See this article for more info on "hero" images. Try to create a design that is both attractive visually and easy to use. For a layout, you can start with the basic templates we have done in class, GDES 45 Basic Page with HTML 5 Containers (youtube video) or Basic 2 Column Responsive Layout (youtube video), or, create one from scratch on your own. If you want to try to use more advanced CSS to layout the page, you can look ahead to Chapter 15-18 in Learning Web Design. However, we will not completely cover some of these techniques for CSS layout together until later. This assignment will be graded both on the requirements below and on the design.
    Use the file web_critique_criteria4_responsive_horizontal.pdf as a guide to help keep important questions in mind while creating your site.

    There are examples in the weekly module and here.
    Remember, the images will not show up for me unless you send them along with your html files, so zip the whole folder with your site. Always make sure to validate on http://validator.w3.org/ before submitting. This is a longer term assignment. Check due dates on the calendar.
    1. Requirements:
    2. 2 linked web pages are required.
    3. Create and use at least 1 "hero" image.
      • It can be in the header or the top of the body.
      • It can be either an inline image or a background image.
      • It can be from a stock photography site.
      • Do not use an image as you found it. Resize and optimize the image as needed.
    4. Use at least one other inline image in the content area. Remember to optimize your images. See Ch. 24 of Learning Web Design for more information on optimization.
    5. Use at least 1 background image(see Ch. 13 of Learning Web Design and the Background image placement video more info on positioning background images will be covered soon)
    6. Put most(or all) of your CSS styles in an external style sheet, and use external styles for most of your styles. See page 348 of Learning Web Design for and the Locations for CSS and basic selectors video for info on external style sheets.
  7. Assignment: Take the Midterm Quiz in the Weekly module in Canvas.
    • This quiz is open book, open note and open internet.
    • Do NOT use other people as a resource however, so take the quiz by yourself.
    • You get one attempt.
    • Good luck(it will be easy)!