apprendre rapidement a utiliser adobe photoshop par la pratique. devenez web-designer ! tutorial photoshop, exercice, formation, webdesign, skins, textures, infographie, pixel.


 ACCUEIL   PORTFOLIO   LOGICIELS   TUTORIELS   DOSSIERS 

Traducteur Photoshop

Ce traducteur automatique vous permet d'obtenir une traduction en direct des outils, menus, commandes et fonctions photoshop en français depuis un tutorial en anglais.
url :
traduire
voir un exemple : original - traduit

Interfaces
Webdesigns
Bandeau Noir
26 étapes
Bandeau a Icones
20 étapes
menu vertical
19 étapes
Menu Flottant
14 étapes
Bandeau Photo
18 étapes
un site de A a Z (2)
15 étapes
un site de A a Z (1)
19 étapes
bandeau blanc
11 étapes
site a onglets
16 étapes
counter clan
21 étapes
Typographie
Textures
Effets
Retouches
Pixel-art
Divers
HTML/DHTML/Javascript
Annonces Google

Bandeau Photo

Un nouveau tutorial webdesign qui vous aprés a réaliser un bandeau haut de site incluant la photo de votre choix et qui définira la couleur de votre site internet.

Identification Abonné :

Votre Email :
Votre Mot de Passe :
Se souvenir de moi
login

Français :
Anglais :
Shortcut PC :
Shortcut Mac :
Menu :
francais
english



Afficher les commandes photoshop en français

Afficher les commandes photoshop en anglais

Afficher la version imprimable du tutorial


Etape 1

Créer un nouveau document de la taille de votre futur site internet. Généralement, on part sur une base de 800x600 pixels auquel on substitura les bords du navigateur internet en plein écran soit environ 780x441 en incluant la barre google.
 
Créer un nouveau calque .
 
Le Remplir en gris bleu moyen (RVB:104,120,127).


Etape 2

Créer un nouveau calque .
 
Sélectionner un rectagle avec l'outil Rectangle de sélection d'une largeur de 760 pixels, toute hauteur.
 
Remplir la sélection en blanc.
 
