Photoshop est un bon outil pour la conception des éléments de l'image de votre site Web , y compris les boutons de renversement , les menus et les graphiques déroulant qui pointent vers d'autres pages web . Toutefois, Photoshop lui-même n'est pas un outil de création de pages Web . Heureusement , il est relativement facile d'exporter votre prototype dans un format graphique Web convivial , et de construire une page Web HTML qui utilise ces éléments. Gardez à l'esprit que les éléments interactifs tels que des liens hypertextes, des boutons de renversement et de menus déroulants exigent un travail supplémentaire . Au-delà des principes de base est très dépendante de votre application, et peut nécessiter des connaissances en programmation . Choses que vous devez
Photoshop
HTML Editor
navigateur Web
Afficher plus
Instructions de base de la page Web
1
Ouvrez votre prototype dans Photoshop et exporter vers un format d'image sur le Web pris en charge. Choisissez "Enregistrer pour le Web et les périphériques " dans le menu Fichier. Dans la boîte de dialogue sélectionner JPEG , GIF ou PNG. Sélectionnez une qualité d'image , en gardant à l'esprit que les augmentations qualité taille de fichier supérieure.
2
"Enregistrer" votre fichier sur le disque , ce qui lui donne un nom tel que " myPrototype.jpg . "
3
Ouvrez votre éditeur HTML et de créer une nouvelle page web . La plupart des éditeurs HTML vont créer une page web de squelette pour vous.
4
Ajouter un élément d'image directement sous la balise body d'ouverture. L'élément d'image prendra la forme : . .
5
enregistrer votre page web et la charge dans n'importe quel navigateur
de
Beyond Basics
6
Améliorez votre disposition en utilisant soit des tables ou Cascading Style Sheets (CSS) pour positionner votre disposition . La méthode privilégiée consiste à prendre les couches individuelles , ou en tranches , créés dans Photoshop et les positionner à l'aide de CSS. Fait correctement , ce qui crée une mise en page " liquide" qui repositionne la mise en page que le navigateur est redimensionnée.
7
améliorer la vitesse en utilisant la répétition d'éléments de fond. Dans Photoshop, créer une 5 pixels de large tranche de votre arrière-plan et l'enregistrer dans un fichier. En HTML , vous pouvez répéter l'élément en utilisant l'attribut de fond de votre body ,
ou le style CSS. Syntaxe pour chaque cas varie , afin de vérifier votre guide HTML. Assurez-vous de définir l'attribut de fond pour " répéter ".
8 Utiliser des cartes d'image pour créer des liens simples à partir d'une image à une autre page Web. Selon développeur web Gregory Hodges, créer un élément de