Optimiser un site pour différents navigateurs ?

Avec IW, chez moi, les photos sont coupées, je ne vois que la moitié, il n’y a pas de barre de défilement vertical :frowning:

+1

lol, c’est quoi un E-e-mail ?

edit : tu as vu les commentaires sur le guide du rourard point com ?? c’est toi le patron de l’hotel :smt005

Chez moi, avec Iceweasel, tout fonctionne nickel ! joli boulôt… reste plus qu’à économiser pour payer le voyage !

Edit : avec un écran 22 pouces “wide”

+1

lol, c’est quoi un E-e-mail ?[/quote] :smt005 :smt005 :smt005 Zut, même avec IW… Je ne m’en suis pas rendu compte car j’ai un écran 22"…

J’ai l’impression que je vais repartir à zéro, ce sera plus sain… Maintenant que j’ai un peu plus de notions !

Je n’ai pas encore corrigé les fautes d’orthographe, à quoi bon si le site ne fonctionne pas convenablement…

Merci à vous, sympa d’avoir testé et surtout donné un retour !

En fait, parce que je suis un promoteur de joomla depuis l’époque mambo…
Pour être plus constructif, j’avais testé spip à l’époque de la mise en place d’un site associatif mais je n’avais pas accroché - De plus, joomla est probablement pas adapté pour un site associatif de par ces modules. C’est donc effectivement une question d’être adaptable aux besoins, et du moment que c’est open source :mrgreen: hein :exclamation:

exactement, loin du débat, c’est juste une histoire de repondre à des besoins. ils ont tous les deux leurs avantages et leurs inconvenients, à chacun d’y trouver son bonheur.

j’ai mis joomla en place pour l’intranet du boulot. Il me permet de diffuser des articles, de proposer les liens vers des applis et d’encapsuler certaines pages php en tant que wrapper. en utilisant un style semblable les utilisateurs ne font pas la difference entre ce qui est joomla et ce qui est fait maison. ça spip ne sait pas le faire ou alors en mettant la main dans le code, alors que joomla le propose depuis son interface d’admin. idem pour le fait de personnaliser le menu latéral.

mais en point négatif pour joomla, en dehors du fait que l’on ne sait jamais d’où sortent les modules (+ ou - artisanal) c’est la gestion des droits qui est trop sommaire. ce que j’apprécie sur spip c’est que tu peux être simple redacteur sur une rubrique et administrateur sur une autre.

Plutôt que de t’envoyer un msg, je préfère écrire ici, c’est toujours plus constructif, pour les autres mais aussi pour moi (quand je dis une connerie, on peut me reprendre et ainsi, j’apprends [y’a pas d’âge pour ça] ).
IW 3.0.12
Donc, comme beaucoup, j’ai des photos tronquées sur l’écran du portable (1440x900).
Sur le PC-bureau (1280x1024), ça a l’air complet, si j’en juge avec les photos de la page “le spa”.
À ce sujet, ces photos mériteraient d’être centrées.
Si tu veux prendre modèle, sur mon site, que je n’ai pas mis à jour depuis au moins 5 ou 6 ans :unamused: , les photos et les pages, sont aussi bien visibles dans les deux formats http://ricardo.free.fr. clic DR sur les pages et tu as le code source de la page. Je ne me souviens plus si les css sont visibles comme ça mais sinon, dis-le moi et je te les envoie.

CSS de la page mon etabli
Bon, ça ne fonctionne pas en fichier joint, il ne veut pas de l’exyension .css :cry:

Si ça t’intéresse, voici le CSS de la page “mon établi” où il y a pas mal de trucs qui “bougent” :smt003

