Problème affichage avec tablette

Problème affichage avec tablette - HTML/CSS - Programmation

Marsh Posté le 08-03-2022 à 20:25:16    

Bonsoir,
 
J'ouvre ce sujet car j'ai un soucis avec mon site.
Le problème viens des tablettes ou le rendu est différent du PC ou du PC Portable. En effet le texte est plus long sur tablette. Je ne trouve pas comment résoudre le problème. Pouvez vous m'aider ?
Voici une page type pour vous rendre compte : http://cartoons.spirit.free.fr/Mon [...] age323.htm

Reply

Marsh Posté le 08-03-2022 à 20:25:16   

Reply

Marsh Posté le 09-03-2022 à 10:27:58    

Plusieurs remarques sur ton site :
1) le code html/css est absolument dégueulasse : normal, tu l'as fait générer par Word si j'ai bien vu. Y'a pas une personne ici qui va s'amuser à trouver quelle règle CSS ou autre cause le problème dans un code aussi merdique. :o
Ex : <head><table border="0" cellpadding="0" cellspacing="2"width="960"align="center"><tr><td>  :pt1cable:  
 
2) une fois que tu auras repris tout le code en le tapant avec tes petites mains, tu auras quelque chose de bien plus propre et tu y verras plus clair. A commencer, tu va mettre tout ce qui est de la mise en forme dans un fichier CSS qui sera commun à toutes les pages de ton site. Avantage : si tu changes une règle d'affichage à un endroit, tu n'auras pas à la modifier partout. ;) Tu vas voir aussi que le code de chaque page va être beaucoup plus léger. Donc, ton site va se charger plus vite et va moins consommer de bande-passante.
 
3) Pour ton pb spécifique, il faut savoir que chaque navigateur et en fonction du terminal d'affichage à des règles d'affichage par défaut différentes. C'est pour ça que sur la balise <html>, en règle css, on lui fixe des margin, padding, et taille de police de caractères. Après, tu peux travailler soit en responsive design soit avec des valeurs fixes (mais ça pourrait poser des soucis sur les petits écrans). Cela dit, vu ton site, ça devrait être jouable sans que ça pose trop de soucis.
 
Mais le traitement du point 1 me paraît primordial ;) Ca va te demander un peu d'apprentissage mais ça te sera bénéfique. Si tu ne te sens pas à apprendre le html/css (manque de motivation, manque de temps...), tu peux passer par un CMS genre Wordpress.


---------------
Astres, outil de help-desk GPL : http://sourceforge.net/projects/astres, ICARE, gestion de conf : http://sourceforge.net/projects/icare, Outil Planeta Calandreta : https://framalibre.org/content/planeta-calandreta
Reply

Marsh Posté le 09-03-2022 à 16:26:41    

Word peut toujours chier du code HTML (le gros mot me paraît adapté vu la qualité du code qui en sort :o )? J'aurais pensé que justement vu la qualité du code et l'existence de Wordpress et Co Microsoft a viré cette fonctionnalité une bonne fois pour toutes?

Reply

Marsh Posté le 09-03-2022 à 18:19:14    

Je fais mon site avec publisher. Je sais que le code est pas très bon mais cela marche plustôt bien jusqu'à présent. Par contre sur tablette j'ai ce problème de longueur de texte qui est bonne sur PC et PC portable mais trop longue sur tablette.  
Je ne sais pas comment résoudre le problème ne connaissant pas trop le langage Html.  
Concernant la ligne <head><table border="0" cellpadding="0" cellspacing="2"width="960"align="center"><tr><td> c'est le seul moyen que j'ai trouvé il y a quelques années pour avoir la page un peu prés centrée

Reply

Marsh Posté le 09-03-2022 à 19:20:10    

Jamais de la vie, c'est en début de body qu'on met du contenu. Le <head> ne contient que des méta-données ou des inclusions de fichiers (css, javascript), pas du contenu  :non:  
 

Citation :

Je sais que le code est pas très bon mais cela marche plustôt bien jusqu'à présent.


C'est un euphémisme  :whistle: Et le "marche plutôt bien", c'est grâce aux navigateurs web qui sont très permissifs et corrigent pleins d'erreurs à la volée pour arriver à afficher coûte que coûte la page. Moi, je serais le moteur de rendu du navigateur, je vois ce code, j'affiche un message d'erreur bien senti  :kaola:


