davidbgk
/
larlet-fr-david

<!doctype html>
<html lang=fr>
<head>
  <!-- Always define the charset before the title -->
  <meta charset=utf-8>
  <title>Critique du livre le Zen des CSS — Biologeek — David Larlet</title>
  <!-- Define a viewport to mobile devices to use - telling the browser to assume that the page is as wide as the device (width=device-width) and setting the initial page zoom level to be 1 (initial-scale=1.0) -->
  <meta name="viewport" content="width=device-width, initial-scale=1"/>
  <!-- Fake favicon, to avoid extra request to the server -->
  <link rel="icon" href="data:;base64,iVBORw0KGgo=">
  <link type="application/atom+xml" rel="alternate" title="Feed" href="/david/log/" />
  <link rel="manifest" href="/manifest.json">
  
  <link rel="stylesheet" href="/static/david/css/larlet-david-_J6Rv.css" data-instant-track />
  
  <noscript>
    <style type="text/css">
      /* Otherwise fonts are loaded by JS for faster initial rendering. See scripts at the bottom. */
      body {
        font-family: 'EquityTextB', serif;
      }
      h1, h2, h3, h4, h5, h6, time, nav a, nav a:link, nav a:visited {
        font-family: 'EquityCapsB', sans-serif;
        font-variant: normal;
      }
    </style>
  </noscript>
  
  <!-- Canonical URL for SEO purposes -->
  <link rel="canonical" href="https://larlet.fr/david/biologeek/archives/20060219-critique-du-livre-le-zen-des-css">

</head>
<body>
  <div>
    
    <header>
      <nav>
        <p>
          <small>
            Je suis <a href="/david/" title="Profil public">David Larlet</a>, <a href="/david/pro/" title="Activité professionnelle">artisan</a> du web qui vous <a href="/david/pro/accompagnement/" title="Activité d’accompagnement">accompagne</a><span class="more-infos"> dans l’acquisition de savoirs pour concevoir des <a href="/david/pro/produits-essentiels/" title="Qu’est-ce qu’un produit essentiel ?">produits essentiels</a></span>. <span class="more-more-infos">Discutons ensemble d’une <a href="/david/pro/devis/" title="En savoir plus">non-demande de devis</a>.</span> Je partage ici mes <a href="/david/blog/" title="Expériences bienveillantes">réflexions</a> et <a href="/david/correspondances/2017/" title="Lettres hebdomadaires">correspondances</a>.
          </small>
        </p>
      </nav>
    </header>
    
    
  <section>
    <h1 property="schema:name">Critique du livre le Zen des CSS</h1>
    <article typeof="schema:BlogPosting">
      <div property="schema:articleBody">
        <img src="/static/david/biologeek/images/logos/le_zen_des_css.png" alt="vignette" style="float:left; margin: 0.5em 1em;" property="schema:thumbnailUrl" />
        <p>Ce livre est vraiment à la hauteur des ambitions du <a href="http://www.csszengarden.com/tr/francais/">jardin Zen</a> et de son succès, ce qui est frappant lorsque l'on commence à feuilleter cet ouvrage c'est qu'il est <strong>beau</strong>, et c'est vraiment rare d'avoir cette réaction lorsque l'on ouvre un bouquin d'informatique. Heureusement, la qualité ne s'arrête pas à la couverture et aux belles images...</p>

<p>Je commence avec les points faibles pour que vous puissiez les oublier avant la fin ;-).</p>

<h2>Points faibles</h2>

<h3>Concernant la version originale</h3>

<ul>
<li>Les agrandissement dans la marge sont pixelisés et c'est vraiment dommage car ça dégrade l'esthétique du livre qui approche de la perfection. Je comprend que l'on veuille montrer certains effets ou créer une impression de zoom mais je ne trouve pas ça très utile.</li>
</ul>

<h3>Concernant la traduction</h3>

<ul>
<li>Les captures de la version française ne sont pas localisées et c'est dommage car la <a href="http://www.csszengarden.com/tr/francais/">traduction existe</a>. Je ne sais pas si c'était possible compte tenu du fait que c'était une traduction mais ça aurait apporté un petit plus intéressant.</li>
<li>Très peu de liens vers des ressources francophones, notamment en fin d'ouvrage, mais encore une fois je ne sais pas si c'était possible lorsque l'on effectue une traduction.</li>
<li>Quelques coquilles (dont une phrase complète en anglais en plein milieu du livre...)</li>
</ul>

