RCC Spring 2010 CSS Assignment #4 / Final Project Grading Sheet - 300 Points (+50 Extra Credit) 3 Printouts: One printscreen of home page plus code printouts for each of 2 style sheets Due Mon June 7 by 11am: Uploaded to RCC server, email sent to instructor, printouts/disk as needed in MLK-219 lab time-stamped Lateness: 90% of value if late same day before 2pm, 80% if same day after 2pm, 70% if 1 day late by final exam, worth 0 after final exam. Theme: -10 points if not ok’d by 2 weeks before due date, -20 if not ok'd by 7 days before, up to -100 if theme ends up inappropriate. Name: _____________________________ HTML Changes -- 25 pts (5 pts each) – Only change what is necessary – leave HTML structure alone! ＿ /5pts All pages: Hotel name substituted everywhere, each page title needs hotel and student name, copyright area needs hotel address, and source of images. ＿ /5pts Home page: New themed hotel image of reasonable size replaces original given hotel image. ＿ /5pts FAQ page: New question and answer indicating the story behind your Hotel theme. ＿ /5pts Events page: At least 5 new calendar events on Fridays and/or Saturdays fitting the hotel's theme ＿ /5pts Testimonials: Rewrite / add at least 1 new different testimonial for each page (except the home page) – 5 new ones total. Common Styles (common.css) -- 190 pts ＿ /15pts Page Styles: body styles for background properties, page margins (top, left, and right), padding, text color, font size, and font-family for all normal page text. Other properties are optional. Page wrapper styles also go here but are optional. ＿ /15pts Heading Styles: 3 rules (for h1, h2, and h3) to set font-size uniquely, one more rule to set common font-family and color. ＿ /10pts First Paragraph Styles: use 3 properties to emphasize paragraph ＿ /10pts Copyright Styles: use 3 properties to deemphasize paragraph ＿ /15pts General Link Styles: use color and text-decoration properties to uniquely style each of the 4 link states (4 separate rules) ＿ /40pts Navigation Bar Styles: should only affect links within the nav bar area ___/10pts On the nav bar itself (div and/or ul and/or li) to remove bullets, make horizontal/vertical, etc. ___/20pts On the links within nav bar: to make buttons that change when hovered. All 4 link states are set. ___/10pts On the current page's links: to make it look and act like it is not a link and to make it stand out from the other links ＿ /15pts General List Styles: set bullet shapes (disc, circle, etc.) & themed images to uniquely style outer and inner bullets. Outer bullet images and shapes should be emphasized (stand out) more than inner bullet images and shapes. ＿ /20pts Testimonial Styles: use at least 2 properties on each of these 4: the testimonials container div, the testimonial divs, the quotes, & the speaker to consistently style the site’s testimonials. Style the testimonial h3 as needed. Speaker goes on its own line. ＿ /15pts Logo Positioning Styles: use background-image, width, height, position, top, and left or right to absolutely position your hotel logo image. Use the “positionme” div for this. Your CSS should position it up toward the top of the page wherever is best. To help me locate it for grading purposes, circle it on your home page printscreen. ＿ /35pts Multi-Column Layout Styles: Use of float and/or absolute position and margins/padding (no page layout tables) to achieve at least a 2-column layout of the main content of all pages. The original XHTML page order & structure can’t be changed without permission. Indicate on your home page printscreen what was floated or positioned to achieve your layout. Put these styles in “multi-column layout” section of style sheet. Refer to the online “page layout guide” for help with this. Custom Styles (custom.css) -- 55 pts ＿ /25pts Events Page Calendar Table Styles: 5 distinct rules (5 points each) to control table heading, days of week, date numbers, empty day cells, and events. ＿ /15pts FAQ page Question & Answer Styles: use at least 3 declarations for questions and 3 for answers to make them distinct from each other on the page & enhance page appearance. ＿ /15pts Services Page Image Floating and Border Styles: float 1st image and 2nd image to opposite sides of page, and set appropriate margins on inner side of each using each image’s given id, then give common non-solid borders to both using given class. Use of 4 Required Background Images -- 25 pts ＿ /25pts Each image is different and tied to the theme / color scheme, appropriately sized, text is easily readable on top of it. Acceptable image locations: 1 for the page background or wrapper, 1 for nav bar or 2 for link buttons on nav bar, 1 for the calendar, 1 for testimonials, 1 for heading text replacement, & 1 for any other element on all pages. Circle images on printscreens if possible. CSS Code Quality and Formatting -- 25 pts ＿ /25pts CSS code validates, is easy to read, rules are indented consistently, blank lines help readability, lowercase selectors, well organized rules, rules placed in proper style sheets & sections, good choice of selectors, shortcut properties used where appropriate. Site Design, Theme Integration and Color Coordination -- 15 pts ＿ /15pts Theme was integrated well into the site's styles, including fonts, background and text colors, link colors, etc. Images used, including logo image and hotel image integrate well with theme. All pages share a consistent appearance. All text is easily readable. Site was uploaded properly to RCC server -- 15 pts ＿ /15pts All pages / graphics display ok in browser from RCC server (to be discussed in class) Possible Deductions: Up to -50% for styles put in wrong style sheet section or put in an HTML page. Up to -50% for any section whose CSS contains a validation error. -5 per missing bullet image, -3 for large bullet images (20x20 px max). -5 if hotel name not on logo. Up to - 50% for css or html copied directly from previous assignment, previous semester, from another site or from another student. Up to -10 for HTML changes unneeded or unapproved. -5 points for each missing printscreen, -2 if printscreen hides needed content or backgrounds.