Référencement WordPress. Create Your Own @font-face Kits. FontDB. Les_joies_du_code();.
Responsive design : définition, fonctionnement, ressources et tutoriels. Si vous vous intéressez de près ou de loin au webdesign ou à l’intégration, vous n’avez pas pu échapper au dernier terme à la mode : le “responsive web design”. Cette avancée technologique est également une nouvelle philosophie de création de site. Voici un article pour définir ce qu’est le “responsive web design” et expliquer quels en sont les points-clés (puis plein de liens, de tutoriels et de ressources super cools aussi !). Le “responsive web design” est né suite à un besoin grandissant. De nos jours, il n’y a pas un client qui demande un site Internet sans demander une version mobile de celui-ci. Le problème est qu’on ne peut pas – ou du moins ce ne serait pas très pratique – développer autant de versions d’un site qu’il y a de résolutions différentes.
Définition du responsive web design Voici 2 exemples pour illustrer des webdesigns crées de façon “responsive” : (Cliquez dessus pour voir en plus grand) Techniquement, dans les grandes lignes Un site et un contenu qui s’adaptent La typo. Font-Face : Intégrer une typographie non-standard. Les typographies sont une partie extrêmement importante dans le design de votre interface web. Plusieurs options s’offrent à l’intégrateur ou au programmeur afin d’intégrer une police de caractère non conventionnelle sur le web. Lorsque je parle d’une typo non conventionnelle, je parle d’une police de caractère autre que celles considérée comme étant 100% compatible à tous les navigateurs pour le web. (Arial, Helvetica, Times New Roman, Times, Courier, Verdana, etc.) Dans le billet suivant, je vous montrerai les étapes à suivre afin d’intégrer une typographie dans votre page web différente de celles mentionnées plus haut grâce à l’attribut CSS3 font-face.
Utilisation de l’attribut CSS3 @font-face La technique que j’utilise le plus souvent est celle de l’attribut @font-face puisque je trouve son intégration très rapide, facile et versatile par rapport aux différents fureteurs tant au niveau MAC que PC. Copiez le code de la feuille de style et intégrez-le à votre fichier CSS. N.B.