Des dizaines de gabarits XHTML / CSS : 2 colonnes, 3 colonnes, largeur fixe ou fluide, etc. Vous pouvez utiliser ces gabarits comme base de vos mises en pages, ou tout simplement étudier leur construction pour progresser en HTML et CSS. Ces gabarits sont librement utilisables pour tout projet, selon les termes des conditions d'utilisation.
L’A.G.R. représente la Ligue d'Alsace de la Fédération Sportive et Culturelle de France et regroupe : * 240 associations affiliées, * 40000 adhérents dont 15000 licenciés. Elle est également habilitée pour la formation de l’encadrement des centres de Vacances et de Loisirs (BAFA / BAFD).
]]>
Le but de ce tutoriel est de transformer le menu HTML du chapitre suivant en un menu "accordéon". Un menu "accordéon" est un menu déroulant un peu particulier, dont les sous-menus s'ouvrent au clic de souris (ou au focus). Pour cela, on va bien sûr utiliser JavaScript, mais en se basant sur la bibliothèque jQuery. J'ai utilisé la version 1.2.1 de jQuery, la plus récente au moment d'écrire ces lignes.
]]>
Présentation du CMS (Content management system) SPIP : SPIP, un système de publication pour l'internet, Avantages et inconvénients, Le travail des rédacteurs de contenu, Le travail de l'intégrateur-designeur, Étude d'un squelette, Documentation, informations et aide sur SPIP
Présentation du gestionnaire de contenu CMS Made Simple : Avantages et inconvénients, Caractéristiques spécifiques par rapport à d'autres CMS, Le travail du rédacteur de contenu, Le travail de l'intégrateur-designeur, Documentation, informations et aide sur CMSMS
Eyrolles vient de publier un nouvel ouvrage sur les feuilles de styles CSS : "Transcender CSS". Il s'agit en fait d'une traduction d'un livre de Andy Clarke, dont l'avant-propos est de Molly Holzschlag et la préface de Dave Shea. Bref, que des pointures dans le domaine. Oui mais voilà, on trouve dans ce livre une partie témoignant d'un manque de tact évident des auteurs : une inspiration (c'est le moins qu'on puisse dire) du site de l'agence française Alsacreations.fr sans aucune mention de la source...
Le principe de ce concours - que nous avions déjà organisé en 2005 - est simple : vous êtes invité à profiter de cette période estivale pour nous proposer une refonte de votre site web. L'idée est de remettre au goût du jour votre page en terme de design, mais aussi de conformité aux standards (X)HTML et CSS, puis de le soumettre au vote des membres et d'être classé dans un tableau général.
On se focalise souvent sur les feuilles de style pour le rendu à l'écran, mais une page web peut également se décliner sous la forme d'un document imprimé. Coup de chance : les feuilles de style CSS servent aussi à définir les styles pour l'impression des pages web. Elle est pas belle, la vie ?
Tout site possède au moins une partie commune à chaque page. Partant de ce constat, pourquoi ne pas insérer de manière dynamique ces éléments et éviter ainsi de dupliquer les portions de codes répétées d'une page à l'autre ? Faciliter la maintenance d'un site et permettre son évolution sans avoir besoin de tout reprendre, tel est le principal attrait de cette méthode. Alors, si comme bon nombre d'entre nous, vous êtes légèrement fainéant sur les bords, et trouvez dommage de vous embêter à ré-écrire une partie de votre code alors qu'une simple ligne suffit ... Ce tutoriel est fait pour vous ! Il vous détaille, pas à pas, la façon de procéder pour inclure un élément sur une ou plusieurs pages de votre site, au moyen de la fonction include().
Je suis relativement débutant avec CSS, auparavant j'utilisais des tableaux, et je créais mon design avec photoshop, ensuite il ne me restait plus qu'à utiliser les tranches, d'arranger un peu le code en fonction de mes besoins, et le tour était joué. Maintenant le css, je suis un peu perdu, et je n'aimerai pas perdre du temps à des "bidouillages", ma question est donc la suivante, quel est le meilleur moyen d'envisager un design CSS ?
Fans des statistiques en tout genre, mais plutôt feignant en ce qui concerne leur réalisation picturale, voici une solution basée sur les feuilles de style CSS pour mettre en valeur de façon élégante et simple diverses données à présenter.
Sylvain a choisi un exemple concret de site web et a comparé les deux méthodes de conception web : la méthode "ancienne" (tableaux, wysiwyg) et la méthode "moderne" (sémantique, css, séparation fond/forme). Il fait la distinction entre les points de vue du concepteur et celui de l'utilisateur, en terme de poids de page, de lisibilité du code, de la facilité d'entretien, de l'accessibilité, etc.
Le principe est simple : plusieurs thèmes (XHTML, CSS, accessibilité, JavaScript / DOM, PHP, etc.), plusieurs niveaux de compétence par thème, et dix questions posées sous forme de QCM. Le but est double : celui de divertir les participants, mais aussi d'apporter des pistes de connaissance sur les questions non maîtrisées, car chaque réponse fausse donne droit à une explication concrète et généralement un lien pour aller plus loin.
Un tutoriel pour apprendre à réaliser des menus "simples" (sans arborescence: tous les liens sont au même niveau) à l'aide des feuilles de style.
La question des dimensions idéales d'un site est souvent posée. Les résolutions d'écran varient généralement de 800x600 pixels à 1280x960 pixels, en passant par 1024x768. Quelle est donc la résolution à privilégier ? Quelle est la dimension idéale pour un site web ? Comment faire un design fluide "intelligent" ?
Une Foire Aux Questions concernant XHTML, CSS, l'accessibilité web, la typographie, bref, la conception web conforme aux standards actuels.
Ce tutoriel vous propose, dans la lignée de celui présentant les bonnes habitudes de codage en JavaScript, d’étudier différentes techniques permettant d’isoler votre code dans des modules « hermétiques », évitant ainsi les interactions involontaires avec le reste de votre code, ou avec le code que vous ne contrôlez pas.
De plus en plus de sites implémentent des liens particuliers connus sous le nom de "liens d'évitement" ou "liens de navigation interne" comme "Aller au menu", "Aller au contenu", "Retour en haut de page"... Bien qu'ils ne soient qu'une exigence de niveau AAA pour WCAG ou Argent pour Accessiweb, ces liens sont pourtant indispensables, notamment pour les utilisateurs de la navigation clavier. Comme tout dispositif nécessitant une adaptation spécifique de la page, ils doivent être utilisés à bon escient et réclament de respecter quelques règles d'implémentation.
Interview de la célèbre "mamie" du web accessible
]]>
Un célèbre avocat du barreau de Paris m’a posé la question cette semaine : “Mais, qu’est-ce que cette histoire de canard qui fait tant rire les geeks ?”. Étant d’un naturel serviable, je me dois de lui éclairer sa lanterne.
Le forum est devenu le coeur de la communauté Alsacréations. Il est l'endroit le plus vivant et où fourmillent des milliers de membres prêts à s'entraider, défendre la cause des standards ou simplement demander un coup de main
Internet Explorer interprète les dimensions CSS différemment des autres navigateurs, ou plutôt interprétait... Contrairement à ce que laissent supposer certains articles et propos de designers "chevronnés" qui n’en démordent pas, Internet Explorer 6 de Microsoft interprète les dimensions CSS des pages html et xhml valides de la même manière que les autres navigateurs de même génération. Alors pourquoi cette confusion ?