Différence d'affichage d'un site suivant la taille de l'écran - Web design - Graphisme
Marsh Posté le 05-08-2007 à 09:55:22
non il aurait été trop gros pour un 17 pouces.
La taille de la fenêtre du salon est différente de celle des toilettes, mais ce que tu regarde à travers reste de la même taille...
Il n'y a pas de solution à ton probleme pour des images bitmap. C'est la definition même de la résolution. Certains écran affiches plus de pixels que d'autres.
Par contre il y a des "astuces" comme créer son site de tel façon qu'il soit étirable en largeur, ce qui aide un peu, mais finalement ne sert pas à grand chose, beaucoup d'autre choses ne sont pas étirables automatiquement, police, images fixes etc...
Marsh Posté le 05-08-2007 à 11:54:10
D'accord mais je remarque que pour d'autres sites, peu importe que je le reagarde avec un écran 17 pouces ou 19 pouces, les proportions sont toujours les mêmes comme si on pouvait permettre au site de s'adapter à la taille de l'écran. Je pensais qu'il y'a avait une solution. Merci tout de même pour la réponse.
Marsh Posté le 06-08-2007 à 11:26:11
Ce site là par exemple, l'affichage est identique en 17 ou 19 pouces.
http://www.mairie-orsay.fr/
Marsh Posté le 06-08-2007 à 13:46:26
Il existe plusieurs solutions pour adapter un site à la taille d'écran de l'utilisateur :
- Le design CSS liquide > exemple: ce forum
- Le design full-Flash liquide > plusieurs exemples: http://www.thefwa.com
- Le design full-Flash scalable > exemple: http://www.emerveille.fr
- La redirection vers d'autres versions du site en fonction de la détection de la taille écran de l'utilisateur
Marsh Posté le 06-08-2007 à 16:45:02
Pour ce qui est du multi-résolution, c'est un peu la merde le web
Faut faire attention aux petits écrans en 800*600 (encore 15% au moins des utilisateurs), jusqu'aux grandes résolutions :
Le mieux est de faire un design élastique : pas de taille minimum, en utilisant bien les floats on peut arriver à ce que des colonnes passent les une en-dessous des autres, pour permettre une lecture sans problème.
On mettera aussi une taille maximum, pour avoir des lignes d'une dizaine de mots. Et encore mieux, on exprimera la largeur des colonnes en em, pour s'adapater à la taille de polices.
Y'a beaucoup d'articles sur ce genre de design "élastiques". Maintenant comme dit, impossible de faire un truc pareil chez tout le monde sans trop faire chier Tant qu'il n'y a pas une bonne gestion du zoom chez tout le monde...
Marsh Posté le 06-08-2007 à 20:50:34
Non mais si t'es en 800x600 sur un 17'' et aussi en 800x600 sur un 19 c'est normal que rien ne bouge...
Ton exemple n'a rien de spécial, sur un 19 en 1024x1280 il est entouré de marge blanches très larges. Sur un 17 pouce en resolution standard donc plus petite (1024x768) il prend toute la largeur.
Ne focalise pas sur la taille de l'écran, il s'agit d'afficher des pixels, tu crées un site de X pixels de large, ben selon que tes visiteurs veulent voir Y ou Z pixels en largeur (c'est la résolution choisie et pas la taille de l'écran) ton même site sera centré ou plein écran.
Si tu crées un site en 100% comme largeur, tu vas te heurter à biens des problemes. Cohérence entre contenu "étirable" et contenu fixe.
Marsh Posté le 06-08-2007 à 21:08:10
d'où l'idée du design elastique qui convient à tout le monde
Marsh Posté le 06-08-2007 à 23:56:20
Justement non ça ne convient pas a tout le monde. Un site n'a pas une vocation à plaire à tout le monde déjà. Il n'y a aucune raison de faire son site autrement que comme on le souhaite personnellement. C'est avant tout un choix graphique, l'expression personnelle du créateur.
Tout site de quelques dimensions que ce soit, peut plaire à sa cible, ce n'est qu'une question de design cohérent.
Laissons les portes ouvertes à Jayjay. Si déja il comprends ce que nous avons expliqué sur la relation taille écran / résolutions écran.
Marsh Posté le 07-08-2007 à 00:01:17
Lactique a écrit : Un site n'a pas une vocation à plaire à tout le monde déjà. |
Euh quand-même un peu
Lactique a écrit : Il n'y a aucune raison de faire son site autrement que comme on le souhaite personnellement. C'est avant tout un choix graphique, l'expression personnelle du créateur. |
C'est le gros défaut de beaucoup de graphiste web : oublier qu'il y a beaucoup de contraintes, et faire un truc trop personnel qui s'adapte mal. Un site web ne sera pas que vu par son designer. Il sera vu par des centaines de gens avec des configurations très différentes : ça peut être la résolution d'affichage, la taille de police, le zoom. Y'a même des dingues qui désactivent les images Il faut prendre tout ça en considération, et bien réfléchir à l'usabilité-accessibilité.
Donc dans le cas de la résolution, prévoir les gens en 800*600, 1024*768 et les plus grandes tailles. Là tu trouvera la cohérence.
Marsh Posté le 07-08-2007 à 00:29:07
Merci beaucoup pour toutes ces infos. Ce que je vous propose, c'est de vous envoyer le lien de mon site quand il sera fini mais j'ai tellement d'autres problèmes à régler lol C'est difficile de tout faire d'une traite avec Dreamweaver. Chaque fois que je règle un pb, un autre surgit et pas des moindres...
J'ai crée une arborescence avec 4 thèmes : Vie quotidienne, Cadre de vie, Multimédia et Ville (je fais le site d'une mairie...).
Dans chaque thème, j'inclus en haut de ma page une bannière et juste en dessous des onglets (les thème cités précedemment) et des menus qui déroulent avec les catégories qui correspondent à ces thèmes : Rx dans Cadre de vie, mon menu déroulant propose de se rendre sur la page Environnement, Tri sélectif etc... Jusque là pas de problèmes même si j'ai lutté car mes menus déroulants sont crées sur Fireworks...
Mon pb intervient maintenant et c'est l'horreur. Prenons la page index par exemple, j'ai l'exemple type d'une page que je voudrais reproduire... 26 fois car j'ai 26 pages au total dans le site. Donc je voudrais mettre 26 fois ma bannière et... 26 fois mes onglets avec menu déroulant. Et là c'est la cata.... j'exporte de Fireworks une fichier html pour chacun de mes onglets soit 4 fichiers... je les importe dans ma page index.html à l'intérieur d'un calque... super facile.... je change de page, je refais la même opération et là gros bordel, quand j'insère le même fichier html de Fireworks, le script ne marche pas... pourquoi ???
C'est comme si je devais remultiplier 26 fois mes fichiers html Fireworks alors que pourtant ce sont les mêmes et les inclure une seule fois à la racine de mon site devrait suffire alors je suis perdu... j'ai fait 4 pages correctes... les pages d'accueil de chaque thème qui comme par hasard sont dans 4 répertoires bien distincts...
Je rencontre ce problème lorsque je veux réinsérer mes onglets dans les autres pages du même thème...
Voilà je ne sais pas qi j'ai été clair mais j'essaie de faire bcp d'efforts pour bien comprendre et je suis plutot content de ce que je réalise vu que je suis débutant mais là je ne trouve pas ça logique... je le fais sur la page index et ça marche alors pkoi pas sur les autres ?
Merci de m'aide rencore une fois, je suis exigeant, pardon d'avance.
Sébastien
Marsh Posté le 07-08-2007 à 09:11:03
Nan c'est bien, tu poses les bonnes questions.
Là tu viens de découvrir qu'il faut mieux toucher à un langage style PHP ou ASP pour gérer tes pages. Tu risques vite d'exploser si tu fais tout en HTML statique brut Malgré l'aide de Dreamweaver, il vaut mieux toucher un peu à du dynamique. Genre t'aurais une page type avec la bannière et le menu, et t'incluerais dynamiquement le contenu.
Est-ce que t'as accès à un tel langage, ou est-ce que t'es obligé de faire de l'html brut ?
Marsh Posté le 07-08-2007 à 09:59:32
Florent tu parles de défauts des graphiste. Je dirais plutot que tu parles de mauvais graphiste si ils font des erreurs aussi grossières.
Mon post va au delà de ces extrapolations de base.
Donc oui un site a une cible ou est mal positionnné. Il n'est pas fait pour plaire à tout le monde. A moins de faire un site "pour tout le monde".
Les contraintes techniques existent dans tous les métiers. C'est quand on les maîtrise que l'on commence à être professionnel. A partir de là on commence à travailler. On fait des choix artistiques assumés, c'est une notion essentielle du design. A l'extrême on repousse les limites même.
Faire tout ça en respectant les contraintes générales est très accessible et absolument pas contradictoire.
Gardez en tête que vouloir plaire à tout le monde c'est le meilleur moyen de ne plaire à personne.
Marsh Posté le 07-08-2007 à 10:03:18
Lactique a écrit : Gardez en tête que vouloir plaire à tout le monde c'est le meilleur moyen de ne plaire à personne. |
Ca c'est bien vrai
Marsh Posté le 07-08-2007 à 10:55:02
je n'ai aucune contrainte particulière, mes employeurs s'y connaissant encore moins que moi lol
j'avance effectivement en tatonnant, c'est hyper long de recommencer 26 fois la même opération. J'ai fait une page type (la page index). Dans ma tête, je me disais que faire un copier coller de tous les éléments de la page index vers les autres pouvaient suffire mais pas du tout. Les copier coller ne marche pas...
Il me semblait pourtant que les feuilles de style servaient à ça mais j'imagine que ça ne concerne que le style et pas le contenu.... mais c'est pénible car à la main, j'aurai forcément des petits décalages (quelques millimètres car comment reproduire 26 fois une page à l'identique ?? Impossible lol
J'aime bien Dreamweaver mais c'est pas évident...
Marsh Posté le 07-08-2007 à 12:14:12
Ben pour décliner tes 26 pages selon ta page principale il suffit de copier/coller dans la partie code de chacune d'entre-elles les éléments (balises meta, styles CSS, contenu, etc.) dont tu as besoin... c'est pas compiqué !
Pour faire un site qui convient à l'ensemble des résolution les plus utilisés sans te prendre la tête, pars sur une largeur de 740px de large et places un fond graphique (motifs répétés, bandes colorées, etc.).
Marsh Posté le 07-08-2007 à 15:12:09
Effectivement, j'ai déjà pu le faire sur toutes les pages d'une catégorie ce qui est déjà bien... Après il n'a pas forcément les liens pour les autres catégories donc le copier coller n'est pas efficace mais je vais m'empresser de chercher les liens et de bien les placer dans mes dossiers ça devrait le faire, merci beaucoup
Marsh Posté le 07-08-2007 à 16:43:32
Voilà j'ai toute l'arborescence de mon site. Vive le copier coller de code Html, au moins ça c'est fait. J'ai plus qu'à alimenter mes pages maintenant. de toute façon je ne peux pas faire pire que le site déjà existant...
Voilà le site en question : http://www.saint-pierre-du-perray.fr/
A moi de faire mieux que ça, on verra bien lol je l'hébergerai ensuite sur un hébergeur perso avant de le voir visible sous l'adresse officielle...
Marsh Posté le 07-08-2007 à 17:31:20
Argh, deux écrans pour *enfin* arriver au site. Après la sélection "sans flash", pourquoi afficher la page intermédiaire ? Enlève-là, elle ne sert vraiment à rien, les internautes t'en remercierons
Marsh Posté le 07-08-2007 à 17:33:45
Sinon extrêmement bof les pages faites sous word Et les frames... et la version flash avec l'intro, jamais d'intro pour un site comme ça
Marsh Posté le 07-08-2007 à 17:35:14
Autrement dit, ça sera pas compliqué de faire mieux Bon courage en tous cas. Et oublie pas de faire gaffe à l'accessibilité et à l'usabilité, surtout pour un site de ville
Marsh Posté le 07-08-2007 à 19:02:03
Mette une intro Flash à un site à vocation informative, c'est comme mettre un kit carrosserie à un véhicule utilitaire de La Poste.
Tu devrais plus travailler l'aspect pratique du site en choisissant un design plus sobre qui facilite la lecture et la recherche.
Marsh Posté le 08-08-2007 à 09:15:25
C'est exactement ce que j'ai prévu.... ouf !!! de toute façon je n'aurai pas le temps de me pencher sur une animation Flash même si je suis persuadé qu'avec flash 8 il doit y avoir moyen de faire quelque chose de sympa avec peu de connaissances... sur le site que je prépare avec un infographiste qui m'a fait les bannières, les cadres pour insérer un menu de raccourci à gauche et les onglets de mes menus déroulants on arrivera directement sur la page d'accueil... je suis d'accord une animation n'est pas forcément indispensable et il faut privilégier la navigation... Merci en tout cas pour tous vos précieux conseils... je vous dirais dès qu'il sera dispo, normalement après validation à la fin du mois ou début septembre pour la nouvelle saison lol...
Marsh Posté le 12-08-2007 à 20:22:20
Bon et bien voilà, mon site en local est pratiquement terminé. Me manque le contenu de quelques pages mais globalement l'essentiel est là et je peux le publier pour avoir une première impression...
J'ai décidé d'héberger mon site chez Multimania. Et début des problèmes, alors que j'ai l'impression qu'il télécharge tous les fichiers du site vers le serveur distant (il se connecte très bien dessus) et bien ma page d'accueil reste désespérément au même point (page en construction...)
J'ai essayé de le faire avec Filezilla, idem, il se connecte bien au serveur et semble même transférer les pages parfaitement, aucun message d'erreur et pourtant c'est toujours pareil, lorsque je vais sur ma page sur internet eh bien ma page d'accueil n'a pas bougé (site en construction...)
Pourquoi ? Que faire ? J'aimerais bien le publier maintenant...
Merci d'avance
Marsh Posté le 12-08-2007 à 21:01:15
Je ne sais pas, moi j'ouvre Filezilla, je tape les indicatifs de connexion c'a'd adresse du serveur ftp, nom d'utilisateur et mot de passe et n° port : 21
Puis il marque succès du listage de répertoire, il me met dans la colonne de droite automatiquement les 3 répertoires + ma page index qui constitue l'ensemble de mon site...
Puis voilà, en bidouillant il me marque en transfert pour les fichiers à transférer et voilà, je ne sais pas comment tester page par page...
Marsh Posté le 12-08-2007 à 23:14:39
Tester page par page, c'est assé simple.
En admétan ke tu ai deux pages qui se trouvent sur ton serveur: "index.html" et "coucou.html", pour en tester une, il te suffi de taper dans internet explorer (ou firefox) http://ladresse_de_ton_site.fr/index.html/ pour tester la page "index.html", ou taper http://ladresse_de_ton_site.fr/coucou.html/ pour tester ta page "coucou.html"
et si tu ne te sens pa a l'aise avec filezilla, vas voir sur google, il ya a quelques tuto pour parendre à maitriser l'interface.
Marsh Posté le 12-08-2007 à 23:49:48
En effet, la page ne fonctionne pas. J'ai décidé de créer un compte chez I France mais je m'aperçois que c'est Multimania qui gère tout ça. Ils ont un logiciel interne pour le transfert donc là je ne peux pas me tromper. C'est en train de transférer en ce moment donc je vois pas pourquoi ça ne fonctionnerait pas. Verdict dans quelques minutes sinon je vais me poser des questions sur ce qui bloque (arborescence, nature des fichiers ??). Je ne sais pas mais c'est pénible
Marsh Posté le 12-08-2007 à 23:53:51
J'en ai marre, ça ne fonctionne toujours pas mais alors il transfère quoi au juste ?? Je vois tous mes fichiers se transférer pourtant... ça peut avoir un rapport avec le nom de mes pages qui ne serait pas bon ?
Marsh Posté le 13-08-2007 à 09:14:39
J'ai réussi à transférer sur le site quelques éléments, enfin... je vais recommencer aujourd'hui du travail mais les scripts de mes menus déroulants ne fonctionnaient pas, peut etre parce que je n'avais pas tout transféré. Est ce qu'il est possible que le site une fois publié n'apparaisse pas du tout de la même façon qu'en local ? Je l'ai pourtant visualisé pour voir que tout allait bien.
Marsh Posté le 05-08-2007 à 01:01:01
Bonjour, je réalise actuellement un site internet pour mon entreprise. Au travail, nous sommes équipés d'écrans 17 pouces. Je fait donc en sorte que l'affichage soit nickel et dans les bonnes proportions. Cependant, en le regardant en local de chez moi avec un écran 19 pouces, je remarque que le site est du coup un peu plus petit et qu'il ne s'affiche pas aux bonnes mesures. Pourquoi ? Comment faire ? Si je l'avais fait sur un écran 19 pouces, le résultat aurait été trop petit sur un 17 pouces...
Merci de m'aider à corriger le problème