Web Development and Design Foundations with HTML5 (8th Edition)
Web Development and Design Foundations with HTML5 (8th Edition)
8th Edition
ISBN: 9780134322759
Author: Terry Felke-Morris
Publisher: PEARSON
Expert Solution & Answer
Book Icon
Chapter 4, Problem 1WR

Explanation of Solution

Web Content Accessibility Guidelines (WCAG):

The guidelines for web accessing have been developed through the W3C process. The purpose of these guidelines is to provide the accessibility of web contents like text, images, structure, presentation, and so on.

Usage of color and images that was mentioned in “WCAG 2.0”:

Color element is to conveying the information interactively. All web elements use color for their text, background, or other styling purpose. The sufficient techniques are as follows:

  • Ensuring the color in data, backgrounds, or other contents is to indicate the information.
  • Ensuring the color within an image to convey the information.
  • Images are used to provide picture in the web page. The user can modify the properties like border, size, and alternative text for an image.

Web page:

The following code is used to demonstrate “WCAG” with color and image element:

Code:

<!--HTML Tag-->

<html>

<!--Head Tag-->

<head>

<!--Title Tag-->

<title>WCAG 2.0</title>

<!--Style Tag-->

<style>

/*Style for body tag*/

body

{

/*Set the background color*/

background-color:powderblue;

/*Set the text color*/

color:black;

/*Set the font*/

font-family:Arial,Verdana,sans-serif;

}

/*Style for "h2" element*/

h2

{

/*Set the background color*/

background-color:black;

/*Set the text color*/

color:white;

/*Set the height in pixels*/

height:50px;

/*Set the width in pixels*/

width:500px;

}

/*Style for "h1" element*/

h1

{

/*Set the height in pixels*/

height:100px;

/*Set the width in pixels*/

width:500px;

}

/*Style for "image" element*/

img

{

/*Set the float value*/

float:right;

/*Set the margin*/

margin-right:100px;

/*Set the width in pixels*/

width:300px;

/*Set the height in pixels*/

height:300px;

}

/*Close the style*/

</style>

<!--Close tag-->

</head>

<!--Body Tag-->

<body>

<!--Heading Tag-->

<h1>Web Content Accessibility Guidelines</h1>

<!--Image tag with its source-->

<img src="w3g...

Blurred answer
Students have asked these similar questions
TRIBUTE PAGE With a basic understanding of HTML and CSS, you can easily create a page for someone you admire. Write about what you adore in the person, add images, give an appealing layout, use paragraphs appropriately. You can also play around with different font styles and background colors.   please Don't Copy from internet
Screenshot a webpage  which has a feature that addresses accessibility issue of the user.  At the bottom of the image, write a paragraph that identifies the accessibility issue of the user and how it is being addressed.  Give the description on how this feature works.  Do you think it is useful and usable?
What is the purpose of CSS in web development, and how can you use CSS to style HTML elements?
Knowledge Booster
Background pattern image
Similar questions
SEE MORE QUESTIONS
Recommended textbooks for you
Text book image
Principles of Information Systems (MindTap Course...
Computer Science
ISBN:9781305971776
Author:Ralph Stair, George Reynolds
Publisher:Cengage Learning