<?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>css 4 design &#187; hébergement</title>
	<atom:link href="http://css4design.com/tag/hebergement/feed" rel="self" type="application/rss+xml" />
	<link>http://css4design.com</link>
	<description>Le blog de l&#039;intégrateur web</description>
	<lastBuildDate>Sun, 05 Feb 2012 18:10:56 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
	<atom:link rel='hub' href='http://css4design.com/?pushpress=hub'/>
		<item>
		<title>Le petit journal du Web &#8212; Décembre 2010</title>
		<link>http://css4design.com/le-petit-journal-du-web-decembre-2010</link>
		<comments>http://css4design.com/le-petit-journal-du-web-decembre-2010#comments</comments>
		<pubDate>Fri, 24 Dec 2010 12:40:13 +0000</pubDate>
		<dc:creator>Bruno Bichet</dc:creator>
				<category><![CDATA[Le petit journal du web]]></category>
		<category><![CDATA[Accessibilité]]></category>
		<category><![CDATA[Chef de projet]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[CSS3]]></category>
		<category><![CDATA[hébergement]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[Icônes]]></category>
		<category><![CDATA[Medias Queries]]></category>
		<category><![CDATA[Migration]]></category>
		<category><![CDATA[Nom de domaine]]></category>
		<category><![CDATA[Pictogramme]]></category>
		<category><![CDATA[Sprites]]></category>
		<category><![CDATA[Wireframe]]></category>
		<category><![CDATA[WordPress]]></category>

		<guid isPermaLink="false">http://css4design.com/?p=8431</guid>
		<description><![CDATA[Comme à son habitude, le petit journal du Web fait le point sur les sites et les services (re)découverts pendant les 30 derniers jours. Pour décembre, ce petit journal vous propose : à la Une, un site consacré à l&#8217;accessibilité Web  ; dans la rubrique Graphisme et Ergonomie, un bookmarklet pour afficher les Wireframes ; dans la catégorie CSS, CSS3 et HTML5, une piqûre de rappel sur l&#8217;organisation des feuilles de styles CSS ; et nous terminons avec un rappel des éléments à prendre en compte lors de la migration d&#8217;un blog WordPress et une mine de ressources pour les [...]]]></description>
			<content:encoded><![CDATA[<div class="tweetmeme_button" style="float: right; margin-left: 18px;">
			<a href="http://api.tweetmeme.com/share?url=http%3A%2F%2Fcss4design.com%2Fle-petit-journal-du-web-decembre-2010">
				<img src="http://api.tweetmeme.com/imagebutton.gif?url=http%3A%2F%2Fcss4design.com%2Fle-petit-journal-du-web-decembre-2010&amp;source=br1o&amp;style=normal&amp;service=bit.ly&amp;service_api=R_0c1ee4b64f105d1b2672690740a77d6a&amp;b=2" height="61" width="50" />
			</a>
		</div><p>Comme à son habitude, le petit journal du Web fait le point sur les sites et les services (re)découverts pendant les 30 derniers jours. Pour décembre, ce petit journal vous propose : à la Une, un site consacré à l&#8217;accessibilité Web  ; dans la rubrique Graphisme et Ergonomie, un bookmarklet pour afficher les Wireframes ; dans la catégorie CSS, CSS3 et HTML5, une piqûre de rappel sur l&#8217;organisation des feuilles de styles CSS ; et nous terminons avec un rappel des éléments à prendre en compte lors de la migration d&#8217;un blog WordPress et une mine de ressources pour les chefs de projet Web !<span id="more-8431"></span></p>

<h2>A la Une !</h2>

<ul>
    <li style="font-size: 1.3em; list-style: none;"><img class="alignleft size-thumbnail wp-image-8626" title="handi-pratique" src="http://css4design.com/wp-content/uploads/2010/12/handi-pratique-102x102.png" alt="" width="102" height="102" /><a href="http://www.handi-pratique.com/">Handi pratique</a> &#8212; Portail professionnel sur l’accessibilité Web, les standards du Web et l’utilisation de l’informatique pour les personnes en situation de handicap. Vous y trouverez les dernières actualités, conseils, études de cas, tests de logiciels et matériels. Lire <a href="http://www.handi-pratique.com/accessibilite-liens-title">Accessibilité des liens : utilisation correcte de l’attribut Title</a>.</li>
</ul>

<h2>Graphisme &amp; Ergonomie</h2>

<div>
<ul>
    <li style="font-size: 1.3em; list-style: none;"><img class="alignleft size-thumbnail wp-image-8619" title="wirify" src="http://css4design.com/wp-content/uploads/2010/12/wirify-102x102.png" alt="" width="102" height="102" /><a href="http://www.volkside.com/2010/12/introducing-wirify-the-web-as-wireframes/">Wirify</a> &#8212; Un Wireframe est une représentation stylisée d&#8217;une page, appelé également maquette «fil de fer» qui permet de faire apparaitre les zones principales sans se soucier des détails. Cette maquette sert de base pour le travail du graphiste. Wirify affiche la version «fil de fer» du site affiché dans votre navigateur, ce qui s&#8217;avère pratique pour faire apparaitre la structure d&#8217;une page. via <a href="http://www.jonathan-menet.fr/blog/2010/12/23/transformer-nimporte-quel-site-web-en-wireframe/">John&#8217;s Graphisme</a>.</li>
    <li><a href="http://inspiredology.com/guiding-user-eye-in-your-designs/">Guiding user Eye in your Designs</a> &#8212; La capacité a retenir l&#8217;attention des utilisateurs et à les guider à travers la page en utilisant les nuances de couleurs pour rythmer la page est un élément fondamental que tout Webdesigner devrait prendre en compte.</li>
    <li><a rel="bookmark" href="http://css4design.com/le-principe-de-proximite-dans-le-webdesign">Le principe de proximité dans le webdesign</a> &#8212; Le principe de proximité est relativement simple à mettre en oeuvre : il suffit d’augmenter ou de diminuer la « distance » entre deux ensembles pour que l’utilisateur identifie rapidement les zones principales à parcourir, le faisant passer du statut de « visiteur » à celui de « lecteur ».</li>
    <li><a href="http://owni.fr/categorie/graphisme-cultures-numeriques/">Vendredi c&#8217;est graphism !</a> &#8212; La rubrique hebdomadaire sur OWNI de <a href="http://graphism.fr/">Geoffrey Dorne</a> (@geoffreydorne) sur l&#8217;actualité du graphisme dans l&#8217;univers et au-delà !!!</li>
    <li><a rel="bookmark" href="http://www.lesintegristes.net/2010/12/19/guidelines-lexemple-de-la-bbc/">Guidelines, l’exemple de la BBC</a> &#8212; Présentation par Eric Le Bihan des <a href="http://www.bbc.co.uk/guidelines/">Guidelines</a> (lignes directrices) de la BBC à l&#8217;attention de leurs fournisseurs en terme d&#8217;accessibilité, de <a href="http://www.bbc.co.uk/guidelines/gel/downloads/GEL_styleguide.pdf">charte éditoriale et graphique</a> et de considérations plus techniques.</li>
    <li><a href="http://thenounproject.com/">The Noun Project</a> &#8212; L&#8217;objectif est ambitieux : collecter, organiser et rendre accessible les symboles du langage visuel de notre monde, sous forme d&#8217;icônes, de pictogrammes disponibles au téléchargement au format SVG, sous licence Creative Commons. Via @mbonnel.</li>
    <li><a href="http://whereisthefold.com/">Where is the fold?</a> &#8212; Superpose la matérialisation du fold à la page Web spécifiée. Le fold est la zone en deça de laquelle l&#8217;utilisateur n&#8217;a pas besoin de scroller pour visualiser la page. <em>Where is the fold?</em> montre le fold tel qu&#8217;il apparait selon les résolutions d&#8217;écran les plus courantes, avec des indications statistiques sur le pourcentage d&#8217;utilisation. Via @chef2projet. Lire <a href="http://css4design.com/les-habitudes-de-scrolling-a-la-loupe-eyetracking">Les habitudes de scrolling à la loupe</a>.</li>
    <li><a href="http://webwithoutwords.com/">Web Without Words</a> &#8212; Expérience visuelle intéressante consistant à remplacer les mots d&#8217;un site Web par des blocs noirs et gris.</li>
    <li><a href="http://css4design.com/le-petit-journal-du-web-special-typo">Le petit journal permanent de la TypOgrApHiE !</a> &#8212; Toujours vaillant, cet article mis à jour régulièrement rassemble toujours le meilleur de la typographie sur le Web.</li>
</ul>
</div>

<h2>CSS / CSS3 / HTML5</h2>

<ul>
    <li style="font-size: 1.3em; list-style: none;"><img class="alignleft size-thumbnail wp-image-8622" title="daisy-css" src="http://css4design.com/wp-content/uploads/2010/12/daisy-css-102x102.png" alt="" width="102" height="102" /><a href="http://romy.tetue.net/methode-daisy?lang=fr">Méthode Daisy : les CSS feuille à feuille</a> &#8212; Très bonne initiation à la philophie des frameworks CSS avec une fort belle métaphore de la marguerite au service de l&#8217;intégrateur HTML &amp; CSS. Dites-le avec des fleurs !</li>
    <li><a href="http://www.capitaine-mousse.fr/blog.html/13/lightbox-sans-javascript">Lightbox sans Javascript</a> &#8211; Une <em>Lightbox</em> full CSS qui remplaçe l&#8217;événement `click` par la pseudo-classe `:focus` et la propriété `tabindex` pour permettre aux images d&#8217;avoir le «focus». Voir la <a href="http://capitaine-mousse.fr/demo/lightbox/">démonstration</a>.</li>
    <li><a href="http://gobanclub.net/2010/11/17/responsive_webdesign_ethan_marcotte_trad_fr/">Le Web Design Réactif</a> &#8212; Traduction de l&#8217;article <a href="http://www.alistapart.com/articles/responsive-web-design">Responsive Web Design</a> d&#8217;<a href="http://ethanmarcotte.com/">Ethan Marcotte</a> sur l&#8217;utilisation des <a href="http://www.w3.org/TR/css3-mediaqueries/">Medias Queries</a> pour concevoir des sites Web s&#8217;adaptant aux contraintes des agents utilisateurs, la taille du viewport notamment, mais pas seulement.</li>
    <li><a href="http://net.tutsplus.com/tutorials/html-css-techniques/html5-and-css3-without-guilt/">HTML5 and CSS3 Without Guilt</a> &#8212; Net|tuts fait le point sur les différentes techniques pour commencer à utiliser HTML5 et CSS3, là, tout de suite.</li>
    <li><a href="http://www.alsacreations.com/tuto/lire/1038-gerer-debordement-contenu-css.html">Gérer les débordements de contenu grâce à CSS</a> &#8212; Article très utile de Raphaël sur les différentes manières d&#8217;éviter que votre contenu ou celui de vos rédacteurs ne casse votre belle mise en page. Au menu : `overflow: hidden`, `word-wrap: break-word`, `text-overflow: ellipsis`, `max-width: 100%`,  avec des exemples, des conseils d&#8217;utilisation et un point sur la compatibilité inter-navigateur !</li>
    <li><a href="http://www.webdesignerwall.com/tutorials/css-gradient-text-effect/">CSS Gradient Text Effect</a> &#8212; Utilisez des dégradés pour plusieurs titres avec une seule image au format PNG. Pas mal de contre-indications, mais peut faire son petit effet !</li>
    <li><a href="http://sixrevisions.com/web-development/ultimate-guide-to-microformats-reference-and-examples/">Ultimate Guide to Microformats: Reference and Examples</a> &#8212; Guide complet sur les microformats avec une table des microformats disponibles et des exemples concrêt d&#8217;utilisation.</li>
    <li><a rel="bookmark" href="http://truffo.fr/2010/12/internet-explorer-7-le-nouveau-standard-du-web/">Internet Explorer 7 : le nouveau standard du Web</a> &#8212; Avec la mort annoncée de IE6, il est judicieux de se remettre en mémoire les propriétés CSS dont nous nous sommes privées depuis (trop) longtemps : sélecteurs multiples, sélecteurs d&#8217;attributs, sélecteur adjacent, sélecteur d&#8217;enfant direct, propriétés `max-width`, etc. Et non, IE7 ne sera peut-être pas le nouveau IE6 ;)</li>
    <li><a href="http://www.pierrevion.fr/2010/19/un-menu-utilisant-un-sprite-css.html">Un menu utilisant un sprite CSS</a> &#8212; L&#8217;utilisation des sprites est un atout pour améliorer les performances de votre site. Voir <a href="http://www.pierrevion.fr/wp-content/demos/sprite/">la démonstration</a>.</li>
    <li><a href="http://css4design.com/le-petit-journal-de-html5">Le petit journal permanent de HTML5</a> &#8212; Toujours vaillant, cet article mis à jour régulièrement rassemble toujours le meilleur des ressources sur HTML5 !</li>
</ul>

<h2>Miscellanées</h2>

<ul>
    <li><a title="Lien vers : Migration de mon blog WordPress" rel="bookmark" href="http://darklg.me/448/migration-blog-wordpress/">Migration de mon blog WordPress</a> &#8212; Article expliquant dans le détail la migration du nom de domaine et de l&#8217;hébergement de notre ami <a href="http://darklg.me/">Darklg</a>. Toujours utile pour ne rien oublier dans cette opération, toujours périlleuse !</li>
    <li><a href="http://www.chef2projet.fr/">chef2projet</a> &#8211; Boîte à outils pour chef de projet web et webmaster classés dans 4 catégories : optimisation du référencement, veille de sites ou blogs, gestion de projet web et création de site web.</li>
</ul>

<p><img class="aligncenter size-full wp-image-8629" title="joyeux-noel" src="http://css4design.com/wp-content/uploads/2010/12/joyeux-noel.png" alt="" width="524" height="335" /></p>

<h3 class='related_post_title'>Articles sur le même sujet</h3>

<ul class='related_post'><li><a href='http://css4design.com/liens-javascript-jquery' title='390 ressources Javascript &amp; jQuery'>390 ressources Javascript &#038; jQuery</a></li><li><a href='http://css4design.com/le-petit-journal-du-web-31-decembre-2010' title='Le petit journal du Web — 31 décembre 2010'>Le petit journal du Web — 31 décembre 2010</a></li><li><a href='http://css4design.com/interviews-bruno-bichet-integration-html-css-design' title='Interviews Bruno Bichet, intégration web et css 4 design de 2007 à nos jours'>Interviews Bruno Bichet, intégration web et css 4 design de 2007 à nos jours</a></li><li><a href='http://css4design.com/wordpress-a-z-extension-plugin' title='WordPress de A à Z &#8212; E comme Extensions (les plugins)'>WordPress de A à Z &#8212; E comme Extensions (les plugins)</a></li><li><a href='http://css4design.com/wordpress-a-z-css' title='WordPress de A à Z &#8212; C comme CSS &amp; Composé HTML5'>WordPress de A à Z &#8212; C comme CSS &#038; Composé HTML5</a></li></ul>
 <p><a href="http://css4design.com/?flattrss_redirect&amp;id=8431&amp;md5=9d2df2275fe94fe40d8a9a99c1841558" title="Flattr" target="_blank"><img src="http://css4design.com/wp-content/plugins/flattr/img/flattr-badge-large.png" alt="flattr this!"/></a></p>]]></content:encoded>
			<wfw:commentRss>http://css4design.com/le-petit-journal-du-web-decembre-2010/feed</wfw:commentRss>
		<slash:comments>4</slash:comments>
		<atom:link rel="payment" href="http://css4design.com/?flattrss_redirect&amp;id=8431&amp;md5=9d2df2275fe94fe40d8a9a99c1841558" type="text/html" />
	</item>
		<item>
		<title>Comprendre les offres d&#039;hébergement web</title>
		<link>http://css4design.com/comprendre-les-offres-hebergement-web</link>
		<comments>http://css4design.com/comprendre-les-offres-hebergement-web#comments</comments>
		<pubDate>Sat, 16 Aug 2008 18:55:32 +0000</pubDate>
		<dc:creator>Bruno Bichet</dc:creator>
				<category><![CDATA[Gestion de site web]]></category>
		<category><![CDATA[hébergement]]></category>
		<category><![CDATA[News]]></category>

		<guid isPermaLink="false">http://www.css4design.com/?p=988</guid>
		<description><![CDATA[10 clés pour comprendre les offres d&#8217;hébergement web. Avec ce billet, Frédéric de Villamil nous remet la tête dans la bonne direction et nous donne les clés pour choisir l&#8217;hébergement qui correspond le mieux à nos besoins. En effet, pas toujours facile de s&#8217;y retrouver entre hébergements mutualisé, serveur privé virtuel, serveur dédié, hébergement low cost, virtualisation, infogérance, SLA, bande passante, burst&#8230; Articles sur le même sujet Le petit journal du Web &#8212; Décembre 2010Après Gandi Blog, voici Free BlogGoogle Doctype, un wiki de référence pour développeur webTweakPNG 1.3.0Création de webdevfr sur Google Groups]]></description>
			<content:encoded><![CDATA[<div class="tweetmeme_button" style="float: right; margin-left: 18px;">
			<a href="http://api.tweetmeme.com/share?url=http%3A%2F%2Fcss4design.com%2Fcomprendre-les-offres-hebergement-web">
				<img src="http://api.tweetmeme.com/imagebutton.gif?url=http%3A%2F%2Fcss4design.com%2Fcomprendre-les-offres-hebergement-web&amp;source=br1o&amp;style=normal&amp;service=bit.ly&amp;service_api=R_0c1ee4b64f105d1b2672690740a77d6a&amp;b=2" height="61" width="50" />
			</a>
		</div><p><a href="http://t37.net/10-cles-pour-comprendre-les-offres-d-hebergement-web">10 clés pour comprendre les offres d&#8217;hébergement web</a>. Avec ce billet, Frédéric de Villamil nous remet la tête dans la bonne direction et nous donne les clés pour choisir l&#8217;hébergement qui correspond le mieux à nos besoins.</p>

<p>En effet, pas toujours facile de s&#8217;y retrouver entre hébergements mutualisé, serveur privé virtuel, serveur dédié, hébergement <em>low cost</em>, virtualisation, infogérance, SLA, bande passante, burst&#8230;</p>

<h3 class='related_post_title'>Articles sur le même sujet</h3>

<ul class='related_post'><li><a href='http://css4design.com/le-petit-journal-du-web-decembre-2010' title='Le petit journal du Web &#8212; Décembre 2010'>Le petit journal du Web &#8212; Décembre 2010</a></li><li><a href='http://css4design.com/apres-gandi-blog-voici-free-blog' title='Après Gandi Blog, voici Free Blog'>Après Gandi Blog, voici Free Blog</a></li><li><a href='http://css4design.com/google-doctype-un-wiki-de-reference-pour-developpeur-web' title='Google Doctype, un wiki de référence pour développeur web'>Google Doctype, un wiki de référence pour développeur web</a></li><li><a href='http://css4design.com/tweakpng-130' title='TweakPNG 1.3.0'>TweakPNG 1.3.0</a></li><li><a href='http://css4design.com/creation-de-webdevfr-sur-google-groups' title='Création de webdevfr sur Google Groups'>Création de webdevfr sur Google Groups</a></li></ul>
 <p><a href="http://css4design.com/?flattrss_redirect&amp;id=988&amp;md5=8b804614557c5d220faca50aed2705b4" title="Flattr" target="_blank"><img src="http://css4design.com/wp-content/plugins/flattr/img/flattr-badge-large.png" alt="flattr this!"/></a></p>]]></content:encoded>
			<wfw:commentRss>http://css4design.com/comprendre-les-offres-hebergement-web/feed</wfw:commentRss>
		<slash:comments>2</slash:comments>
		<atom:link rel="payment" href="http://css4design.com/?flattrss_redirect&amp;id=988&amp;md5=8b804614557c5d220faca50aed2705b4" type="text/html" />
	</item>
	</channel>
</rss>

<!-- Performance optimized by W3 Total Cache. Learn more: http://www.w3-edge.com/wordpress-plugins/

Page Caching using disk: enhanced (User agent is rejected)

Served from: css4design.com @ 2012-02-09 03:39:58 -->
