Un modèle Web est une mise en page Web de base --- ou conteneur --- vous pouvez réutiliser pour créer plusieurs pages . Le modèle fournit la structure de base pour votre site, vous permettant de maintenir un thème cohérent et mise en page sur tout le site sans avoir à recréer chaque page. Alors que Photoshop n'est pas techniquement un programme de conception de page Web, vous pouvez l'utiliser pour créer des modèles Web par " tranches " l'image PSD en différentes sections et ensuite exporter le PSD à une page Web HTML. Vous pouvez ensuite ouvrir le fichier modèle HTML dans Dreamweaver ou un autre programme de conception de sites Web et de l'utiliser pour créer les pages de votre site. Choses que vous devez
Adobe Photoshop CS3 ou tard
Afficher plus Instructions
1
démarrer un nouveau document dans Photoshop. Donnez-lui les dimensions que vous souhaitez utiliser pour vos pages Web , comme ceci: Cliquez sur «Fichier » dans la barre de menu et choisissez "Nouveau " pour ouvrir la boîte de dialogue Nouveau. Tapez la largeur (en pixels) dans le champ " Largeur" et la hauteur (en pixels) dans le champ " Hauteur" . Cliquez sur « OK ».
2
Créez la bannière pour votre page Web. La bannière , bien sûr, est l'image graphique ou qui affiche en haut de la page. Il se compose généralement d' un logo d'entreprise et d'autres graphiques relatives à un produit ou service. Vous pouvez insérer une image existante ou utiliser la peinture de Photoshop et outils de texte pour créer la bannière.
3
Créer des boutons pour votre page Web. Ceux-ci deviendront des liens, ou «points chauds », qui prennent les utilisateurs du site à différentes pages sur le site . Soit insérer des images de bouton existant et les placer où vous le souhaitez dans le modèle ou utilisez la peinture de Photoshop et outils de texte pour créer des boutons.
4
Sélectionnez l'outil " Slice " ( cinquième bouton du haut en la boîte à outils ) . Si vous n'avez pas utilisé l'outil Tranche avant , ce bouton est sans doute réglé sur un autre outil. Cliquez et maintenez le bouton , puis choisissez " outil de découpage" du fly-out .
5
Faites glisser l'outil Tranche autour du premier bouton ou une zone dans le modèle dans lequel vous souhaitez créer un lien. Cela crée une caisse de " Slice " autour de l'objet . Photoshop place cette boîte dans une cellule de tableau qui va devenir un tableau HTML séparé lorsque vous exportez ce document au format HTML.
6
un clic droit sur la nouvelle tranche et choisir " Modifier les options de tranche" de la mouche Menu out. Cela ouvre la boîte de dialogue Options de tranche .
7
Entrez l'URL que vous souhaitez que ce bouton lien dans le champ " URL" . Vous pouvez également entrer d'autres informations pour le bouton, comme la page du navigateur cible, et d'autres tags. Si vous souhaitez modifier la taille et la position de la tranche , le faire avec les options dans la section "Dimensions" de la boîte de dialogue. Cliquez sur « OK ».
8
Répéter les étapes précédentes pour créer des tranches et l'édition des options de tranche pour chaque bouton dans le modèle.
9
Cliquez sur "Fichier " dans le menu bar et choisir "Enregistrer pour le Web et les périphériques . " Cela ouvre la Enregistrer pour le Web et la boîte de dialogue Périphériques . De là, vous pouvez modifier plusieurs aspects de votre modèle , comme la couleur de fond, la compression d'image et la qualité , la taille du document et ainsi de suite . Ces options sont bien étiquetés et parlent d' eux-mêmes . ( Vous pouvez prévisualiser le code HTML de ce modèle en cliquant sur le bouton "Aperçu" . )
10
Cliquez sur le bouton «Enregistrer» . Nommez et enregistrez le fichier HTML. Vous avez créé votre modèle Web . Vous pouvez maintenant ouvrir dans un éditeur de page Web et ajouter votre contenu .