Is it correct to use single quotes for HTML attributes?

Question

Recently I've been seeing a lot of this:

<a href='http://widget-site-example.com/example.html'>
    <img src='http://widget-site-example.com/ross.jpg' alt='Ross&#39;s Widget' />
</a>

Is it valid to use single quotes in HTML? As I've highlighted above it's also problematic because you have to escape apostrophes.

I wish this had become popular to start! Because double quotes were more popular it became common JavaScript style to use single quotes in JavaScript, because strings would be full of HTML with double quotes. Now I've typed so many single quote strings in JavaScript that whenever I use a other language like Python, C#, C++ I end up typing single quotes and get syntax errors — gman, Jul 19 '20 at 16:24

score 57 · Accepted Answer · answered Oct 28 '08 at 10:22

57

It's certainly valid to use single quotes (HTML 4.01, section 3.2.2). I haven't noticed such a trend, but perhaps there's some framework that powers web sites you've visited that happens to quote using single quotes.

answered Oct 28 '08 at 10:22

Greg Hewgill

828,234
170
1,097
1,237

Funnily enough it's mainly sites that give external code out - for example a stats image for Ohloh or as in http://www.pushuptheweb.com/ – Ross Oct 28 '08 at 10:25
Google Font Library is now providing sample code with single quotes: http://www.google.com/webfonts – Simon East Dec 13 '11 at 23:03

score 46 · Answer 2 · edited Feb 27 '11 at 23:07

46

I find using single quotes is handy when dynamically generating HTML using a programming language that uses double quote string literals.

e.g.

String.Format("<a href='{0}'>{1}</a>", Url, Desc)

edited Feb 27 '11 at 23:07

Justin

80,106
47
208
350

answered Oct 28 '08 at 10:25

Ady

4,678
2
19
19

7

What? You dont like String.Format("{1}", Url, Desc) ??? =P – StingyJack Nov 07 '08 at 20:56
String.Format(@"{1}", Url, Desc) this is what you might consider :) – Nikita Ignatov Jan 03 '09 at 12:50
5

or String.Format("{1}", Url, Desc) – missaghi Jan 14 '09 at 18:55
23

3 perfect examples of extreme ugliness :) – ThiefMaster Dec 16 '11 at 02:10
3

and this is a great example of how to create XSS vulnerabilities in your site – Allison May 19 '17 at 06:31

score 12 · Answer 3 · edited Oct 10 '10 at 13:33

12

When using PHP to generate HTML it can be easier to do something like:

$html = "<img src='$url' />";

than concatenating a string with a variable with a string, as PHP parses variables in double-quoted strings.

edited Oct 10 '10 at 13:33

sisve

18,658
3
49
90

answered Oct 28 '08 at 10:28

Dean Rather

29,230
13
59
68

It's also easier than staring at $html = ""; As escaped quotes are all to easy to forget – Sekhat Oct 28 '08 at 11:08
4

actually you can reverse it in php as well: $html = ''; – Kevin Laity Jan 07 '11 at 18:46
16

@KevinLaity, using single quotes in PHP would make $url print out as $url, not the variable contents: http://php.net/manual/en/language.types.string.php – bradlis7 Nov 10 '11 at 16:56
alternatives don't make it more readable either: `$html = ''` – JimmyMcHoover Jan 24 '13 at 09:16
1

I use formatted strings, like `sprintf('', $url)` – Koen. Oct 27 '15 at 23:11

score 4 · Answer 4 · answered Oct 28 '08 at 13:17

Someone may use it in PHP to avoid escaping " if they're using double quoted string to parse variables within it, or to avoid using string concatenation operator.

Example:

echo "<input type='text' value='$data'/>";

instead of

echo "<input type=\"text\" value=\"$data\" />";

or

echo '<input type="text" value="' . $data . '" />';

Nowadays I always stick to using double quotes for HTML and single quotes for Javascript.

score 3 · Answer 5 · answered Oct 28 '08 at 10:32

3

It's easier when you want to embed double quotes.

answered Oct 28 '08 at 10:32

3

Same applies if you completely reverse the scenario... so not a good reason IMO – Joe Phillips Jan 14 '09 at 18:59
@JoePhillips Not always, some languages don't let you simply 'reverse the scenario'. .NET, for example, will only allow strings to be defined using double quotes. – krowe2 Feb 03 '17 at 22:47
@krowe2 This is true. But if you're storing javascript in C# strings, you're probably doing all kinds of things wrong – Joe Phillips Feb 04 '17 at 04:41
@JoePhillips I didn't mention JS but that would be just ONE reason to do it and, no, there is nothing wrong with doing this. One common example would be for cache busting purposes. `Reponse.Write(String.Format("", MakeUniqueStringFun()));` This example would be better if it wouldn't work just as well like so: `` but one is not really more correct than the other and it should be obvious that longer snippets of JS become unwieldy using the later method. – krowe2 Feb 07 '17 at 16:29

score 3 · Answer 6 · answered Oct 28 '08 at 10:51

3

In ASP.NET, it's easier to use single quotes if you're using data-binding expressions in attributes:

<asp:TextBox runat="server" Text='<%# Bind("Name") %>' />

answered Oct 28 '08 at 10:51

Danko Durbić

6,637
5
32
37

score 2 · Answer 7 · answered Jul 27 '10 at 18:05

