Cima+

 
 

Propulser votre entreprise sur le Web

Les technologies SoleWeb, création de site web profesionnel.  
   

Blogue
Monde du Web SoleWeb

 


 

Tendances Web 2013-2014Les tendances Web 2014-2015

Le point de vue de l'internaute, l'Internet mobile, design web, commerce électronique, vidéos et publicité en ligne... Quels sont les nouveaux comportements des internautes ? Qu'en est-il des grandes tendances du Web ?

Lire la suite

 

Le "Responsive design" ou conception de sites web adaptatifs

Repenser l'approche de création d'un site Internet

offrir au visiteur une expérience de consultation optimale facilitant la lecture et la navigation en fonction de l'appreil utilisé...

Lire la suite

 
 

Google Checkout, Google Wallet, enfin disponible au Québec

Google Checkout, bientôt Google Wallet, est le système créé par Google pour compétitionner avec Paypal, mais il reste un produit encore inférieur, car il offre peu d'options en comparaison avec ses ... 

Lire la suite

 
 

Optimiser vos images

Une image vaut mille mots.

Une page remplie de texte dans un site Web n'incite pas à la lecture. L'apport d'un image augmente l'intérêt et la curiosité. L'image idéale est celle qui résume le plus le contenu de la page....

Lire la suite

 
 

Creation d'un formulaire Web SoleWebLa conception d'un formulaire pour le web.

Les problématiques de lisibilité, d'organisation visuelle et de choix des champs sont les points centraux dans la conception d'un formulaire. On peut dégager certains standards mais les choix d'interface sont souvent ...

Lire la suite

 
 

La première impression - conception d'un site WebLa première impression

Premier coup d'œil.

Lors de la conception d'un site Web, un même design ne produit pas le même effet sur papier que sur ecran. Le design web est un compromis entre une présentation possédant un graphisme époustouflant, permettant de donner une ... 

Lire la suite

 

 

La charte graphique

Un site intègre de la première à la dernière page. 

Une charte graphique est l'ensemble des règles graphiques, colorés et formels créés pour la communication imprimée (ainsi que d'un site Web). Cette charte a pour but de faciliter le quotidien de chacun en fournissant des...

Lire la suite

 
 

Google Panda / penguinGoogle Panda et Penguin - Nouveauté pour le référencement (SEO)


Depuis les mise à jour des Algoritmes de référencement de Google, comment devons-nous réagir pour avoir un bon positionnement ?
 

Google Panda a été initialement décrit comme une mise à jour visant à sanctionner les fermes de contenu et sactionner les site de mauvaise qualité.

Lire la suite

 

Optimiser vos images

 

Une image vaut mille mots.

 

Une page remplie de texte dans un site Web n'incite pas à la lecture. L'apport d'un image augmente l'intérêt et la curiosité. L'image idéale est celle qui résume le plus le contenu de la page.

Il faut trouver un équilibre entre images et textes, car trop d'images nuisent à la clarté et surtout ralentissent la vitesse de chargement.

Votre site aura besoin d'images qui se téléchargent vite. Elles doivent être à la fois légères, de bonne qualité et pertinentent. 

 

Trois formats d'images coexistent sur le Web: le Gif, le JPEG et le PNG.

 

Format JPEG


Avantages
o format avec possibilité de compression très élevée
o supporte 16 millions de couleurs (24 bits) et le noir et blanc (8 bits)
o parfaitement supporté par les navigateurs

Inconvénients

o compression visible sur les changements brusque de couleur (pixelisation)
o ne supporte pas de transparence

 

Format GIF


Avantages

o compression sans dégradation d'image, si l'image contient moins de 256 couleur
o parfaitement supporté par les navigateurs
o peu être animé
o supporte la transparence

Inconvénients

o supporte un maximum de 256 couleurs

 

Format PNG


Avantages

o supporte 16 millions de couleurs (24 bits) et le noir et blanc (8 bits) 

o parfaitement supporté par les navigateurs
o supporte la transparence

Inconvénients
o Fichier plus lours qu'un JPG ou qu'un GIF

 


 


Logiciels graphiques

Un logiciel graphique est nécessaire pour créer, retoucher ou préparer une image Web.

Le plus connu des logiciels graphiques est Adobe Photoshop®. Il excelle surtout dans la retouche de photos et permet de créer des images de très bonne qualité. 

Il existe aussi quelques logiciels gratuits ou peu couteux qui permettent d'obtenir les mêmes résultats:

The Gimp, gratuit. 
Photo Plus, gratuit, 
Corel Paint Shop Pro®, peu couteux.

Le logiciel PAINT, inclus dans les systèmes d'exploitation Windows, est à déconseiller pour redimentionner une image, n'ayant pas de filtre de lissage, il aura tendance à gâcher l'image.

 

Notions importantes

Résolution de l'image

C'est une mesure en DPI (Dots Per Inch) ou PPP (points par pouce) qui définie la configuration de sortie pour l'image. On sait qu'un écran d'ordinateur a une définition de 72 DPI alors qu'une imprimante est généralement de 150 DPI. Chez l'imrpimeur c'est 300 DPI. Puisque vos images sont destinés à une sortie écran, il est inutile d'avoir une résolution supérieure à 72 DPI.

 

Taille de l'image

Le poids d'une image est directement proportionnel à sa taille. Ainsi, une grande image sera beaucoup plus lourde qu'une petite. Il convient donc de redimentionner la taille de l'image en fonction de l'utilité que vous en ferez sur la page. Si vous réduisez la taille de l'image dans l'éditeur SoleWeb, son poids sera identique à l'originale même si l'image semble plus petite. Il faut donc l'optimiser dans un logiciel spécialisé dans la retouche d'images (Photoshop® ou Paint shop pro® par exemple) afin de réduire sa taille pour qu'elle convienne exactement à l'usage que vous en ferez sur votre page Web.


Images optimisées avec Photoshop ®

Image 50 X 50 pixels
Poid: 3.63 Ko
soleweb_small.jpg

Image 100 X 100 pixels
Poid: 9.16 Ko
soleweb_med.jpg

Image 250 X 250 pixels
Poid: 35.31 Ko
soleweb_large.jpg

 

Images redimentionnées sans optimisations (elles sont moins définies et trop lourdes)

 



Image 50 X 50 pixels
Poid: 35.31 Ko
soleweb_large.jpg

Image 100 X 100 pixels
Poid: 35.31 Ko
soleweb_large.jpg

Image 220 X 150 pixels
Poid: 35.31 Ko
soleweb_large.jpg

 

Vous pouvez consulter les propriétés d'une image en cliquant sur celle-ci avec le bouton de droite de votre souris et en sélectionnant "Propriétés". Vous obtiendrez alors sa dimension en pixels, son poid en octects
(1 Ko = 1000 octects) ainsi que la localisation (dans quel répertoire) et le nom de l'image.

Question de poids

Il est important de prendre en considération le poids des images afin d'optimiser le temps de chargement de vos pages. En règle générale, on situe le poids idéal d'une page à moins de 200ko, images comprises.  

 

Lors de la création d'une rubrique, SoleWeb vous permet d'avoir un aperçu de l'images avant de l'insérer dans votre site. Vous évitant ainsi toutes confusions lorsque votre dossier contient beaucoup images. 

 

Retour au Blogue


 

HTML Comment Box is loading comments...