<h2>Points forts</h2>

<ul>
<li>C'est beau :-)</li>
<li>Les exemples sont bien choisis et la structure du livre est claire et progressive.</li>
<li>Le niveau de détail des techniques est suffisant, ce qui rend le livre accessible après avoir lu <a href="http://openweb.eu.org">openweb</a> par exemple.</li>
<li>Quelques grands principes de design et d'ergonomie sont expliqués de façon détaillée et illustrée.</li>
<li>Tous les liens du livre sont sur <a href="http://www.mezzoblue.com/zengarden/book/links/">le site de l'auteur</a>, ce qui est très pratique compte tenu de leur nombre... et de la galère pour taper une adresse.</li>
</ul>

<h2>Détails</h2>

<p>Cet ouvrage coûte 30€ et comporte 295 pages.</p>

<h2>Conclusion</h2>

<p>Ce livre ne vous apprendra pas à utiliser les <abbr title="Cascading Style Sheets">CSS</abbr> mais ce n'est pas son but, il a répondu parfaitement à mes attentes en termes de design, de standards et d'ergonomie. C'est un ouvrage qui devrait intéresser un large public, du geek qui aime bien les effets expérimentaux à quelqu'un qui a découvert les <abbr title="Cascading Style Sheets">CSS</abbr> depuis peu mais qui a du mal à concrétiser ses idées de design ou qui butte sur des problèmes techniques particuliers.</p>

<p>Au final, vous (re)découvrirez probablement de nombreux effets utiles tout en acquérant de solides bases en design web. Je dois avouer avoir eu un peu peur d'avoir à sauter des pages, voire des chapitres et j'ai finalement été très agréablement surpris par la richesse et le professionnalisme de ce livre. En un mot, c'est un investissement rentable, n'hésitez plus.</p>

<p>Vous pouvez <a href="https://larlet.fr/david/biologeek/archives/20060219-critiques-de-livres-aux-editions-eyrolles/">consulter l'ensemble de mes critiques de livres</a>.</p>
      </div>
    </article>
    <footer>
      <h6 property="schema:datePublished">— 19/02/2006</h6>
    </footer>
  </section>
  <section>
    <div>
      <h3>Articles peut-être en rapport</h3>
      <ul>
        <li><a href="/david/biologeek/archives/20080613-artiste-qui-sommeille-en-chaque-geek/" title="Accès à ★ L&#39;artiste qui sommeille en chaque geek">★ L&#39;artiste qui sommeille en chaque geek</a></li>
        <li><a href="/david/biologeek/archives/20071124-quel-avenir-pour-les-applications-web-libres/" title="Accès à ★ Quel avenir pour les applications web libres ?">★ Quel avenir pour les applications web libres ?</a></li>
        <li><a href="/david/biologeek/archives/20070819-l-importance-du-rythme-vertical-en-design-css/" title="Accès à ★ L&#39;importance du rythme vertical en design CSS">★ L&#39;importance du rythme vertical en design CSS</a></li>
      </ul>
    </div>
  </section>
  <section>
    <div id="comments">
      <h3>Commentaires</h3>
      
<div class="comment" typeof="schema:UserComments">
    <p class="comment-meta">
        <span class="comment-author" property="schema:creator">Silvyn</span> le <span class="comment-date" property="schema:commentTime">19/02/2006</span> :
    </p>
    <div class="comment-content" property="schema:commentText">
        <p>Je ne vais pas être original, mais je fais exactement le même constat ! :) Et je suis bien content de l'avoir acheté !</p>
    </div>
</div>
<div class="comment" typeof="schema:UserComments">
    <p class="comment-meta">
        <span class="comment-author" property="schema:creator">gali</span> le <span class="comment-date" property="schema:commentTime">19/02/2006</span> :
    </p>
    <div class="comment-content" property="schema:commentText">
        <p>Très interessant ce livre je le conseille également :)</p>
    </div>