[code]html,body {
text-align: justify;
font-family : georgia,“times new roman”,verdana, arial, geneva, sans-serif, helvetica,serif;
background-color : #FF6600; /* ORANGE*/
}
p{
text-indent:3em;
}
h1 {
font-size : 150%;
font-family : georgia,“times new roman”,verdana, arial, geneva, sans-serif, helvetica,serif;
color : #000000;
text-align: center;
}
h2 {
font-size : 130%;
font-family : georgia,“times new roman”,verdana, arial, geneva, sans-serif, helvetica,serif;
color : #000000;
text-align:left;
}
.italic{
font-size : 100%;
font-family : “times new roman”,georgia,verdana, arial, geneva, sans-serif, helvetica,serif;
font-style: italic;
}
.cadre1 {
position: absolute;
top:1%;
left:1%;
border-style:solid;
border-width:1px;
border-color:#FFFF00; /*BLEU */
width: 98%;
height:98%;
}
.cadrereste{
position: absolute;
top:210%;
left:2%;
width: 96%;
}
.fondfeuilles{
position: absolute;
top:105%;
left:0%;
background:url(feuilles.jpg);
width: 100%;
height:100%;
}
.cadresimple{
position:relative;
top:20%;
left:2%;
width:95%;
height:10%;
color:#000000;
text-align:center;
font-size:90%;
background:#FF860F;
font-weight:bold;

}
.cadrevalid{
position:absolute;
top:93%;
left:1%;
height:25px;
width:120px;
border-style:solid;
border-width:1px;
border-color:#FFFF00; /*JAUNE */
}
.flechebas{
position:absolute;
top:91%;
right:0%;
}
.phototitre {
position:absolute;
top:27%;
left:30%;
border-style:solid;
border-width:1px;
border-color:#FFFF00; /*JAUNE /
width:43%;
height:60%; /15em/
}
ul {
list-style-type: none; /
on supprime les puces, inutiles /
}
div.menu a {
position:relative;
top:20%;
left:22%;
margin: 1%; /float: left;=Pour un affichage horizontal/
width: 50%; /
on d�finit la taille du bouton de menu */
height: 7%;
display: block;
text-align: center;
font-family:georgia,“times new roman”,verdana, arial, geneva, sans-serif, helvetica,serif;
font-size:110%;
border: 2px solid #660000;
text-decoration: none;
color: #000000;
background: #FF860F;
}
div.menu a:hover { /Change au passage de la souris/
background:#FFD016;
border: 2px solid #660000; /ATTENTION : hover tjrs en 1er/
color:#000000;
font-weight:bold;
}
div.menu a:active { /Change au cliquage/
background: #0000FF;
border: 2px solid #CC00FF;
color: #FF0000;
}
.droite {
float: right;
font-family:georgia,“times new roman”,verdana, arial,helvetica,serif;
font-size:100%;
}
.photodroite { /Visible par IE en taille grande/
margin-left:15px;
margin-top:15px;
width:30%;
height:10.5em; /ATENTION, IE n’accepte que ‘em’ pour la hauteur/
float:right;
}

/img[class=“photodroite”] {
width:15%;
height:5.2em;
}
/
/Ce qui pr�c�de permet d’avoir une image de d�part plus petite pour MFF
cette partie n’�tant pas lue par IE
/

.photodroite:hover{ /‘hover’ n’est pas pris en compte par IE/
cursor:pointer;
margin-left:15px;
margin-top:15px;
width:60%;
height:21em;
float:right;
}
.photopied { /Visible par IE en taille grande/
margin-left:15px;
margin-top:15px;
width:22%;
height:11em;
float:right;
}

/img[class=“photopied”] {
width:11%;
height:5.5em;
}
/
/* Voir note plus haut*/

.photopied:hover{ /‘hover’ n’est pas pris en compte par IE/
cursor:pointer;
margin-left:15px;
margin-top:15px;
width:44%;
height:22em;
float:right;
}
#col1 {width: 36%;} /colonnes du tableau : volume bois/
#col2 {width: 5%;}
#col3 {width: 11%;}
#col4 {width: 6%;}
#col5 {width: 30%;}
table{ /tableau du volume bois/
margin-left:13%;
font-family:“times new roman”,georgia,verdana, arial, geneva, sans-serif, helvetica,serif;
}[/code]

Ne tiens pas compte de ma remarque concernant le centrage car je n’avais pas autorisé javascript sur ta page. :blush: .
Une fois fait, c’est parfait.
.
EDIT :
j’adore le baobab :smt007

le css est visible avec les add-ons qui vont bein c’est juste ce qui est interprété côté serveur qui ne l’est pas (comme le code php par exemple)

sinon pour avoir pas mal galéré avec cette histoire d’interopérabilité IE/firefox, je peux confirmer que tu gagnera un temps fou à faire comme j’ai lu plus haut avec une feuille de style css pour chacun de ces navigateurs

[quote=“ricardo”]Plutôt que de t’envoyer un msg, je préfère écrire ici, c’est toujours plus constructif, pour les autres mais aussi pour moi (quand je dis une connerie, on peut me reprendre et ainsi, j’apprends [y’a pas d’âge pour ça] ).
IW 3.0.12
Donc, comme beaucoup, j’ai des photos tronquées sur l’écran du portable (1440x900).
Sur le PC-bureau (1280x1024), ça a l’air complet, si j’en juge avec les photos de la page “le spa”.
À ce sujet, ces photos mériteraient d’être centrées.
Si tu veux prendre modèle, sur mon site, que je n’ai pas mis à jour depuis au moins 5 ou 6 ans :unamused: , les photos et les pages, sont aussi bien visibles dans les deux formats http://ricardo.free.fr. clic DR sur les pages et tu as le code source de la page. Je ne me souviens plus si les css sont visibles comme ça mais sinon, dis-le moi et je te les envoie.[/quote]Merci beaucoup Ricardo, c’est sympa. Je regarde ça tout de suite (j’y suis déja…) et je jette un oeil sur le HTML et les CSS. J’ai toutes les extensions WEB dans IW, très pratique pour décortiquer un site…

