Faites plus avec des images sur votre site WordPress

Comme le dit le vieil adage, «une image vaut mille mots». Dans le cas de la conception Web, des images de tous types sont utilisées pour aider à raconter une histoire. Les articles de blog les utilisent souvent pour résumer un point, tandis que des exemples plus axés sur les ventes utilisent des images pour illustrer la raison pour laquelle un produit ou un service vaut la peine d'être acheté. Ils sont une partie indispensable de tout site Web.

Heureusement pour nous, WordPress confère à nos images le traitement royal. Ses fonctionnalités multimédia intégrées nous permettent de cataloguer nos images, de les parcourir et même d’apporter des modifications mineures..

Bien que cela nous donne un peu de puissance, les bons plugins peuvent nous aider à en faire encore plus. Aujourd'hui, nous allons examiner cinq de ces plugins WordPress que vous pouvez utiliser pour apporter plus de flexibilité et de fonctionnalités aux images de votre site. Chaque plugin est disponible au téléchargement avec votre abonnement annuel à Envato Elements. Les abonnés ont accès à plus de 450 thèmes et plugins WordPress, ainsi qu'à des centaines de milliers d'éléments de conception de haute qualité, le tout pour un prix modique..

1. Construire une galerie d'images haut de gamme

WordPress possède un moyen intégré pour créer des galeries d'images. Mais le résultat final est quelque chose de très fondamental. Les galeries ont le potentiel de faire beaucoup plus. Ils peuvent présenter votre sujet (qu'il s'agisse de vos compétences en photographie ou de votre collection de voitures classiques) et ajouter une interactivité sérieuse au mélange. Mais vous devrez utiliser un plugin pour créer quelque chose de beau et de fonctionnel..

Galerie globale - Galerie sensible à Wordpress

Global Gallery est un plugin qui peut tout faire. Utilisez-le pour créer des galeries d'images, des curseurs ou des carrousels hautement personnalisés. Vous pouvez importer des images de médias sociaux et de sites de partage de photos ou les télécharger directement via la galerie multimédia de WordPress. Le plug-in vous permet également de marquer des images, que vous pouvez utiliser pour créer une interface de portefeuille filtrable. Vous constaterez également qu'il existe une variété de dispositions et de paramètres à modifier. De plus, tout est réactif et fonctionnera sur n'importe quel écran.

2. Ajouter de l'interactivité à vos images

Les cartes-images existent depuis un certain temps et sont toujours extrêmement utiles. Pour les non-initiés, une carte-image ressemble à n'importe quelle autre image de votre site Web, mais sa magie vient du fait que vous pouvez dessiner de manière personnalisée des zones cliquables «zones sensibles» sur cette image. Cela signifie que vous pouvez relier différentes parties d'une image à différents endroits ou ajouter d'autres effets. Par exemple, vous pouvez avoir une photo de groupe du personnel de votre entreprise. Vous pouvez utiliser une carte-image pour placer un lien sur le visage de chaque personne qui renvoie à sa biographie spécifique..

Image Map Pro

Par défaut, WordPress ne gère pas très bien les cartes d’image. Et puis, il y a aussi le problème de leur manque de réactivité, ce qui conduit les points chauds à ne pas s'adapter correctement aux écrans plus petits. C'est là qu'Image Map Pro est si pratique. Dessinez des formes personnalisées sur vos images qui peuvent être utilisées pour ajouter des liens ou pour afficher des info-bulles multimédia. Il est également entièrement réactif et prend en charge les événements tactiles..

3. Faites des comparaisons une expérience plus visuelle

Une des méthodes les plus efficaces pour démontrer la différence entre les sujets est l’image classique avant-après. Nous les voyons partout pour une bonne raison: ils travaillent. C'est très visuel et souvent si facile à comprendre qu'aucune autre explication n'est nécessaire. Ils comprennent mieux que les mots.

Comparaison des images avant et après WordPress Plugin

La comparaison d'images fournit non seulement un moyen facile d'ajouter des images avant-après à votre site Web WordPress, elle les rend également interactives. Les utilisateurs peuvent faire glisser une ligne de comparaison (horizontalement ou verticalement - en fonction de votre configuration) pour révéler les parties cachées d'une image combinée. Cela apporte un peu plus de concentration sur l'utilisateur qui garantit mieux leur attention.

Et si vous souhaitez mettre la main sur du JavaScript et construire le vôtre, jetez un coup d'œil à ce tutoriel de Adi Purdila:

• 

  Comment créer un slider à écran partagé avec JavaScript

  Dans le didacticiel vidéo d'aujourd'hui, je vais vous montrer comment créer un élément «à écran divisé» (ou une interface utilisateur, comme vous préférez l'appeler) à l'aide de JavaScript. Inspiration…

4. Créer des effets spéciaux superbes

L'ajout d'effets spéciaux aux images peut donner à votre site un aspect unique tout en attirant l'œil de l'utilisateur sur une zone spécifique de la page. Vous pouvez faire diverses choses, des filtres d'image de type Instagram à l'implémentation de l'animation. Ce qui est bien, c’est que vous n’avez plus besoin d’être un expert de Photoshop pour le faire. Avec CSS3, beaucoup de ces effets sont construits directement dans.

Imager - Amazing Image Tool pour WordPress

Avec Imager, vous pouvez facilement ajouter plus de 60 effets spéciaux aux images de votre site. Les filtres, les animations et les effets de souris sont à portée de main. Le plugin sert également d’utilitaire d’image à part entière en vous permettant de créer des tailles d’image personnalisées, une régénération des vignettes, des filigranes, etc..

Et encore une fois, voici Adi Purdila pour expliquer plus en détail les filtres et les CSS:

• 

  Comment appliquer des filtres Instagram dans le navigateur avec Pure CSS

  Voyons comment vous pouvez créer des effets de filtre de type Instagram dans le navigateur sans rien de plus que du CSS. Nous allons jeter un coup d'oeil!

5. Rendre la participation du public plus amusante

Si les médias sociaux nous ont appris une chose, c'est que les gens aiment partager des images. Les memes et les GIF nous font rire et sont souvent utilisés pour aider à diffuser des idées. Dans la bonne situation, il est logique d'exploiter cette technologie pour accroître la participation des utilisateurs sur nos propres sites Web. Pourtant, il semble que ce soit une ressource relativement inexploitée en dehors de l’espace social.

WP Comment Images et vidéos

Pour les sites qui encouragent les commentaires des lecteurs, les images et vidéos WP Comment pourraient être la solution pour susciter plus de conversation. Cela permet non seulement le téléchargement de contenu multimédia par l'utilisateur, mais également le partage de contenu multimédia à partir de sites tels que YouTube et Vimeo. Ce peu de divertissement supplémentaire pourrait faire une grande différence en ce qui concerne la participation des utilisateurs..

Plus que de la décoration

Traditionnellement, les images étaient utilisées pour ajouter un élément décoratif aux sites Web. Mais, comme nous l’avons vu, ils peuvent également être un outil efficace et complet. Les plugins ci-dessus vous aideront à les utiliser de manière à raconter votre histoire et à ajouter de nouveaux niveaux d'interactivité à votre site..