Appliquer ensuite le style de calque Ombre portée :
Mode de fusion : Produit en noir
Opacité : 75%, Angle : 135°, Distance : 0px, Grossi : 0%, Taille : 5px, Contour : Linéaire, Bruit : 0%

 
Pourquoi 760 pixels de largeur ?
C'est a quelques pixels de moins pret, la largeur des navigateurs internet en plein écran en 800x600 de résolution d'écran. Ainsi, votre site sera compatible 800x600 pixels ou + (Les bords colorés vont s'agrandir avec la taille de la fenetre du navigateur et la zone contenu sera centrée sur la page).


Etape 3

Créer un nouveau calque et Remplir la sélection en noir cette fois ci.
 
Avec l'outil Ellipse de sélection , sélectionner un ovale sur la partie haute de toute la largeur du document comme dans l'exemple ci-dessus.
 
Effacer ensuite la sélection.


Etape 4

Avec l'outil Rectangle de sélection , sélectionner la partie haute et basse du noir restant comme dans l'exemple ci-dessus.
 
Effacer les sélections.


Etape 5

importer maintenant votre photo dans le document.
 
Dans la fenetre de calques, cliquer sur le calque contenant la forme noir avec le bouton Ctrl enfoncé pour faire une sélection de celle-ci.
 
Cliquer ensuite sur l'icone Ajouter un masque vectoriel situé en bas de la fenetre de calques.


Etape 6

Dans la fenetre de calques, sélectionner la vignette de masque de fusion de calque contenant la photo.
 
Appliquer ensuite le style de calque Ombre interne :
Mode de fusion : Produit en noir
Opacité : 75%, Angle : 135°, Distance : 0px, Maigri : 0%, Taille : 5px, Contour : Linéaire, Bruit : 0%


Etape 7

Créer un nouveau calque .
 
Dans la fenetre de calques, cliquer sur la vignette de calque contenant la forme noir du debut pour sélectionner celle-ci.
 
Intervertir la sélection et la Remplir en noir.
 
Dilater ensuite la selection de 3 pixels et Effacer la.


Etape 8

Dans la fenetre de calques, cliquer sur la vignette de calque contenant le rectangle blanc pour sélectionner celui-ci.
 
Intervertir et Effacer la sélection.


Etape 9

Avec l'outil Rectangle de sélection , sélectionner un rectangle de 3 pixels de large au dessus a gauche de la forme créer precedament comme dans l'exemple ci-dessus.
 
Avec l'outil Dégradé , remplir la sélection d'un dégradé vertical du noir (en bas) vers le transparent (en haut).


Etape 10

En enfoncant les touches Ctrl , alt et Shift du clavier et grace à la souris, copier le dégradé précédament créer sur la partie droite du dessin comme dans l'exemple ci-dessus.


Etape 11

Dans la fenetre de calques, passer le calque en opacité 30%


Etape 12

Toujours dans la fenetre de calques, créer un nouveau calque entre le calque contenant le rectangle blanc et le calque contenant la photo.
 
Avec l'outil Rectangle de sélection , sélectionner le rectangle par dessus la forme haute du document comme dans l'exemple ci-dessus.
 
Avec l'outil Dégradé , créer un dégradé vertical du noir (en bas) au blanc (en haut) comme dans l'exemple ci-dessus.
 
Dans la fenetre de calques, passer l'opacité du calque a 30%.


Etape 13

Créer encore un nouveau calque .
 
Avec l'outil Rectangle de sélection , sélectionner un rectangle en dessous de la photo comme dans l'exemple ci-dessus.
 
Avec l'outil Dégradé , créer un dégradé vertical du noir (en bas) au blanc (en haut) comme dans l'exemple ci-dessus.
 
Dans la fenetre de calques, passer l'opacité du calque a 30%.


Etape 14

Créer encore un nouveau calque .
 
Avec l'outil Rectangle de sélection , sélectionner la ligne juste en dessous du rectangle créer précédament comme dans l'exemple ci-dessus.
 
Remplir la sélection en noir.
 
Dans la fenetre de calques, passer l'opacité du calque a 40%.


Etape 15

Créer encore un nouveau calque .
 
Avec l'outil Rectangle de sélection , sélectionner une ligne de séparation de bouton dans le rectangle précédament créer comme dans l'exemple ci-dessus.
 
Remplir la sélection en noir.
 
Déplacer la sélection de 1 pixel vers a droite en appuyant 1 fois sur la touche [fleche droite] du clavier.

 
Remplir cette nouvelle sélection en blanc.

 
Dans la fenetre de calques, passer l'opacité du calque a 40%.


Etape 16

En enfoncant les touches Ctrl , alt et Shift du clavier et grace à la souris, dupliquer autant de fois qu'il le faut les lignes précédaments crées vers la partie droite du rectangle comme dans l'exemple ci-dessus.


Etape 17

Avec l'outil Rectangle de sélection , sélectionner un rectangle englobant la partie haute du rectangle de boutons comme dans l'exemple ci-dessus.
 
Appliquer ensuite un Contour progressif de 20 pixels et Effacer la sélection 3 fois de suite.


Etape 18

Il ne vous reste plus qu'a insérer votre logo dans la partie haute du bandeau et a ajouter le nom des rubriques dans les boutons au moment de l'intégration html du webdesign.

Fichier(s) associé(s) au tutorial
bandeauphoto (452 Ko) télécharger
Thumb (7 Ko) télécharger
Commentaires des visiteurs
Ajouter un commentaire
Copyright Jérome Boulinguez 1995/2007
Tous les éléments de ce site sont la propriété de leurs auteurs respectifs.
Toutes reproductions, distributions, commercialisations, copies sous quelques formes que ce soit est strictement interdit sous peine de poursuites.


point de croix .  broderie .  cross stitch .  broderie prenom .  broderie portrait .  pochoir .  pochoir personalisé .  stickers .  scrapbooking .  pochoirs à imprimer .  loisir créatif .  templates .  lifting .  cadeaux personnalisés .  pop art .  warhol .  warhol .  pop art .  affiches .  journal de naissance .  prénom .  étiquettes personnalisées .  parchemin personnalisé .  parchemin .  pagerank .  calendrier .  avatar .  faire-part .  collections .  mariage .  telephone portable .  tableau prénom .  fausse couverture people .  fausse couverture de magazine .  fausse couverture de journal .  calligraphie prenom .  t-shirt personnalisé .  géo-localisation .  fausse affiche .  affiche humour .  marque-pages .  plaque de rue .  roman photo .  cadre photo .  faux papiers .  dés photos .  pêle mêle .  pancarte de porte .  pour les nuls .  carte de membre .  scrapbooking .  acrostiche .  graffiti .  invitation a imprimer .  tapis de souris personnalise .  mug personnalisé .  mug photo .  grille point de croix gratuite .