<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" media="screen" href="/~d/styles/rss2enclosuresfull.xsl"?><?xml-stylesheet type="text/css" media="screen" href="http://feeds.feedburner.com/~d/styles/itemcontent.css"?><rss 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/" xmlns:media="http://search.yahoo.com/mrss/" xmlns:itunes="http://www.itunes.com/dtds/podcast-1.0.dtd" version="2.0">

<channel>
	<title>WordPress Basics</title>
	
	<link>http://basics.4design.tl</link>
	<description>A Hard Rock-solid Theme based on HTML5 Boilerplate «For Those About to Rock» with WordPress</description>
	<lastBuildDate>Fri, 18 May 2012 17:31:01 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.2</generator>
		<atom10:link xmlns:atom10="http://www.w3.org/2005/Atom" rel="self" type="application/rss+xml" href="http://feeds.feedburner.com/wordpress/basics" /><feedburner:info xmlns:feedburner="http://rssnamespace.org/feedburner/ext/1.0" uri="wordpress/basics" /><atom10:link xmlns:atom10="http://www.w3.org/2005/Atom" rel="hub" href="http://pubsubhubbub.appspot.com/" /><itunes:explicit>no</itunes:explicit><itunes:subtitle>A Hard Rock-solid Theme based on HTML5 Boilerplate «For Those About to Rock» with WordPress</itunes:subtitle><item>
		<title>WordPress Basics version 0.3.1</title>
		<link>http://basics.4design.tl/wordpress-basics-version-0-3-1</link>
		<comments>http://basics.4design.tl/wordpress-basics-version-0-3-1#comments</comments>
		<pubDate>Sat, 10 Mar 2012 19:16:58 +0000</pubDate>
		<dc:creator>Bruno Bichet</dc:creator>
				<category><![CDATA[News]]></category>
		<category><![CDATA[.htaccess]]></category>
		<category><![CDATA[HTML5 Boilerplate]]></category>

		<guid isPermaLink="false">http://basics.4design.tl/?p=568</guid>
		<description><![CDATA[Due to minor changes, Both Basics and Beyond Basics comes in version 0.3.1 a few time after the version 0.3 which aims to match the HTML5 Boilerplate 3.0 updates. The Changelogs Basics 0.3.1 &#8211; 10/03/2012 Remove robots.txt and .htaccess Change version number [style.css], [header.php] Beyond Basics 0.3.1  &#8211; 10/03/2012 Change the category &#8230; <a href="http://basics.4design.tl/wordpress-basics-version-0-3-1" rel="nofollow">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>Due to minor changes, Both Basics and Beyond Basics comes in version 0.3.1 a few time after the <a href="http://basics.4design.tl/wordpress-basics-version-0-3">version 0.3</a> which aims to match the HTML5 Boilerplate 3.0 updates.<span id="more-568"></span></p>
<h1>The Changelogs</h1>
<p><em><strong>Basics 0.3.1</strong> &#8211; 10/03/2012</em></p>
<ol>
<li>Remove robots.txt and .htaccess</li>
<li>Change version number<strong> [style.css]</strong>, <strong>[header.php]</strong></li>
</ol>
<p><em><strong>Beyond Basics</strong> 0.3.1  &#8211; 10/03/2012</em></p>
<ol>
<li>Change the category name by the category ID to display the post filed under the &#8220;Uncategorized category&#8221; instead of displaying the &#8220;news&#8221; category <strong>[home.php]</strong>.</li>
</ol>
<p>→ Give a try to WordPress Basics and its Child theme Beyond Basics via <a title="Download Basics &amp; Beyond Basics" href="http://basics.4design.tl/download-basics">the download page</a>.</p>

<p><a href="http://feedads.g.doubleclick.net/~a/bNOU8rSWYlXdifbodQZ03gbQd7s/0/da"><img src="http://feedads.g.doubleclick.net/~a/bNOU8rSWYlXdifbodQZ03gbQd7s/0/di" border="0" ismap="true"></img></a><br/>
<a href="http://feedads.g.doubleclick.net/~a/bNOU8rSWYlXdifbodQZ03gbQd7s/1/da"><img src="http://feedads.g.doubleclick.net/~a/bNOU8rSWYlXdifbodQZ03gbQd7s/1/di" border="0" ismap="true"></img></a></p>]]></content:encoded>
			<wfw:commentRss>http://basics.4design.tl/wordpress-basics-version-0-3-1/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>WordPress Basics Version 0.3</title>
		<link>http://basics.4design.tl/wordpress-basics-version-0-3</link>
		<comments>http://basics.4design.tl/wordpress-basics-version-0-3#comments</comments>
		<pubDate>Fri, 09 Mar 2012 13:11:33 +0000</pubDate>
		<dc:creator>Bruno Bichet</dc:creator>
				<category><![CDATA[News]]></category>
		<category><![CDATA[HTML5 Boilerplate]]></category>
		<category><![CDATA[normalize]]></category>
		<category><![CDATA[update]]></category>

		<guid isPermaLink="false">http://wp4design.com/?p=308</guid>
		<description><![CDATA[According to Bon Scott, It’s a long way to the top if you wanna  Rock &#38; Roll! It’s about the same if you want to make a blank theme which follows the evolution of good practices. For this version 0.3, I have made some changes according to the new version of HTML5 &#8230; <a href="http://basics.4design.tl/wordpress-basics-version-0-3" rel="nofollow">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>According to Bon Scott, <em>It’s a long way to the top if you wanna  Rock &amp; Roll!</em> It’s about the same if you want to make a blank theme which follows the evolution of good practices. For this version 0.3, I have made some changes according to the new version of HTML5 Boilerplate which is arrived to the version 3.0.<span id="more-308"></span></p>
<p>The changelog is written in the order of the corrections, deletes or addings. Nonetheless, for a better reading I have sorted here the modifications :</p>
<h1>WordPress Basics</h1>
<h2>HTML5 Boilerplate</h2>
<ol>
<li>Update <strong>[css/normalize.css]</strong> <strong>[css/tool.css]</strong> and <strong>[css/author.css]</strong> from new version of HTML5 Boilerplate</li>
<li>Update jQuery version to 1.7.1 in basics_scripts() function <strong>[inc/functions-filter-action.php]</strong> and <strong>/js/libs/</strong></li>
<li><strong></strong>Update Modernizr 2.5.3 <strong>[header.php]</strong> and <strong>/js/libs/</strong></li>
<li><strong></strong>Remove &#8220;defer&#8221; property to script in basics_scripts() function <strong>[inc/functions-filter-action.php]</strong></li>
<li>Add <strong>lt-iex</strong> classes to html tag</li>
<li>Add ChromeFrame call within body tag <strong>[header.php]</strong></li>
<li>Add localization for ChromeFrame call <strong>[header.php]</strong></li>
<li>Change <strong>meta name=&#8221;viewport&#8221;</strong> <strong>[header.php]</strong></li>
<li>Update plugins.js and script.js <strong>/js/</strong></li>
<li>Add robots.txt for reminder purpose</li>
<li>Add .htaccess (from HTML5 Boilerplate) for reminder purpose</li>
</ol>
<h2>Others:</h2>
<ol>
<li>Add tab indentations <strong>[header.php]</strong></li>
<li>Tweak some comments <strong>[style.css]</strong></li>
<li>Change version number for stylesheet call : <em>?v=0.3&#8243;</em><strong>[header.php]</strong></li>
<li>Remove Chrome Frame call and DD<em>belatedPNG.js in basics</em> scripts() function <strong>[inc/functions-filter-action.php]</strong></li>
<li>Remove DD<em>belatedPNG in basics</em>scripts() function <strong>[inc/functions-filter-action.php]</strong></li>
<li>Remove DD_belatedPNG.js in <strong>/js/libs/</strong></li>
<li>Correct author URI <strong>[style.css]</strong>, <strong>[css/grid.css]</strong>, <strong>[HUMANS.txt]</strong>, <strong>[markup.css]</strong></li>
<li>Remove empty lines <strong>[footer.php]</strong></li>
<li>Turn wp4design into basics.4design <strong>[footer.php]</strong></li>
</ol>
<h1>Beyond Basics</h1>
<ol>
<li>Add styles for /* google search */ from HTML5 Boilerplate <strong>[404.php]</strong></li>
<li>Add font-size: 0.8em <strong>[css/author.css]</strong></li>
<li>Turn wp4design into basics.4design <strong>[style.css]</strong></li>
</ol>
<p>→ Give a try to WordPress Basics and its Child theme Beyond Basics via <a title="Download Basics &amp; Beyond Basics" href="http://basics.4design.tl/download-basics">the download page</a>.</p>

<p><a href="http://feedads.g.doubleclick.net/~a/YPvGdqGvtjGWcrhEZo4pLcwdh4s/0/da"><img src="http://feedads.g.doubleclick.net/~a/YPvGdqGvtjGWcrhEZo4pLcwdh4s/0/di" border="0" ismap="true"></img></a><br/>
<a href="http://feedads.g.doubleclick.net/~a/YPvGdqGvtjGWcrhEZo4pLcwdh4s/1/da"><img src="http://feedads.g.doubleclick.net/~a/YPvGdqGvtjGWcrhEZo4pLcwdh4s/1/di" border="0" ismap="true"></img></a></p>]]></content:encoded>
			<wfw:commentRss>http://basics.4design.tl/wordpress-basics-version-0-3/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Basics 0.2.8.2 and Beyond Basics 0.2.3 are waiting for you</title>
		<link>http://basics.4design.tl/basics-0-2-8-2-and-beyond-basics-0-2-3-are-waiting-for-you</link>
		<comments>http://basics.4design.tl/basics-0-2-8-2-and-beyond-basics-0-2-3-are-waiting-for-you#comments</comments>
		<pubDate>Mon, 10 Oct 2011 13:33:01 +0000</pubDate>
		<dc:creator>Bruno Bichet</dc:creator>
				<category><![CDATA[News]]></category>
		<category><![CDATA[Internet Explorer]]></category>

		<guid isPermaLink="false">http://wp4design.com/?p=515</guid>
		<description><![CDATA[The theme Basics 0.2.8.2, followed by its child theme Beyond Basics 0.2.3 are now issued. Some minor changes for the main theme, among which: some CSS classes for text alignment and indentations reviewed for legibility purposes. The child theme comes with more improvements: adding some HTML tags for wrapping purposes, fixing collapsing menus &#8230; <a href="http://basics.4design.tl/basics-0-2-8-2-and-beyond-basics-0-2-3-are-waiting-for-you" rel="nofollow">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>The theme Basics 0.2.8.2, followed by its child theme Beyond Basics 0.2.3 are now issued. Some minor changes for the main theme, among which: some CSS classes for text alignment and indentations reviewed for legibility purposes. The child theme comes with more improvements: adding some HTML tags for wrapping purposes, fixing collapsing menus in old versions of Internet Explorer.<span id="more-515"></span></p>
<h1>Changelogs</h1>
<h2>Basics 0.2.8.2</h2>
<ol>
<li>Change version number for stylesheet call : *?v=0.2.9&#8243;* **[header.php]**</li>
<li>Add *.left*, *.right*, *.center* and *.justify* with *text-align: xxx* property for text/img alignment **[markup.css]**</li>
<li>Change indentations and some comments **[markup.css]**</li>
</ol>
<h2>Beyond Basics 0.2.3</h2>
<ol>
<li>Add &amp;lt;aside&amp;gt;&#8217;s *#sidebar-0* and *#sidebar-4* to wrap two &amp;lt;section&amp;gt;&#8217;s in **[sidebar.php]**, **[home.php]**</li>
<li>Change .sidebars to .sidebar in *#sidebar-0* and *#sidebar-4* **[sidebar.php]**</li>
<li>Fix some CSS to match with 1. et 2. above **[author.css]**</li>
<li>Fix collapsing top menu *#widget-area-1* for old IE&#8217;s (.oldie) **[author.css]**</li>
</ol>

<p><a href="http://feedads.g.doubleclick.net/~a/a-gaUr_bi4msqRlEpg5XSfx9PHQ/0/da"><img src="http://feedads.g.doubleclick.net/~a/a-gaUr_bi4msqRlEpg5XSfx9PHQ/0/di" border="0" ismap="true"></img></a><br/>
<a href="http://feedads.g.doubleclick.net/~a/a-gaUr_bi4msqRlEpg5XSfx9PHQ/1/da"><img src="http://feedads.g.doubleclick.net/~a/a-gaUr_bi4msqRlEpg5XSfx9PHQ/1/di" border="0" ismap="true"></img></a></p>]]></content:encoded>
			<wfw:commentRss>http://basics.4design.tl/basics-0-2-8-2-and-beyond-basics-0-2-3-are-waiting-for-you/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Basics 0.2.8 and its Child theme Beyond Basics 0.2.1</title>
		<link>http://basics.4design.tl/theme-basics-0-2-8-and-child-theme-beyond-basics-0-2-1</link>
		<comments>http://basics.4design.tl/theme-basics-0-2-8-and-child-theme-beyond-basics-0-2-1#comments</comments>
		<pubDate>Sun, 25 Sep 2011 14:16:15 +0000</pubDate>
		<dc:creator>Bruno Bichet</dc:creator>
				<category><![CDATA[News]]></category>
		<category><![CDATA[Child Theme]]></category>
		<category><![CDATA[get_sidebar()]]></category>
		<category><![CDATA[Parent Theme]]></category>
		<category><![CDATA[Sidebar]]></category>
		<category><![CDATA[XHTML5]]></category>
		<category><![CDATA[XML]]></category>

		<guid isPermaLink="false">http://wp4design.com/?p=502</guid>
		<description><![CDATA[From the beginnings, Basics is build to be used with a Child theme. Since the former version, Basics comes with Beyond Basics. After some tests, I planned many enhancements in order to make the Parent theme and the Child theme more complementary. Globally, I decreased the number of files included in Basics &#8230; <a href="http://basics.4design.tl/theme-basics-0-2-8-and-child-theme-beyond-basics-0-2-1" rel="nofollow">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>From the beginnings, Basics is build to be used with a Child theme. Since the <a href="http://wp4design.com/wordpress-basics-0-2-7-ch-ch-ch-ch-changes">former version</a>, Basics comes with Beyond Basics. After some tests, I planned many enhancements in order to make the Parent theme and the Child theme more complementary. Globally, I decreased the number of files included in Basics by moving some specific files to Beyond Basics.<span id="more-502"></span></p>
<h2>In short:</h2>
<ul>
<li>Optimize the way the sidebars are loaded,</li>
<li>Turn searchform.php into a PHP function by filtering the original hook,</li>
<li>Close the self-closing HTML tags with a slash to be more consistent with the XHTML5 way (in order to make Basics and Beyond Basics parsable with XML tools),</li>
<li>Improve the author.css of Beyond Basics.</li>
</ul>
<div>
<h1>Basics changelogs</h1>
<p><em>Last modified on 25/09/2011 &#8211; 15:00 by Bruno Bichet</em></p>
<p>For Those About to Rock&#8230; Fire!</p>
<h2>Release 0.2.8 &#8211; 25/09/2011 &#8211; 15:00</h2>
<ol>
<li>Add <em>margin-top: 0</em> to <em>li ul, li ol</em> css rule to avoid gap <strong>[markup.css]</strong></li>
<li>Add <em>.visuallyhidden</em> class on &lt;h1&gt; in <em>basics_content_nav()</em> <strong>[inc/functions-display.php]</strong></li>
<li>Add <em>posts_link_rel_next()</em> and <em>posts_link_rel_prev()</em> functions to print a rel &#8220;next&#8221; or &#8220;prev&#8221; microformats attributes on navivagation links between posts (maybe redondant with the meta link rel prev/next/start in head)</li>
<li>Close &lt;input&gt; tags with /&gt; for XML parsing purpose, just in case&#8230; <strong>[functions-comments.php]</strong>, <strong>[searchform.php]</strong></li>
<li>Close &lt;img&gt; tags with /&gt; for XML parsing purpose, just in case&#8230; <strong>[content.php]</strong>, <strong>[functions-display.php]</strong></li>
<li>Close &lt;meta&gt; and &lt;link&gt; tags with /&gt; for XML parsing purpose, just in case&#8230; <strong>[header.php]</strong>, <strong>[functions-display.php]</strong></li>
<li>Rewrite with uppercase to follow the WHATWG style (and maybe more compatibility with XML parsers or whatever)</li>
<li>Move &lt;a&gt; into &lt;h1&gt; in &lt;hgroup&gt; to validate: No &lt;a&gt; tag allowed in &lt;hgroup&gt; <strong>[header.php]</strong></li>
<li>Add <em>.section-title</em> class to h1 in main menu</li>
<li>Add remove<em>more</em>jump_link() to remove link Jumps to the More tag <strong>[inc/functions-filter-action.php]</strong></li>
<li>Move <em>sidebar-1.php</em>, <em>sidebar-2.php</em> and <em>sidebar-3.php</em> to Child theme Beyond Basics</li>
<li>Create <em>sidebar.php</em> with formerly <em>sidebar-1.php</em> content</li>
<li>Add to&#8230; get sidebars <img src='http://basics.4design.tl/wp-includes/images/smilies/icon_wink.gif' alt=';-)' class='wp-smiley' />  <strong>[index.php]</strong>, <strong>[search.php]</strong></li>
<li>Add <em>basics_searchform()</em> to turn <em>searchform.php</em> into function <strong>[inc/functions-filter-action.php]</strong></li>
<li>Replace <em>get_search_form()</em> calls by <em>basics_searchform()</em></li>
<li>Shorten some comments <strong>[inc/functions-setup.php]</strong></li>
<li>Change relative paths to load jQuery and other script: from Child theme to Parent theme.</li>
</ol>
<h1>Beyond Basics changelogs (Child Theme of WordPress Basics)</h1>
<p><em>Last modified on 25/09/2011 &#8211; 14:30 by Bruno Bichet</em></p>
<p>For Those About to Rock&#8230; Fire!</p>
<h2>Release 0.2 &#8211; 25/09/2011 &#8211; 14:30</h2>
<ol>
<li>Fix path to <em>grid.css</em> from Basics and some minor changes in comments <strong>[style.css]</strong></li>
<li>Change <em>author.css</em> to match with the move of &lt;a&gt; into &lt;h1&gt; in &lt;hgroup&gt; (cf. CHANGELOG.txt in Basics folder) <strong>[css/author.css]</strong></li>
<li>Add <em>visuallyhidden</em> rules in <em>css/author.css</em> for &lt;p;h1&gt; in <em>menu</em> class and #colophon <strong>[css/author.css]</strong></li>
<li>Add <em>.focusable</em> classe on <em>skip-link</em> link <strong>[css/author.css]</strong></li>
<li>Add <em>function basics_link_cat()</em> function to display a link to read all posts from the &#8220;uncategorized&#8221; category on home <strong>[functions.php]</strong></li>
<li>Add <em>basics_link_cat()</em> function <strong>[home.php]</strong> (see point n°5 for details).</li>
<li>Add <em>sidebar-1.php</em>, <em>sidebar-2.php</em> and <em>sidebar-3.php</em> from Parent theme Basics</li>
<li>Add <em>index.php</em> from Parent theme Basics to bypass the <em>get_sidebar()</em> for customization purposes</li>
<li>Copy <em>/js</em> folder from Basics</li>
<li>Change root directory for <em>/js</em> folder to accord the path whith the Child theme if exists</li>
<li>Turn some &lt;div&gt; into &lt;section&gt; for consistency accross files in the theme <strong>[404.php]</strong>, <strong>[home.php]</strong>, <strong>[sidebar.php]</strong></li>
<li>Delete <em>/js</em> folder from Beyond Basics.</li>
<li>Delete <em>basics_scripts()</em> function <strong>[functions.php]</strong></li>
</ol>
<p>→ Download <a title="Download Basics and Beyond Basics" href="http://wp4design.com/download-basics">Basics and Beyond Basics</a>.</p>
</div>
<p>From the beginnings, Basics is build to be used with a Child theme. Since the former version, Basics comes with Beyond Basics. After some tests, I planned many enhancements in order to make the Parent theme and the Child theme more complementary. Globally, I decreased the number of files included in Basics by moving some specific files to Beyond Basics.</p>

<p><a href="http://feedads.g.doubleclick.net/~a/5luA-azS_sMZGg5W4PviItniU2o/0/da"><img src="http://feedads.g.doubleclick.net/~a/5luA-azS_sMZGg5W4PviItniU2o/0/di" border="0" ismap="true"></img></a><br/>
<a href="http://feedads.g.doubleclick.net/~a/5luA-azS_sMZGg5W4PviItniU2o/1/da"><img src="http://feedads.g.doubleclick.net/~a/5luA-azS_sMZGg5W4PviItniU2o/1/di" border="0" ismap="true"></img></a></p>]]></content:encoded>
			<wfw:commentRss>http://basics.4design.tl/theme-basics-0-2-8-and-child-theme-beyond-basics-0-2-1/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>WordPress Basics 0.2.7.1 — Ch-ch-ch-ch-Changes!</title>
		<link>http://basics.4design.tl/wordpress-basics-0-2-7-ch-ch-ch-ch-changes</link>
		<comments>http://basics.4design.tl/wordpress-basics-0-2-7-ch-ch-ch-ch-changes#comments</comments>
		<pubDate>Tue, 20 Sep 2011 00:28:56 +0000</pubDate>
		<dc:creator>Bruno Bichet</dc:creator>
				<category><![CDATA[News]]></category>
		<category><![CDATA[Basics]]></category>
		<category><![CDATA[Beyond Basics]]></category>
		<category><![CDATA[Child Theme]]></category>
		<category><![CDATA[functions]]></category>
		<category><![CDATA[Javascript]]></category>
		<category><![CDATA[jQuery]]></category>
		<category><![CDATA[Parent Theme]]></category>

		<guid isPermaLink="false">http://wp4design.com/?p=486</guid>
		<description><![CDATA[In this new version 0.2.7.1 of WordPress Basics, I&#8217;ve focused on optimizations and consistencies, starting with the functions.php file, that I decomposed in many specialized files, like functions-setup.php, functions-display.php, functions-filter-action.php and functions-comment.php, for now. I&#8217;ve change the way the logo is marked up in the header.php in a HTML5 way, putting into practice the advices of the &#8230; <a href="http://basics.4design.tl/wordpress-basics-0-2-7-ch-ch-ch-ch-changes" rel="nofollow">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>In this new version 0.2.7.1 of WordPress Basics, I&#8217;ve focused on optimizations and consistencies, starting with the <em>functions.php</em> file, that I decomposed in many specialized files, like <em>functions-setup.php</em>, <em>functions-display.php</em>, <em>functions-filter-action.php</em> and <em>functions-comment.php</em>, for now. I&#8217;ve change the way the logo is marked up in the <em>header.php</em> in a HTML5 way, putting into practice the advices of the article <a href="http://wp4design.com/html5-boilerplate-using-ir-class">Using .ir class and make the replaced image “clickable”</a>. <span id="more-486"></span></p>
<p>I have worked to <strong>make Basics more flexible</strong> by turning some hard coding into functions to make customizations more easier, especially concerning Javascript libraries and other scripts authors may want to add to fit their personnal needs. By the way, I have moved a lot of files to a brand <strong>new Child theme named Beyond Basics</strong>. The Parent theme <strong>Basics gains in simplicity!</strong></p>
<p>PS: Don&#8217;t be afraid: minus the mark up for the logo and some removals like <em>.ir</em> or <em>.visuallyhidden</em> classes, the skeleton is still the same for now.</p>
<h1>Basics changelogs</h1>
<p><em>Last modified on 20/09/2011 &#8211; 00:37 by Bruno Bichet</em></p>
<p>For Those About to Rock&#8230; Fire!</p>
<h2>Release 0.2.7.1 &#8211; 20/09/2011 &#8211; 00:37</h2>
<ol>
<li>Change version number for stylesheet call : <em>?v=0.2.7.1&#8243;</em> [header.php]</li>
<li>Edit paths to URL of favicons in <em>basics_favicon()</em> to make it work <strong>[inc/functions-display.php]</strong></li>
<li>Rename basics<em>favicon() to basics</em>favicons() <strong>[inc/functions-display.php]</strong>, <strong>[header.php]</strong></li>
<li>Move <strong>[404.php]</strong> to Child Theme <em>Beyond Basics</em></li>
<li>Change case to some .txt files : CHANGELOG.txt HUMANS.txt, README.txt, LICENSE.txt</li>
<li>Make some cosmetic changes to HUMANS.txt</li>
<li>Add <em>basics_search_autofocus()</em> to print <em>autofocus</em> attribute to Search form when the user is in search context</li>
<li>Edit README.txt to reflect the changes brought by the Child Theme Beyond Basics</li>
</ol>
<h2>Release 0.2.7 &#8211; 19/09/2011</h2>
<ol>
<li>Minor changes in comments [style.css] <strong>[markup.css]</strong></li>
<li>Change hook (<em>widgets_init</em> instead of <em>init</em>) for registering <em>basics_widgets_init()</em> function <strong>[functions.php]</strong></li>
<li>Wrap some basics functions into <em>basics_setup()</em> triggered by <em>after_setup_theme hook</em> <strong>[functions.php]</strong></li>
<li>Remove one level of indentation after each <em>if ( ! function_exists():</em> <strong>[functions.php]</strong></li>
<li>Split [functions.php] file in several files sets in <em>/inc/</em> folder for easy maintenance and evolution</li>
<li>Add condition <em>is_404()</em> to <em>basics_description()</em> to avoid &#8220;Notice&#8221; when <em>$post</em> doesn&#8217;t exist (404 = no post)<strong>[inc/functions-display.php]</strong></li>
<li>Change function <em>the_widget( &#8216;WP_Widget_Archives&#8217;, &#8216;dropdown=1&amp;count=0&#8242;</em> to avoid Notice if <em>&amp;count=0</em> is missing <strong>[content-404.php]</strong></li>
<li>Add condition on function <em>basics_description()</em> when <em>$wp_query-&gt;found_posts</em> is empty (no result found)<strong>[inc/functions-display.php]</strong></li>
<li>Move <em>$content_width</em> into <em>basics_setup()</em> function <strong>[inc/functions-setup.php]</strong></li>
<li>Add link to comments and display number of comments to the function <em>basics_posted_in()</em> <strong>[inc/functions-display.php]</strong></li>
<li>Remove <em>div#logo</em> <strong>[header.php]</strong></li>
<li>Wrap &lt;h1&gt; in &lt;hgroup&gt; with <em>a#site-title</em> to replace <em>div#logo</em> <strong>[header.php]</strong></li>
<li>Change some CSS to match the two changes above <strong>[author.css]</strong></li>
<li>Update jQuery lib to version 1.6.4 <strong>[/js/libs/]</strong></li>
<li>Change paths to jQuery lib to reflect change above <strong>[footer.php]</strong></li>
<li>Empty <em>author.css</em> to keep the theme &#8220;blank&#8221; (author.css should be reused in a Child theme) and change comment in <strong>[style.css]</strong></li>
<li>Update <strong>readme.txt</strong> to reflect the changes.</li>
<li>Cosmetic changes in comments layout <strong>[style.css]</strong></li>
<li>Add <em>basics_favicon()</em> function to print links for favicons. Make the customization in a Child theme easier<strong>[functions-display.php]</strong>, <strong>[header.php]</strong></li>
<li>Remove indentation in tag <strong>[header.php]</strong></li>
<li>Remove final trailing slash in <em>link rel=&#8221;pingback&#8221;</em> tag <strong>[header.php]</strong></li>
<li>Remove tag <em>post-formats</em>, <em>featured-images</em> <strong>[style.css]</strong></li>
<li>Add <em>basics_jquery()</em> function to load jQuery properly with <em>wp_enqueue_script()</em> <strong>[inc/functions-filter-action.php]</strong></li>
<li>Add <em>basics_scripts()</em> function to load the other scripts or librarie in a customizable way for authors<strong>[inc/functions-filter-action.php]</strong></li>
<li>Add HTML comment to explain where authors could manage jQuery and other scripts <strong>[footer.php]</strong></li>
<li>Add <em>basics_i_love_wordpress()</em> function to display mini logo instead of hard printing it <strong>[footer.php]</strong></li>
<li>Remove <em>.visuallyhidden</em> classes <strong>[footer.php]</strong>, <strong>[header.php]</strong>, <strong>[inc/functions-display.php]</strong>, <strong>[searchform.php]</strong></li>
<li>Change <em>home_url( &#8216;/&#8217; )</em> to <em>bloginfo( &#8216;name&#8217; )</em> in label tag <strong>[searchform.php]</strong></li>
<li>Update the .po file for french translation</li>
<li>Move of <strong>[content-404.php]</strong>, <strong>[content-news.php]</strong> and <strong>[home.php]</strong> files in Child theme <em>Beyond Basics</em> to make Basics more&#8230; basic!</li>
<li>Add <em>edit_post_link()</em> in <em>basics_posted_in()</em> allowing authors to edit their posts <strong>[inc/functions-display.php]</strong></li>
<li>Change message when <em>! comments_open() &amp;&amp; is_page()</em> with a sprintf for easier translation for the contact page <strong>[comments.php]</strong></li>
</ol>

<p><a href="http://feedads.g.doubleclick.net/~a/YdghT7ue07KjKkjewLXFmc7w1i0/0/da"><img src="http://feedads.g.doubleclick.net/~a/YdghT7ue07KjKkjewLXFmc7w1i0/0/di" border="0" ismap="true"></img></a><br/>
<a href="http://feedads.g.doubleclick.net/~a/YdghT7ue07KjKkjewLXFmc7w1i0/1/da"><img src="http://feedads.g.doubleclick.net/~a/YdghT7ue07KjKkjewLXFmc7w1i0/1/di" border="0" ismap="true"></img></a></p>]]></content:encoded>
			<wfw:commentRss>http://basics.4design.tl/wordpress-basics-0-2-7-ch-ch-ch-ch-changes/feed</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Basics 0.2.6 — an HTML5 Boilerplate 2 update and more</title>
		<link>http://basics.4design.tl/basics-0-2-6-an-html5-boilerplate-2-update-and-more</link>
		<comments>http://basics.4design.tl/basics-0-2-6-an-html5-boilerplate-2-update-and-more#comments</comments>
		<pubDate>Fri, 02 Sep 2011 18:33:22 +0000</pubDate>
		<dc:creator>Bruno Bichet</dc:creator>
				<category><![CDATA[News]]></category>
		<category><![CDATA[Basics 0.2.6]]></category>
		<category><![CDATA[HTML5 Boilerplate]]></category>
		<category><![CDATA[PHP]]></category>
		<category><![CDATA[WP_DEBUG]]></category>

		<guid isPermaLink="false">http://wp4design.com/?p=467</guid>
		<description><![CDATA[I began to sleep on the version 0.2.5  of my theme WordPress Basics when the new HTML5 Boilerplate 2 raised in the middle of August. This new version of HTML5 Boilerplate brings many changes. The most important is maybe the replacement of the CSS reset by a &#8221;simple&#8221; redefinition of HTML tags with normalize.css created first by Nicolas Gallagher and Jonathan Neal. Basics 0.2.6 takes into account the various changes introduced by HTML5 boilerplate 2 with the update of HTML code, CSS files, JavaScript libraries: Update some parts &#8230; <a href="http://basics.4design.tl/basics-0-2-6-an-html5-boilerplate-2-update-and-more" rel="nofollow">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>I began to sleep on the version 0.2.5  of my theme WordPress Basics when the new HTML5 Boilerplate 2 raised in the middle of August. This new version of HTML5 Boilerplate brings many changes. The most important is maybe the replacement of the CSS reset by a &#8221;simple&#8221; redefinition of HTML tags with <a href="http://necolas.github.com/normalize.css/">normalize.css</a> created first by <a href="http://nicolasgallagher.com/">Nicolas Gallagher</a> and <a href="http://twitter.com/jon_neal">Jonathan Neal</a>.<span id="more-467"></span></p>
<p>Basics 0.2.6 takes into account the various changes introduced by HTML5 boilerplate 2 with the update of HTML code, CSS files, JavaScript libraries:</p>
<ul>
<li>Update some parts of HTML code in <em>header.php</em> and <em>footer.php</em> files,</li>
<li>Include <em>normalize.css</em> in <em>normalize.css</em> (formerly <em>reset.css</em>), and <em>tools.css</em> (non semantic classes),</li>
<li>Updated versions of <em>jQuery</em> and <em>Modernizr</em> (I&#8217;ve kept <em>DD_BelatedPNG</em> I just in case).</li>
<li>Remove redondants CSS properties between <em>normalize.css</em> and <em>markup.css</em>.</li>
</ul>
<p>Also, I took the opportunity to provide an update to the function <em>basics_description (): </em>shortcodes do not appear &#8221;as is&#8221; anymore when used early in the article. Thanks to <a href="http://tom-web.fr">Thomas Patin</a> who alerted me to this subject and provided the line of code I&#8217;ve  inserted into the function to make the things works.</p>
<p>After activating `WP_DEBUG` mode, I&#8217;ve cleaned up the PHP code to avoid errors, warnings or notices in the PHP, especially in the <em>basics_respond()</em> function and within the <em>comments.php</em> file. One step further to make Basics compliant with the Repositery&#8217;s guidelines of WordPress.org&#8217;s Themes!</p>
<h2>The complete Changelog for Basics 0.2.6</h2>
<ol>
<li>Change version number for stylesheet call : <em>?v=0.2.6&#8243;</em> [header.php]</li>
<li>Change HTML markup to match changes in H5BP 2.0 [header.php] [footer.php]</li>
<li>Change [reset.css ] and [tool.css] to match changes in H5BP 2.0</li>
<li>Minor change on comments {author.css]</li>
<li>Update <em>/js/libs</em> for jQuery and Modernizr (DD_belatedpng is always here for compatibility purposes)</li>
<li>Prevent shortcode to appear &#8220;as is&#8221; in the meta description in <em>basics_description()</em> [functions.php] Thanks to Thomas Patin (http://tom-web.fr)</li>
<li>turn <em>margin-left: 0</em> into <em>padding-left: 0</em> [author.css line 359]</li>
<li>change line-height value in [reset.css line 11] : old: 1.231 &#8211; new : 1.5</li>
<li>Rename <em>reset.css</em> to <em>normalize.css</em> and change <em>@import reset.css</em> to <em>normalize.css</em> [markup.css]</li>
<li>Remove <em>font-size: 100%</em> in <em>markup.css</em> (already set in normalize.css)</li>
<li>font-family, font-size, line-height and color property are now set in css/normalize.css only instead of beeing set twice in markup.css</li>
<li>Remove conditional comments for IE wrapping the <em>meta http-equiv=&#8221;X-UA-Compatible&#8221;</em></li>
<li>Define variables <em>$aria_req</em> and <em>$post_id</em> in <em>basics_respond()</em> [functions.php]</li>
<li>Remove <em>$new_defaults</em> in <em>comment_form()</em> call [comments.php]</li>
<li>Put together script calls within conditionnal comments for lt IE 7 [footer.php]</li>
</ol>

<p><a href="http://feedads.g.doubleclick.net/~a/Af9Es8SroDJ1xm3pbLdN7u6WWfs/0/da"><img src="http://feedads.g.doubleclick.net/~a/Af9Es8SroDJ1xm3pbLdN7u6WWfs/0/di" border="0" ismap="true"></img></a><br/>
<a href="http://feedads.g.doubleclick.net/~a/Af9Es8SroDJ1xm3pbLdN7u6WWfs/1/da"><img src="http://feedads.g.doubleclick.net/~a/Af9Es8SroDJ1xm3pbLdN7u6WWfs/1/di" border="0" ismap="true"></img></a></p>]]></content:encoded>
			<wfw:commentRss>http://basics.4design.tl/basics-0-2-6-an-html5-boilerplate-2-update-and-more/feed</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Add a .singular class within the body tag</title>
		<link>http://basics.4design.tl/add-singular-class-body-tag</link>
		<comments>http://basics.4design.tl/add-singular-class-body-tag#comments</comments>
		<pubDate>Mon, 25 Jul 2011 08:44:39 +0000</pubDate>
		<dc:creator>Bruno Bichet</dc:creator>
				<category><![CDATA[Tutorial]]></category>
		<category><![CDATA[.attachment]]></category>
		<category><![CDATA[.page]]></category>
		<category><![CDATA[.single]]></category>
		<category><![CDATA[.singular]]></category>
		<category><![CDATA[body]]></category>
		<category><![CDATA[class]]></category>
		<category><![CDATA[function]]></category>
		<category><![CDATA[is_attachment()]]></category>
		<category><![CDATA[is_page()]]></category>
		<category><![CDATA[is_single()]]></category>
		<category><![CDATA[is_singular()]]></category>

		<guid isPermaLink="false">http://wp4design.com/?p=447</guid>
		<description><![CDATA[The is_singular() conditional tag check if the user is displaying a single post, a single page or an attachment, which are respectively check with is_single(), is_page() and is_attachment(). With these conditional tags come three usefull classes nested in the body tag: .single, .page or .attachment. But, no .singular classe to rule them &#8230; <a href="http://basics.4design.tl/add-singular-class-body-tag" rel="nofollow">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>The <em>is_singular()</em> <a href="http://codex.wordpress.org/Conditional_Tags">conditional tag</a> check if the user is displaying a single post, a single page or an attachment, which are respectively check with <em>is_single()</em>, <em>is_page()</em> and <em>is_attachment()</em>. With these conditional tags come three usefull classes nested in the body tag: <em>.single</em>, <em>.page</em> or <em>.attachment</em>. But, no <em>.singular</em> classe to rule them all!<span id="more-447"></span></p>
<p>So, I put in ♥ Basics a function to fix that:</p>
<pre>/**
* Add custom body classes
*/
add_filter( 'body_class', 'basics_body_class' );
if ( ! function_exists( 'basics_body_class' ) ) :
    function basics_body_class($classes) {
        if ( is_singular() )
        $classes[] = 'singular';
        return $classes;
    }
endif;</pre>
<p>The result is that instead of using a long selector like .single, .page, .attachment { &#8230; } you just have to specify .singular { &#8230; }</p>

<p><a href="http://feedads.g.doubleclick.net/~a/s5kfH4gnhlWmfmMrHGeWFBAKYaI/0/da"><img src="http://feedads.g.doubleclick.net/~a/s5kfH4gnhlWmfmMrHGeWFBAKYaI/0/di" border="0" ismap="true"></img></a><br/>
<a href="http://feedads.g.doubleclick.net/~a/s5kfH4gnhlWmfmMrHGeWFBAKYaI/1/da"><img src="http://feedads.g.doubleclick.net/~a/s5kfH4gnhlWmfmMrHGeWFBAKYaI/1/di" border="0" ismap="true"></img></a></p>]]></content:encoded>
			<wfw:commentRss>http://basics.4design.tl/add-singular-class-body-tag/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>WordPress Basics 0.2.5 on rails</title>
		<link>http://basics.4design.tl/wordpress-basics-0-2-5-on-rails</link>
		<comments>http://basics.4design.tl/wordpress-basics-0-2-5-on-rails#comments</comments>
		<pubDate>Fri, 24 Jun 2011 16:34:59 +0000</pubDate>
		<dc:creator>Bruno Bichet</dc:creator>
				<category><![CDATA[News]]></category>
		<category><![CDATA[functions.php]]></category>
		<category><![CDATA[SEO]]></category>
		<category><![CDATA[Version]]></category>

		<guid isPermaLink="false">http://wp4design.com/?p=434</guid>
		<description><![CDATA[Hi guys and chicks ! Here comes a new version of ♥ Basics. Some minors changes compared to the latest version. The first part of the changes are cosmetic; the others are an improvement of the SEO function basics_description() and basics_title(). I let you with the changelog.txt to take note of further changes. Release 0.2.5 &#8211; 24/06/2011 Add CSS rules #widget-area-4 &#8230; <a href="http://basics.4design.tl/wordpress-basics-0-2-5-on-rails" rel="nofollow">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>Hi guys and chicks ! Here comes a new version of ♥ Basics. Some minors changes compared to the latest version. The first part of the changes are cosmetic; the others are an improvement of the SEO function <code>basics_description()</code> and <code>basics_title()</code>. I let you with the <a href="http://wp4design.com/wp-content/themes/basics.0.2.5/changelog.txt">changelog.txt</a> to take note of further changes.<span id="more-434"></span></p>
<h2>Release 0.2.5 &#8211; 24/06/2011</h2>
<ol>
<li>Add CSS rules <code>#widget-area-4 { clear: left; }</code>. Keep this Widget area below the two sidebars (which are floating)</li>
<li>Add some specifics rules for .ie6 and ie7 to display item menu top inline [author.css]</li>
<li>Turn <code>text-decoration: none</code> into <code>text-decoration: underline</code> to make the links more visible [markup.css]</li>
<li>Add meta description for author, tag and category in basics_description() function [functions.php]</li>
<li>Add support for iframe in the WYSIWYG editor to switch easily between HTML and Visual mode [functions.php]</li>
<li>(Commented for now) Disable the wpautop function so that WordPress makes no attempt to correct the markup [functions.php]</li>
<li>Remove website&#8217;s slogan in title when displaying de home page in basics_title() [function.php]</li>
</ol>
<p>→ Download <strong><a href="http://wp4design.com/wp-content/themes/basics.0.2.5.zip">♥ Basics 0.2.5</a></strong> now!</p>

<p><a href="http://feedads.g.doubleclick.net/~a/_U5Pbd1uC5RtxYPSZjgwpOjqov4/0/da"><img src="http://feedads.g.doubleclick.net/~a/_U5Pbd1uC5RtxYPSZjgwpOjqov4/0/di" border="0" ismap="true"></img></a><br/>
<a href="http://feedads.g.doubleclick.net/~a/_U5Pbd1uC5RtxYPSZjgwpOjqov4/1/da"><img src="http://feedads.g.doubleclick.net/~a/_U5Pbd1uC5RtxYPSZjgwpOjqov4/1/di" border="0" ismap="true"></img></a></p>]]></content:encoded>
			<wfw:commentRss>http://basics.4design.tl/wordpress-basics-0-2-5-on-rails/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Avoid variables, create strings: they will return the favor</title>
		<link>http://basics.4design.tl/avoid-variables-create-strings-they-will-return-the-favor</link>
		<comments>http://basics.4design.tl/avoid-variables-create-strings-they-will-return-the-favor#comments</comments>
		<pubDate>Wed, 15 Jun 2011 18:37:12 +0000</pubDate>
		<dc:creator>Bruno Bichet</dc:creator>
				<category><![CDATA[Tutorial]]></category>
		<category><![CDATA[gettext]]></category>
		<category><![CDATA[internationalization]]></category>
		<category><![CDATA[l18n]]></category>
		<category><![CDATA[poedit]]></category>

		<guid isPermaLink="false">http://wp4design.com/?p=429</guid>
		<description><![CDATA[WordPress allow you to personnalize the context in many ways by displaying the current tag or category, as the tag or category description, for example. But, when it comes to add strings from nowhere, like a heading section which isn&#8217;t a tag, author, category or whatever already build within WordPress, you find &#8230; <a href="http://basics.4design.tl/avoid-variables-create-strings-they-will-return-the-favor" rel="nofollow">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>WordPress allow you to personnalize the context in many ways by displaying the current tag or category, as the tag or category description, for example. But, when it comes to add strings from nowhere, like a heading section which isn&#8217;t a tag, author, category or whatever already build within WordPress, you find yourself left high and dry.<span id="more-429"></span></p>
<p>In Basics, I use a simple tricks: I just create some strings with the <a href="http://codex.wordpress.org/I18n_for_WordPress_Developers">gettext and tools for l18n</a> (internationalization) buid within WordPress. Paid for the <em>.po</em> file to adapt the content of these strings.</p>
<p>Say, you want display a title and a sub-title above your posts:</p>
<pre>&lt;header&gt;
    &lt;hgroup&gt;
        &lt;h1 class="section-title"&gt;&lt;?php _e( 'Do you want to know more?', 'basics' ); ?&gt;&lt;/h1&gt;
        &lt;h2 class="section-description"&gt;&lt;?php _e( 'Find here all the latest news about Basics', 'basics' ); ?&gt;&lt;/h2&gt;
    &lt;/hgroup&gt;
&lt;/header&gt;</pre>
<p>Just open the <em>.po</em> file within <a href="http://www.poedit.net/">Poedit</a> and translate or adapt the strings to fit your needs.</p>

<p><a href="http://feedads.g.doubleclick.net/~a/Gmwyo4qOmOpGH97KHt-2zGwHc5U/0/da"><img src="http://feedads.g.doubleclick.net/~a/Gmwyo4qOmOpGH97KHt-2zGwHc5U/0/di" border="0" ismap="true"></img></a><br/>
<a href="http://feedads.g.doubleclick.net/~a/Gmwyo4qOmOpGH97KHt-2zGwHc5U/1/da"><img src="http://feedads.g.doubleclick.net/~a/Gmwyo4qOmOpGH97KHt-2zGwHc5U/1/di" border="0" ismap="true"></img></a></p>]]></content:encoded>
			<wfw:commentRss>http://basics.4design.tl/avoid-variables-create-strings-they-will-return-the-favor/feed</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>HTML5 Boilerplate — Using .ir class and make the replaced image “clickable”</title>
		<link>http://basics.4design.tl/html5-boilerplate-using-ir-class</link>
		<comments>http://basics.4design.tl/html5-boilerplate-using-ir-class#comments</comments>
		<pubDate>Fri, 10 Jun 2011 17:34:09 +0000</pubDate>
		<dc:creator>Bruno Bichet</dc:creator>
				<category><![CDATA[Tutorial]]></category>
		<category><![CDATA[.ir]]></category>
		<category><![CDATA[class]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[hidden]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[image replacement]]></category>
		<category><![CDATA[invisible]]></category>
		<category><![CDATA[Logo]]></category>
		<category><![CDATA[visuallyhidden]]></category>

		<guid isPermaLink="false">http://wp4design.com/?p=414</guid>
		<description><![CDATA[HTML5 Boilerplate &#8212; and ♥ Basics by the way &#8212; comes with some usefull CSS classes to hide content in multiple ways depending on your needs: .hidden, .visuallyhidden, .invisible and .ir. Let&#8217;s fly over the first classes and then detail the last. .hidden { display: none !important; visibility: hidden; } Fig. 1: Hide for both screenreaders and browsers .visuallyhidden { border: &#8230; <a href="http://basics.4design.tl/html5-boilerplate-using-ir-class" rel="nofollow">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p><a href="http://html5boilerplate.com/">HTML5 Boilerplate</a> &#8212; and ♥ Basics by the way &#8212; comes with some usefull CSS classes to hide content in multiple ways depending on your needs: <em>.hidden</em>, <em>.visuallyhidden</em>, <em>.invisible</em> and <em>.ir</em>. Let&#8217;s fly over the first classes and then detail the last.<span id="more-414"></span></p>
<dl>
<dt><code>.hidden { display: none !important; visibility: hidden; }</code></dt>
<dd>Fig. 1: Hide for both screenreaders and browsers</dd>
<dt><code>.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }</code></dt>
<dd>Fig. 2: Hide only visually, but have it available for screenreaders</dd>
<dt><code>.invisible { visibility: hidden; }</code></dt>
<dd>Fig. 3: Hide visually and from screenreaders, but maintain layout</dd>
<dt><code>.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; }<br />
.ir br { display: none; }</code></dt>
<dd>Fig. 4: For image replacement</dd>
</dl>
<h1>CSS Image Replacement</h1>
<p>The latter offer a mecanism to hide some text &#8220;under the carpet&#8221; for displaying an image with a background property instead. It&#8217;s cool, but there is an issue when you want display a clickable image, like a logo, for example.</p>
<h2>The HTML 4.01 way</h2>
<pre><code>&lt;h1 id="site-title" class="ir fn org"&gt; &lt;a class="url home bookmark" href="/" rel="home"&gt;&lt;?php bloginfo( 'name' ); ?&gt;&lt;/a&gt; &lt;/h1&gt;</code></pre>
<p>with the CSS:</p>
<pre><code>#site-title { width: 220px; height: 160px; background: url(../img/logo.png) no-repeat; } </code></pre>
<p>As you can imaginate, there&#8217;s no way to click on the site title because the clickable element isn&#8217;t displayed.</p>
<h2>The HTML5 way</h2>
<p>Let&#8217;s get rid of this issue with some HTML 5 twirl. Simply make the whole <code>&lt;h1&gt;</code> clickable:</p>
<pre><code>&lt;a class="url home bookmark" href="/" rel="home"&gt; &lt;h1 id="site-title" class="ir fn org"&gt;&lt;?php bloginfo( 'name' ); ?&gt;&lt;/h1&gt; &lt;/a&gt;</code></pre>
<h1>According to the <a href="http://www.w3.org/TR/html5/text-level-semantics.html#the-a-element">HTML5 specification</a>&#8230;</h1>
<blockquote><p>The <code>a</code> element may be wrapped around entire paragraphs, lists, tables, and so forth, even entire sections, so long as there is no interactive content within (e.g. buttons or other links)</p></blockquote>
<p>&#8230;the cat&#8217;s in the bag =^__^=</p>
<p>Note: This markup isn&#8217;t allowed if you planned to use it within an &lt;hgroup&gt; tag.</p>

<p><a href="http://feedads.g.doubleclick.net/~a/Z7kB6LuS6Z1VgfInc9Wkn2Ba19c/0/da"><img src="http://feedads.g.doubleclick.net/~a/Z7kB6LuS6Z1VgfInc9Wkn2Ba19c/0/di" border="0" ismap="true"></img></a><br/>
<a href="http://feedads.g.doubleclick.net/~a/Z7kB6LuS6Z1VgfInc9Wkn2Ba19c/1/da"><img src="http://feedads.g.doubleclick.net/~a/Z7kB6LuS6Z1VgfInc9Wkn2Ba19c/1/di" border="0" ismap="true"></img></a></p>]]></content:encoded>
			<wfw:commentRss>http://basics.4design.tl/html5-boilerplate-using-ir-class/feed</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
	<media:rating>nonadult</media:rating></channel>
</rss>

