Tester un tuto : faire un design CSS à la portée de tous

Tester un tuto : faire un design CSS à la portée de tous - HTML/CSS - Programmation

Marsh Posté le 01-09-2003 à 14:08:52    

Je suis en train de faire un ébauche pour expliquer simplement comment créer un design en CSS.  
--> http://www.alsacreations.com/articles/design/
 
L'idée est que ce tuto soit vraiment à la portée de tous, même ceux qui n'ont jamais vraiment mis les mains dans le code et d'expliquer très basiquement comment on peut utiliser les CSS autrement que pour changer la couleur d'un lien ;)
 
Je commencere simplement par expliquer quels sont les avantages (sans prosélytisme), mais aussi les inconvénients (mettre les mains dans le cambouis du code pour les trucs complexes), puis parler un peu de compatibilités navigateurs.
 
Ensuite, on aboutit à une construction de page classique (entête, menu gauche, partie centrale, pied de page)... mais en CSS expliqués simplement... voire en montrant comment le faire entièrement avec l'outil CSS de Dream, car c'est possible !  
 
Dites-moi :
- si ce n'est pas trop engagé (oui, je m'emporte parfois)
- si c'est assez compréhensible, même pour un newbie
- s'il n'y a pas de grosses bêtises ;)
 
Merci d'avance


---------------
www.polychromies.com (Portfolio) - www.photographier-bebe.com (livre photo de bébé) - www.alsacreations.com
Reply

Marsh Posté le 01-09-2003 à 14:08:52   

Reply

Marsh Posté le 01-09-2003 à 14:17:47    

hop, pendant que je te tiens, tu n'as pas répondu à mon mail concernant la première relecture ;)

Reply

Marsh Posté le 01-09-2003 à 14:20:44    

Ouais, j'avais mis ça un peu de côté en effet pour pallier à des demandes plus pressantes ;)
Mais on ve pouvoir regarder ça de très près...


---------------
www.polychromies.com (Portfolio) - www.photographier-bebe.com (livre photo de bébé) - www.alsacreations.com
Reply

Marsh Posté le 01-09-2003 à 14:43:57    

c'est très bien. Mais tu t'emportes un peu

Reply

Marsh Posté le 01-09-2003 à 14:46:58    

JagStang a écrit :

Mais tu t'emportes un peu

Et encore, j'ai essayé d'être raisonnable ! ;) Peux-tu me dire à quel endroit ça t'a gêné ?


---------------
www.polychromies.com (Portfolio) - www.photographier-bebe.com (livre photo de bébé) - www.alsacreations.com
Reply

Marsh Posté le 01-09-2003 à 15:31:31    

A aucun endroit en particulier mais je ne vios pas trop l'intérêt en fait. Il existe déjà des centaines (milliers) de pages traitat de "Comment faire un site web". Un de plus, mais pourquoi pas

Reply

Marsh Posté le 01-09-2003 à 15:32:54    

Mais ne le prend pas mal, je respecte ton travail et ton esprit communautaire   :)

Reply

Marsh Posté le 01-09-2003 à 15:37:14    

JagStang a écrit :

Il existe déjà des centaines (milliers) de pages traitat de "Comment faire un site web".  

Ah bon, en CSS pur ? J'en connais vraiment très peu en français (5 ou 6) et je les trouve assez peu accessibles aux débutants.


---------------
www.polychromies.com (Portfolio) - www.photographier-bebe.com (livre photo de bébé) - www.alsacreations.com
Reply

Marsh Posté le 01-09-2003 à 19:25:05    

J'aime bcp tes articles et ils vont très bien comme ressources complémentaires à OpenWeb.  
 
Le site de alsa est super mais il manque peut-être une marge pour le texte. Si l'écran de l'ordinateur est un peu rogné ben on aura de la peine à lire.
 
C'est très bien de faire ce travail et on n'a jamais assez de bonnes ressource comparé au centaines de sites poubelle qui traitent du sujet  :sweat: .
 
 :hello:

Reply

Marsh Posté le 01-09-2003 à 19:28:37    

je vois que tu conseil ce genre de chose
 

