Computer Science Assignment: Getting Started with HTML

profilemsingh51

Note: The instructions below state that you are allowed to use an AI to create a logo or image for your page. You are also welcome when checking your work to consult a chatbot to understand problems and how to fix them (but you must always decide which suggestions are correct and type in all changes). You should not use AI to write the HTML for this assignment.

Do not use any CSS styles or JavaScript for this assignment (even though there is some discussion of styling in the reading).

Preparation

  • Before you start writing any HTML, you need to decide on a focus or subject for your website. Your site can focus on a business, an organization, a hobby, or another interest.
  • On your desktop (or other location that you can find easily), create an empty folder named IT3240_Week_1.
  • You will need an image that you can use as a logo near the top of the page. Use AI, if you like, to generate the logo or image. You can add another image in the contents of the page, if you wish. Please put the image file(s) in the same folder as your index.html file. It is best to avoid spaces in the file name (replace spaces with underscores as needed).

Writing the HTML

  1. Start Visual Studio Code (VSC) and open this folder. (Make sure the icon for the Explorer, which looks like 2 pieces of paper, is selected. Then click the blue Open Folder button. )
  2. In the Explorer on the left side of the VSC window, mouse over the name of the open folder (IT3240_Week_1) and click the option for a New File... (the icon looks like a piece of paper with a plus sign).
  3. Name the file index.html in all lowercase letters. The file name (including its spelling and lowercase letters) is important.
  4. When you create a file in VSC, you will see the text "Generate code or select a language. Start typing to dismiss or don't show this again." Click the blue text link with the text "don't show." It is important that you write all the code yourself. 
  5. Use all the following HTML tags to create the first version of your website's homepage. Tags marked with * must be paired with a corresponding closing tag, as covered in the reading: 
         <!DOCTYPE> 
         <html lang="en"> *  
         <head> * 
         <meta charset="utf-8"> 
         <title> * 
         <body> * 
         <header> * 
         <h1> * 
         <h2> * 
         <img> (include src & alt attributes) 
         <p> *
  6. Use the <h1> tag pair for the large title that will appear at the top of the page. Use at least 2 <h2> tag pairs as subheadings in the content of the page. 
  7. Your page should have 50–100 words of text to make clear what the site's focus is.

Verifying Your Work

  1. After you are done working on your page, test it in two different browsers to make sure it works as expected. In a Word document, state which browsers you tested the page in and include two screen shots showing the page displaying correctly in both browsers.
  2. Go to the Nu HTML Checker toolvalidator.nu to check your page's HTML. In the "Check by" dropdown menu, select "file upload." Then, click the File Upload button to upload the .html file to be validated. After the file has been uploaded, click the Check button.
  3. Fix any errors noted by the tool and correct the causes of any warnings.
  4. You are welcome to use an AI chatbot to assist with understanding the problems and to suggest corrections, but you need to decide on the steps to be taken, and you must type in the code yourself. Do not copy and paste code from the chatbot or allow the AI to modify your code. Re-check the .html file as needed until all issues have been addressed.
  5. Take a screen shot of the Nu HTML Checker results showing successful validation and add it to the Word document with the statement of which browsers you tested the page in.

Submission Requirements

  • Add the Word document to the folder containing your .html file and the image file(s).
    • Do not include any extra files in your submission.
    • Compress the folder and submit the zip file as an attachment to your submission.

Competencies Measured

By successfully completing this assignment, you will demonstrate your proficiency in the following course competencies and rubric criteria:

  • Competency 1: Author well-structured, standards-compliant HTML.
    • Use all required HTML tags.
    • Include HTML headings and relevant text content.
    • Test page in 2 browsers.
    • Validate HTML using HTML Checker and fixes errors.
    • 10 hours ago
    • 10