info1300-2024sp-documents

Milestone 2: Final Design & Draft Website with some Responsive Elements

tl;dr Finalize design & implement a draft website with some responsive elements. In the second milestone, you will finalize your narrow and wide designs and implement a draft of your website using a “wide” screen layout using flexboxes for some side by side content; and begin to implement some responsive elements of your “narrow” site using media queries.

Resources

Project Document Summary:

Coding Resources:

Table of Contents

Deadlines

Submissions Deadline Slip Day Deadline Credit
Milestone 1 (p2m1) Wed 3/6, 11:59pm Thu 3/7, 11:59pm 36 points (correctness)
Milestone 2 (p2m2) Wed 3/13, 11:59pm Thu 3/14, 11:59pm 52 points (correctness)
Final Submission (p2fin) Wed 3/20, 11:59pm Thu 3/21, 11:59pm 100 points(correctness)

1. Milestone 1 Feedback Revision

Before you begin Milestone 2, revise your project based on your Milestone 1 feedback.

When revising your plan in the design journey, don’t delete your “old” answers. Remember, we want to see your design’s journey; you are graded on your design process. If you later change your mind, keep the “old” answer and then add a new one below it explaining why you changed your mind.

2. Review the Project Requirements

When working for a client, you’ll need to check their requirements frequently to ensure you’re meeting their expectations. You don’t want to spend weeks working on something only to discover at the last minute that what you’ve been working on doesn’t meet their requirements.

Please read the project overview and project requirements.

3. Draft “wide” website and start coding the “narrow” version using responsive CSS

Code a draft version of your wide (“desktop”) design in HTML. Your draft version not need to be 100% complete. This is a draft. Your site should have all its content; there should be no placeholder content.

Once you have a draft of your wide (“desktop”) design in HTML begin to code your narrow (“mobile”) versions using responsive CSS breakpoints. You should have at least some responsive elements coded for this draft version of your site.

You are required to use responsive CSS (media queries) to produce your responsive website. You may not create separate files (i.e. HTML and CSS) for mobile and desktop versions of your site. You may not just set the width of all elements to 100% to make it “responsive.”

When you’ve finished your draft site and all content is included, delete the “m-content” folder.

Milestone 2 Tips

Milestone 2 Submission (p2m2)

Stage, commit and push all changed files in your Git repository to Cornell’s GitHub server. (All commits must reside on the main branch.)

Then, complete the submission form.

Note: All files must be in the location specified in this document for credit; our grading process cannot reliably locate your work in other locations.