Code :
  1. a.image:hover { /* définition de la classe "image" de la balise <a> au survol */
  2.      background: url(image2.gif) no-repeat center center; /* source de l'image d'arrivée */
  3.      }


 
Sais tu que IE6 a un bug avec les a:hover et les images de fond  :sweat:  ? Sait tu comment le contourner  :??: ...
 
Moi j'y ai perdu des heures ...

Reply

Marsh Posté le 01-09-2003 à 19:28:37   

Reply

Marsh Posté le 01-09-2003 à 19:59:13    

greut a écrit :

je vois que tu conseil ce genre de chose
 

Code :
  1. a.image:hover { /* définition de la classe "image" de la balise <a> au survol */
  2.      background: url(image2.gif) no-repeat center center; /* source de l'image d'arrivée */
  3.      }


 
Sais tu que IE6 a un bug avec les a:hover et les images de fond  :sweat:  ? Sait tu comment le contourner  :??: ...
 
Moi j'y ai perdu des heures ...


Pas de problème sur le mien (IE 6.0.2800).
Par contre, je viens de remarquer une erreur :  
c'est background: url(image2.gif) no-repeat center middle;


---------------
www.polychromies.com (Portfolio) - www.photographier-bebe.com (livre photo de bébé) - www.alsacreations.com
Reply

Marsh Posté le 01-09-2003 à 20:04:02    

Citation :


Prérequis : connaissances de base en CSS


 
Je pige pas, vu que tu t'adresses à des newbies... surtout que ton tutorial n'est pas hyper poussé


---------------
What if I were smiling and running into your arms? Would you see then what I see now?  
Reply

Marsh Posté le 01-09-2003 à 20:04:24    

vas donc jeter un coup d'oeil ici : http://forum.hardware.fr/forum2.ph [...] subcat=389

Reply

Marsh Posté le 01-09-2003 à 20:56:24    

OK lu. Oui c'est curieux en effet
 
JagStang > tu as raison, je vais supprimer ça ;)


---------------
www.polychromies.com (Portfolio) - www.photographier-bebe.com (livre photo de bébé) - www.alsacreations.com
Reply

Marsh Posté le 01-09-2003 à 22:09:35    

SIBELIUS a écrit :


c'est background: url(image2.gif) no-repeat center middle;


Non, non c'est bien "center center" (ou alors un seul "center" )


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
Reply

Marsh Posté le 02-09-2003 à 00:16:27    

gm_superstar a écrit :


Non, non c'est bien "center center" (ou alors un seul "center" )


Ah, on m'aurait menti ? http://selfhtml.selfhtml.com.fr/cs [...] d_position


---------------
www.polychromies.com (Portfolio) - www.photographier-bebe.com (livre photo de bébé) - www.alsacreations.com
Reply

Marsh Posté le 02-09-2003 à 00:33:47    

super, je suis hyper impatient de voir ça, et n'hesite pas à bien pousser ton tuto, il faut que je me fasse un menu en css :)
 
bon courage ;)

Reply

Marsh Posté le 02-09-2003 à 00:39:38    

KdZ' a écrit :

super, je suis hyper impatient de voir ça, et n'hesite pas à bien pousser ton tuto, il faut que je me fasse un menu en css :)
 
bon courage ;)


Non, ce tuto n'ira pas plus loin que ça, il sert juste à poser les bases.
Pour les trucs plus évolués, j'ai ma liste ici : http://www.alsacreations.com/articles/


---------------
www.polychromies.com (Portfolio) - www.photographier-bebe.com (livre photo de bébé) - www.alsacreations.com
Reply

Marsh Posté le 02-09-2003 à 00:44:48    

ah ben si on ne peut plus se fier à selfhtml  :(


---------------
www.polychromies.com (Portfolio) - www.photographier-bebe.com (livre photo de bébé) - www.alsacreations.com
Reply

Marsh Posté le 02-09-2003 à 00:52:23    

Les docs de selfhtml sont vieilles. Il se peut qu'elles aient été écrites alors que les CSS2 n'étaient qu'à l'état de propositions.


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
Reply

Marsh Posté le    

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed