[resolue] probleme de physique

probleme de physique [resolue] - HTML/CSS - Programmation

Marsh Posté le 01-03-2015 à 12:05:27    

bonjour,
avec un amis, nous essayons de mettre en place un site web mais nous nous heurtons evidemment a des difficultés. c'est pour l'une d'entre elle que je suis ici. :??:  
je souhaite programmer une page d'acceuil a base d'images et ou il suffirait de rajouter une ligne de code pour ajouter un article. cependent mes image n'on pas de physique dans la page donc quant les articles arriveent au bout de l'ecran, il y a certe un retour a la ligne mais juste de la hauteur du titre de l'article et non de l'image. auriez vous un moyen d'empecher cette superposition?
merci d'avence  :)  
 
voila le lien du site pour illustrer, evidemment il n'est pas encore finit: http://centre-actu.fr.nf


Message édité par heiji_misaki le 01-03-2015 à 15:13:07
Reply

Marsh Posté le 01-03-2015 à 12:05:27   

Reply

Marsh Posté le 01-03-2015 à 13:03:01    

PS: le script google analytic c'est juste parce que je trouve cela fun de suivre ces chiffres ^^

Reply

Marsh Posté le 01-03-2015 à 15:12:22    

desole du dérangement...j'ai trouver la solution qui consistait a utiliser des display: inline-block;
merci tout de meme :)

Reply

Marsh Posté le 10-03-2015 à 10:31:18    

Salut,
 
Juste pour info ton site ne respecte aucune bonne pratique du web ni aucune base d'ergonomie ! On y voit des choses aberrantes datant des débuts d'Internet !
 
Le background de la page qui est censé mettre une image derrière le menu, c'est juste pas possible ! C'est adapté à une taille d'écran et une résolution particulières, soit peut-être 5 % des utilisateurs. Pour tous les autres utilisateurs, le menu est en dehors de l'image.
 
Je ne suis pas du tout un spécialiste du web, mais même en simple utilisateur, ça fait vraiment carton !
 
Je me doute que tu débutes, je dis pas tout ça pour t'emmerder, c'est très bien que tu veuilles faire un site web, mais tu devrais faire un tuto, même pas PHP mais juste sur les bonnes pratiques du web, pour partir sur de bonnes bases simplement sur la structuration d'une page (par exemple on affiche pas le background d'un menu sur le background de la page, pour les raisons que j'ai évoquées).
 
Après si c'est pas le dév web en lui-même qui t'intéresse mais que tu veux simplement écrire des articles et partager ton avis sur des sujets, tourne-toi plutôt vers un CMS de type Wordpress, qui offre aussi la possibilité de le personnaliser vraiment énormément, à tel point que ça devient du dév, tout en offrant une base solide et ergonomique qui convient même à ceux qui ne veulent pas se plonger dans le dév.
 
Mais comme je pense que tu cherches surtout à développer par toi-même, je t'encourage à persister mais en reprenant d'abord les bases, tu verras ça changera du tout au tout.


Message édité par psychodarksquall le 10-03-2015 à 10:31:50
Reply

Marsh Posté le 10-03-2015 à 21:19:48    

effectivement je cherche a le faire "a la main", un truc tout pret ne m'interesse pas. Et il est egalement vrais que j'apprend, mais le passé ne contient pas que des erreures, et j'apprend des mienne. pour etre precis, j'apprend le html/css/php/mySQL depuis 2-3semaines.  
"on affiche pas le background d'un menu sur le background de la page," bien que je ne comprenne pas cette formulation, j'ai compris l'idée et ...j'avais remarquer cette erreur depuis un moment et je m'y penche en ce moment. j'avais juste une autre partie en cour.
mais pour se qui est des base, j'ai terminer les tuto Html et php du site du zero. evidement le site va evoluer, ce n'est pas un produit finis encore, je ne l'ai jamais dit ainsi, et j'apprecie un regard critique si il est constructif, n'hesite pas a me dire se qui ne vas pas, en dehor du gout qui est personnel, l'informatique est une technologie qui evolue.

Reply

Marsh Posté le 10-03-2015 à 23:13:34    

Voici par exemple ce que moi je vois sur mon écran :
 
http://img15.hostingpics.net/thumbs/mini_202851Screen.png
 
Reconnais que c'est peu lisible.
 
Il faut structurer le HTML en différentes balises imbriquées entre elles pour que les contenus ne se superposent pas.
 
Tu ne dois pas utiliser le background de la page pour habiller les différentes div telles que le menu (Jeux vidéo / Logicel /etc.) ou le header (le titre). Regarde si je rétrécie la fenêtre de mon navigateur :
 
