scratch/output/Scratch/en/blog/2010-10-06-New-Blog-Design-Constraints/index.html
Yann Esposito (Yogsototh) ba85cee7a4 Added social buttons
2012-04-10 15:56:34 +02:00

201 lines
No EOL
9.2 KiB
HTML

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr" xml:lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="keywords" content="programming, blog">
<link rel="shortcut icon" type="image/x-icon" href="/Scratch/img/favicon.ico" />
<link rel="stylesheet" type="text/css" href="/Scratch/assets/css/main.css" />
<link rel="stylesheet" type="text/css" href="/Scratch/css/solarized.css" />
<link rel="stylesheet" type="text/css" href="/Scratch/css/idc.css" />
<link rel="alternate" type="application/rss+xml" title="RSS" href="http://feeds.feedburner.com/yannespositocomen"/>
<link rel="alternate" lang="fr" xml:lang="fr" title="Contraintes du design de ce blog" type="text/html" hreflang="fr" href="/Scratch/fr/blog/2010-10-06-New-Blog-Design-Constraints/" />
<link rel="alternate" lang="en" xml:lang="en" title="New Blog Design Constraints" type="text/html" hreflang="en" href="/Scratch/en/blog/2010-10-06-New-Blog-Design-Constraints/" />
<script type="text/javascript" src="/Scratch/js/jquery-1.3.1.min.js"></script>
<script type="text/javascript" src="/Scratch/js/jquery.cookie.js"></script>
<script type="text/javascript" src="/Scratch/js/index.js"></script>
<!--[if lt IE 9]>
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
<![endif]-->
<title>New Blog Design Constraints</title>
</head>
<body lang="en" class="article">
<script type="text/javascript">// <![CDATA[
document.write('<div id="blackpage"><img src="/Scratch/img/loading.gif" alt="loading..."/></div>');
// ]]>
</script>
<div id="content">
<div id="choix">
<div class="return"><a href="#entete">&darr; Menu &darr;</a></div>
<div id="choixlang">
<a href="/Scratch/fr/blog/2010-10-06-New-Blog-Design-Constraints/" onclick="setLanguage('fr')">en Français</a>
</div>
<div class="flush"></div>
</div>
<div id="titre">
<h1>
New Blog Design Constraints
</h1>
</div>
<div class="flush"></div>
<div class="flush"></div>
<div id="afterheader">
<div class="corps">
<p>I changed the design of my blog.
Now it should be far cleaner.
I believe I use no CSS3 feature and far less javascript.
Of course before my website was perfectly browsable without javascript.
Unfortunately some CSS3 feature are not mature enough on some browser.
For more details you can read my older <a href="/Scratch/en/blog/2010-07-07-CSS-rendering-problems-by-navigator">blog entry</a>.
But the major problem came from, <code>font-shadow</code> and gradients.
Then my new design obey to the following rules:</p>
<ul>
<li>no CSS element begining by &lsquo;-moz&rsquo; or &lsquo;-webkit&rsquo;, etc&hellip;,</li>
<li>no text shadow,</li>
<li>clean (I mean delete) most javascript.</li>
</ul>
<p>I hope the new design please you.</p>
</div>
<div id="social">
<div class="left"> <a href="https://twitter.com/share" class="twitter-share-button" data-via="yogsototh">Tweet</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
</div>
<div class="left"> <div class="g-plusone" data-size="medium" data-annotation="inline" data-width="106"></div>
<script type="text/javascript">
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>
</div>
<div class="flush"></div>
</div>
<div id="choixrss">
<a id="rss" href="http://feeds.feedburner.com/yannespositocomen">
Subscribe
</a>
</div>
<script type="text/javascript">
$(document).ready(function(){
$('#comment').hide();
$('#clickcomment').click(showComments);
});
function showComments() {
$('#comment').show();
$('#clickcomment').fadeOut();
}
document.write('<div id="clickcomment">Comments &amp; Share</div>');
</script>
<div class="flush"></div>
<div class="corps" id="comment">
<h2 class="first">comments</h2>
<noscript>
You must enable javascript to comment.
</noscript>
<script type="text/javascript">
var idcomments_acct = 'a307f0044511ff1b5cfca573fc0a52e7';
var idcomments_post_id = '/Scratch/en/blog/2010-10-06-New-Blog-Design-Constraints/';
var idcomments_post_url = 'http://yannesposito.com/Scratch/en/blog/2010-10-06-New-Blog-Design-Constraints/';
</script>
<span id="IDCommentsPostTitle" style="display:none"></span>
<script type='text/javascript' src='/Scratch/js/genericCommentWrapperV2.js'></script>
</div>
<div id="entete" class="corps_spaced">
<div id="liens">
<ul><li><a href="/Scratch/en/">Home</a></li>
<li><a href="/Scratch/en/blog/">Blog</a></li>
<li><a href="/Scratch/en/softwares/">Softwares</a></li>
<li><a href="/Scratch/en/about/">About</a></li></ul>
</div>
<div class="flush"></div>
<hr/>
<div id="next_before_articles">
<div id="previous_articles">
previous entries
<div class="previous_article">
<a href="/Scratch/en/blog/2010-09-02-Use-git-to-calculate-trusted-mtimes/"><span class="nicer">«</span>&nbsp;Use git to calculate trusted mtimes</a>
</div>
<div class="previous_article">
<a href="/Scratch/en/blog/2010-09-02-base64-and-sha1-on-iPhone/"><span class="nicer">«</span>&nbsp;base64 and sha1 on iPhone</a>
</div>
<div class="previous_article">
<a href="/Scratch/en/blog/2010-08-31-send-mail-from-command-line-with-attached-file/"><span class="nicer">«</span>&nbsp;send mail from command line with attached file</a>
</div>
</div>
<div id="next_articles">
next entries
<div class="next_article">
<a href="/Scratch/en/blog/2010-10-10-Secure-eMail-on-Mac-in-few-steps/">Secure eMail on Mac in few steps&nbsp;<span class="nicer">»</span></a>
</div>
<div class="next_article">
<a href="/Scratch/en/blog/2010-10-14-Fun-with-wav/">Fun with wav&nbsp;<span class="nicer">»</span></a>
</div>
<div class="next_article">
<a href="/Scratch/en/blog/2010-10-26-LaTeX-like-macro-and-markdown/">LaTeX like macro for markdown&nbsp;<span class="nicer">»</span></a>
</div>
</div>
<div class="flush"></div>
</div>
</div>
<div id="bottom">
<div>
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
</div>
<div>
<a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/">Copyright ©, Yann Esposito</a>
</div>
<div id="lastmod">
Created: 10/06/2010
Modified: 04/20/2011
</div>
<div>
Entirely done with
<a href="http://www.vim.org">Vim</a>
and
<a href="http://nanoc.stoneship.org">nanoc</a>
</div>
</div>
<div class="clear"></div>
</div>
</body>
</html>