---------------
Astres, outil de help-desk GPL : http://sourceforge.net/projects/astres, ICARE, gestion de conf : http://sourceforge.net/projects/icare, Outil Planeta Calandreta : https://framalibre.org/content/planeta-calandreta
Reply

Marsh Posté le 09-03-2022 à 19:23:10    

hyogas a écrit :

le seul moyen que j'ai trouvé il y a quelques années

Le truc c'est que le HTML ça évolue, pour le meilleur ou pour le pire, ça dépend. En tout cas aujourd'hui il est "state of the art" de ne pas utiliser de tableaux pour la mise en page, de mettre le CSS (qui doit servir pour la mise en page, le HTML sert à structurer) dans un/des fichier(s) séparé(s) etc. Après les navigateurs vont avaler pas mal de cochonneries, mais on se retrouve avec des soucis de mise en page comme tu en as un justement. Et je ne parle même pas des gens aveugles qui utilisent des lecteurs d'écran ou ce genre de trucs, là si la page est codée avec les pieds (ou pleine de Javascript) c'est un gros soucis.

 

Je ne maîtrise pas le HTML non plus, mais je suis à peu près certain qu'on doit pouvoir appliquer une règle CSS sur le body ou à défaut sur un <div> pour centrer tout le bazar.

 

Sinon +1 pour un CMS, mais attention, il faut absolument tenir à jour ces trucs car il y a souvent des failles qui sont exploitées rapidement!

 

edit: grillé par rufo qui a trouvé des mots plus directs. :o


Message édité par rat de combat le 09-03-2022 à 19:23:57
Reply

Marsh Posté le 30-04-2022 à 13:10:53    

Bonjour,
 
Excusez moi de ne pas avoir répondu plutôt mais j'ai été pas mal débordé ces derniers temps.
 
J'ai modifié ma page que voici http://cartoons.spirit.free.fr/Mon [...] ge323b.htm
 
Comme certain me l'ont sugéré, je suis aller sur  
 
CSS =>  https://jigsaw.w3.org/css-validator/
 
Le code est bon mais cela ne change rien pour la longueur du texte et android ou c'est trop long. Avec vous une idée pour m'aider merci d'avance ?

Reply

Marsh Posté le 01-05-2022 à 22:08:25    

ton bordel est fait sous Publisher.
tous les conteneurs du site sont positionnés en absolute avec des hauteurs et largeurs fixes.

 

en gros et pour faire simple, c'est ni fait, ni à faire, il faudrait juste arrêter Publisher, qui n'est pas fait pour ça.
Publisher est un soft de PAO, pas un éditeur de site web.


Message édité par gatsu35 le 01-05-2022 à 22:09:56

---------------
Blablaté par Harko
Reply

Marsh Posté le 02-05-2022 à 10:04:50    

hyogas a écrit :

Bonjour,
 
Excusez moi de ne pas avoir répondu plutôt mais j'ai été pas mal débordé ces derniers temps.
 
J'ai modifié ma page que voici http://cartoons.spirit.free.fr/Mon [...] ge323b.htm
 
Comme certain me l'ont sugéré, je suis aller sur  
 
CSS =>  https://jigsaw.w3.org/css-validator/
 
Le code est bon mais cela ne change rien pour la longueur du texte et android ou c'est trop long. Avec vous une idée pour m'aider merci d'avance ?


Non, le code n'est pas bon au sens technique et sémantique. Il est juste bon au niveau syntaxique sauf qu'il y a tout un tas de saloperies d'attributs non standard (les "v:" par ex) et d'autres infos qui n'ont rien à faire dans le HTML et qui devraient être dans le CSS.
 
Comme l'a dit gatsu35, le code est ni fait ni à faire ce qui est normal vu que tu ne connais pas le HTML/CSS et que Publisher n'est pas fait pour ça. Tu devrais te mettre à Wordpress qui devrait te permettre d'avoir un site bien mieux sans que tu aies besoin d'apprendre le HTML/CSS (moyennant de choisir un thème WP qui soit responsive ;)).


---------------
Astres, outil de help-desk GPL : http://sourceforge.net/projects/astres, ICARE, gestion de conf : http://sourceforge.net/projects/icare, Outil Planeta Calandreta : https://framalibre.org/content/planeta-calandreta
Reply

Sujets relatifs:

Leave a Replay

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