Comment créer un site web avec photoshop maquette

Lors de la création d'un site Web, parfois la partie la plus difficile est de déterminer la mise en page. Adobe Photoshop fournit un moyen rapide et facile de créer un site Web maquette. En utilisant des couches et une combinaison des outils de conception de Photoshop, le processus de réarranger le look and feel de votre site web peut vous sauver des heures.

Instructions

  1. Déterminer la taille de votre site web toile maquette en fonction de votre auditoire. Par exemple, pour un public qui utilise encore un moniteur à tube cathodique à basse résolution, vous souhaitez utiliser une taille de toile qui est de 760 pixels de large. Cependant, pour un moniteur à écran plat avec la résolution fixée à 1024 par 768, vous souhaitez utiliser une toile qui est de 975 pixels de large. Créez un nouveau document et définir la taille de la toile.




  2. Déterminer la disposition du site. Utilisez simples carrés ou ellipses pour délimiter les différentes sections de votre maquette. Par exemple, marquer un espace pour la bannière, la bannière de côté, le contenu et le pied de page. Créer chaque fonctionnalité sur un nouveau calque de sorte que vous pouvez facilement réorganiser le site.





  3. Déterminer la taille de la police et de remplir les sections qui contiennent du texte avec le texte de l'espace réservé. Faire une recherche rapide sur Internet pour Lorem Ipsum, un discours latin utilisé par les concepteurs pour voir comment le texte se penchera sur une page, va générer ce texte pour vous. Si l'arrière-plan ou d'autres sections seront composées d'une couleur, les remplir avec la couleur correcte.




  4. Créer les graphiques. Vous pouvez utiliser Photoshop pour créer ces graphiques, tels que la bannière ou logos, ou les tirer d'un autre emplacement. Placer et positionner les graphiques sur le site Web maquette. Sélectionner "Fichier" et puis "Lieu" et accédez à l'image. Remarque: Conservez une version Photoshop des graphiques de sorte que vous pouvez les modifier plus tard.

  5. Peaufinez et modifier le site jusqu'à ce que le site web maquette regarde la façon dont vous voulez qu'il regarde. Parce que chaque nouvelle fonctionnalité est sur une couche différente, vous pouvez rapidement déplacer sections, cachez sections (cliquez sur l'œil dans la couche palette) ou de remplacer les images et les couleurs.

» » » » Comment créer un site web avec photoshop maquette