Intégration graphique Css

L'intégration graphique consiste à convertir une maquette graphique en feuille de style Css adapté au web et lisible par les navigateurs (Chrome, Firefox...)

Dans la plupart des cas, lorsqu'une société veut refondre son site Internet et mettre à jour son visuel, elle fait appel à un graphiste ou webdesigner pour la conception du design.
Ce dernier va concevoir une "maquette" graphique c'est à dire un croquis à l'aide de logiciels comme Photoshop ou Illustrator. Le format correspondant à cette maquette n'est pas lisible par les navigateurs web comme Chrome, Firefox ou Internet Explorer d'où la nécessité d'intégrer la maquette au bon format web, à savoir le CSS (Cascading Style Sheets).

Généralement, on trouve plusieurs feuilles de style dans un seul site web. Celles-ci définissent la présentation visuelle du site Internet dans sa globalité :

• Police de caractères, taille, style
• Propriétés du texte, des liens, couleurs
• Couleurs de fond
• Tableaux
• Menus
• Effets visuels
• etc etc...

Depuis peu, les feuilles de style CSS gèrent également les designs appelés "Responsive" c'est à dire qui s'adaptent automatiquement à la taille de la fenêtre (ou dimension de l'écran) suivant que l'on navigue sur un ordinateur PC de bureau, une tablette ou un smartphone.

Le gros avantage des feuilles de style est la séparation du contenu (textes, image, photos, vidéos, formulaires...) et de sa mise en forme.

ASTUCE

Grâce au raccourci clavier "Ctrl + Shift + C", il est possible de visualiser les styles Css d'une page web sur n'importe quel site depuis Firefox ou Chrome.
Ainsi, il est aisé de résoudre les bugs d'affichage d'un site web car on peut éditer les styles "à la volée" directement dans son navigateur et voir les changements en temps réel.