| ||||||||
Astucien | Bonjour
Ce post concerne l'affichage...
J'ai lu le post de Malcom sur les conseils donnés aux débutants (ce qui doit etre mon cas) notamment sur l'affichage.
Il conseille de travailer en % plutot qu'en pxl
Je dis "ok"
mais comment peut on changer des pages qui ont deja été concue en tenant compte de la résolution du pc ou elles ont été crées!
Sachant que je travaille sous NVU...
Merci d'avance pour votre aide!!
@+
ted
| |||||||
Publicité | ||||||||
| ||||||||
Petit astucien | Dans le cas gÚnÚral c'est les tableaux dans lesquels s'affichent le contenu qui sont calculÚs avec une largeur correspondant Ó la rÚsolution d'Úcran.
Par exemple.
<table width="780px"> pour une rÚsolution de 800*600
<table width="1000px"> pour une rÚsolution de 1024 * 768
Nota : les valeurs sont infÚrieures Ó la rÚsolution pour tenir compte de la barre de scroll et bordure.
Beaucoup sont optimisÚs pour 800*600. Alors que cette rÚsolution tombe en dÚsaffection. Moins de 10% dans le dernier sondage de pcinpact. En fin, bref, chacun fait ce qu'il veut !
Quoiqu'il en soit si tu veux que ton site occupe la largeur de l'Úcran quelque soit la rÚsolution tu remplaces dans tous les cas :
<table width="XXXpx"> par <table width="100%">
Il te faut adapter Úventuellement images et fonds.
Si les balises sont des <div> avec des calques, tu fais la mÛme chose dans le css.
Tu remplaces par exemple body {width:800px} par body{width:100%}
Bon surf, bon scrpt !
Et le bonjour Ó Malcolm qui est de bon conseil.
*Á* (morkania & dnf) :-)))
| |||||||
Astucien | Ok merci mais j'ai vraiment bcp de tableau, ca serait un peu long!
N'est ce pas plus rapide de faire trois site pour les trois resolutions les plus reprÚsentÚes???
Merci
@+
ted | |||||||
Maître astucien | Salut
Une autre solution que j'ai appliquÚ , l'utilisation d'une rÚsolution 800x600 que je centre quelque soit la rÚsolution , comme þa tout va bien . Je ne vois pas refaire toutes mes pages pour du 1024 ou du 1200 ( j'ai pour l'instant 220 fichiers et 35 dossiers .......... [boom] ) .
A + | |||||||
Petit astucien | En php , tu en as pour un instant.
CÓ m'a donnÚ une idÚe !
J'ai scriptÚ une moulinette pour tranformer les 800, 1024 , 1200 etc... en 100%
Voilou
1- On copicolle les fichiers Ó traiter dans un rÚpertoire siteatraiter/ ( ou un autre nom)
2-On liste les fichiers Ó traiter
= Ó l'aide du bloc-note Úcrire simplement le nom des fichiers dans une page fichiers.txt
RÚgle 1 - si le fichier est dans un dossier indiquer simplemnt le chemin depuis la racine du rÚpertoire
RÚgle 2 - 1 seul fichier par ligne et on commence en haut.
Exemple de liste :
index.php
moi.html
pages/yoplaboum.html
*****************************************************
fichiers.txt doit Ûtre mis Ó la racine du rÚpertoire des fichiers Ó changer.
On aurait pu utiliser une fonction qui liste automatiquement les fichiers du site, mais si on ne veut pas tous les changer, cÓ permet de maitriser la chose.
[code]<?
//fichier changemoissa.php Ó mettre Ó la racine du rÚpertoire des fichiers Ó changer
if(empty($_POST["ok"])) {$_POST["ok"]="";}
$ok=$_POST["ok"];
if($ok!=""){
//Tableau de toute les largeurs (width) Ó remplacer par 100%
$valeurs=array(800,1024,1200,"800px","1024px","1200px");
// On peut en ajouter
// Ou mettre la totalitÚ de l'attribut => "width=800" si on a peur que des valeurs numÚriques soient affectÚes dans le site.
$fichiers=file("fichiers.txt");
for($n=0;$n<count($fichiers);$n++){
$fichiers[$n]=rtrim($fichiers[$n]);
$changemoissa=file($fichiers[$n]);
for($i=0;$i<count($changemoissa);$i++){
for($k=0;$k<count($valeurs);$k++){
$changemoissa[$i]=str_replace("width=\"".$valeurs[$k]."\"","width=\"100%\"",$changemoissa[$i]);
}
}
$fp=fopen($fichiers[$n],"w");
for($i=0;$i<count($changemoissa);$i++){ fwrite($fp,$changemoissa[$i]);}
fclose($fp);
}
}
echo "<form method=\"post\"><input type=\"submit\" name=\"ok\" value=\"changer\"></form>";[/code]
Le cas ÚchÚant, veiller Ó ce les attributs des fichiers CHMOD permettent de les rÚÚcrire. Mais si vous e faite en local, aucun problÚme.
J'ai mis un bouton d'actionnage de la purÚe pour vous permettre de rÚflÚchir une derniÞre fois :-)))))
C type top non ! On dira pas, Malcolm, mais þÓ envoie les tablos multidimentionnels.
@+
*Á*
Modifié par midnightblue le 28/11/2005 23:00 | |||||||
Astucien | Waou
super la solution en php [bierre][bierre][dent]
Mais bon, le php, j'y comprends pas comme langage mais bon je pourrais essayer...
Je te tiens au courant!
@+
ted[idee]
Ps: Malcom serait-il si celebre??? [clindoeil] | |||||||
Astucien | midnightblue a Úcrit :
Je rectifie, en php si on connait, y en a pour un instant[clindoeil]
En php , tu en as pour un instant. 1- On copicolle les fichiers Ó traiter dans un rÚpertoire siteatraiter/ ( ou un autre nom)
Jusque la, ca va...[approuve]
2-On liste les fichiers Ó traiter
= Ó l'aide du bloc-note Úcrire simplement le nom des fichiers dans une page fichiers.txt
RÚgle 1 - si le fichier est dans un dossier indiquer simplemnt le chemin depuis la racine du rÚpertoire
RÚgle 2 - 1 seul fichier par ligne et on commence en haut.
Exemple de liste :
index.php
moi.html
pages/yoplaboum.html
Je liste tous les fichiers des pages (photos, arriere plans, etc..? ou juste les fichiers html
fichiers.txt doit Ûtre mis Ó la racine du rÚpertoire des fichiers Ó changer.
Au risque de passer pour un ignare de la technologie de Mr.Atanasoff John Vincent (l'inventeur du premier pc) et Mr Gates , la racine du repertoire, euh c'est quoi??...[rougir][rougir]
Pour le reste du code, quelles sont les parties que je dois modifier??...
Voila, dÚsolÚ d'avoir encore si peu de connaissances!
Je mets quand meme un rÚsolu...
@+
tedModifié par ted the Ors le 28/11/2005 23:23 | |||||||
Petit astucien | Tu mets seulement les fichiers htlml ou htm suivant comment tu les as nommÚs.
Avant d'entreprendre l'opÚration pense Ó faire tout de mÛme une sauvegarde de tes fichiers.
A la racine du rÚpertoire , þÓ veut dire immÚdiatement "dedans" (= pas dans un sous-dossier.)
Donc tu ouvres le dossier du rÚpertoire, et tu enregistres le fichier Ó cet endroit.
Pour le code, il ne faut surtout rien toucher sauf Úventuellement la ligne avec le tableau des valeurs Ó changer et seulement si tu veux transformer d'autres rÚsolutions d'Úcran.
Tu copie colles le code tel-quel dans ton bloc note et tu nommes la page changemoissa.php. C'EST TOUT.
Pour la pratique, j'ai essayÚ en local avec 3 petits fichiers : þÓ marche.
En local (sur ton PC) , il te faut Easyphp ou similaire pour ouvrir la page changemoissa.php
Sinon tu fais þÓ direct sur le serveur de ton hÚbergeur mais pense Ó donner les CHMOD suffisants Ó tes fichiers pour que php puisse y re-Úcrire dedans. Clic droit dessus et cocher les cases correspondantes aux droits d'Úcriture.
A+.
*Á*
Modifié par midnightblue le 29/11/2005 00:21 | |||||||
Astucien | Bonjour
Bon je crois que c'est bon, mais je laisse Ó ceux qui ont la motiv' essayer pour voir si l'affichage est correcte pour les 3 rÚsolutions...
Merci encore Ó Midnightblue!
@+
ted | |||||||
Astucien | Slt
Midnight blue, est ce que tu peux me dire ce que t'en penses quand meme...
Voila l'adresse:
http://www.webescapeplan.host-gratuit.net/
MErki d'avance
@+
ted | |||||||
Petit astucien | Hello Ted,
J'ai ÚtÚ faire un tour sur ton site.
Bravo pour le style, il convient bien au thÚme, du moins c'est mon avis perso. J'adore la page LineUP ! Et les pavÚs Ó droite sont bien lisibles, bien mis en valeur. Par contre dans la page Bio le caractÞre est trop petit par rapport Ó la longueur de la ligne et le texte est difficilement lisible sans un gros effort de l'oeil. LÓ tu devrais tu devrais t'inspirer de Line Up...
Pour les autres pages tu as bien su varier la prÚsentation tout en restant dans le mÛme style. C'est prometteur!
Bravo (re) en tout cas et bonne continuation.[bierre]
A+
*Á* | |||||||
Astucien | yop midnight, morkania oui je me rappelle bien ... [clindoeil]
ta solution de proposer des tableaux en php est "pratique", mais souffre d'une chose AMHA : le tableau est fait pour prÚsenter des donnÚes tabulaires et non de la mise en page ...
gÚnÚrer un tableau 'Ó la volÚe' est trÞs pratique, mais þa sous entend que le tableau est toujours du mlÛme style, or ceux qui les utilisent pour la mise en page se trouvent bien souvent confrontÚs Ó devoir imbriquer des tableaux dans ces cellules de tableau ...
Travailler en % ou en pixels peut se valoir, si tu fais un site Ó largeur fixe, tu peux le prÚvoir pour un affichage potable en 800 (sachant que ces rÚsolutions sont assez minoritaires) et un affichage correct en 1024 et + ...
Autrement la solution de pourcentage s'offre entiÞrement, dans toute la splendeur des CSS. Voyez par exemple le site http://unreal2004.free.fr
quelle que soit la rÚsolution, l'image de fond (qui, nativement, est en 800x600) s'affiche en entier ... | |||||||
Astucien | midnightblue a Úcrit :
Merci c'est supre encourageant...
Quand au design, certaines personnes m'ont dit que c'Útait trop fouilli...Je suis en train d'hesiter Ó passer par un kit graphiques, mais c'est tellement moins personnel...
En tout cas, pour la page Bio, je ne comprends pas parce que j'ai augmenter la taille de police, et chez moi je le vois parfaitement, chez les autres, ca marche pas...alors que la police utilisÚ est conventionnelle...
Bon, en tout cas, merci beaucoup, pour l'affichage, le probleme est rÚsolu...
Bonne continuation
@+
ted
Hello Ted, J'ai ÚtÚ faire un tour sur ton site. Bravo pour le style, il convient bien au thÚme, du moins c'est mon avis perso. J'adore la page LineUP ! Et les pavÚs Ó droite sont bien lisibles, bien mis en valeur. Par contre dans la page Bio le caractÞre est trop petit par rapport Ó la longueur de la ligne et le texte est difficilement lisible sans un gros effort de l'oeil. LÓ tu devrais tu devrais t'inspirer de Line Up... Pour les autres pages tu as bien su varier la prÚsentation tout en restant dans le mÛme style. C'est prometteur! Bravo (re) en tout cas et bonne continuation.[bierre] A+ *Á* | |||||||
Petit astucien | Pour que le texte soit lisible remplace la balise
<small style="font-family:Garamond">
par
<p style=font-family:Garamond; font-size:14px>
Pense Ó refermer la balise en fin de texte.
</p>
Et si possible rÚduit la largeur de ce pavÚ. Au delÓ de 50-60 signes par ligne l'oeil fatigue et au delÓ de 120 signes c'est critique.
Pour amÚliorer encore le parcours visuel sur ton site, tu peux affecter la mÛme couleur Ó tous les textes "Ó lire". Par exemple le gris de la page LineUp. C'est des petits trucs comme þÓ qui aident l'oeil Ó se repÚrer, et rendent finalement le site agrÚable Ó dÚcouvrir.
Bonne semaine.
*Á* | |||||||
Grande Maîtresse astucienne | Malcolm a Úcrit :
Salut Malcolm,
Avec une barre de dÚfilement horizontale en 800x600. [clindoeil]
Autrement la solution de pourcentage s'offre entiÞrement, dans toute la splendeur des CSS. Voyez par exemple le site http://unreal2004.free.fr quelle que soit la rÚsolution, l'image de fond (qui, nativement, est en 800x600) s'affiche en entier ... | |||||||
Astucien | pour le contenu, oui, pas pour l'image de fond ... | |||||||
|
Les bons plans du moment PC Astuces | Tous les Bons Plans | ||||||||||||||||||
|