<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>JavaScript Workshop &#187; HTML</title>
	<atom:link href="http://www.javascriptworkshop.com/category/html/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.javascriptworkshop.com</link>
	<description>Helping others learn JavaScript and web development in general.</description>
	<lastBuildDate>Tue, 06 Sep 2011 11:10:27 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=</generator>
		<item>
		<title>The Ultimate HTML Reference Book</title>
		<link>http://www.javascriptworkshop.com/2008/01/05/the-ultimate-html-reference-book/</link>
		<comments>http://www.javascriptworkshop.com/2008/01/05/the-ultimate-html-reference-book/#comments</comments>
		<pubDate>Sun, 06 Jan 2008 02:09:10 +0000</pubDate>
		<dc:creator>Frank Stepanski</dc:creator>
				<category><![CDATA[HTML]]></category>

		<guid isPermaLink="false">http://www.javascriptworkshop.com/?p=238</guid>
		<description><![CDATA[Sitepoint came out with a great reference book (.pdf) on everything you would ever need to know about HTML. A great read.]]></description>
			<content:encoded><![CDATA[<p>Sitepoint came out with a great <a class="externalLink" href = "http://www.javascriptworkshop.com/wp-content/uploads/pdf/TheUltimateHTMLReference.pdf">reference book</a> (.pdf) on everything you would ever need to know about HTML.  A great read.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.javascriptworkshop.com/2008/01/05/the-ultimate-html-reference-book/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Wanted Dead: Bad Tags</title>
		<link>http://www.javascriptworkshop.com/2007/06/08/wanted-dead-bad-tags/</link>
		<comments>http://www.javascriptworkshop.com/2007/06/08/wanted-dead-bad-tags/#comments</comments>
		<pubDate>Fri, 08 Jun 2007 23:56:34 +0000</pubDate>
		<dc:creator>Frank Stepanski</dc:creator>
				<category><![CDATA[HTML]]></category>
		<category><![CDATA[Presentational Markup]]></category>
		<category><![CDATA[XHTML]]></category>

		<guid isPermaLink="false">http://www.javascriptworkshop.com/?p=185</guid>
		<description><![CDATA[Bad tags usually come down to tags that are presentational, which is the realm of CSS, or simply not valid, leading to unreliable code that can’t be guaranteed to work on different or future browsers. Applet &#8212; Embed a Java applet. Not valid. Use object tag. b &#8212; Bold. A valid tag, but purely presentational. [...]]]></description>
			<content:encoded><![CDATA[<p>Bad tags usually come down to tags that are presentational, which is the realm of CSS, or simply not valid, leading to unreliable code that can’t be guaranteed to work on different or future browsers.  </p>
<p><span id="more-185"></span></p>
<ul>
<li> <strong>Applet</strong> &#8212; Embed a Java applet. Not valid.  Use object tag.</li>
<li> <strong>b</strong> &#8212; Bold. A valid tag, but purely presentational.  Use CSS font-weight for bold or HTML em or strong for emphasis.</li>
<li> <strong>big</strong> &#8212; Big text. A valid tag, but purely presentational.  Use CSS font-size.</li>
<li> <strong>blink</strong> &#8212; Blinking text. Not valid. Use JavaScript or CSS text-decoration: blink if you really insist on inflicting this.</li>
<li> <strong>center</strong> &#8212; Center.  Not valid.  Use CSS margin: 0 auto or text-align: center.</li>
<li> <strong>font</strong> &#8212; Font name and size.  Not valid. Use CSS font, font-family, and font-size.</li>
<li> <strong>hr</strong> &#8212; Horizontal rule.  A valid tag, but presentational.  Perhaps the most controversial of these Bad Tags, many argue that this has a genuine role as a divider of content.  As it belongs to the XHTML Presentational Module and as its name implies, however to truly separate structure and presentation, hr should be avoided.  CSS borders can replicate hortizonal rules, as can background images.</li>
<li> <strong>i</strong> &#8212; Italic.  A valid tag, but truly presentational.  Use CSS font-size for italics or HTML em or strong for emphasis.</li>
<li> <strong>marquee</strong> &#8212;  Scrolling text.  Not valid.  Use JavaScript, Flash or other plugin.</li>
<li> <strong>small</strong> &#8212; Small text.  A valid tag, but purely presentational. Use CSS font-size.</li>
<li> <strong>sub</strong> &#8212; Superscript.  A valid tag, but purely presentational.  Use CSS vertical-align or position.</li>
<li> <strong>sup</strong> – Superscript.  A valid tag, but purely presentation.  Use CSS vertical-align or position.
<li> <strong>u</strong> &#8212; Underline. Not valid. Use CSS text-decoration.</li>
<li> <strong>align</strong> &#8212; Aligns content.  As with center tag, CSS text-align should be used.</li>
<li> <strong>background</strong> &#8212;  Background image.  Not valid. Use CSS background-image.</li>
<li> <strong>target</strong> &#8212; Specifies where a link should open (such as in a new window). Not valid.  JavaScript is a possible alternative, but the use of this should be questioned due to the adverse effect it has on usability and accessibility.</li>
<li> <strong>link, alink and vlink</strong> &#8212; Non-visited, active and visited link colors.  Not valid. Use CSS :link, :active and :visited pseudo-classes.</li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://www.javascriptworkshop.com/2007/06/08/wanted-dead-bad-tags/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>CDATA?</title>
		<link>http://www.javascriptworkshop.com/2007/02/11/cdata/</link>
		<comments>http://www.javascriptworkshop.com/2007/02/11/cdata/#comments</comments>
		<pubDate>Sun, 11 Feb 2007 21:57:42 +0000</pubDate>
		<dc:creator>Frank Stepanski</dc:creator>
				<category><![CDATA[HTML]]></category>
		<category><![CDATA[CDATA]]></category>
		<category><![CDATA[JavaScript topics]]></category>
		<category><![CDATA[Presentational Markup]]></category>
		<category><![CDATA[XHTML]]></category>

		<guid isPermaLink="false">http://www.javascriptworkshop.com/?p=153</guid>
		<description><![CDATA[With HTML pages on the web you can just include the required Javascript between tags. When you validate the HTML on your web page the Javascript content is considered to be CDATA (character data) that is therefore ignored by the validator. The same is not true if you follow the more recent XHTML standards in [...]]]></description>
			<content:encoded><![CDATA[<p>With HTML pages on the web you can just include the required Javascript between <script> and </script> tags. When you validate the HTML on your web page the Javascript content is considered to be <a class = "externalLink" href = "http://en.wikipedia.org/wiki/CDATA">CDATA</a> (character data) that is therefore ignored by the <a class = "externalLink" href = "http://validator.w3.org/">validator</a>. The same is not true if you follow the more recent XHTML standards in setting up your web page. With XHTML the code between the script tags is considered to be PCDATA (parsed character data) which is therefore processed by the validator. </p>
<p>Because of this, you can&#8217;t just include Javascript between the script tags on your page without &#8216;breaking&#8217; your web page (at least as far as the validator is concerned). </p>
<p><span id="more-153"></span></p>
<p>To fix this problem we can do one of two things. The simplest way, particularly if the Javascript contains more than just one or two lines, is to make the Javascript external to the page resulting in their being nothing between the script tags to stop the page validating. </p>
<p>If it is just one or two lines then it is probably not worth making an external script so you will want to leave the content between the script tags and tell the validator that this is to be ignored. We do this by placing the Javascript code within a CDATA tag like this:</p>

<div class="wp_syntax"><div class="code"><pre class="html4strict" style="font-family:monospace;"><span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">script</span> <span style="color: #000066;">type</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;text/javascript&quot;</span>&gt;</span>
<span style="color: #009900;">&lt;!<span style="color: #66cc66;">&#91;</span>CDATA<span style="color: #66cc66;">&#91;</span></span>
<span style="color: #009900;"><span style="color: #66cc66;">//</span> <span style="color: #000066;">content</span> of your Javascript goes here</span>
<span style="color: #009900;"><span style="color: #66cc66;">&#93;</span><span style="color: #66cc66;">&#93;</span>&gt;</span>
<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">script</span>&gt;</span></pre></div></div>

<p>This fixes the validator. The problem is that some older web browsers don&#8217;t understand the CDATA tag and so this breaks your Javascript in those web browsers. Fortunately, Javascript multi-line comments start and finish with characters that do not cause validation errors. We can therefore comment out the CDATA tag in so far as the Javascript processors within the web browsers are concerned while still leaving the Javascript content defined as CDATA as far as the validator is concerned. We do it like this:</p>

<div class="wp_syntax"><div class="code"><pre class="html4strict" style="font-family:monospace;"><span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">script</span> <span style="color: #000066;">type</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;text/javascript&quot;</span>&gt;</span>
/* <span style="color: #009900;">&lt;!<span style="color: #66cc66;">&#91;</span>CDATA<span style="color: #66cc66;">&#91;</span> *<span style="color: #66cc66;">/</span></span>
<span style="color: #009900;"><span style="color: #66cc66;">//</span> <span style="color: #000066;">content</span> of your Javascript goes here</span>
<span style="color: #009900;"><span style="color: #66cc66;">/</span>* <span style="color: #66cc66;">&#93;</span><span style="color: #66cc66;">&#93;</span>&gt;</span> */
<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">script</span>&gt;</span></pre></div></div>

<p>Now our Javascript code is handled correctly both by newer browsers and validators that actually understand the XHTML DTD as well as by older web browsers that don&#8217;t understand XHTML and interpret everything on the page as HTML. </p>
]]></content:encoded>
			<wfw:commentRss>http://www.javascriptworkshop.com/2007/02/11/cdata/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

