Answered step by step
Verified Expert Solution
Link Copied!

Question

1 Approved Answer

Goal: design and implement THREE versions of a webpage that present promotional information for the Finger Lakes region of New York State. The content on

Goal: design and implement THREE versions of a webpage that present promotional information for the Finger Lakes region of New York State. The content on each version needs to be real, meaning: no lorem Ipsum text, no FPO images, and each version needs to fulfill the goal, stated above in a clear, meaningful presentation The three webpages need to be independent of each other You are not creating a website - each webpage needs to be independent There should be no menu system nor navigation on any of the webpages Notes No word count or other quantity specifications are provided in these instructions. You are required to figure out how much content you need to gather to properly fulfill the goal. For the required layouts described below, you may used any reasonable application of the layout techniques we studied in ISTE-140, so long as they makes sense, and youre not using old-fashioned/out-dated techniques. The focus of this assignment is on (1) design, and (2) technical implementation. I.e., good code is only half the grade. You need to focus on the content and its visual presentation as well. If need be, feel free to comment your code to explain your design choices. The only technologies (languages) you are required to use for this assignment are: HTML and CSS. You are not required to use: JavaScript; PHP Includes; nor HTML forms. Suggested Steps Create three low fidelity wireframe diagrams that meet these requirements One wireframe must use a Z-pattern that presents appropriate content in each quadrant plus the typical visual element in the center One wireframe must use an F-pattern that presents appropriate, repeating content areas along each horizontal arm One wireframe must use a card layout* that presents browsable content in similarly structured boxes * For this one, you do not have to use a masonry layout. For simplicity you can just use a structured grid Note: the wireframe diagrams will need to be turned-in! Gather content appropriate for each proposed layout You are not expected to create original content. You can gather text and images from existing websites including WikiPedia BUT take note of wherever you get the content! You are also required On each webpage, you must cite the original location of all the content you gathered including links (hypertext) to their sources. The specific content for each webpage can be similar, but you will need to consider the use case of each layout, and be sure to right size the quantity of content for the spaces they will need to fill. Create the HTML and CSS to implement the three webpages The HTML file for each version will need to reside in its own folder, with its own CSS and images, separate from the other versions. The filing system must follow all best practices used in the industry. Images must be prepared for use on the web, following all best practices used in the industry. The HTML code must be clean and readable, and must demonstrate use of a good document structure, document outline, and semantically relevant tags whenever possible. The CSS code must be clean and readable, using a clear and sensible CSS architecture, and good selectors that target the HTML as simply as possible Each design must demonstrate good use of the C.R.A.P. principles and good use of typography that is both legible and readable. The implementation of each webpage must demonstrate the best practices of responsive web design (RWD) from large desktops (1900px wide) down to mobile phone size (375px wide) Each version will need to follow all other industry standards and best practices that we covered in ISTE-140 whether they are mentioned in these instructions or not. Host the three webpages online On Solace, place the separate three versions in separate folders named: final1, final2, and final3 You may update your course homepage accordingly but it will not be graded for this assignment Turn-in the final practical in myCourses In myCourses, in the Assignment Final Practical, submit the following no later than Wednesday, December 20, 11:59 PM (no exceptions, for real this time!) Provide the three links to the webpages hosted on Solace - one to each version Provide the three low-fidelity wireframes as image files, uploaded along with your submission in myCourses BTW - the checkboxes in these instructions^ are in effect, the rubric against which youll be graded

Step by Step Solution

There are 3 Steps involved in it

Step: 1

blur-text-image

Get Instant Access to Expert-Tailored Solutions

See step-by-step solutions with expert insights and AI powered tools for academic success

Step: 2

blur-text-image

Step: 3

blur-text-image

Ace Your Homework with AI

Get the answers you need in no time with our AI-driven, step-by-step assistance

Get Started

Students also viewed these Databases questions