MONTGOMERY COLLEGE Business, Accounting, Economics, Computer Applications, and Paralegal Studies Department Germantown Campus CMAP272 Professional Web Site Development Instructor: John Coliton Spring, 2015 CRN 34320 Office: HT 423 (240-567-6947) HT 203 Wed. 9:00 a.m. 10:40 a.m. Office Hours: Monday, 11:00 a.m. Noon Department Phone: 240-567-7722 Monday, 2:30 p.m. 3:30 p.m. Wednesday, 11:00 a.m. Noon Web: http://www.montgomerycollege.edu/~jcoliton/ Email: john.coliton@montgomerycollege.edu Course Description Provides instruction for creating, uploading, and maintaining professional-quality websites containing graphics, style sheets, multimedia, and other basic enhancements using handcoded HTML as well as Adobe Dreamweaver's fundamental tools. Topics include website development and emerging Internet technologies and trends. PREREQUISITE: Any CMAP, CMSC, or GDES course that is two credits or more or consent of department. Assessment levels: ENGL 101/101A, READ 120. Four hours lecture/discussion each week. Formerly CA 272. 4.000 Credit hours 4.000 Bill Hours Course Objectives Development and enhancement of non-technical skills Speak and write about the course topics with sufficient proficiency. Apply critical thinking to a variety of topics in the course. Introduction to XHTML Analyze the difference between HTML and XHTML. Demonstrate basic HTML and XHTML hand-coding by creating and/or modifying Web pages efficiently. Web Authoring Software Examine the various Web authoring tools on the market and assess their ability to produce valid, accessible pages that comply with Web standards. Demonstrate ability to use Dreamweaver to develop Web standards pages. Cascading Style Sheets (CSS) Create screen, print, and handheld style sheets Explain use of CSS techniques in Web page presentation to o Format and position text o Float, position, and clear images o Position page elements strictly with CSS (no layout tables) Use Internet Explorer Conditional Comments Fix Bugs and add hacks for cross platform stability Other Core Web Design Skills Demonstrate ability to separate presentation (goes in style sheet) and content (goes in the XHTML document) Demonstrate ability to semantically structure a page Use the <div> tag as a key building block in structuring pages Create templates and library items Create (accessibility) skip links and format navigation links in unordered lists Create pure CSS navigation buttons CMAP272 Professional Web Site Development Page 1
Course Objectives (continued) Create data tables Create accessible forms Add content from Office documents to pages in a way that preserves clean code Advertising and Web presence Optimize a site for search engines and establish a presence on the Web Explain how to purchase a domain name and find a Web hosting package Copyright Issues Analyze and evaluate the options available for using materials on the Web and related copyright issues Introduction to Accessibility & Usability Issues Identify universal design methods for users with disabilities Identify basic considerations for web site usability Multimedia development for the Web Add multimedia elements (most universally, flash audio and video) so Web pages remain valid and accessible Publication of Web pages to a Server Create and upload web pages to a remote server using an FTP program. Course Materials Book Learning Web Design: A Beginner s Guide to HTML, CSS, JavaScript, and Web Graphics by Jennifer Robbins (ISBN: 978-1-449-31927-4) published by O Reilly Videos We will be using mixed media resources this semester to complete our coursework. Some reading and exercises will come from our course text listed above. The other educational focus will be the use of training videos from Lynda.com [http://www.lynda.com]. I have set up a classroom for us on Lynda.com. You will receive an email, DIRECTLY from Lynda.com (TO YOUR MC EMAIL ACCOUNT), by January 30, 2015, inviting you to join the classroom. You will be required to register, and to pay the classroom fee (by credit card), which will be about $35.00. Plan NOW and figure out how you will be paying for this required resource. Please be sure to purchase your text book as soon as possible; you will need it the first week of class. And, be sure to enroll in Lynda.com as soon as you are invited. Do NOT wait. You will miss out on a great education, and your assignments will be late! Software & Storage Although not required, you may also choose to purchase either Adobe Dreamweaver or the Adobe Creative Cloud (CC) edition of the software. The software is provided in the classroom and lab, but if you choose you may buy a copy at a student rate from the bookstore (or download the 30 day trial version from Adobe). You will also need a USB drive to save your work, 2 gigabytes should be sufficient, and a second to back-up your work (backups can be critical near the end of the semester). CMAP272 Professional Web Site Development Page 2
Important Dates The last day to drop the class with a refund is: February 1, 2015 The last day to change to audit is: February 15, 2015 The last day to drop a class without a grade is: February 15, 2015 The last day to drop a class with a grade of W is: April 19, 2015 Syllabus Supplement Additional policies are at http://mc.coliton.com/syllabussupplementspring2015.pdf and should be considered part of this syllabus. Blackboard/Blended Learning Guidelines Additional policies that are relevant to students taking courses in a blended learning format (partially in the classroom and partially online) are available at: http://mc.coliton.com/blackboard_guidelines_spring_2015.pdf. Grading Policy and Procedure Grading is based on homework assignments, classroom assignments, online discussion, a midterm, a final project, a class presentation, and class participation. The classroom assignments require you to post work that we did in class on Blackboard by the following week. Homework is to be posted on the web4students server by noon on Thursday of the week noted in the schedule below. Late work will not be accepted after the last class of the semester (not the final). The midterm will be drawn from the reading and lecture material and is open book. Make-up exams are not typically granted without a bona fide reason for missing the exam (court date or military service are examples). The final project will include developing a five page web site based on one of the exhibits at the Smithsonian Institution, more information regarding the project will be provided in a separate handout. The online discussions will be short writing assignments recapping what was covered during a specified time period. The class presentation will be a review of a web site that you find particularly interesting, artistic, or informative. Class participation will be based on attendance, the quality of interaction and involvement during discussions, and interaction with other students. This class may be audited (taken without the expectation of a grade) with my permission and the proper form submitted to the records office. Someone who audits the class is still expected to participate in class and complete all projects. The grading is allocated as follows: Final Project (in four parts)... 200 Homework Assignments (10 at 20 pts. each)... 200 Classroom Assignments (10 at 10 pts. each)... 100 Midterm... 100 Online writing assignments (5 @ 10 pts. each)... 50 Class presentation... 25 Class participation... 25 Total Points:... 700 CMAP272 Professional Web Site Development Page 3
Grading Policy and Procedure (continued) The following distribution of points will be used to determine final grades: A = 630 700 (90-100%) B = 560 629 (80-90%) C = 490 559 (70-80%) D = 420 489 (60-70%) F = 0 419 (0-60%) Course Schedule and Readings Week Topic Assignment Length 28 Jan Introduction Part 1 Getting Started (chapters 1 3) 4 Feb HTML Basics 4: Creating a Simple Page 5: Marking Up Text Dreamweaver CC: Essential Training 1:34:26 Adobe Dreamweaver 1m 4s Introduction 6m 49s 1. The Dreamweaver Interface 55m 50s 3. Creating New Documents 30m 43s Dreamweaver CS5: Getting Started with HTML5 0:21:55 Introduction 3m 8s 1:56:21 2. Enhanced Structural Tags 18m 47s Homework Assignment #1 Create a home page and directory structure Due 9/12 by noon 11 Feb Lists & Links 6: Adding Links Dreamweaver CC: Essential Training 1:55:31 4. Authoring Options 34m 7s 5. Structuring Documents 46m 4s 6. Creating Links 35m 20s HTML5 First Look 1:15:26 Introduction 3m 56s 3:10:57 1. Introducing HTML5 21m 12s 2. What's New in HTML5? 27m 49s 3. Creating HTML5 Documents 22m 29s Homework Assignment #2 Montgomery College Fact Sheet Due 9/19 by noon. CMAP272 Professional Web Site Development Page 4
18 Feb Images & Tables 7: Adding Images 8: Table Markup Dreamweaver CC: Essential Training 1:37:25 8. Working with Images 55m 52s 9. Working with Tables 41m 33s HTML5 First Look 0:41:27 4. Structuring HTML5 Documents 41m 27s 2:18:52 Homework Assignment #3 Working with tables, images and relative links Due 9/26 by noon 25 Feb Flash, Audio & Video 10: What s Up, HTML5 HTML5 First Look 1:01:00 6. HTML5 API Support 1h 1m Web Accessibility 0:35:15 Introduction 2m 0s 1. Getting Started with Web Accessibility 33m 15s Dreamweaver CS5: Getting Started with HTML5 0:28:52 4. Native Media Implementation 28m 52s 2:05:07 Homework Assignment #4 Flash animation and video Due 10/3 by noon 4 Mar Sites & Forms 9: Forms Dreamweaver CC: Essential Training 1:11:24 2. Managing Projects 27m 21s 10. Site Management 44m 3s HTML5 First Look 0:27:53 5. Building Forms in HTML5 27m 53s Dreamweaver CS5: Getting Started with HTML5 0:13:00 5. Next Generation Forms 13m 0s 1:52:17 Homework Assignment #5 Creating a form and a response Due 10/10 by noon Final Project Proposal Due 10/16 at 9:30 a.m. 11 Mar 18 Mar Midterm Exam Spring Break CMAP272 Professional Web Site Development Page 5
25 Mar Intro to CSS 11: Cascading Style Sheets Orientation Dreamweaver CC: Essential Training 1:47:00 7. Managing CSS 1h 47m CSS Core Concepts 1:11:57 Introduction 4m 57s 2:58:57 1. CSS Basics 1h 7m Homework Assignment #6 Applying styles to create a schedule of classes Due 10/24 by noon 1 Apr Selectors & Conflicts CSS Core Concepts 2:57:39 2. Targeting Page Content 2h 15m 2:57:39 3. Resolving Conflicts 42m 39s Homework Assignment #7 Applying styles to create course descriptions Due 10/31 by noon Final Project Plans Due 11/13 at 9:30 a.m. 8 Apr Text 12: Formatting Text Web Accessibility 1:06:00 4. Working with Text 1h 6m Dreamweaver CS5: Getting Started with HTML5 0:12:11 6. New Wave Typography 12m 11s CSS Core Concepts 1:47:00 4. Basic Text Formatting 1h 47m 3:05:11 Homework Assignment #8 Using web fonts to create an advertisement Due 11/7 by noon 15 Apr Color & Images 13: Color and Backgrounds 21: Web Graphics Basics Web Accessibility 1:22:26 2. Setting Up an Accessibility Testing Environment 54m 31s 6. Working with Images 27m 55s CSS Core Concepts 0:47:51 6. Working with Color 47m 51s 2:10:17 Homework Assignment #9 Style sheets and accessibility in a photo gallery Due 11/14 by noon CMAP272 Professional Web Site Development Page 6
22 Apr Boxes & Layout 14: Thinking Inside the Box 15: Floating and Positioning 16: Page Layout with CSS Web Accessibility 3. Creating Accessible Page Layouts 26m 12s 0:26:12 CSS Core Concepts 5. Styling Container Elements 2h 1m 2:02:58 Conclusion 1m 58s 2:29:10 Homework Assignment #10 Create an online resume Due 11/21 by noon Final Project and Presentation Due 12/11 at 8:00 a.m. 29 Apr Lists, Tables & Forms 18: CSS Techniques Web Accessibility 2:35:08 5. Creating Navigation 1h 15m 2:31:08 7. Working with Tables 34m 1s 8. Creating Forms 42m 7s 6 May Media Queries & Transitions HTML5 First Look 0:57:33 7. Associated Technologies 57m 33s Dreamweaver CS5: Getting Started with HTML5 0:22:39 3. CSS3 Media Queries 22m 39s 1:20:11 13 May Presentations 8:00 a.m. 10:00 a.m. A course calendar is available online at: http://mc.coliton.com/tech272/images/calendar.pdf CMAP272 Professional Web Site Development Page 7