Updating a Webpage
Instructions: In this exercise, you review a webpage, update its content, and improve its appearance.
Work with the apply12.html file in the apply folder, image files in the apply\images folder, and
applystyles12.css file in the apply\css folder from the Data Files for Students. The completed
webpage is shown in Figure 12–22. You will also use professional web development practices to
indent, space, comment, and validate your code.

Perform the following tasks:
1. Create a new folder named apply12 and copy the apply12.html file and the css and images
    folders from the Data Files for Students to the apply12 folder.
2. Open apply12.html in your text editor, review the page, add a title, modify the comment at the
     top of the page to include your name and today’s date, and a paragraph element with your name
     in the footer element.

3. Insert a paragraph element below each h3 element and include one to two sentences about
     each content management system.
4. Insert an img element after each paragraph element that uses the appropriate image from
    the apply\images folder. Include appropriate alt text, a width attribute, and a height attribute.
5. Link each image to the respective website (WordPress, Joomla, and Drupal).
6. Rename the CSS file within the css folder to applystyles12.css and update the CSS file link in
     the apply12.html file.

7. Open applystyles12.css in your text editor and add the following properties and values to the header style rule:
     background-color: #1427A6;
      color: #FFFFFF;
8. Create a new style rule for the h1 element that center aligns text. Include a comment above the
     new style rule.
9. Update the main style rule to specify a white background color.
10. Create a new style rule for the article element that specifies the following properties:

column-count: 3;
-webkit-column-count: 3; /* Chrome, Safari, Opera */
-moz-column-count: 3; /* Firefox */
column-gap: 3em;
-webkit-column-gap: 3em; /* Chrome, Safari, Opera */
-moz-column-gap: 3em; /* Firefox */
column-rule-style: solid;
-webkit-column-rule-style: solid; /* Chrome, Safari, Opera */
-moz-column-rule-style: solid; /* Firefox */

11. Add a comment to the article style rule.
12. Update the footer style rule to specify top margin with a value of 3em.
13. Save all of your changes and open the apply12.html in your browser.
14. Validate your HTML document and CSS file and fix any errors that are identified.
15. Submit the files in a format specified by your instructor.
16. Research an online ticketing system to handle website maintenance requests and discuss
       how you could implement this type of system for your website.