2

In PHP, echo takes multiples parameters. So, if one would like to omit the concatenation operator, they could done something like and still use double quotes :

echo '<input type="text" value="', $data, '" />';

answered Jul 27 '10 at 18:05

matv

141
5

1

but by the time you realize it, you already started your echo string with double quotes, so you just use singles inside the string. That happens to me all the time. – DiegoDD Jul 29 '13 at 17:32
This is also more memory efficient, as it avoids creating a new string. – Andrea Oct 17 '14 at 13:39
This doesn't seem to answer the question at all. – krowe2 Feb 03 '17 at 22:45

score 2 · Answer 8 · answered Dec 04 '16 at 14:24

2

Another case where you may want to use single quotes: Storing JSON data in data attributes:

<tr data-info='{"test":true}'></tr>

JSON object keys must be in double quotes, so the attribute itself cannot.

answered Dec 04 '16 at 14:24

bryc

7,107
6
34
50

score 2 · Answer 9 · answered Jan 14 '09 at 18:49

2

Single quotes are perfectly legal in (X)HTML. Using a backslash to escape them, on the other hand, isn't. <img src='http://widget-site-example.com/ross.jpg' alt='Ross\'s Widget' /> is an image with the alt text "Ross\", and empty s and Widget/Widget' attributes. The correct way of escaping an apostrophe in HTML is '.

answered Jan 14 '09 at 18:49

Ms2ger

14,822
6
34
35

1

Single quotes are not perfectly legal in XHTML. – Joe Phillips Jan 14 '09 at 19:11
3

Single quotes are legal XHTML, aren't they? – Bennett McElwee Jan 18 '10 at 03:53

score 1 · Answer 10 · answered Oct 30 '15 at 16:18

If you want to the html to be valid html4 or xhtml then both single-quotes or double-quotes will work for attributes. HTML4 can be validated here: https://validator.w3.org/

If you are supporting only modern browsers (ie10 and higher) then you can use the html5 syntax which allows single quotes, double quotes, and no quotes (as long as there are no special characters in the attributes' value). HTML5 can be validated here: https://validator.w3.org/nu

score 1 · Answer 11 · answered Oct 10 '10 at 12:56

Single quotes generate a cleaner page with less clutter. You shouldn't be escaping them in HTML strings and it's your choice which to use... my preference is single quotes normally and if I need to include a single quote in the string (e.g. as delimiters for a string inside the string), I use double quotes for one & single for the other.

score 0 · Answer 12 · answered Feb 02 '13 at 06:26

I know this is an old thread, but still very much relevant.

If you want control over quotes in your generated HTML, you can use the sprintf() function in PHP (and similar calls available in many other languages):

$html = sprintf('<a href="%s">%s</a>', $url, $text);

Using sprintf() allows the format string to be easily modifiable by retrieving it from a database or configuration file, or via translation mechanisms.

It is very readable, and allows either double or single quotes in the generated HTML, with very little change and never any escaping:

$html = sprintf("<a href='%s'>%s</a>", $url, $text);

score 0 · Answer 13 · edited Aug 19 '13 at 23:45

0

Why not save pressing the SHIFT Key. One less keystroke for the same milage.

edited Aug 19 '13 at 23:45

rink.attendant.6

36,468
57
89
143

answered Jul 29 '13 at 17:23

Snuggs

792
1
4
6

ha! best general reason, I've seen. – Joseph Gabriel Apr 21 '14 at 17:17

score 0 · Answer 14 · answered Oct 28 '08 at 10:31

What's against single quotes?

You can have single/double quotes all over your html code without any problem, as long as you keep the same quoting style inside a current tags ( many browser won't complain even about this, and validation just want that if you start with a quote, end with the same, inside the same propriety )

Free support to random quoting styles!!! (yay ;D )

score 0 · Answer 15 · answered Mar 17 '21 at 12:50

Let's settle this argument for good

Double quotes are OK
Single quotes are OK
No quotes are OK, as long as you don't have one of these characters:
- space (obviously)
- "<" or ">" (makes sense)
- equal sign (not sure why but ok)
- any kind of quote: double, single, backtick (again, makes sense)

Funny how some people, even today, stick to the "double quote only" standard which was never really a standard but a convention. Also, if your language has apostrophes as a natural element (English, anyone?) it's more convenient, but in my opinion, increasing the complexity of PHP string compositions is way too high a price to pay for this.

score -7 · Answer 16 · edited Jun 20 '20 at 09:12

-7

You should avoid quotes altogether.

In your example only one quoted attribute actually needed quotes.

<!-- best form -->
<a href=http://widget-site-example.com/example.html>
  <img src=http://widget-site-example.com/ross.jpg alt='Ross&#39;s Widget' />
</a>

If you do use quotes, there is no hard and fast rule, but I've seen most commonly single quotes, with double quotes on the inside if necessary.

Using double quotes won't pass some validators.

edited Jun 20 '20 at 09:12

Community

1
1

answered Oct 17 '14 at 18:56

Code Whisperer

20,934
17
57
82

Quotes are required for the content to be valid [tag:HTML] 4.01 – Eric Oct 30 '15 at 16:01

Is it correct to use single quotes for HTML attributes?

16 Answers16

Let's settle this argument for good

You should avoid quotes altogether.

Linked

Related