J’ai finalement décidé de reprendre tout à zéro, ce sera sûrement plus rapide que de rectifier mes erreurs. Comme on me l’a conseillé (ici je crois ? ou j’ai lu ça ce matin sur un site quelconque ?) à chaque modification je vérifie dans IE et IW, comme ça pas de surprise.
Je suis parti d’un gabarit trouvé sur Internet (largeur fluide «intelligente», colonnes factices, colonnes latérales positionnées en float), c’est chouette, la page s’adapte très bien dans différents affichages.

Je progresse vite, je suis content de moi :blush: Je pense avoir terminé ce soir !

J’en profite pour remercier tous ceux qui ont apporté leur pierre à mon modeste édifice, vous avez été d’une aide précieuse ! Sans ce Forum je ne serais jamais parvenu à mes fins :smt055 :smt057 :smt060 Et plus encore… :laughing:
=> -50% chez moi à tous ceux qui se présentent comme venant du Forum ! (par contre je ne peux rien faire pour le billet…)

PS : mon père était compagnon ébéniste, très bien fait ton établi !
PS2 : Vous êtes plus rapides que moi… J’ai pas fini ce message que déjà deux autres viennent de s’intercaler :wink:

[quote=“ricardo”]Ne tiens pas compte de ma remarque concernant le centrage car je n’avais pas autorisé javascript sur ta page. :blush: .
Une fois fait, c’est parfait.
.
EDIT :
j’adore le baobab :smt007[/quote]Par contre, si je peux me permettre, les images sur ton site sont déformées chez moi (étirées en largeur par rapport à l’original).
Si je fais ça à mon équipe de masseuses, elles vont faire la gueule :laughing:

Juste pour dire que mettre ton slideshow (les jolies photos qui défilent) dans le pied e page Oo. C’est plutôt a mettre dans le corps de la page.
Enfin niveau visuel ça changera pas grand chose mais au niveau logique et compréhension (pour plus tard quand tu reviendra dessus ^^) ça change ^^.
Pense à tout ça si tu recommence, et essaye de faire les choses par toi même (loin de moi l’idée de jeter la pierre) car on met à jour/modifie et on apprend plus facilement/efficacement.

Continue ! et bonne chance

[quote=“lol”]Par contre, si je peux me permettre, les images sur ton site sont déformées chez moi (étirées en largeur par rapport à l’original).
Si je fais ça à mon équipe de masseuses, elles vont faire la gueule :laughing:[/quote]
C’est vrai, je m’en suis rendu compte avec l’écran large de mon portable.
J’ai la flemme de reprendre tout ça.
J’avais fait ce site pour apprendre un peu ce qu’était le html mais en fait, on en a vite fait le tour.

C’est vrai ! J’ai presque terminé la nouvelle mouture :wink:
Il faut que je travaille les photos, c’est long… J’ai testé avec IE, IW, Firefox et Chrome. Nickel ! :laughing:

Je met en ligne ce soir quand j’ai terminé, si tu as 5 minutes, j’aimerais avoir ton avis !

Encore merci pour ton aide :smt006

[quote=“lol”]
Je met en ligne ce soir quand j’ai terminé, si tu as 5 minutes, j’aimerais avoir ton avis !

Encore merci pour ton aide :smt006[/quote]
Avec plaisir mais il serait bien que tu inclues l’URL à ta signature.

Vu dans la page “Le Spa” :

On dit ‘une’ fruit à Madagascar :question:

[quote=“ricardo”]Vu dans la page “Le Spa” :

On dit ‘une’ fruit à Madagascar :question:[/quote]Tu ne laisse donc rien passer :laughing: Bon, c’est corrigé (ça parce qu’il reste des tonnes de fautes et de trucs qui ne vont pas…)
Une seule feuille de style pour tous les navigateurs :smiley:
Ton avis sur cette nouvelle mouture ? J’ai testé avec plein de navigateurs, chez moi c’est bon ! Chez vous ?
(Ne regardez pas les commentaires des photos, les photos - les masseuses si… - les textes… c’est un brouillon ! Il reste plein de petits détails à régler)

essai sur le ‘portable’, malgré l’acceptation de javascript, les photos ne sont pas toutes centrées quand on clique directement sur certaines.
Ex : celles de “Le spa”