</div>
<div class="comment" typeof="schema:UserComments">
    <p class="comment-meta">
        <span class="comment-author" property="schema:creator">Kagou</span> le <span class="comment-date" property="schema:commentTime">20/02/2006</span> :
    </p>
    <div class="comment-content" property="schema:commentText">
        <p>J'ai eu une supe idée que de me l'offrir ;)</p>
    </div>
</div>
<div class="comment" typeof="schema:UserComments">
    <p class="comment-meta">
        <span class="comment-author" property="schema:creator">Baptiste</span> le <span class="comment-date" property="schema:commentTime">21/02/2006</span> :
    </p>
    <div class="comment-content" property="schema:commentText">
        <p>Tu as lu mon billet sur le bouquin, tu sais donc ce que je pense de la traduction, mais le livre Ruby on Rails (aussi chez Eyrolles) a l'écrasante majorité des captures refaites dans un système français et sur une appli francisée... <br />
Donc je pense que ça doit être possible, surtout qu'objectivement, je ne vois pas bien où peut se situer l'obstacle.</p>
    </div>
</div>
<div class="comment" typeof="schema:UserComments">
    <p class="comment-meta">
        <span class="comment-author" property="schema:creator">David, biologeek</span> le <span class="comment-date" property="schema:commentTime">22/02/2006</span> :
    </p>
    <div class="comment-content" property="schema:commentText">
        <p>Pareil, n'hésite pas à faire un trackback en retour ;)</p>
    </div>
</div>
<div class="comment" typeof="schema:UserComments">
    <p class="comment-meta">
        <span class="comment-author" property="schema:creator">Le blog d&#39;Aozeo</span> le <span class="comment-date" property="schema:commentTime">22/02/2006</span> :
    </p>
    <div class="comment-content" property="schema:commentText">
        <!-- TB -->
<p><strong>Le Zen des CSS</strong></p>
<p>On a beaucoup parlé de ce livre de Dave Shea (aux éditions Eyrolles) depuis la sortie de sa traduction... Après la bataille, revue de bouquin !
L'ouvrage est joli. La mise en page claire, sobre et lisible.</p>
    </div>
</div>
<div class="comment" typeof="schema:UserComments">
    <p class="comment-meta">
        <span class="comment-author" property="schema:creator">giz404</span> le <span class="comment-date" property="schema:commentTime">27/02/2006</span> :
    </p>
    <div class="comment-content" property="schema:commentText">
        <p>Je l'avais feuilleté rapidement, je ne savais pas s'il m'apporterait grand-chose, mais après tous les échos positifs que j'en ai eu, je me dis que c'est le prochain bouquin que je m'achète.</p>
    </div>
</div>
<div class="comment" typeof="schema:UserComments">
    <p class="comment-meta">
        <span class="comment-author" property="schema:creator">Céhèssèsse</span> le <span class="comment-date" property="schema:commentTime">06/05/2006</span> :
    </p>
    <div class="comment-content" property="schema:commentText">
        <p>Un très bon livre et un très bon site pour s'inspirer de très belles création. Voici le plus beau thème proposé par Zen Garden, repris par notre hôte, mon préféré !<br />
<a href="http://www.csszengarden.com/?cssfile=/184/184.css&amp;page=1" title="http://www.csszengarden.com/?cssfile=/184/184.css&amp;page=1" rel="nofollow">www.csszengarden.com/?css...</a></p>
    </div>
</div>

    </div>
  </section>

    
    <footer>
      <nav>
        <p>
          <small>
            Je réponds quasiment toujours aux <a href="m&#x61;ilto:d&#x61;vid%40l&#x61;rlet&#46;fr" title="Envoyer un email">emails</a> (<a href="/david/signature/" title="Ma signature actuelle avec possibilité de chiffrement">signés</a>) et vous pouvez me rencontrer à Montréal. <span class="more-infos">N’hésitez pas à <a href="/david/log/" title="Être tenu informé des mises à jour">vous abonner</a> pour être tenu informé des publications récentes.</span>
          </small>
        </p>
      </nav>
    </footer>
    
  </div>
  
  <script src="/static/david/js/larlet-david-3ee43f.js" data-no-instant></script>
  
  <script data-no-instant>InstantClick.init()</script>
  
</body>
</html>