http://img15.hostingpics.net/thumbs/mini_526689Screen2.png
 
Le background se met à l'échelle et se décale par rapport au texte du menu. Je te conseille de jeter un œil sur ce simple tuto pour faire un menu horizontal, tu verras toutes les subtilités : http://openclassrooms.com/courses/un-menu-horizontal

Reply

Marsh Posté le 10-03-2015 à 23:23:19    

je te remercie pour ces conseil, en effet je n'imaginais pas que la difference puisse atteindre ce niveaux. je m'y penche donc de suite, et je le corrigerais dès que possible aider de ces astuces. je reposterais un message a la rigueur si tu souhaite voir le resultat et relancer une critique.

Reply

Marsh Posté le 11-03-2015 à 09:27:25    

Une des difficultés majeures lors de la création d'un site, c'est le "responsive design", à savoir le fait que le site doit être adapté à n'importe quelle taille et résolution d'écran (téléphones mobiles compris, dans l'idéal, mais là ça complique encore un peu plus). L'autre défi c'est de le faire compatible avec tous les navigateurs et leurs différentes versions (là ça se complique vu que certaines versions des navigateurs interprètent différemment voire pas du tout certaines nouveautés du HTML et du CSS).
 
Pas de soucis pour que tu postes ici les évolutions et les questions que tu peux avoir, j'y répondrai dans la mesure du possible (je suis développeur mais pas spécialiste en web non plus, même si j'en fait un peu).
 
Edit : très bon exemple, va sur ce site http://3200tigres.wwf.fr/ et essaie de changer la taille de ta fenêtre.


Message édité par psychodarksquall le 11-03-2015 à 16:46:26
Reply

Marsh Posté le 11-03-2015 à 22:43:03    

je te remercie de ta presence :)
oui, mais je voudrais une page qui ne resssemble pas a une page justement. je voudrais une veritable interface, avec des icones et le menu donc en haut. mais la ou je bloque: c'est pour que la taille de la police suive la taille de l'image d'en-tete. il faudrait que les mots reste comme ils sont dans leurs case et donc que la police change de taille en fonction de la resolution mais je n'ai trouver aucune info a ce sujet.
 
Si tu vas voir le site actuellement, il est down. j'ai decider de le reset entierement apres m'etre enerver pour l'interface de mes page. en effet la propriete absolute me permettait de placer exactement comme je le voulait mais ne poussait pas les autre objets. je recommence donc le site de 0. mais si tu avait une solution pour l'en-tete, cela serait utile car, quitte a faire des page web "standarts", je prefere arreter le web et retourner a mon C.


Message édité par heiji_misaki le 11-03-2015 à 23:44:02
Reply

Marsh Posté le 11-03-2015 à 23:56:52    

Généralement les images d'en-tête sont dans une taille fixe, la police n'est pas une police ajoutée en HTML, elle fait partie de l'image, et celle-ci ne change pas de taille dynamiquement selon la taille de la fenêtre. Il existe cependant une alternative, le format SVG : un format d'image récent qui permet de redimensionner une image sans que ça pixelise (car ce n'est pas un ensemble de pixel comme les autres formats, mais des coordonnées qui recréent l'image quels que soient sa taille et le niveau de zoom). Un schéma simple résume le truc : http://upload.wikimedia.org/wikipe [...] Fr.svg.png .
 
Dans tous les cas si tu veux ton menu avec quatre cases mais que le texte soit toujours dans les cases, le premier truc qui me vient à l'esprit c'est de couper ton image en quatre (donc tu te retrouves avec quatre images), créer une div par élément du menu, et dans cette div tu met la partie de l'image qu'il faut en background, et le texte correspondant. Et ensuite tu t'arranges pour que les quatre div soient collées (avec l'attribut "margin" du CSS). Ou tu peux carrément faire en sorte que ton menu soit une seule image (texte inclus) et découper ensuite les zones de clic. Enfin il y a toujours plusieurs moyens d'arriver au résultat souhaité et ma solution n'est peut-être pas la bonne.
 
Pour info la propriété "absolute" c'est à manier avec d'extrêmes précautions, perso j'éviterais. Dans la majorité des cas c'est mal utilisé. C'est un peu comme si sur Word tu faisais plein d'espaces en début de ligne pour centrer un texte, alors qu'il y a une option de centrage. Il faut éviter de s'éloigner des bonnes pratiques, elles ne sont pas là pour rien, et avec HTML5 et CSS3 il n'y a presque pas besoin de "bidouiller", tous les outils sont là.
 
Sinon je n'ai pas trop compris ce que tu souhaitais obtenir comme résultat final.

Reply

Sujets relatifs:

Leave a Replay

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