1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="utf-8">
5 <title></title>
6
7 <!--
8 File: http://cssdweb.edu/Student Resources/Website Development I/CodeSamples/AttributeQuotesTest.html
9 maintained by Jesse M. Heines
10 Copyright (c) 2022 by Jesse Heines. All rights reserved. May be freely
11 copied or excerpted for educational purposes with credit to the author.
12 updated by JMH on August 5, 2022 at 5:37 PM
13 -->
14
15 <style>
16 code {
17 font-size: 1.1em ;
18 }
19 #examples {
20 border: 1px solid black ;
21 padding: 0px 15px;
22 border-radius: 15px ;
23 }
24 </style>
25
26 </head>
27
28 <body>
29 <p><code>http://cssdweb.edu/Student Resources/Website Development I/CodeSamples/AttributeQuotesText.html</code></p>
30
31 <p>This is a test of the statement in the last paragraph on page 79 in
32 <em>Fundamentals of Web Development, Third Edition</em> by Randy Connolly and
33 Ricardo Hoar that says that enclosing attribute values in quotes is optional in
34 HTML5.</p>
35
36 <p>That paragraphs says:</p>
37 <blockquote>
38 HTML elements can also contain attributes. An HTML attribute is a name=value
39 pair that provides more information about the HTML element. In XHTML, attribute
40 values had to be enclosed in quotes;
41 <span style="background-color: yellow">in HTML5, the quotes are optional</span>, though
42 many web authors still maintain the practice of enclosing attributes values in
43 quotes.
44 </blockquote>
45
46 <p>But look at these examples:</p>
47 <blockquote id="examples">
48
49 <p style=color: blue>This is the first example. It is a paragraph tag with a style
50 attribute. The paragraph is intended to be displayed in blue text, but the style
51 attribute value is not enclosed in quotes. It is coded as follows:</p>
52 <blockquote>
53 <code><p style=color: blue>This is the first example. ...</p></code>
54 </blockquote>
55
56 <p style="color: blue">This is the second example. It is also a paragraph tag with a
57 style attribute. Like the previous paragraph, it is intended to be displayed in blue
58 text, but this time the style attribute value is enclosed in quotes. It is coded as
59 follows:</p>
60 <blockquote>
61 <code><p style="color: blue">This is the second example. ...</p></code>
62 </blockquote>
63
64 </blockquote>
65
66 <h4><em>Thus, I strongly disagree with the book’s authors.</em></h4>
67
68 <p>It would be OK to say: “attribute values that consist of a single word need not
69 be enclosed in quotes, but attribute values that consist of multiple words must still
70 be enclosed in quotes.” However, the general statement that enclosing HTML5
71 attributes in quotes is optional is simply wrong, as the above examples clearly
72 demonstrate.</p>
73
74 <p>I strongly encourage web programmers to always enclose attribute values in quotes as
75 good coding practice. That way they don’t get confused about when they need to
76 use quotes and when they don’t.</p>
77 </body>
78
79 </html>