Integration de maquette faite sur Photoshop en Html
Bimbaks
Messages postés
7
Date d'inscription
Statut
Membre
Dernière intervention
-
elgazar Messages postés 5841 Date d'inscription Statut Membre Dernière intervention -
elgazar Messages postés 5841 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
Je suis passionné de la programmation web.
Je voulais juste avoir un eclairecissement de savoir comment arriver a intégrer en html une maquette du site faite dans le logiciel Photoshop.
Merci pour la reponse.
Je suis passionné de la programmation web.
Je voulais juste avoir un eclairecissement de savoir comment arriver a intégrer en html une maquette du site faite dans le logiciel Photoshop.
Merci pour la reponse.
A voir également:
- Integration de maquette faite sur Photoshop en Html
- Adobe photoshop - Accueil - Applications & Logiciels
- Editeur html - Télécharger - HTML
- Photoshop pour pc - Télécharger - Montage photo
- Photoshop elements gratuit - Télécharger - Retouche d'image
- Br html ✓ - Forum Webmastering
2 réponses
Bonsoir,
cela se fait avec HTML qui est un langage mais pas de programmation.
HTML est la description des contenus du site et leur références hypertextes éventuelles écrites dans un fichier texte(la page HTML=la page web).
Par contenu c'est tout ce qui se trouve dans la page: texte, images, ...
Par exemple pour indiquer un paragraphe de texte on écris avec HTML:
L'élément "p" (<p> pour le début de la zone, </p> pour sa fin) viens de l'anglais 'paragraph' dont je me passerais de la traduction.
Une image sera indiquée par l'ément nommé img qui s'écris ainsi:
Les éléments HTML(appelés balises car ce sont des repères qui indiquent ceci est un texte, une image, une vidéo, ...) peuvent être imbriquées les uns aux autres de manière infinie et certains de ces éléments sont des balises correspondant à des containers. Ces 'containers' permettent donc de diviser la page en autant de sections que l'on veux.
Une fois le HTML fait(le contenu et sa valeur sémantique) pour l'apparence on utilise le langage C.S.S. qui permet d'indiquer des propriétés de mise en page et d'affichage comme les dimensions dans la page, la position de l'élément, la présence d'un cadre, la couleur ou l'image de fond de l'élément, les tailles de police ...
Contrairement à la PAO pour des médias comme l'imprimerie il faut donc séparer le contenu(le texte, les images à afficher...) de son contenant(l'apparence, les couleurs, les éléments de charte graphique...).
La page web ayant des dimensions relatives à celle de l'utilisateur(résolution d'écran sur un ordinateur de bureau, plus petit sur un appareil mobile) un fichier Photoshop est une image avec des dimensions normées(longueur, largeur) il faut utiliser des découpes exportées en plusieurs fichiers images intégrés par HTML(+CSS).
Vous trouverez facilement des cours de HTML et sa suite logique CSS gratuitement sur le web, c'est assez simple surtout si vous avez déjà des connaissance en mise en page.
Si vous êtes passionné vous devez d'abord apprendre ce dont vous parlez.
Une page web peut se passer de toute programmation puisque HTML ni C.S.S. ne sont de la programmation.
javascript est un langage de programmation qui permet d'indiquer un 'comportement' et ainsi d'améliorer l'interactivité, faire des calculs et utiliser des valeurs ou même de réécrire le HTML ou le C.S.S. de la page.
Mais ces bases assez simple à acquérir sont indispensables avant de commencer à faire de la programmation car celle ci est en grande partie basée sur la manipulation des contenus et de l'affichage de la page(respectivement HTML et C.S.S.).
Un début par là:
https://www.google.fr/search?q=apprendre+HTML
cela se fait avec HTML qui est un langage mais pas de programmation.
HTML est la description des contenus du site et leur références hypertextes éventuelles écrites dans un fichier texte(la page HTML=la page web).
Par contenu c'est tout ce qui se trouve dans la page: texte, images, ...
Par exemple pour indiquer un paragraphe de texte on écris avec HTML:
<p> Ici un paragraphe de texte </p>
L'élément "p" (<p> pour le début de la zone, </p> pour sa fin) viens de l'anglais 'paragraph' dont je me passerais de la traduction.
Une image sera indiquée par l'ément nommé img qui s'écris ainsi:
<img src="mon_image.jpg" alt="description de l'image ici">
Les éléments HTML(appelés balises car ce sont des repères qui indiquent ceci est un texte, une image, une vidéo, ...) peuvent être imbriquées les uns aux autres de manière infinie et certains de ces éléments sont des balises correspondant à des containers. Ces 'containers' permettent donc de diviser la page en autant de sections que l'on veux.
Une fois le HTML fait(le contenu et sa valeur sémantique) pour l'apparence on utilise le langage C.S.S. qui permet d'indiquer des propriétés de mise en page et d'affichage comme les dimensions dans la page, la position de l'élément, la présence d'un cadre, la couleur ou l'image de fond de l'élément, les tailles de police ...
Contrairement à la PAO pour des médias comme l'imprimerie il faut donc séparer le contenu(le texte, les images à afficher...) de son contenant(l'apparence, les couleurs, les éléments de charte graphique...).
La page web ayant des dimensions relatives à celle de l'utilisateur(résolution d'écran sur un ordinateur de bureau, plus petit sur un appareil mobile) un fichier Photoshop est une image avec des dimensions normées(longueur, largeur) il faut utiliser des découpes exportées en plusieurs fichiers images intégrés par HTML(+CSS).
Vous trouverez facilement des cours de HTML et sa suite logique CSS gratuitement sur le web, c'est assez simple surtout si vous avez déjà des connaissance en mise en page.
Si vous êtes passionné vous devez d'abord apprendre ce dont vous parlez.
Une page web peut se passer de toute programmation puisque HTML ni C.S.S. ne sont de la programmation.
javascript est un langage de programmation qui permet d'indiquer un 'comportement' et ainsi d'améliorer l'interactivité, faire des calculs et utiliser des valeurs ou même de réécrire le HTML ou le C.S.S. de la page.
Mais ces bases assez simple à acquérir sont indispensables avant de commencer à faire de la programmation car celle ci est en grande partie basée sur la manipulation des contenus et de l'affichage de la page(respectivement HTML et C.S.S.).
Un début par là:
https://www.google.fr/search?q=apprendre+HTML
Bonjour
Il y a longtemps que je ne l'ai pas fait ( j'ai un vieux cs4 donc c'est peut être différent pour les versions récentes) mais si je me souviens bien, il faut juste découper ton design avec l'outil tranche (icone couteau) ensuite tu va dans édition=>enregistrer pour le web=>dans la fenêtre de controle où tu vois ton image avec les tranches, tu cliques sur enregistrer puis dans la fenêtre qui s'ouvre tu choisis le type (html et images) et les paramêtres et tu valides par enregistrer.
Cela va te créer un fichier html (plus ou moins bon) avec le dossier images juste a coté
Il y a longtemps que je ne l'ai pas fait ( j'ai un vieux cs4 donc c'est peut être différent pour les versions récentes) mais si je me souviens bien, il faut juste découper ton design avec l'outil tranche (icone couteau) ensuite tu va dans édition=>enregistrer pour le web=>dans la fenêtre de controle où tu vois ton image avec les tranches, tu cliques sur enregistrer puis dans la fenêtre qui s'ouvre tu choisis le type (html et images) et les paramêtres et tu valides par enregistrer.
Cela va te créer un fichier html (plus ou moins bon) avec le dossier images juste a coté
