forked from paulirish/w3fools
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
1584 lines (1441 loc) · 97.2 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
944
945
946
947
948
949
950
951
952
953
954
955
956
957
958
959
960
961
962
963
964
965
966
967
968
969
970
971
972
973
974
975
976
977
978
979
980
981
982
983
984
985
986
987
988
989
990
991
992
993
994
995
996
997
998
999
1000
<!DOCTYPE html>
<!--[if lt IE 9 ]><html lang="en" class="no-js shitty"><![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--><html lang="en" class="no-js"><!--<![endif]-->
<head>
<meta charset="utf-8">
<title>W3Fools – A W3Schools Intervention</title>
<meta name="description" content=" We hope we can illuminate why W3Schools is a troublesome resource, why their faulty information is a detriment to the web, and what you (and they) can do about it.">
<meta name="author" content="The JavaScript and Front-end Development Community">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/style.css">
<script src="js/libs/modernizr-1.6.min.js"></script>
</head>
<!--
-->
<body>
<div id="container">
<header>
<h1 id="intervention"><b>W3Schools</b> An Intervention</h1>
<h2>Are you using? Abusing? We are here to help.</h2>
</header>
<div id="main" role="main">
<nav id="toc">
<a href="#intervention" accesskey="1">Welcome</a>
<a href="#trouble" accesskey="2">Trouble</a>
<a href="#why-it-matters" accesskey="3">Why</a>
<a href="#what-should-be-done" accesskey="4">What</a>
<a href="#why-w3schools-sucks" accesskey="5">How</a>
<a href="#road-ahead" accesskey="6">Forward</a>
</nav>
<div class="intro"><!--START CLASS intro-->
<p>
We are passionate about the web, learning, and craftsmanship. We want you, as web designers and developers, to be successful in your careers. We feel, though, that W3Schools is harming the community with inaccurate information. Like any other authoritative educational resource, W3Schools should both hold itself to, and be held to, the highest standards.
</p><p>
We hope we can illuminate why W3Schools is a troublesome resource, why their faulty information is a detriment to the web, and what you <small>(and they)</small> can do about it.
</p>
<p><small>~ members of the Front-end Dev Community, <time pubdate datetime="2011-01-14">January 14<sup>th</sup>, 2011</time></small></p>
</div><!--END CLASS intro-->
<section class="content">
<div id="contributors">
<h2>From:</h2>
<a href="http://twitter.com/addyosmani" class="twitter-anywhere-user"><span class="at">@</span>addyosmani</a>
<a href="http://twitter.com/ajpiano" class="twitter-anywhere-user"><span class="at">@</span>ajpiano</a>
<a href="http://twitter.com/alrra" class="twitter-anywhere-user"><span class="at">@</span>alrra</a>
<a href="http://twitter.com/antimatter15" class="twitter-anywhere-user"><span class="at">@</span>antimatter15</a>
<a href="http://twitter.com/ard" class="twitter-anywhere-user"><span class="at">@</span>ard</a>
<a href="http://twitter.com/atornblad" class="twitter-anywhere-user"><span class="at">@</span>atornblad</a>
<a href="http://twitter.com/bentruyman" class="twitter-anywhere-user"><span class="at">@</span>bentruyman</a>
<a href="http://twitter.com/beverloo" class="twitter-anywhere-user"><span class="at">@</span>beverloo</a>
<a href="http://twitter.com/bjorninge" class="twitter-anywhere-user"><span class="at">@</span>bjorninge</a>
<a href="http://twitter.com/boazsender" class="twitter-anywhere-user"><span class="at">@</span>boazsender</a>
<a href="http://twitter.com/boblet" class="twitter-anywhere-user"><span class="at">@</span>boblet</a>
<a href="http://twitter.com/bradneuberg" class="twitter-anywhere-user"><span class="at">@</span>bradneuberg</a>
<a href="http://twitter.com/brianloveswords" class="twitter-anywhere-user"><span class="at">@</span>brianloveswords</a>
<a href="http://twitter.com/cowboy" class="twitter-anywhere-user"><span class="at">@</span>cowboy</a>
<a href="http://twitter.com/c_t_montgomery" class="twitter-anywhere-user"><span class="at">@</span>c_t_montgomery</a>
<a href="http://twitter.com/danheberden" class="twitter-anywhere-user"><span class="at">@</span>danheberden</a>
<a href="http://twitter.com/darcy_clarke" class="twitter-anywhere-user"><span class="at">@</span>darcy_clarke</a>
<a href="http://twitter.com/devongovett" class="twitter-anywhere-user"><span class="at">@</span>devongovett</a>
<a href="http://twitter.com/edwinm" class="twitter-anywhere-user"><span class="at">@</span>edwinm</a>
<a href="http://twitter.com/ekashida" class="twitter-anywhere-user"><span class="at">@</span>ekashida</a>
<a href="http://twitter.com/erichynds" class="twitter-anywhere-user"><span class="at">@</span>erichynds</a>
<a href="http://twitter.com/franksvalli" class="twitter-anywhere-user"><span class="at">@</span>franksvalli</a>
<a href="http://twitter.com/gf3" class="twitter-anywhere-user"><span class="at">@</span>gf3</a>
<a href="http://twitter.com/gridinoc" class="twitter-anywhere-user"><span class="at">@</span>gridinoc</a>
<a href="http://twitter.com/heycam" class="twitter-anywhere-user"><span class="at">@</span>heycam</a>
<a href="http://twitter.com/jamespearce" class="twitter-anywhere-user"><span class="at">@</span>jamespearce</a>
<a href="http://twitter.com/jerem" class="twitter-anywhere-user"><span class="at">@</span>jerem</a>
<a href="http://twitter.com/kangax" class="twitter-anywhere-user"><span class="at">@</span>kangax</a>
<a href="http://twitter.com/kfranqueiro" class="twitter-anywhere-user"><span class="at">@</span>kfranqueiro</a>
<a href="http://twitter.com/kriskowal" class="twitter-anywhere-user"><span class="at">@</span>kriskowal</a>
<a href="http://twitter.com/lightroy" class="twitter-anywhere-user"><span class="at">@</span>lightroy</a>
<a href="http://twitter.com/mathias" class="twitter-anywhere-user"><span class="at">@</span>mathias</a>
<a href="http://twitter.com/miketaylr" class="twitter-anywhere-user"><span class="at">@</span>miketaylr</a>
<a href="http://twitter.com/millermedeiros" class="twitter-anywhere-user"><span class="at">@</span>millermedeiros</a>
<a href="http://twitter.com/mrnibbles" class="twitter-anywhere-user"><span class="at">@</span>mrnibbles</a>
<a href="http://twitter.com/nimbuin" class="twitter-anywhere-user"><span class="at">@</span>nimbuin</a>
<a href="http://twitter.com/paul_irish" class="twitter-anywhere-user"><span class="at">@</span>paul_irish</a>
<a href="http://twitter.com/peolanha" class="twitter-anywhere-user"><span class="at">@</span>peolanha</a>
<a href="http://twitter.com/ralphholzmann" class="twitter-anywhere-user"><span class="at">@</span>ralphholzmann</a>
<a href="http://twitter.com/robfaraj" class="twitter-anywhere-user"><span class="at">@</span>robfaraj</a>
<a href="http://twitter.com/rwaldron" class="twitter-anywhere-user"><span class="at">@</span>rwaldron</a>
<a href="http://twitter.com/scriptin" class="twitter-anywhere-user"><span class="at">@</span>scriptin</a>
<a href="http://twitter.com/seankoole" class="twitter-anywhere-user"><span class="at">@</span>seankoole</a>
<a href="http://twitter.com/sephr" class="twitter-anywhere-user"><span class="at">@</span>sephr</a>
<a href="http://twitter.com/slexaxton" class="twitter-anywhere-user"><span class="at">@</span>slexaxton</a>
<a href="http://twitter.com/slightlylate" class="twitter-anywhere-user"><span class="at">@</span>slightlylate</a>
<a href="http://twitter.com/trygve_lie" class="twitter-anywhere-user"><span class="at">@</span>trygve_lie</a>
<a href="http://twitter.com/zetafleet" class="twitter-anywhere-user"><span class="at">@</span>zetafleet</a>
</div>
</section>
<section class="content"><h2 id="trouble">W3Schools is trouble</h2>
<ol>
<li class="noaffiliation">
W3Schools.com is <strong>not affiliated with the W3C in any way</strong>. Members of the W3C have asked
W3Schools to explicitly disavow any connection in the past, and they have refused to do so. <!-- This fact is from conversations with W3C employees, but afaik it is not published publicly on the web. Sorry. :( -->
</li>
<li class="cert">
W3Schools offers <a href="http://www.w3schools.com/cert/default.asp" rel="nofollow">certifications</a> whose value is highly debateable…
No employers recognize
or respect W3Schools certificates. Unlike Microsoft’s <abbr title="Microsoft Certified Professional (MCSE, etc.)">MCP</abbr>
or Cisco’s <abbr title="Cisco Career Certifications (CCNE, etc.)">CCC</abbr>, W3Schools has absolutely
no authority over the technologies for which they claim to provide certification. Unlike CompTIA’s
ANSI/ISO accredited certifications, W3Schools has no support from governing standards bodies.
</li>
<li class="incorrect">
W3Schools frequently publishes inaccurate or misleading content. We have collected several examples
illustrating this problem below.
</li>
</ol>
</section>
<section class="belief"><p>We believe w3schools is harmful to the web. Web developers deserve better.</p></section>
<section class="content"><h2 id="why-it-matters">Why does it matter?</h2>
<h4>Bad education hurts.</h4>
<ol>
<li>Being badly educated hampers your ability to score a good job.
<li>Inaccurate references slow development and cause costly QA loops.
<li>Learning key web development idioms slowly or incorrectly puts you years behind your own colleagues.
</ol></section>
<!--
<something about putting ‘mdc’ in your search query>
To filter out w3school in your google search, append “-w3school” to your search without the quotes. To get the document from MDC,
just append mdc to your search query.
On recommendations.. MDC for intermediate css and javascript, i think.
-->
<section class="content"><h2 id="what-should-be-done">What should be done</h2>
<ol>
<li>
<strong>W3Schools</strong> should consider <abbr title="make the site a wiki. Or.. put it all in public source control, like on Github.">wikifying</abbr> their content so the community could self-correct and keep the information
up-to-date. Today, they do not even allow you to submit corrections on a page. They should.
</li>
<li><strong>You</strong> should learn from (and recommend) these more reputable sources:
<ul>
<li>
<a href="http://dev.opera.com/articles/view/1-introduction-to-the-web-standards-cur/#toc">Opera Web Standards Curriculum</a>
covers the basics of web standards-based design in HTML and CSS.
<li>
<a href="http://code.google.com/edu/submissions/html-css-javascript/">Google's HTML, CSS, and Javascript from the Ground Up</a>
presents the basics of web development with video tutorials presented by Google's expert web developers.
<li>
<a href="http://reference.sitepoint.com/">SitePoint</a> is a pretty good reference for HTML, CSS and JavaScript. Their documentation always mentions feature support across different browsers, and describes known browser bugs.
<li>
The W3C, itself, has a wiki-based general <a href="http://www.w3.org/html/wiki/Learn">Learn</a> page as well as an <a
href="http://www.w3.org/html/wiki/Elements">HTML element reference</a>.
<li>
<p>
<a href="https://developer.mozilla.org/en-US/docs">The MDC (Mozilla's Doc Center)</a> takes over at intermediate CSS and
covers JavaScript better than anyone.
</p>
<p>
The MDC is also a wiki (little known fact), which means we, as knowledgeable web developers, can add or change information so
the pages are as effective and comprehensive as possible.
</p>
</li>
</ul>
</li>
<!-- <li>
Until they fix their content, we urge everyone, not just web
developers, to stop linking to or referencing w3schools.
<sup><a href="#cmnt4" id="cmnt_ref4">[d]</a></sup>
</li> -->
<!-- http://news.ycombinator.com/item?id=2082089 -->
</ol>
</section>
<section class="content"><h2 id="build-one-yourselves">“Build One Yourself”</h2>
<p>
An oft-repeated mantra in OSS (and a critique we've already received) is that you shouldn't criticise something unless you're willing to put your money where your mouth is and build something better. It's an admirable ethos, but not really applicable here.</p>
<p>W3Schools has put a lot of effort into positioning itself at the top of search results and, despite our efforts (such as the
<a href="http://promotejs.com/">PromoteJS</a> initiative), appears to be there to stay. Other, better resources already exist, but
none of them are capable of overcoming the inertia that W3Schools has built up over the years.</p>
<p>We believe it is W3Schools's
responsibility to disseminate accurate information—and if they refuse, we hope that this document will help dissuade
others from promoting or linking to W3Schools as an authoritative source of information.</p>
</section>
<section class="sucks clearfix">
<div class="intro" id="why-w3schools-sucks">
<p>From W3Schools's own footer…</p>
<blockquote>
We do not warrant the correctness of [W3Schools] content. The risk from using it lies entirely with the user.
</blockquote>
<p>We couldn't put it much better ourselves.</p>
<p class="update">
<small>Although we haven't heard from W3Schools directly, we have noticed that W3Schools has started to correct errors we've spotted. These have been noted here with <s>strikethrough</s>. Although we'd appreciate some communication, we're elated they've taken steps to improve their information. </small>
<small>Despite these attempts, we are not confident that W3Schools can be reliable as an accurate reference in the future. We think the resources we've recommended are superior.</small>
</p>
</div>
<ul>
<li id="htmlsucks">
<h3>HTML</h3>
<ul>
<li id="html-headings">
<a href="#html-headings" class="wrap">#</a>
<a href="http://www.w3schools.com/html/html_headings.asp" rel="nofollow" class="w3s-link"><del>www.w3schools.com/html/html_headings.asp</del></a>.
<blockquote>
Note: Browsers automatically add an empty line before and after a heading.
</blockquote>
<p>
This is an oversimplification. Browsers' default stylesheets define these elements as block-level with non-zero <code>margin-top</code>
and <code>margin-bottom</code> values. No newlines are added.
</p>
</li>
<li id="html5_intro">
<a href="#html5_intro" class="wrap">#</a>
<a href="http://www.w3schools.com/html5/html5_intro.asp" rel="nofollow" class="w3s-link">www.w3schools.com/html5/html5_intro.asp</a>.
<blockquote>
The latest versions of Safari, Chrome, Firefox, and Opera support some HTML5 features. Internet Explorer 9 will support some HTML5 features.
</blockquote>
<p>
This is misleading. Many features that have existed for years in IE are just now being standardized by HTML5, e.g. <code>contenteditable</code>.
IE8 also already supports <code>localStorage</code>, which is an HTML5 feature.
</p>
</li>
<li id="html_getstarted">
<a href="#html_getstarted" class="wrap">#</a>
<a href="http://www.w3schools.com/html/html_getstarted.asp" rel="nofollow" class="w3s-link"><del>www.w3schools.com/html/html_getstarted.asp</del></a>.
<blockquote>
[…] professional web developers often prefer HTML editors like FrontPage or Dreamweaver, instead of writing plain text.
</blockquote>
<p>
Professional web developers do not recommend the use of WYSIWYG editors.
</p>
</li>
<!--
<li id="tag_script">
<a href="#tag_script" class="wrap">#</a>
<a href="http://www.w3schools.com/html5/tag_script.asp" rel="nofollow" class="w3s-link"><del>www.w3schools.com/html5/tag_script.asp</del></a>.
<blockquote>
The required <code>type</code> attribute specifies the MIME type of the script.
</blockquote>
<p>This is wrong. In HTML5, the type attribute is optional, not required.</p>
</li>
-->
<!--
<li id="html_styles">
<a href="#html_styles" class="wrap">#</a>
<a href="http://www.w3schools.com/html/html_styles.asp" rel="nofollow" class="w3s-link">www.w3schools.com/html/html_styles.asp</a>.
<p>
Virtually everything on this page advocates worst practices in Web development. There is no
excuse for disseminating this kind of content in 2011, at least without a very large disclaimer
discussing external stylesheets.
</p>
</li>
-->
<li id="html_frames">
<a href="#html_frames" class="wrap">#</a>
<a href="http://www.w3schools.com/html/html_frames.asp" rel="nofollow" class="w3s-link">www.w3schools.com/html/html_frames.asp</a>.
<p>
Again, frames are considered among the very worst of practices in modern Web development. In
fact, they are considered so bad, they are no longer <em>valid</em> in HTML5.
</p>
</li>
<li id="html_elements">
<a href="#html_elements" class="wrap">#</a>
<a href="http://www.w3schools.com/html/html_elements.asp" rel="nofollow" class="w3s-link">www.w3schools.com/html/html_elements.asp</a>.
<blockquote>
Most browsers will display HTML correctly even if you forget the end tag
</blockquote>
<p>
Most browsers try to correct your markup but there will probably be unintended consequences.
There are a few elements, such as <p>, which are explicitly stated in the HTML spec to have an
optional close tag, but most elements are not this way.
</p>
<p>This page was recently updated:</p>
<blockquote>
The example above will work in most browsers, but don't rely on it. Forgetting the end tag can produce unexpected results or errors.
</blockquote>
<p>
This is still wrong. The example uses <code><p></code> tags, which are one of the few exceptions where
a closing tag is optional.
</p>
<blockquote>
W3Schools use lowercase tags because the World Wide Web Consortium (W3C) recommends lowercase in HTML 4
</blockquote>
<p>
Incorrect. W3C's HTML 4.01 Specification specifically says <a href="http://www.w3.org/TR/html401/about.html#h-1.2.1">element and attribute names are case-insensitive</a>, and uses uppercase tags to differentiate them from attributes. While XML-based XHTML 1.x and XHTML5 require lowercase tags, HTML5 is also case-insensitive.
</p>
</li>
<li id="html_getstarted_htm">
<a href="#html_getstarted_htm" class="wrap">#</a>
<a href="http://www.w3schools.com/html/html_getstarted.asp" rel="nofollow" class="w3s-link"><del>www.w3schools.com/html/html_getstarted.asp</del></a>.
<blockquote>
When you save an HTML file, you can use either the <code>.htm</code> or the <code>.html</code> file extension. We use <code>.htm</code> in
our examples. It is a habit from the past, when the software only allowed three letters in file extensions. With new software
it is perfectly safe to use <code>.html</code>
</blockquote>
<p>
Nitpicking to be sure, but Unix has supported arbitrary 255-character file names since 1983.
That is hardly "new software", and illustrates the misunderstanding of basic principles of
computing & software design that tends to permeate W3Schools material.
</p>
<p>
Extensions are not necessary at all and if they are present they don't have to be
<code>.htm</code> or <code>.html</code>. The key thing is that HTML files are served with
the corrent content-type e.g. <code>text/html</code>. (many web servers have some built in
or preconfigured knowledge that <code>.htm</code> and <code>.html</code> should be served
with the <code>text/html</code> content-type)
</p>
</li>
<li id="html5_webstorage">
<a href="#html5_webstorage" class="wrap">#</a>
<a href="http://www.w3schools.com/html5/html5_webstorage.asp" rel="nofollow" class="w3s-link"><del>www.w3schools.com/html5/html5_webstorage.asp</del></a>.
<blockquote>
The localStorage method stores the data with no time limit. […] The sessionStorage method stores
the data for one session.
</blockquote>
<p>
<code>localStorage</code> and <code>sessionStorage</code> are called "methods", but they are not
methods—they are objects that implement the HTML5 Storage interface. Nothing about their
properties and methods are mentioned, it just shows a simple dot syntax getter example. This is
important, because W3Schools apologists often claim that the reason W3Schools documentation is
wrong is because it is old—but this "content" is certainly not old, as the web storage API is
less than 2 years old.
</p>
</li>
<li id="html5_ref_standardattributes">
<a href="#html5_ref_standardattributes" class="wrap">#</a>
<a href="http://www.w3schools.com/html5/html5_ref_standardattributes.asp" rel="nofollow" class="w3s-link">www.w3schools.com/html5/html5_ref_standardattributes.asp</a>.
<p>
There is no such thing as a <code>subject</code> attribute, but W3Schools claims there is.
Furthermore, many HTML5 standard attributes such as <code>dir</code> and <code>dropzone</code>
are conspicuously absent.
In HTML-dialect HTML5, the values of boolean attributes like <code>hidden</code> are not relevant to how the attribute is processed.
Finally, instead of listing all five microdata attributes, only "item" and "itemprop" are
provided—and they don’t give a reasonable explanation of how they should be used, leaving the
visitor clueless.
</p>
</li>
<li id="tag_q">
<a href="#tag_q" class="wrap">#</a>
<a href="http://www.w3schools.com/tags/tag_q.asp" rel="nofollow" class="w3s-link"><del>www.w3schools.com/tags/tag_q.asp</del></a>.
<blockquote>
Browser Support. The <q> tag is supported in all major browsers, except Internet Explorer.
</blockquote>
<p>This is blatantly false; <code><q></code> tags work just fine in IE8.</p>
</li>
<li id="markup">
<a href="#markup" class="wrap">#</a>
<p>
The markup of the W3Schools site itself is awful and does not conform to best practices: table in
table in table in table, with lots of inline styles.
</p>
</li>
<li id="html5_form_input_types">
<a href="#html5_form_input_types" class="wrap">#</a>
<a href="http://www.w3schools.com/html5/html5_form_input_types.asp" rel="nofollow" class="w3s-link"><del>www.w3schools.com/html5/html5_form_input_types.asp</del></a>.
<blockquote>
search: No No 9.0 No No, color: No No 9.0 No No
</blockquote>
<p>
This entire support matrix is wrong. Support for <code>type=color</code> and
<code>type=search</code> were added in Opera version 11, not version 9. Furthermore, IE, Safari,
Chrome, and Firefox all have support for properties that W3Schools claims they do not support.
</p>
</li>
<li id="html_elements_br">
<a href="#html_elements_br" class="wrap">#</a>
<a href="http://www.w3schools.com/html/html_elements.asp" rel="nofollow" class="w3s-link">www.w3schools.com/html/html_elements.asp</a>.
<blockquote>
Even if <code><br></code> works in all browsers, writing <code><br /></code> instead is more future proof.
</blockquote>
<p>
This is false and misleading; there is nothing future-proof about self-closing tags, especially
as the work on XHTML 2.0 has been discontinued. Furthermore, <br /> isn't semantic in most cases and probably should not
be mentioned at all.
</p>
<blockquote>
Note: Future version of HTML will not allow you to skip end tags.
</blockquote>
<p>
This is blatantly false. The latest version of HTML, HTML5, continues to allow certain end tags
to be omitted.
</p>
</li>
<li id="html_links">
<a href="#html_links" class="wrap">#</a>
<a href="http://www.w3schools.com/html/html_links.asp" rel="nofollow" class="w3s-link">www.w3schools.com/html/html_links.asp</a>.
<blockquote>
The name attribute specifies the name of an anchor. The name attribute is used to create a
bookmark inside an HTML document.
</blockquote>
<p>
This is misleading. Named anchors have been deprecated since HTML4 and replaced with element IDs.
(Yes, that's right: you can link to any element with a <code>href="#thing"</code> as long as it
has <code>id="thing"</code>. Yes, it works everywhere.)
</p>
</li>
<li id="tag_font_style">
<a href="#tag_font_style" class="wrap">#</a>
<a href="http://www.w3schools.com/tags/tag_font_style.asp" rel="nofollow" class="w3s-link">www.w3schools.com/tags/tag_font_style.asp</a>.
<blockquote>
The <tt>, <i>, <b>, <big>, and <small> tags are all font-style tags. They are not
deprecated, but it is possible to achieve richer effect with CSS.
</blockquote>
<p>
This is wrong. <code><big></code> and <code><tt></code> are not only
deprecated, they are obsolete as of HTML5. In any case, a learning site should never advocate the
use of these tags to format text, even with a mild disclaimer that “richer” effects are possible
via CSS.
</p>
</li>
<li id="html_tables">
<a href="#html_tables" class="wrap">#</a>
<a href="http://www.w3schools.com/html/html_tables.asp" rel="nofollow" class="w3s-link">www.w3schools.com/html/html_tables.asp</a>.
<p>
Pages earlier in the HTML tutorial they recommended using CSS for style, but suddenly they are
back to using ancient attributes to set border-width on tables. They also claim that <q>the text
in a <code>th</code> element will be bold and centered</q>, but this only refers to the default
styles of certain browsers, which they never explain—and their own site overrides this rule so
that the header in the example is left-justified, not centered.
</p>
</li>
<li id="html_forms">
<a href="#html_forms" class="wrap">#</a>
<a href="http://www.w3schools.com/html/html_forms.asp" rel="nofollow" class="w3s-link">www.w3schools.com/html/html_forms.asp</a>.
<blockquote>
<pre><form>
First name: <input type="text" name="firstname" /><br />
Last name: <input type="text" name="lastname" />
</form></pre>
</blockquote>
<p>
This code is wrong. Non-block-level elements (such as <code><input></code>) are not
valid directly inside <code><form></code> tags until HTML5.
</p>
</li>
<li id="html_colors">
<a href="#html_colors" class="wrap">#</a>
<a href="http://www.w3schools.com/html/html_colors.asp" rel="nofollow" class="w3s-link">www.w3schools.com/html/html_colors.asp</a>,
<a href="http://www.w3schools.com/html/html_colornames.asp" rel="nofollow" class="w3s-link">www.w3schools.com/html/html_colornames.asp</a>,
<a href="http://www.w3schools.com/html/html_colorvalues.asp" rel="nofollow" class="w3s-link">www.w3schools.com/html/html_colorvalues.asp</a>
<p>
This is all CSS stuff. It should not be listed in the HTML section. Additionally, the Color Names page lies: not all browsers support the 130 SVG colors.
</p>
</li>
<li id="html_whyusehtml4">
<a href="#html_whyusehtml4" class="wrap">#</a>
<a href="http://www.w3schools.com/html/html_whyusehtml4.asp" rel="nofollow" class="w3s-link">www.w3schools.com/html/html_whyusehtml4.asp</a>.
<p>
This is one of the few places in the entire site where they provide an example that contains a
DOCTYPE. People that use their examples as starting points will be generating quirks-mode markup,
since pretty much none of them offer a DOCTYPE.
</p>
</li>
<li id="html_head">
<a href="#html_head" class="wrap">#</a>
<a href="http://w3schools.com/html/html_head.asp" rel="nofollow" class="w3s-link">www.w3schools.com/html/html_head.asp</a>.
<blockquote>
<pre><html>
<head>
<title>Title of the document</title>
</head>
<body>
The content of the document......
</body>
</html></pre>
</blockquote>
<p>
Their "minimum document example" is missing a DOCTYPE. It also differs from other "minimal
document examples" on their site, such as the one on the HTML Introduction page, which is missing
a <code><head></code> entirely.
</p>
</li>
<li id="html_url">
<a href="#html_url" class="wrap">#</a>
<a href="http://www.w3schools.com/html/html_url.asp" rel="nofollow" class="w3s-link"><del>www.w3schools.com/html/html_url.asp</del></a>.
<blockquote>
Pages starting with http:// are not encrypted, so all information exchanged between your computer
and the Internet can be "seen" by hackers.
</blockquote>
<p>
This is a gross mischaracterization of how attacks involving traffic sniffing operate.
</p>
<blockquote>
Common URL Schemes […] gopher […] news […] WAIS
</blockquote>
<p>
None of these URL schemes were ever "common" within the lifetime of W3Schools, and certainly are
not common now. This information simply should have never existed.
</p>
</li>
<li id="html_urlencode">
<a href="#html_urlencode" class="wrap">#</a>
<a href="http://www.w3schools.com/html/html_urlencode.asp" rel="nofollow" class="w3s-link">www.w3schools.com/html/html_urlencode.asp</a>.
<blockquote>
URL encoding replaces unsafe ASCII characters with "%" followed by two hexadecimal digits
corresponding to the character values in the ISO-8859-1 character-set.
</blockquote>
<p>
This is false. URL encodings are not ISO-8859-1. RFC 3986 is the standard defining URL encoding,
and specifies that textual characters should, in fact, be mapped to UTF-8 octets.
</p>
<blockquote>
URLs cannot contain spaces. URL encoding normally replaces a space with a + sign.
</blockquote>
<p>
That's not true. An URL can use spaces. Nothing defines that a space is replaced with a + sign.
</p>
</li>
<li id="html5_video">
<a href="#html5_video" class="wrap">#</a>
<a href="http://w3schools.com/html5/html5_video.asp" rel="nofollow" class="w3s-link">www.w3schools.com/html5/html5_video.asp</a>.
<blockquote>
Currently, there are 2 supported video formats for the video element: […] Ogg = Ogg files with
Thedora video codec and Vorbis audio codec […] MPEG4 = MPEG 4 files with H.264 video codec and
AAC audio codec
</blockquote>
<p>
This is wrong. The HTML spec does not define supported video formats. In fact, there are
three main video formats, not two: Theora (not Thedora) + Vorbis in an Ogg container,
VP8 + Vorbis in a WebM container, and H.264 + AAC in an MPEG-4 container.
Furthermore, Safari supports whatever QuickTime supports, which means that Xiph Components can be
installed to add support for Ogg video.
</p>
<blockquote>
All <code><video></code> Attributes
</blockquote>
<p>
This list is wrong and woefully incomplete; even the <code>poster</code> attribute is missing.
</p>
</li>
<li id="html5">
<a href="#html5" class="wrap">#</a>
<a href="http://www.w3schools.com/html5/default.asp" rel="nofollow" class="w3s-link">www.w3schools.com/html5/default.asp</a>.
<blockquote>
At W3Schools you will find complete references about tags, standard attributes, standard events,
and more.
</blockquote>
<p>
This is not true. A lot of attributes, standard events and more are missing. We've documented
some of these omissions above, such as the HTML5 video attributes and HTML5 common attributes,
but there are many other places that purport to be complete references on the W3Schools that
contain significant errors or omissions.
</p>
</li>
<li id="tag_p">
<a href="#tag_p" class="wrap">#</a>
<a href="http://www.w3schools.com/tags/tag_p.asp" rel="nofollow" class="w3s-link">www.w3schools.com/tags/tag_p.asp</a>
<blockquote>
<p>The <code><p></code> tag defines a paragraph.</p>
<p>The p element automatically creates some space before and after itself. The space is automatically applied by the browser, or you can specify it in a style sheet.</p>
</blockquote>
<p>
That explanation confuses "tag" and "element". Browsers' default CSS
defines margins for paragraphs -- the part about creating "some space"
is misleading.
</p>
</li>
<li id="tag_meta">
<a href="#tag_meta" class="wrap">#</a>
<a href="http://www.w3schools.com/html5/tag_meta.asp" rel="nofollow" class="w3s-link">www.w3schools.com/html5/tag_meta.asp</a>
<blockquote><pre><meta charset="ISO-8859-1" /></pre></blockquote>
<p>
This is very bad. Sites like W3Schools should not be advocating the use of ISO-8859-1. UTF-8
should be used in nearly all cases.
</p>
</li>
<li id="tag_details">
<a href="#tag_details" class="wrap">#</a>
<a href="http://www.w3schools.com/html5/tag_details.asp" rel="nofollow" class="w3s-link">www.w3schools.com/html5/tag_details.asp</a>
<p>
The purpose of the HTML5 <code><details></code> element. This article makes it sound like <code><details></code> is a
document-level metadata tag, when in fact it's meant to be used as a collapsible container for additional content or controls.
</p>
</li>
<li id="tag_hn">
<a href="#tag_hn" class="wrap">#</a>
<a href="http://www.w3schools.com/tags/tag_hn.asp" rel="nofollow" class="w3s-link">www.w3schools.com/tags/tag_hn.asp</a>.
<blockquote>
<code><h1></code> defines the largest heading and <code><h6></code> defines the smallest heading.
</blockquote>
<p>
This is not true. The heading elements' number defines their rank for their importance on the
page.
</p>
</li>
<li id="tag_phrase_elements">
<a href="#tag_phrase_elements" class="wrap">#</a>
<a href="http://www.w3schools.com/tags/tag_phrase_elements.asp" rel="nofollow" class="w3s-link">www.w3schools.com/tags/tag_phrase_elements.asp</a>.
<blockquote>
<code><cite></code> defines a citation
</blockquote>
<p>
There’s no mention in “Differences Between HTML 4.01 and HTML5” that HTML5 forbids using <code><cite></code> for people — it’s now only for “<a href="http://developers.whatwg.org/text-level-semantics.html#the-cite-element">a title of a work</a>”.
</p>
<blockquote>
<pre>…
<strong>Strong text</strong>
…</pre>
</blockquote>
<p>
Several of the examples on this page are weak, but this one even contradicts W3Schools’ own info: “In HTML 4.01, the <code><strong></code> tag defined strong emphasized text, but in HTML5 it defines important text”.
</p>
</li>
<li id="tag_dl">
<a href="#tag_dl" class="wrap">#</a>
<a href="http://www.w3schools.com/tags/tag_dl.asp" rel="nofollow" class="w3s-link">www.w3schools.com/tags/tag_dl.asp</a>.
<blockquote>
The <code><dl></code> tag defines a definition list
</blockquote>
<p>
Wrong. In HTML5 the <code><dl></code> element <a href="http://developers.whatwg.org/grouping-content.html#the-dl-element">represents an association list or description list</a>. This is a much wider meaning than HTML4’s “definition list”. The example is also terrible, even for a definition — here’s hoping w3schools doesn’t start a dictionary side project.
</p>
</li>
<li id="tag_header">
<a href="#tag_header" class="wrap">#</a>
<a href="http://www.w3schools.com/tags/tag_header.asp" rel="nofollow" class="w3s-link">www.w3schools.com/tags/tag_header.asp</a>.
<blockquote>
The <code><header></code> tag specifies an introduction, or a group of navigation elements for the document
</blockquote>
<p>
Wrong. In HTML5 the <code><header></code> element <a href="http://developers.whatwg.org/sections.html#the-header-element">represents a group of introductory or navigational aids</a>. It is not <em>just</em> for the document. In addition it’s often used for headers in sectioning content elements such as <code><section></code> and <code><article></code>.
</p>
</li>
</ul>
</li>
<li id="csssucks">
<h3>CSS</h3>
<ul>
<li id="pr_pseudo_after">
<a href="#pr_pseudo_after" class="wrap">#</a>
<a href="http://www.w3schools.com/css/pr_pseudo_after.asp" rel="nofollow" class="w3s-link">www.w3schools.com/css/pr_pseudo_after.asp</a>.
<blockquote>
Example: Play a sound after each occurrence of an h1 element:
<pre><code>h1:after
{
content:url(beep.wav);
}</code></pre>
</blockquote>
<p>
Playing a sound after each occurrence of an <code>H1</code> element is not likely to be a real-world problem that needs solving, nor is it even possible with the current implementation.
A better example might include something like:</p>
<pre><code>.description:after {
content:'...'
}</code></pre>
</li>
<li id="pr_class_display">
<a href="#pr_class_display" class="wrap">#</a>
<a href="http://www.w3schools.com/css/pr_class_display.asp" rel="nofollow" class="w3s-link">www.w3schools.com/css/pr_class_display.asp</a>.
<blockquote>
No versions of Internet Explorer (including IE8) support the property values <code>inline-table</code>, <code>run-in</code>,
<code>table</code>, <code>table-caption</code>, <code>table-cell</code>, <code>table-column</code>, <code>table-column-group</code>,
<code>table-row</code>, or <code>table-row-group</code>.
</blockquote>
<p>IE8 supports all of these.</p>
</li>
<li id="css3_2dtransforms">
<a href="#css3_2dtransforms" class="wrap">#</a>
<a href="http://www.w3schools.com/css3/css3_2dtransforms.asp" rel="nofollow" class="w3s-link">www.w3schools.com/css3/css3_2dtransforms.asp</a>.
<blockquote>
2D Transform Methods […] matrix(n,n,n,n,n,n) translate(x,y) scale(x,y) rotate(angle)
skew(x-angle,y-angle) skewX(angle) skewY(angle)
</blockquote>
<p>
This reference of transform methods lists <code>skewX</code> and <code>skewY</code> but
omits <code>translateX</code>, <code>translateY</code>, <code>scaleX</code>, and <code>scaleY</code>.
</p>
</li>
<li id="css3_fonts">
<a href="#css3_fonts" class="wrap">#</a>
<a href="http://www.w3schools.com/css3/css3_fonts.asp" rel="nofollow" class="w3s-link">www.w3schools.com/css3/css3_fonts.asp</a>.
<blockquote>
Internet Explorer does not yet support the @font-face rule.
</blockquote>
<p>
This is wrong. In fact, Microsoft <em>invented</em> the <code>@font-face</code> at-rule.
</p>
</li>
</ul>
</li>
<li id="jssucks">
<h3>JavaScript</h3>
<ul>
<li id="js_timing">
<a href="#js_timing" class="wrap">#</a>
<a href="http://www.w3schools.com/js/js_timing.asp" rel="nofollow" class="w3s-link">www.w3schools.com/js/js_timing.asp</a>.
<blockquote><code>var t=setTimeout("javascript statement",milliseconds);</code></blockquote>
<p>
This is terrible advice. You <strong>never</strong> pass a string to
<code><a href="https://developer.mozilla.org/en/DOM/window.setTimeout" rel="external">setTimeout()</a></code>
unless you like using
<code><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/eval" rel="external">eval</a>()</code>.
Passing a string also means, among other things, that you can't use any variables from your local
scope. Also, the examples on this page use a ton of global variables. Bad.
</p>
</li>
<li id="js_browser">
<a href="#js_browser" class="wrap">#</a>
<a href="http://www.w3schools.com/js/js_browser.asp" rel="nofollow" class="w3s-link">www.w3schools.com/js/js_browser.asp</a>.
<blockquote>
Sometimes it can be useful to detect the visitor's browser, and then serve the appropriate information.
The best way to do this is to make your web pages smart enough to look one way to some browsers and another way to other browsers.
</blockquote>
<p>
Abysmal. User-agent sniffing is a <em>very</em> bad thing, because it is easily
<a href="http://webaim.org/blog/user-agent-string-history/">spoofable</a>. This applies equally
to the <code>window.navigator</code> object.
</p>
<blockquote><pre><code><script type="text/javascript">
document.write("Browser CodeName: " + navigator.appCodeName);
document.write("<br /><br />");
document.write("Browser Name: " + navigator.appName);
document.write("<br /><br />");
document.write("Browser Version: " + navigator.appVersion);
document.write("<br /><br />");
document.write("Cookies Enabled: " + navigator.cookieEnabled);
document.write("<br /><br />");
document.write("Platform: " + navigator.platform);
document.write("<br /><br />");
document.write("User-agent header: " + navigator.userAgent);
</script></code></pre></blockquote>
<p>
W3Schools uses <code><a href="https://developer.mozilla.org/en/document.write" rel="external">document.write</a>()</code>
in a lot of their examples; unfortunately, it has a tendency to trash a page and is one of the poorest
ways possible to add content. It also means that you can't
defer/asynchronously load any other scripts, and your DOM loading is delayed because the browser has to wait for your
<code><a href="https://developer.mozilla.org/en/document.write" rel="external">document.write</a>()</code>.
</p>
</li>
<li id="met_win_setinterval">
<a href="#met_win_setinterval" class="wrap">#</a>
<a href="http://www.w3schools.com/jsref/met_win_setinterval.asp" rel="nofollow" class="w3s-link">www.w3schools.com/jsref/met_win_setinterval.asp</a>.
<p>
No warning about what happens when the callback takes longer than the given interval.
</p>
</li>
<li id="jsref_eval">
<a href="#jsref_eval" class="wrap">#</a>
<a href="http://www.w3schools.com/jsref/jsref_eval.asp" rel="nofollow" class="w3s-link">www.w3schools.com/jsref/jsref_eval.asp</a>.
<blockquote>
First, <code>eval()</code> determines if the argument is a valid string, then <code>eval()</code> parses the string looking
for JavaScript code. If it finds any JavaScript code, it will be executed.
</blockquote>
<p>
<code><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/eval" rel="external">eval</a>()</code>
certainly does not parse a string to determine whether or not it's JavaScript.
</p>
<p>
W3Schools recently updated their description, but it is still wrong.
</p>
<blockquote>
If the argument is an expression, eval() evaluates the expression. If the argument is one or more JavaScript statements, eval()
executes the statements.
</blockquote>
<p>
You do not pass an expression or a JavaScript statement to <code>eval()</code>, but rather a string, which typically
represents an expression or statement. The expression/statement represented by the string is executed.
</p>
<p>
In fact, if you do not pass a string to <code>eval()</code>, the argument is returned unchanged.
</p>
<p>
Worst of all, W3Schools irresponsibility fails to educate users on why <code>eval()</code> is a <a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/eval#section_5">dangerous function to use</a>
and is inappropriate for most use cases. Nor is there any mention of safer alternatives.
</p>
</li>
<li id="js_statements">
<a href="#js_statements" class="wrap">#</a>
<a href="http://www.w3schools.com/JS/js_statements.asp" rel="nofollow" class="w3s-link">www.w3schools.com/JS/js_statements.asp</a>.
<blockquote>
JavaScript code (or just JavaScript) is a sequence of JavaScript statements.
</blockquote>
<p>
Apparently <em>declarations</em> and <em>expressions</em> can go right to hell (since JavaScript only is a sequence of statements).
</p>
<blockquote>
Each statement is executed by the browser in the sequence they are written.
</blockquote>
<p>
This is not exactly true, either, as JavaScript
<a href="https://developer.mozilla.org/en/JavaScript/Reference/Scope_Cheatsheet#Hoisting" rel="external">hoists</a>
variable and function declarations, meaning that those declarations are not defined in sequence.
</p>
<blockquote>
JavaScript Blocks
</blockquote>
<p>
This section mentions nothing about JavaScript not having block scope even though its block
syntax suggests that it does.
</p>
<blockquote>
The example above is not very useful.
</blockquote>
<p>lol whut?!</p>
</li>
<li id="tryjquery_ajax2">
<a href="#tryjquery_ajax2" class="wrap">#</a>
<a href="http://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_ajax2" rel="nofollow" class="w3s-link">www.w3schools.com/jquery/tryit.asp?filename=tryjquery_ajax2</a>.
<blockquote><code>async: false</code></blockquote>
<p>
The first "A" in AJAX stands for "asynchronous" (or non-blocking). Promoting setting the <code>async</code> property to false
when calling jQuery's <code><a href="http://api.jquery.com/jQuery.ajax/" rel="external">ajax</a></code> method
without any context in an example that is likely to be copy/pasta'd around the net is grossly irresponsible.
</p>
</li>
<li id="js_functions">
<a href="#js_functions" class="wrap">#</a>
<a href="http://www.w3schools.com/js/js_functions.asp" rel="nofollow" class="w3s-link">www.w3schools.com/js/js_functions.asp</a>.
<blockquote>
If you declare a variable within a function, the variable can only be accessed within that function. When you exit the
function, the variable is destroyed.
</blockquote>
<p>
The whole concept of closures doesn't exist at W3Schools… Also, they never go over the difference between a function
declaration and a function expression. I know this is for beginners, but they could at least put it in the advanced section, or make
it apparent that functions are first-class?
</p>
</li>
<li id="js_objects">
<a href="#js_objects" class="wrap">#</a>
<a href="http://www.w3schools.com/js/js_objects.asp" rel="nofollow" class="w3s-link">www.w3schools.com/js/js_objects.asp</a>.
<blockquote><code>personObj=new Object();</code></blockquote>
<p>
This is a bad and unnecessary use of the <code>new</code> keyword. They should be using and
advocating the object literal syntax (<code>{}</code>) for creating new objects.
</p>
<blockquote>Create a template of an object. The template defines the structure of an object.</blockquote>
<p>
This is the wrong name for an object constructor. They also don't explain that calling the
constructor using <code>new</code> will return a new object.
</p>
</li>
<li id="js_obj_boolean">
<a href="#js_obj_boolean" class="wrap">#</a>
<a href="http://www.w3schools.com/js/js_obj_boolean.asp" rel="nofollow" class="w3s-link">www.w3schools.com/js/js_obj_boolean.asp</a>.
<blockquote><code>var myBoolean=new Boolean();</code></blockquote>
<p>
This code is completely useless. It is slower, larger, and causes all sorts of problems compared
to straight-up <code>true</code> and <code>false</code>. If you use
<code>new <a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Boolean" rel="external">Boolean</a>()</code>,
<code><a href="https://developer.mozilla.org/en/JavaScript/Reference/Operators/Special/typeof" rel="external">typeof</a></code> will
return "object" instead of "boolean", and strict equality operators will fail.
</p>
<blockquote><pre><code>var myBoolean=new Boolean();
var myBoolean=new Boolean(0);
var myBoolean=new Boolean(null);
var myBoolean=new Boolean("");
var myBoolean=new Boolean(false);
var myBoolean=new Boolean(NaN);</code></pre></blockquote>
<p>
You can coerce any value to a boolean by using a double-unary operator (e.g. <code>!!null</code>,
<code>!!0</code>, etc.). It's shorter, and it gives you a proper primitive instead of a boxed
Boolean object (which, as mentioned above, will not act like you expect).
</p>
</li>
<li id="js_loop_for">
<a href="#js_loop_for" class="wrap">#</a>
<a href="http://www.w3schools.com/js/js_loop_for.asp" rel="nofollow" class="w3s-link">www.w3schools.com/js/js_loop_for.asp</a>.
<blockquote>
for (var=startvalue;var<=endvalue;var=var+increment)
</blockquote>
<p>
Not only do they forget about using the <code><a href="https://developer.mozilla.org/en/JavaScript/Reference/Statements/var" rel="external">var</a></code>
keyword to prevent the variable from leaking to the global scope, but you can't even use
<code><a href="https://developer.mozilla.org/en/JavaScript/Reference/Statements/var" rel="external">var</a></code> as a variable name—it is
a reserved word, and this code will generate a SyntaxError.
</p>
</li>
<li id="js_summary">
<a href="#js_summary" class="wrap">#</a>
<a href="http://www.w3schools.com/js/js_summary.asp" rel="nofollow" class="w3s-link">www.w3schools.com/js/js_summary.asp</a>.
<blockquote>
Now You Know JavaScript, What's Next? […] If you want to learn about server-side scripting, the
next step is to learn ASP or PHP.
</blockquote>
<p>
ASP Classic was discontinued in 2000 and replaced with C#/ASP.NET. Recommending people learn an
outdated language is <em>not</em> a good next step.
</p>
</li>
<li id="js_loop_for_in">
<a href="#js_loop_for_in" class="wrap">#</a>
<a href="http://www.w3schools.com/js/js_loop_for_in.asp" rel="nofollow" class="w3s-link">www.w3schools.com/js/js_loop_for_in.asp</a>.
<blockquote>Use the for...in statement to loop through an array:</blockquote>
<p>
This is wrong. You should never use for..in to loop through an array, since it will enumerate
any properties or methods that are attached to Array.prototype (or the Array object itself).
</p>
<p>
This page also completely fails to mention the use of
<code><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object/hasOwnProperty" rel="external">Object.prototype.hasOwnProperty</a>()</code>
to avoid enumerating properties set on the object’s prototype.
</p>
<blockquote>
The variable argument can be a named variable, an array element, or a property of an object.
</blockquote>
<p>
Why would you ever do this? Why would you even say it is possible?
</p>
</li>
<li id="js_whereto">
<a href="#js_whereto" class="wrap">#</a>
<a href="http://www.w3schools.com/js/js_whereto.asp" rel="nofollow" class="w3s-link">www.w3schools.com/js/js_whereto.asp</a>.
<blockquote>
Scripts in <code><head></code>
</blockquote>
<p>
In older browsers, placing scripts in the <code><head></code> has a negative impact on page performance. Until the script
is done loading, resources below the script are blocked from downloading, and elements below the