5177 sujets

Le Bar du forum

Bonjour,

Ce commentaire ne me donne pas envie de tester :
Jean Claude Attitude a écrit :
mmm, mouai ca génère des balises tables, c’est encore pas du XHTML Transitional ou Strict, donc meme si ça peut faire gagner du temps, il vaut mieux apprendre le CSS. En tout cas merci d’avoir pris le temps de faire un tuto, qui aidera les débutants

Le jour où un logiciel wysiwyg ou de création graphique générera un code propre, ça sera une belle avancée...
Modifié par Smiley neko (03 May 2006 - 10:31)
je n'ai pas encore essayer, mais je vais le faire!
je donnerai mes impressions suite à l'expérience.
Smiley smile

<edit>ça vaut peut etre le coup d'essayer quand même!</edit>
Modifié par Maxwell (03 May 2006 - 10:39)
ben fait ce n'est pas si mauvais que cela, enfin je pense:
test de découpage Xhtml/css via Photoshop et image ready

En tout cas, c'est valide!!!

J'ai fait plusieurs essais, et pas de trace de <table>!!
beaucoup de DIV mais pas de tableau!!!
le code css est assez pauvre, mais permet d'avoir effectivement une base de travail!

NB le test est succint, il faudrait pousser un peu plus loin, ce que je ferai a la prochaine occasion.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>elke4</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<!-- ImageReady Styles (elke4.psd) -->
<style type="text/css">
<!--

#Tableau_01 {
	position:absolute;
	left:0px;
	top:0px;
	width:780px;
	height:820px;
}

#id01_ {
	position:absolute;
	left:0px;
	top:0px;
	width:780px;
	height:298px;
}

#id02_ {
	position:absolute;
	left:0px;
	top:298px;
	width:6px;
	height:522px;
}

#id03_ {
	position:absolute;
	left:6px;
	top:298px;
	width:746px;
	height:23px;
}

#id04_ {
	position:absolute;
	left:752px;
	top:298px;
	width:28px;
	height:522px;
}

#id05_ {
	position:absolute;
	left:6px;
	top:321px;
	width:746px;
	height:499px;
}

-->
</style>
<!-- End ImageReady Styles -->
</head>
<body style="background-color:#FFFFFF;">
<!-- ImageReady Slices (elke4.psd) -->
<div id="Tableau_01">
	<div id="id01_">
		<img id="id01" src="images/01.jpg" width="780" height="298" alt="" />

	</div>
	<div id="id02_">
		<img id="id02" src="images/02.jpg" width="6" height="522" alt="" />
	</div>
	<div id="id03_">
		<img id="id03" src="images/03.jpg" width="746" height="23" alt="" />
	</div>
	<div id="id04_">
		<img id="id04" src="images/04.jpg" width="28" height="522" alt="" />

	</div>
	<div id="id05_">
		<img id="id05" src="images/05.jpg" width="746" height="499" alt="" />
	</div>
</div>
<!-- End ImageReady Slices -->
</body>
</html>



le template n'est pas de moi, mais du site officiel d'Adobe (pour info!)
Modifié par Maxwell (03 May 2006 - 11:23)
Marvin Le Rouge a écrit :
Un id suffit parfois pour savoir que l'approche est mauvaise ...

#Tableau_01


