37

Is there any difference between the following code blocks?

<iframe src="http://example.com" width=100%></iframe>

<iframe src=http://example.com width="100%"></iframe>

I've tried both and both seem to work, but I'm asking just in case there's something I need to be careful with?

Aryan Beezadhur
  • 4,503
  • 4
  • 21
  • 42
John
  • 4,596
  • 11
  • 37
  • 43

6 Answers6

33

There is no practical difference except

  1. if you validate your page, quotation marks may or may not be needed to avoid error messages, depending on doctype being used
  2. if you serve the page with an XML content type to browsers (which is rare and seldom useful), then the quotes are required – otherwise the page is not displayed at all, just an error message
  3. if the page is otherwise processed with XML tools, the quotes are necessary.

Otherwise, the quotation marks are really needed only if the attribute value contains a space, a line break, an Ascii quotation mark ("), an Ascii apostrophe ('), a grave accent (`), an equals sign (=), a less than sign (<), or a greater than sign (>). So style = width:20em would work (though it might be seen as somewhat obscure), whereas style = width: 20em would not – due to the space, you would need to write style = "width: 20em".

Many people always write quotation marks around all attribute values, for simplicity. Others think that quotation marks make the code a bit messy, so they omit them when possible.

Quite independently of this, src="www.example.com" means a relative URL reference, not what people expect to mean. You probably meant src="http://www.example.com".

Jukka K. Korpela
  • 195,524
  • 37
  • 270
  • 390
15

According to the W3C there are four types of attribute syntax:

  1. empty attribute syntax
  2. unquoted attribute-value syntax
  3. single-quoted attribute-value syntax
  4. double-quoted attribute-value syntax

These really apply to HTML5, however when referring to < HTML5 the W3C says that quotes (single or double) are required based on the doctype (e.g. strict, transitional, etc.) used.

georgeawg
  • 48,608
  • 13
  • 72
  • 95
j08691
  • 204,283
  • 31
  • 260
  • 272
  • 1
    The quote requirement isn't determined by whether the strict or transitional flavor is used. It's determined by the markup dialect: HTML or XHTML. – BoltClock Aug 08 '18 at 17:30
10

Nope both are the same..

In HTML 5 Quotes around attributes are just optional. (Unless the value has spaces or special characters )

But I feel it's a better practice to enclose them in Quotes..

Sushanth --
  • 55,259
  • 9
  • 66
  • 105
  • 2
    The simplest and best answer. The feeling that it is a better practice to always use quotes is ubiquitous within the web community, yet it's just a feeling. For "hand-crafted" documents it probably reduces errors a lot, but if one is building an automated HTML minimizer one would want to omit quotes where possible. – antonagestam Oct 03 '19 at 09:02
10

Unquoted attribute value syntax

The attribute name, followed by zero or more space characters, followed by a single U+003D EQUALS SIGN character, followed by zero or more space characters, followed by the attribute value, which, in addition to the requirements given above for attribute values, must not contain any literal space characters, any U+0022 QUOTATION MARK characters ("), U+0027 APOSTROPHE characters ('), U+003D EQUALS SIGN characters (=), U+003C LESS-THAN SIGN characters (<), U+003E GREATER-THAN SIGN characters (>), or U+0060 GRAVE ACCENT characters (`), and must not be the empty string.

Source: W3 HTML5 Specification - sec 8.1.2.3. Attributes

Aryan Beezadhur
  • 4,503
  • 4
  • 21
  • 42
georgeawg
  • 48,608
  • 13
  • 72
  • 95
6

This is from Google - best practices - "Minimize payload size" https://developers.google.com/speed/docs/best-practices/payload (my emphasis)

To ensure that your content compresses well, do the following: ... Use consistent quoting for HTML tag attributes, i.e. always single quote, always double quote, or no quoting at all where possible.

tomo7
  • 451
  • 7
  • 6
-1

It is all about the true validity of HTML markup. It's for what W3C (WWW Consortium) work for. Many things might work in HTML but they have to be validated in order to be more carefully recognized by the web browser. You can even omit the <html> and </html> tags at the start and end, but it is not recommended at all, nobody does it and it is considered as a 'bad code'.

Therefore, it is more valid to put them in quotes.

Martijn Pieters
  • 1,048,767
  • 296
  • 4,058
  • 3,343
Davit
  • 1,394
  • 5
  • 21
  • 47
  • 6
    In HTML (specialized [SGML](https://en.wikipedia.org/wiki/Standard_Generalized_Markup_Language)) versions, before HTML5, both is valid. There is no //false validity// or //true validity//; either a document is valid according to its `DOCTYPE` declaration or it isn't. However, it isn't valid in XHTML (an application of XML). – Rainer Rillke Aug 16 '16 at 06:43
  • Note that the rendered HTML will include the quotes – Aryan Beezadhur Nov 26 '20 at 20:51