Directions- Create an external CSS stylesheet to style the text, colors, and navigation links used on your web pages. Also update your index “homepage” from Assessment 1 to use the new stylesheet and adding four new pages to your site as specified below.
- Add an external CSS stylesheet to your website. The file should be named styles.css. You will define the styles for your web pages in this file, and all HTML files should link to this common CSS file. Don’t create separate stylesheets for each page.
- Create CSS3 compliant styles that will provide a consistent look and feel for the pages on your website.
- Write CSS3 style rules to govern how text is displayed by defining properties such as:
- Font family.
- Font size.
- Font color.
- Font style.
- Font weight.
- Text margins
- Text padding.
In addition:
- Apply the styles to various parts of the page, such as:
- Headers/headlines.
- Text used in the body of the page.
- Images.
- Background (image or color).
- Navigation (use a styled unordered list to provide navigation links) and other hyperlinks on the page.
- Consider using Google Fonts to have access to a wider range of web fonts that work on all platforms. See .
- Be sure to document the CSS file with comments to explain how the styles are used.
- Use a variety of CSS selectors to apply styles to page elements based on tag name, class, and id.
- Add a link tag to your index.html file in the (<head> section) and add the necessary classes and ids that are needed to apply the styles to the relevant parts of your index page. All CSS should be in the external stylesheet. There should not be an inline or embedded CSS in the HTML.
- Try to use semantic tags, such as <nav>, <article>, <main>, <header>, <footer>, and <section> instead of <div> tags, where possible, though you may use <div> tags when there are no better elements for the job.
- Once you have the CSS styling your index page as intended, add the following four HTML files to your site files:
- about.html (“About Me” or “About Us” depending on the focus or theme for your site).
- interests.html (“My Interests”) or specialties.html (Our Specialties).
- gallery.html (for related images). This page just needs a couple of images in this assessment. More will be added in future assessments.
- contact.html (for relevant contact information).
- Update the hyperlinks in the styled navigation area on the index page to reflect the pages on your site.
- Add appropriate content to the four new pages and apply the styles defined in the shared, external CSS stylesheet. Be sure to include HTML comments in the source code to document the pages. As noted above, the gallery page for this assessment just needs a couple of images.
- Using the W3C validation services, validate the CSS file and the five HTML files. Capture a screenshot of the results of each W3C validation. Place the validation screenshots in a Word document (don’t submit image files for the screenshots). Validation warnings are okay, but you need to correct any errors pointed out by the validation services.
- .
- .
- You should also test all pages in two different browsers on your computer. You don’t need to get screenshots of these tests. Just include a statement in the Word document stating which browsers you tested the pages in.
Assessment examples: You may use the assessment examples in the file to give you an idea of what a Proficient or higher rating on the scoring guide would look like.
Note: Errors from the validation should be fixed. However, warnings do not need to be fixed but should be reviewed. Fix the issues from the top down, as one error can cascade into 20 other errors. Remember, for the assessments in this course, be sure to test your web pages in at least two browsers.
Submission Requirements
Place the HTML files, the CSS file, image files used for your site, and the Word document in a folder and zip that folder. Submit the zip file as the attachment for this assessment.
Get this or a similar paper done in as fast as 4 hours, 24/7.
NB: We do not sell prewritten papers. All essays are written from scratch according to specific needs and instructions
Leave a Reply
You must be logged in to post a comment.