Générateur CSS3 Avec les dernières avancées CSS3, de nombreux effets qui demandaient autrefois le maniement de Photoshop sont désormais directement codable en CSS. Il est cependant toujours un peu difficile de visualiser des effets graphiques (ombrages, dégradés…) en regardant une ligne de code. Cette liste de générateurs CSS vous permettra d’obtenir facilement les effets de style désirés via une interface graphique, et d’extraire le code CSS correspondant. Cette liste de générateurs CSS3 a été publiée par Chris Spooner sur le site Line25 . Les générateurs CSS3 tout-en-un Les générateurs CSS de grille et de squelette Les générateurs CSS de dégradé (gradient) {*style:<b> </b>*} Les générateurs CSS de bouton Les éditeurs CSS de texte Les générateurs CSS de « sprite » Le meilleur du reste
Introduction au Responsive web design La boîte à outils ultime pour le responsive design Si vous ne savez pas par où commencer votre webdesign responsive, ni quels outils vont vous faciliter la vie, cette liste d’outils concoctée à l’aide du dernier article de Smashing Hub devrait vous égayer. Faisons un petit tour des outils pratiques ou simplement indispensables… Le responsive design est relativement récent et les choses bougent très vite. A peine a-t-on pris connaissance d’une technique qu’il faut déjà apprendre une nouvelle chose ou maîtriser le dernier outil sorti. Le responsive design n’est pas une simple mode de passage mais bel et bien une possibilité et une philosophie de conception de sites web bien en place qui fait ses preuves. Avec sa popularité toujours grandissante, de nombreux outils ont vu le jour pour faciliter le travail des concepteurs et intégrateurs de sites. L’article original recense de nombreux outils gratuits qu’on peut trouver sur le web et vous trouverez ci-dessous ma sélection parmi tous ceux présentés dans celui-ci, plus quelques ajouts. 1. 2.
10 conseils d’utilisabilité avant de concevoir l’UX L’expérience utilisateur d’un site web, vaste sujet que nous avons déjà traité dans de nombreux articles : Chaque éditeur souhaite que les visiteurs prennent du plaisir quand ils visitent leur site, qu’ils gardent un bon souvenir, qu’ils reviennent et qu’ils recommandent le site à leur entourage. L’expérience offerte sur un site web prend de plus en plus d’importance avec la richesse des offres disponibles sur les différents supports : Web, mobile ou tablette. Le marché du commerce en ligne oblige donc à se démarquer des concurrents en offrant aux utilisateurs plus qu’une plate-forme fonctionnelle en ligne. Il n’est plus possible de rendre public un nouveau service ni préparé ni testé et penser créer des expériences extraordinaires. Il est nécessaire de s’assurer que le site web satisfait les attentes les plus simples des utilisateurs. 1. L’utilisabilité est la capacité d’un système à être utilisé par certains utilisateurs afin d’atteindre leurs buts ou objectifs. 2. 3. 4. 5. 6. 7. 8. 9.
» 20 tutoriaux CSS3 pour vous préparer au futur du web Le web design évolue constamment, au grès des modes et des technologies. Les graphistes et designers doivent non seulement garder un oeil sur les nouvelles tendances mais aussi sur les dernières technologies comme jQuery, HTML5 et CSS3, qui permettent d’exprimer une plus grande créativité tout enrichissant l’expérience de l’utilisateur. Ces 20 tutoriaux CSS3 vous permettront d’apprendre à coder de superbes éléments web interactifs. Ajoutez ces sites à vos favoris, et prenez votre temps… N’hésitez pas à partagez de billet avec vos collègues / amis ! Ces 20 tutoriaux CSS3 ont été référencés sur web design ledger par Tomas Laurinavicius. Construisez rapidement une page annonce (teaser) en CSS3 Avec ce tutoriel, vous apprendrez à créer une page annonce en utilisant uniquement CSS. Créer un menu déroulant avec CSS3 Avec ce tutoriel relativement simple, vous apprendrez à coder un menu déroulant en CSS3 pour un résultat simple, propre et professionnel. Accordéon avec CSS3 Tableaux de prix en CSS3
Tendances du web design 2012 [Chat Vidéo] Les fondateurs de Napster lancent Airtime sur Facebook Sean Parker et Shawn Fanning, les fondateurs de Napster, viennent de lancer une nouvelle start-up. Baptisé AirTime, il s’agit d’un service en ligne de chat vidéo, basé sur la communauté Facebook. Sorte de Chatroulette, AirTime permet aux membres du réseau de discuter entre amis mais également de discuter avec des inconnus. En effet, Airtime propose de rencontrer les amis de vos amis, les internautes qui se trouvent près du lieu où vous vous trouvez ou encore les adeptes du réseau qui présentent les mêmes centres d »intérêts que vous. Une fois lancés dans la discussions vidéo, les utilisateurs peuvent révéler leur identité ou rester anonymes. Pour accéder à Airtime, il est donc indispensable de s’inscrire via Facebook Connect afin que le service puisse obtenir les données liées à votre personnalité et vos goûts. L’atout de cette nouvelle application réside néanmoins dans le fait qu’elle ne requiert aucun téléchargement de programme.
Frédéric Guerrier (guerrier) sur Twitter Using CSS to Fix Anything: 20+ Common Bugs and Fixes Jun 15 2008 Without a doubt, a logical and structured layout is the best way to go. Not only because your layout varies between browsers, but also because CSS has a lot of ways to position every element you have. Today we wanted to share with you some quick tips on how to avoid easy pitfalls when creating your CSS layout. This is the first part in this series as there are SO MANY good tricks out there and if you see an easier or better methods, then post a comment below or email me. You might be interested to check our other related post for some inspiration: IE Bug Fixes 1- Bug Fix: IE Double Margin Float Bug- It’s an Internet Explorer-exclusive bug wherein an element that is floated – and given a margin in the same direction as the float – ends up with twice the specified margin size. To something like this: 2-Overcoming the Box Model Hack- If you want to specify a width to any div, do NOT specify padding or margins. Do something like this: Centering a Block Element Column Issues <div><!
Tendances du webdesign : que nous réserve 2014 Avec cette année 2013 riche en rebondissements, il est désormais grand temps de voir ce que nous réserve les tendances du webdesign 2014. Webdesigners, directeurs artistiques, entrepreneurs, freelances font le bilan et donnent leurs prédictions webdesign pour l’année à venir. Qui de mieux que les gens qui font le web d’aujourd’hui et de demain pour analyser les grandes tendances webdesign à venir ? Sur le même principe que l’an passé, je vous propose un article participatif avec des interviews de professionnels du web. Pour structurer les avis et prendre la température, je leur ai proposé de répondre à quatre petites questions : Quelle fût, d’après vous, la principale tendance du webdesign en 2013 ? En tirant les conclusions de cette année, chacun dans sa spécialité, son domaine et sa culture a traité le sujet à sa façon. Brad Frost Webdesigner, orateur, blogueur, consultant basé à Pittsburgh en Pennsylvanie. Site : bradfrostweb – Twitter : @brad_frost 1. 2. 3. 4. Stéphanie Walter
HTML5, où en sommes-nous ? HTML5 est né en 2004 et sa standardisation est annoncée pour 2014… 10 ans pour mettre en place la norme qui doit remplacer les nombreux plug-ins, afin d’utiliser au maximum les technologies Web natives et standardisées. Alors aujourd’hui, à 2 ans de son aboutissement, où en sommes-nous ? Est-il déjà entré dans le monde du web ? Heureusement on n’a pas attendu 2014 pour se faire plaisir. Le HTML5 se fait adopter à une vitesse remarquable, en particulier par les navigateurs (certains plus vite que d’autres) et les outils de création comme la CS6 d’Adobe. Alors si nos outils nous permettent de l’utiliser, pourquoi s’en priver ? À vrai dire, beaucoup de développeurs n’ont pas attendu bien longtemps avant de se lancer. Janel Garvin, PDG d’Evans Data, avait déclaré dans un communiqué « Il n’y a aucune question à propos de l’adoption d’HTML5 c’est déjà le standard de facto ». Les vendeurs aussi essaient de franchir le cap en soutenant ce langage dans leurs produits de base. ).
Responsive WEBDESIGN des outils, grilles, tableaux, carrousels... by sohenno Dec 7