% Author: Ian! D. Allen - idallen@idallen.ca - www.idallen.com % Date: Winter 2011 - January to April 2011 - Updated 2011-04-04 00:20 EDT % Title: Week 11 Notes for CST8281 - Winter 2011 - [Course Home Page] - [Course Outline] - [All Weeks] - [Plain Text] Final Exam Instructions ======================= - The Final Exam date is posted on the [Course Home Page]. - For full mark credit, read the [Test Instructions] for important directions on how to enter your answers on the mark-sense forms. Lecture Notes for This Week =========================== - **The Course Linux Server** - **File Transfer** - **Review Basic HTML** - **Review Firefox Web Developer Toolbar** - **Validation URLs** - **Tables and Lists, nested** - **W3Schools lab work** From the Class Notes link on the Course Home Page ------------------------------------------------- - [Course Home Page] - [All Weeks] - [Assignment #10] - Internet, Course Linux Server, Linux, Web/HTML - [Assignment #11] - midterm test #2 topics review - [550_web_what_vs_how.html] - Presentation vs. Content - Keeping “How” separate from “What” in Web design - [555_web_design.html] - Best and Worst Practices for Web Design - [560_course_linux_server.html] - using the Course Linux Server - [570_file_transfer.html] - How to Transfer Files - [590_how_to_report_problems.txt] - How to report problems - [600_basic_html.ppt] - Basic HTML From the Internet ----------------- - HTML Validation Page (validate all your pages) - - You can add a button to the bottom of any web page that will validate it for you, so that you don’t have to remember the above URL. You can get the HTML for this button from any validated web page. - - Unicorn - W3C’s Unified Validator - one button does it all - Online HTML Tutorials (that validate) - - WARNING: Some of the “Try It” examples use deprecated tags and attributes! Do *not* copy these bad examples. - - - - w3schools Introduction to HTML: - WARNING: Some of the “Try It” examples use deprecated tags and attributes! - Do not use deprecated tags and attributes with the strict DOCTYPE. - Do not use self-closing tags, e.g. `
` with the strict DOCTYPE. - Use the standard HTML tag `
` when using the strict DOCTYPE. - Read almost everything except “Forms”, “Frames”, and “IFrames” under “HTML Basic” and try the examples: - Read and try examples: HTML HOME - Read and try examples: HTML Introduction - Read and try examples: HTML Get Started - Read and try examples: HTML Basic - Read and try examples: HTML Elements - Read and try examples: HTML Attributes - Read and try examples: HTML Headings - Read and try examples: HTML Paragraphs - Read and try examples: HTML Formatting - Read and try examples: HTML Styles - Read and try examples: HTML Links - Read and try examples: HTML Images (omit image maps) - Read and try examples: HTML Tables - Read and try examples: HTML Lists - OMIT: HTML Forms (omit Forms - you will do this next term) - OMIT: HTML Frames (deprecated - do not use) - OMIT: HTML Iframes (does not validate with Strict) - Read and try examples: HTML Colors - Be aware of: HTML Colornames and HTML Colorvalues - Summary: HTML Quick List (summary of all above basic concepts) - From under side-bar “HTML Advanced”: - Read and try examples: HTML CSS - Read: HTML Head - Read: HTML Meta - Read and try examples: HTML Entities - Read and try examples: HTML URLs - Read and try examples: HTML URL Encode - Read: HTML Webserver - Read: HTML Summary (see the HTML examples) - Bookmark this Reference: - Tables: two descriptions of how tables work: - - - do not use tables to structure or lay out your web page! - Table-free web page layout: - - - see “Why tables for layout is stupid. Problems defined, solutions offered.” - - - see “1. Faster Loading” for an example of with/without tables/CSS - - live demo of extremely varied CSS design - - “The Perfect 3 Column Liquid Layout (Percentage widths)” - full-height columns with full background color! - uses CSS relative positioning to move column color pages left and right - Cleaning up bad HTML using Tidy: From the Classroom Whiteboard/Chalkboard ---------------------------------------- - Your in-class notes go here. - Lab work in Week 11: - have you done your Assignment #09 demo from two weeks ago? - self-mark Assignment #10 and submit - try all the w3schools Basic HTML examples (see above) - you may wish to update your minimal.html page using w3schools examples -- | Ian! D. Allen - idallen@idallen.ca - Ottawa, Ontario, Canada | Home Page: http://idallen.com/ Contact Improv: http://contactimprov.ca/ | College professor (Free/Libre GNU+Linux) at: http://teaching.idallen.com/ | Defend digital freedom: http://eff.org/ and have fun: http://fools.ca/ [Plain Text] - plain text version of this page in [Pandoc Markdown] format [Course Home Page]: .. [Course Outline]: 2010-2011_CST8281.pdf [All Weeks]: indexcgi.cgi [Plain Text]: week11notes.txt [Test Instructions]: 000_test_instructions.html [Assignment #10]: assignment10.txt [Assignment #11]: assignment11.txt [550_web_what_vs_how.html]: 550_web_what_vs_how.html [555_web_design.html]: 555_web_design.html [560_course_linux_server.html]: 560_course_linux_server.html [570_file_transfer.html]: 570_file_transfer.html [590_how_to_report_problems.txt]: 590_how_to_report_problems.txt [600_basic_html.ppt]: 600_basic_html.ppt [Pandoc Markdown]: http://johnmacfarlane.net/pandoc/