Discussion :

[dantelesupreme]

Je vous explique la chose :

J'ai postuler a une offre d'alternance pour du développement web PHP CSS MySQL et la personne m'a demandé de découper une maquette JPG.

La maquette est celle-ci :



Les consignes étaient celles ci :

"vous trouverez ci-joint un petit test d'intégration.
C'est une maquette en jpg à découper et à intégrer dans une page html de
façon à ce que l'ensemble soit cohérent et le plus léger possible."

Je n'ai jamais fait sa auparavant (découper une maquette) mais cela ne pose pas de problème. Le truc c'est que j'arrive pas trop a savoir ou je devrais découper l'image pour bien l'intégrer avec du CSS.

Je vous demande pas de la découper a ma place bien sur mais seulement si vous pouvez me donner quelques pistes.

Merci d'avance

[Candygirl]

Il a donné un jpg ?!

Perso je lui répondrais la chose suivante:

"Si vous souhaitez un résultat vraiment efficace je préférerais travailler sur la maquette avec les images non aplaties afin de conserver de la souplesse sur le résultat xhtml/CSS. Si vraiment cela n'est pas possible, pouvez-vous me fournir un PNG 24 afin qu'il n'y ait pas de perte de qualité à la base et que je puisse ensuite compresser correctement les images ?"

J'ose espérer que la compression dégueux de l'image est le résultat de ton hébergement ou il t'as vraiment envoyé une maquette aussi moche (niveau compression)?

Autre question, le "petit test d'intégration" sera-t-il utilisé chez le client et donc payé en cas de succès ?

[dantelesupreme]

Alors oui c'est exactement la maquette qu'il ma donné en JPG. Par contre je ne sais pas si elle sera utilisé chez le client et payé en cas de succès, je ne pense pas. A vrai dire, je ne me suis même pas poser la question .

Par contre j'ai quand meme réaliser la découpe en utilisant l'outil tranche de photoshop et du css.

Voici le résultat :

http://dantelesupreme.free.fr/test_i...Grambois2.html

Il y a une perte de qualité au niveau de l'image et qu'en pensez-vous de la découpe, elle est est cohérente et judicieuse ?

Merci pour vos réponses

[Bisûnûrs]

et qu'en pensez-vous de la découpe, elle est est cohérente et judicieuse ?

Heu ...

Ca dépend ce que tu comptes faire après avec cette découpe. La laisser telle qu'elle avec le code formaté de cette façon ou non.

A la façon dont tu as découpé l'image, on a tout l'impression que tu veux faire de la mise en page avec des tableaux à coups de colspan et de rowspan.
Si tu veux avoir une mise en page correcte faite à l'aide de CSS la découpe ne va pas du tout.

Sinon, avec cette découpe, tu comptes positionner le texte du footer comment ? Je te conseille aussi de faire une image dégradée pour le fond qui se répète au lieu de l'avoir au centre de l'écran avec du blanc autour.

[Candygirl]

Je rejoins l'avis de Bisûnûrs; elle aurait été acceptable à l'ère du montage en tableaux mais elle ne l'est pas pour un montage "moderne" en css.

• Les textes devraient être en texte et non en image.
  
• Les éléments graphiques contenant des informations devraient être des images en dur dans le html afin de renseigner le alt et non en image de fond qui rend l'information totalement inaccessible.
  
• Le centrage du site à l'aide des marges négatives est à proscrire en l'absence d'un min-height min-width sur le body sous peine de voir l'information disparaître irrémédiablement sur le haut ou à gauche lors d'un rétrecissement de fenêtre
  
• Le fond gris n'occupait-il pas toute l'image ? Je l'aurais plutôt vu en fond que juste sur une portion congrue entourée de blanc.
  
• 200k pour une page d'entrée est inacceptable. Le choix du gif pour les photos n'est pas judicieux.
  
• pas besoin de toutes ces positions absolues et le z-index est inutile dans le cas présent
  
• Il n'y a pas de doctype déclaré
  
• je diagnostique une divite aiguë

Découper une image aplatie de la sorte n'a pas de sens actuellement. En t'envoyant cette image soit on a voulu te tester soit la personne raisonne encore tableaux (je penche pour cette option) et pourrait donc peut-être se satisfaire de ton découpage.

Par contre je doute qu'elle laisse passer le poids total qui pourrait être bien moindre pensé correctement (texte en texte, photo en jpg,...)