Peut être est ce une volonté des developpeurs afin de permettre au novice en CSS de ne pas trop se perdre?! ( j'extrapole ! )

En tout cas, c'est deja un pas en avant de la part d'Adobe vers les standards!!
a écrit :
En tout cas, c'est deja un pas en avant de la part d'Adobe vers les standards!!
Oui, c'est déjà ça.
Le code est assez bien présenté, commenté. Et oui, c'est dommage pour le div#tableau_01... curieux nom. Smiley lol
-1 également pour le style du body appliqué sur lui et non pas dans feuille de style.
Le code supporte ce DOCTYPE :
a écrit :
This Page Is Valid XHTML 1.0 Strict!
Bonjour,

juste une petite précision, je ne m'appelle pas jean-claude Smiley eek , mais jean-jacques Smiley biggrin .
Il est clair que le tutoriel que je propose sur mon blog n'est pas une belle façon de générer une css, ce qui est très instructif ce sont les commentaires qui ont été générés sur le sujet qui ont permit de mettre à jour les limites de cette approche.

Concernant la sémantique des balises div ont peut quand même y faire quelquechose en les renommant dans image ready ce qui permet d'améliorer un tout petit peu le résultat Smiley cligne .

A propos des tableaux et bien je peux vous assurer qu'il n'y en a aucuns dans le code généré par image ready. J'ai également testé de passer tout ça dans un validateur et l'ensemble XHTML (strict) + CSS sont valides et bien formés (on est bien loin de la tag soup générée par d'autres produits Smiley lol ).

Merci à toute l'équipe d'Alsa création car votre site est vraiment excellent !

Bonne continuation !

Jean-Jacques
Administrateur
jeanjacques a écrit :
Merci à toute l'équipe d'Alsa création car votre site est vraiment excellent !

Râââh Smiley biggol

Bonjour à toi quand-même hein Smiley cligne
hum si cela ne génère que des images, je vois mal comment l'utilisateur peut insérer un autre contenu par la suite ?
Noisequik a écrit :
hum si cela ne génère que des images, je vois mal comment l'utilisateur peut insérer un autre contenu par la suite ?


Ensuite c'est a toi de faire une legere manipulation du code,
si tu places les images dans la feuille de style,
tu as le champ libre pour tes textes!
Modifié par Maxwell (03 May 2006 - 15:17)
Ce ne genère pas que des images, comme je l'ai expliqué sur un post que je ne retrouve pas, sous Imageready, on peut très bien préciser du texte html à insérer dans une "tranche", au final il exporte un div contenant du texte.
Bon je viens de vérifier :
L'option html ce situe dans la boite flotante tranche (menu fenetre > tranche).

- Choisir type : pas d'image
- selectionner : le texte est en html

On peut lui mettre un background et d'autres options.

Bon je viens de tester sur une maquette simple et ça marche. Smiley smile

j'avais mes beaux hn et mon p.

Au final ca genere des div en position absolute mais j'ai pas cherché non plus dans les milliards de reglages.
a écrit :
A propos des tableaux et bien je peux vous assurer qu'il n'y en a aucuns dans le code généré par image ready.
Oui, on a vu. Par contre, il y a un div#tableau, ce qui est marrant comme nom. Smiley cligne
neko a écrit :
A propos des tableaux et bien je peux vous assurer qu'il n'y en a aucuns dans le code généré par image ready.
Oui, on a vu. Par contre, il y a un div#tableau, ce qui est marrant comme nom. Smiley cligne

A mon avis (et je ne pense pas que Nostradamus me contredira sur ce point), c'est tout simplement dû au fait que les développeurs qui ont fait ça étaient (sont ?) tellement habitués aux tableaux qu'ils ont simplement fait l'association "mon tableau d'avant = mon div de plus gros niveau hiérarchique maintenant".
Et ils sont aussi atteint de divite et d'absolutite aigüe.
Mais bon, il est certain qu'il y a un sacré mieux par rapport au code que ces outils généraient avant.
Je mettrais donc un "A fait de gros efforts. Doit persévérer dans cette voie." Smiley lol
Euhhh le pire marvin... c'est que c'est mon photosop 7 qui le fait. Smiley lol

Donc c'est pas récent.

Aymeric, j'avoue avoir découvert un truc.
A partir du moment où ce ne sont que des découpes d'images, réalisées à la main, je vois pas comment pourrais faire autrement le logiciel que de mettre une div pour chaque image... A la limite, des images en position:absolute; ...

Après, si on veut une page bien pensée, c'est à nous de la penser, en faisant les fonds, en réflechissant sur plusieurs niveaux. Un logiciel ne saura sans-doute jamais (ou alors dans un avenir d'intelligence artificielle) faire cela.