Archives par Tags :(x)html

Bien débuter l’étude des comportements CSS : synthèse de vos contributions

Avec un peu de retard pour cause d’actualité professionnelle surchargée, je vais donc faire une première synthèse des idées et pistes que vous avez proposé. Pour rappel, le billet à l’origine de cette synthèse est le suivant : Appel à contribution : bien débuter l’étude des comportements CSS Ma proposition initiale : Pour ma part, pour bien [...]

Lire : Bien débuter l’étude des comportements CSS : synthèse de vos contributions

Limitation des habillages avancés de blog Typepad

Vous pouvez faire des habillages avancés en éditant le code HTMl et la feuille de style CSS… Ils oublient juste de rappeler pour les webdesigners qui ont la mémoire courte qu’il est impossible de modifier la structure de la page de prévisualisation de commentaires et du captcha… j’ai l’air fin avec mon nettoyage de balises [...]

Lire : Limitation des habillages avancés de blog Typepad

Appel à contribution : bien débuter l’étude des comportements CSS

J’ai reçu un email ce matin d’un visiteur du blog qui m’a posé une question très intéressante : Par quoi commencer l’étude des feuilles de style CSS ? Pour bien répondre à Loic, je vais donc préparer un « plan de formation » sous la forme d’un billet à venir, mais vos avis m’intéressent aussi grandement pour voir [...]

Lire : Appel à contribution : bien débuter l’étude des comportements CSS

Site internet WordPress : lamigraine.org

Et voila, le quatrième billet de la série « processus de création ».

Je vous présente donc lamigraine.org, site à vocation communautaire sur le thème de la migraine et des céphalées.

Pour reprendre les bonnes habitudes, nous allons donc étudier ce dossier, du cahier des charges initial à la réalisation finale.

Lire : Site internet WordPress : lamigraine.org

Correction d’exercice : un menu en rollover façon "dock" Mac

Pour rappel, l’exercice ce trouve à cette adresse : Exercice CSS : un menu en « rollover façon « Dock Mac »

Comme il y a deux exercices pour le prix d’un seul, et le corrigé risque d’être un peu long, on va donc cliquer sur « lire la suite… »

Lire : Correction d’exercice : un menu en rollover façon "dock" Mac

Dans la série non ils ne sont pas morts….

On aurait besoin d’une intégration de pages html pour notre intranet, attention, beaucoup de postes client sont encore en Nescape 4.X et Internet Explorer 5.X… Maquettes reçue, jolie, facile à faire… en html/CSS2… Parce que j’ai aussi les recommandations techniques… (x)html et CSS2. CSS2 et netscape 4.X…. wai, wai, wai… Et sans tableaux de mise [...]

Lire : Dans la série non ils ne sont pas morts….

Exercice CSS : un menu en "rollover façon "Dock Mac"

Voila, après le teasing, voici l’exercice en entier, même si je sais que certains d’entre vous on déjà commencé à creuser le problème.

Aujourd’hui, nous avons deux exercices au lieu d’un seul.

Pourquoi deux ? Pour pouvoir gérer des différences de niveau de maitrise des outils, nous aurons donc une version « simple » de l’exercice accessible même aux débutants et une version plus complexe pour que les « cadors » puissent se creuser les neurones.

C’est parti !

Lire : Exercice CSS : un menu en "rollover façon "Dock Mac"

Correction d’exercice CSS : un pied de page qui dépasse sur le contenu

Pour rappel :

Le lien vers l’exercice : Exercice CSS : un pied de page qui dépasse sur le contenu

Et les consignes :

Un pied de page qui dépasse sur le contenu de la page

  • Objectif : à la fin de cet exercice, vous serez, normalement, capables, de positionner des éléments graphiques inclus dans la partie appelée « pied de page » de façon à ce qu’ils se superposent avec des contenus présents dans des éléments supérieurs de la page (voir image fournie pour une meilleure visualisation).
  • Niveau de difficulté : complexe
  • Difficulté détectée : Mise en page en trois colonnes, la colonne de gauche à un fond de couleur.
  • Pré requis techniques : connaitre les balises html, bases de CSS, une bonne connaissance des différents types de positionnement et leurs interactions est nécessaire (des sources sont fournies en bas de page).
  • Matériel nécessaire : Un éditeur de texte (ou html) et un logiciel de gestion d’images (the Gimp ou photoshop par exemple).
  • Informations complémentaires : Le design à une largeur fixe, les textes des colonnes visibles dans l’image jointe ne sont là qu’a titre indicatif, il faut, au final, que le texte du contenu central soit clairement positionné comme précisé sur le visuel. Comme toujours, le code html et CSS doivent être valides, c’est le minimum, je vous laisse tout liberté au niveau de contraintes supplémentaires si vous en avez envie. Bien sur au minimum compatible avec les principaux navigateurs du marché.

L’image

miniature de l'image de référence de l'exercice

Pour la suite, c’est par ici…

Lire : Correction d’exercice CSS : un pied de page qui dépasse sur le contenu

Exercice CSS : un pied de page qui dépasse sur le contenu

La semaine dernière, je vous avais parlé d’une maquette à réaliser en urgence. Cette maquette a été acceptée par le client, moyennant quelques petites modifications, mais le prestataire en charge de l’intégration m’est tombée dessus à propos de certaines libertés que j’avais prises d’un point de vue de la mise en page (coucou Myriam ;) [...]

Lire : Exercice CSS : un pied de page qui dépasse sur le contenu

Pensez CSS et (X)HTML dés l’élaboration de votre maquette

Si il ne devait rester qu’une différence entre un Webdesigner et un graphiste, ce serait celle là : le Webdesigner pense Web, le Graphiste pense graphisme. Dit comme ça, nous avons une belle lapalissade, mais croyez moi, c’est vrai. Ce n’est d’ailleurs pas pour rien que la plupart des graphistes que je connais et qui « font [...]

Lire : Pensez CSS et (X)HTML dés l’élaboration de votre maquette