b-ivey / css-project

0 stars 0 forks source link

CSS Project

Due: Friday, April 10, Noon.

Instructions

This assignment is worth 10 points.

Using a corrected version of your HTML résumé, create a styled version for the web and print using CSS. The files you create should have a .HTML extension. If you want to preview your work, I suggest using another text editor to write your code and test in a browser.

You have the freedom to be creative in how you present your résumé. All presentation should be through the use of CSS, the styling should follow proper visual design techniques and adhere to best practices.

Suggestion: Follow instructions. When you finish your first attempt at coding, print this page and mark off each requirement you have met. Fix your code/résumé to meet the requirements you have missed.

Before You Begin

By now, you should have taken the time to correct the HTML version of your résumé based on feedback from your professor. You may choose to (or have to) modify your HTML in order for a design in CSS to take hold. Adjustments to your HTML are permitted.

Do not make the same mistakes you made on the first project. Mistakes repeated (or uncorrected) from the HTML project will receive a deduction.

Requirements

Your page should:

Reminder

When including an image:

Design Sins

Your design should avoid the following:

Submission

You will be submitting at least three files -- resume.html, style.css and an image file -- for this assignment. (Yes, you will be overwriting the resume.html file you submitted in the first assignment -- this is okay!) You may have extra files such as additional images. Commit your files to the username.github.io repo you created at the beginning of the semester.

Create an issue in the css-project repository with your full name and a link to your web page (http://username.github.io/resume.html) by the deadline. If you are unsure of how to submit, check the example provided in the Issues section.

Do not wait until the last minute to submit your URL.

Grading

You are expected to do your best to meet the requirements listed above. If you give an honest effort and submit the work on time, you will receive full credit. Your professor reserves the right to deduct points for submissions perceived as rushed, insufficient or incomplete. Points will be deducted for mistakes repeated from the HTML assignment.

To assure you do not make mistakes going forward, you will receive feedback. One-on-one help will be available during office hours to go over any questions you may have to improve the quality of your work moving forward. Missing requirements and/or mistakes on future assignments will not be overlooked.

You are required to submit this assignment properly and on time. A missed deadline (submitting the assignment at 12:00:01 p.m.) will result in a three (3) point deduction for every 24-hour period the assignment is late up to three days past deadline.

Failure to submit the assignment to GitHub as detailed above (to your username.github.io repo, as resume.html) will result in a two (2) point deduction.

(I use a computer script to clone and do an initial validation check of every student's work. If the script breaks, it means I have to do extra work to find and/or grade your assignment. Therefore, it will cost you in points.)

Plagiarism or lapses in web ethics, as detailed in the course syllabus, will result in a zero (0) on the assignment, PLUS a 15-point penalty on your final grade and referral to the University of Miami Honor Council.

FAQ

Do I have to use the same exact HTML from the first project?

No. You may change the HTML as much or as little as you need to. Make sure you properly use semantic and structural HTML and the code validates.

Do I have to use the same exact image from the first project?

No. Chances are your image may not "fit in" to the visual design you have in mind. You may have to re-crop/re-size and export the image in Photoshop for it to work in your design. (Remember not to re-edit the edited image you previously published. Start over using the original image.) Or, if you prefer to include an entirely new image, that is fine, too. Instead of the image included via the img tag in HTML, you might consider using a background pattern or image in CSS.

Do I need to have navigation?

Only if your design does not warrant it. Really it only makes sense to keep the navigation if your design is one column and much of your content is "below the fold."

Can I do a one-column layout?

Yes, but you MUST use a technique to move elements outside the normal flow on the page.

Must my design be flexible?

This is not a requirement. Try using pixels/fixed widths to lay out the page, then adjust your CSS to change it to become flexible (i.e. using min-width, max-width, fractional units). Some designs will flex with ease; others won't. If it flexes, keep it! If it doesn't, change your code to use the fixed approach.

Does my (max) 960-pixel container have to be centered?

If you have a left-aligned design (i.e. a left column with a background which features prominently on the right), you do not need to center the container. It goes against the design you're aiming for. (Unless, of course, you find a creative way to have that background stretch all the way to the left side of the browser window!) Otherwise, yes.

Good luck!