Skip to content

Tech Concepts, Smith, 9-25-2018

Warm-Up:

  • What is something you've learned during this project that could help you in the future? How could it help you?

PGCPS Gmail Login | Student SchoolMax Login

Objective:

  • Students will gain basic understanding of code to gain the necessary background knowledge required to generate and conceptualize artistic ideas and work. (Anchor Standard 1)

Today's Agenda

  1. Guided Instruction
    1. Warm-Up Review
    2. Homework Review
      1. Now that you can use any colors you want, list 10 text/background color combinations that would work well. (Example: white text, black background OR black text, white background)
    3. Project: Policies & Procedures Review
      • If you scored higher than a 0, you have until September 29 (4 days from today) to resubmit for a higher grade.
      • As stated in the syllabus, Zeros earned for incomplete, late, and/or nonexistent work are not eligible for resubmission.
    4. Project 2: Coding
      1. Rubric
        • ► 25% Project includes bug-free code created by the student, rather than copy/pasted from other sources.
        • ►25% Project contains a minimum of 25 lines of code. [Class Choice]
        • ►25% Web page includes 100 NON-CODE words. [Class Choice, UPDATED 9-21]
        • ►25% Project contains characters. [Class Choice]
      2. Code Review:
        1. HTML (w3schools)
          1. "Tryit Editor"
        2. <!DOCTYPE html> (Everything that follows is a web page.)
        3. <html></html> (Everything between these is HTML code.)
        4. <head></head> (Everything between these is the Header.)
        5. <title></title> (Everything between these is the Title.)
        6. <body></body> (Everything between these is what can be seen in the website.)
          1. We also learned how to change colors using some older code. We will learn a new way today.
        7. <h1></h1> (Everything between these is LARGE, bold, and on its own line.)
          1. <h2></h2> (Same, but a bit smaller.)
        8. <p></p> (Everything between these is a single paragraph).
        9. <a href="http://fouloistech.info">Linked Text</a> (Add a link to another page.)
        10. <strong></strong> (Everything between these is bold.)
        11. <em></em> (Everything between these is italic.)
        12. <tagname style="property:value;">

          HOW TO CHANGE COLORS!

          1. color (text color)
          2. background-color
          3. border (outline color)
          1. <h1 style="border:2px solid Violet; background-color:yellow; color:white;">This should be painful to read.</h1>
      3. New Code
        1. Saving work to share:
          1. Text editor (On PC, use Notepad)
          2. Name file with .html suffix, NOT .txt suffix.
        2. <img src="imagename.suffix"> (Add image to page)
          1. align="left/right/center" (text wrap)
          2. alt="image description"
          3. width="pixelnumber" (Could also use percent.)
          4. height="pixelnumber" (Could also use percent.)
          5. border="pixelnumber"
  2. Independent Work
    1. Homework & Journal Checks
    2. Project Pre-Production
      1. The rubric requires characters. Include them today.
    3. Project Production & Post-Production
      1. Dependant on project scope determined by student.
  3. HOMEWORK
    1. Write out three ideas we can use for a PART 2 of our coding unit. Be as specific as possible. (Example: "Digital portfolio of art projects" is specific, "web page" is not.)