Médias

Accueil > Médias

L'image & le graphisme

L'image

  Une image trop lourde impacte sur la vitesse de chargement de la page. Il s'agit d'un critère important puisqu'il va non seulement décourager 
  l'internaute mais aussi les robots (spiders). 
  Donc, le site sera pénalisé en terme de référencement. WordPress adapte automatiquement l'image au besoin du site (taille, poids, etc.).

  La taille maximale par défaut de téléversement d'une image dans WP est de 50 Mb (Méga Bytes ou Méga Octets Mo).
  OpenSource de gestion de l'image : Xconvert[1], PhotoFiltre [2], Paint.net [3], Paint pour windows

Formats, dimension & poids d'images

3 formats de fichiers sont privilégiés : JPEG : format compressé, fichier léger, mais avec perte de qualité de résolution et pas de transparence. À utiliser pour les photos PNG : format recommandé par le W3C (World Wide Web Consortium[4]). Ce format conserve la transparence de l'image mais il est un peu lourd. À utiliser pour les logos en transparence et images avec très peu de couleurs GIF : moins utilisé que les 2 précédents, il permet de prendre en charge l'animation. À utiliser occasionnellement en raison du poids du fichier Si le fichier image est trop lourd, il existe des compresseurs en ligne assez efficaces selon le format de fichier. compresser un fichier PNG [5] compresser un fichier JPEG[6] convertir png en jpeg[7] ou jpeg en png[8] I-IMG [9] : outil en ligne pour travailler l'image (compresser, redimensionner, recadrer, convertir un format jpg en png, etc)

 La résolution, les dimensions et le poids du fichier (données indicatives)

Résolution	Dimension H x L	Poids du fichier
100 dpi	364 x 559 px	596 ko
200 dpi	728 x 1118 px	2,33 Mo
300 dpi	1092 x 1677 px	5,24 Mo
800 dpi	2912 x 4472 px	37,3 Mo

La gestion des formats de fichiers

VIDEO - Convertir des formats de fichiers

Cette vidéo présente quelques astuces pour réduire le poids d'un fichier image, convertir un .png en .jpg, convertir un fichier .jpg en .pdf ou encore fusionner plusieurs fichiers .pdf en un seul.

Outil - Convertir le format Webp

Un outil gratuit en ligne pour convertir des images WebP en JPG/JPEG/PNG/ICO, ou tout autre format d'image en WebP en un seul clic [10]

Gestion des images

• résolution d'une image : nombre de pixels à savoir sa "dimension informatique". WordPress redimensionne automatiquement les images trop grandes. Il est donc inutile de téléverser une image d'une largeur de 2000 px si la largeur maximale prise en compte par le site est de 720 px en raison de son poids. Le poids d'origine est conservé malgré l'adaptation de l'image : difficulté d'affichage, lenteur.

Redimensionner une image avec Paint

Redimensionner une image avec Paint.net

Redimensionner un lot d'images avec XnConvert[11].

• nommage de l'image : il ne faut pas négliger le nommage puisqu'il participe activement au référencement du site. Le nommage doit décrire l'image. Le téléversement de fichier impose de bannir : espaces, accents, majuscules et autres caractères exotiques (ex : image_amenagement-du-pres_2020.png)

WordPress propose une extension facilitatrice du nommage des images pour un meilleur référencement et éviter les oublis[12]

Quelques astuces techniques

Connaitre les propriétés de l'image clic droit sur l'image pour accéder au menu contextuel Sélectionner "Propriétés" -1- Général Taille 1,14 Mo. Ce fichier est trop lourd, l'image ne va pas s'afficher correctement c'est-à-dire avec fluidité -2- Détails cette image est trop grande d'où son poids. Elle fait H (height) 6000 x L (width)4058 px. Il faut modifier ses dimensions	Propriété d'un fichier
Modifier les dimensions de l'image H x L La modification des dimensions peut se faire avec paint très rapidement. -1- Ouverture du fichier image, Redimensionner -2- Pourcentage ou Pixels selon l'action à mener. -3- 500 px de hauteur en laissant les proportions. Le réglage de la largeur se fait automatiquement -4- Sélection de la conservation des proportions ou non -5- Affichage de l'image redimensionnée -6- Visualisation des propriétés de ce nouveau fichier : 627 Ko et 749 x 500 px	Paint - Redimensionner une image
Le fichier est encore un peu lourd 627 ko, il faut le compresser à l'aide d'une compresseur en ligne -7- Téléversement du fichier dans l'application en ligne permettant la compression (ici, à 75 %) -8- Poids après compression 135 ko. Ceci est parfait pour l'affichage sur le site	Compression du png

La transparence sur une image

Il est parfois utile voire indispensable de supprimer l'arrière plan ou le fond d'une image.

Avec REMOVEBG, une application en ligne très simple et rapide [13] Il suffit de télécharger (ou déposer) l'image sur le site REMOVEBG ou de saisir l'URL de l'image dans l'espace dédié. Une fois l'image téléchargée, l'image s'affiche automatiquement avec l'arrière-plan éliminé. L'option "modifier" permet d'agir sur les couleurs de l'arrière plan. Un clic sur "télécharger" pour récupérer l'image.
Avec le logiciel Paint.net [14] Paint.net (ou Paintnet pour les intimes) est un logiciel de retouche d’images à destination des PC qui fonctionne sous Windows. Ses fonctionnalités sont simples et intuitives. [|| Paint.net en vidéos]

La création de coins arrondis sur une image

Cet exemple en vidéo montre la création de coins arrondis sur un image. Cette manipulation peut se faire avec n'importe quelle forme géométrique

Le graphisme - tendances 2021

Chaque année depuis 6 ans maintenant nous donnons la parole à un pool d’experts issus de l’univers de la communication visuelle pour imaginer de quoi l’année à venir sera faite en matière de design graphique : directeur de création, directeur du design, graphiste freelance, designers, etc. se sont prêtés à l’exercice, analysant l’année écoulée, leur travail et leurs propres recherches. Quelles tendances se dessinent, lesquelles se renforcent ou au contraire s’effacent ? [15]

• Le psychédélisme abstrait
• Le renouveau du symbolisme
• Le rétro futurisme
• Le surréalisme
• Les représentations plus authentiques
• Les personnages irrévérencieux
• Les bandes-dessinées et le pop art
• Les inspirations beaux-arts
• Les éléments de la nature
• Le flou et le grain
• Le design socialement responsable

Article complémentaire [16]

Image matricielle & Vectorielle

Photopea

Photopea [17] est un logiciel de retouche et de traitement d'images matricielles et vectorielles. Disponible uniquement en ligne, le logiciel revendique 1,5 million d'utilisateurs en octobre 2018. Il supporte la plupart des formats d'image, y compris les fichiers au format PSD ainsi que ceux issus de Sketch ou de GIMP

Gimp

GIMP [18] est un logiciel OpenSource de traitement de l'image. Il est une excellente alternative à Photoshop fournit les outils nécessaires à la manipulation d'images de haute qualité. De la retouche à la restauration de composites créatifs, la seule limite est votre imagination.
Il donne aux artistes la puissance et la flexibilité nécessaires pour transformer les images en créations vraiment uniques. Il est aussi utilisé pour la production d'icônes, d'éléments de conception graphique et d'art pour les composants d'interface utilisateur et les maquettes. Il offre des fonctions de gestion des couleurs de premier ordre pour assurer une reproduction des couleurs haute fidélité sur les supports numériques et imprimés. Il est utilisé au mieux dans les flux de travail impliquant d'autres logiciels libres tels que Scribus, Inkscape et SwatchBooker. Les développeurs et mainteneurs de GIMP souhaitent créer un logiciel d'infographie gratuit haut de gamme pour l'édition et la création d'images originales, de photos, d'icônes, d'éléments graphiques de pages web, et d'art pour les éléments de l'interface de l'utilisateur. Logiciel très complet pour retoucher des images/photos [19]

Vidéos GIMP

  Des tutoriels vidéos

Paint.net

PAINT.NET[20] est un logiciel simple d'utilisation un peu moins complet que GIMP. Il permet de commercer facilement avec le traitement de l'image. En savoir plus en vidéo

Des sites d'illustrations et animations

EDIT.org

EDIT.org [21] est un éditeur en ligne avec plus de 20 000 modèles différents pour créer les meilleures affiches, bannières, publications sur les réseaux sociaux et différents types de publicités, très faciles à utiliser et entièrement personnalisables.
L'éditeur se concentre sur l'aide aux petites entreprises avec leurs besoins quotidiens, pour lesquels il propose des modèles distincts sur différents types d'emplois ou d'entreprises qui peuvent aider à promouvoir des dates particulières, des événements, des remises ou des services spécifiques, entre autres.

Blush

Blush [22] permet la création et la personnalisation d'illustrations percutantes grâce aux collections proposées par nos illustrateurs internationaux

Vektor

VEKTOR [23] - Toutes les illustrations énumérées sont gratuites pour un usage personnel et commercial. Certains packs d'illustrations ont des licences personnalisées qui peuvent en restreindre l'utilisation. [24]

Pixelied

PIXELIED [25] est une alternative efficace à un outil comme Canva, pour créer des visuels à destination du web et des réseaux sociaux sans compétence en graphisme. La plateforme est en anglais mais elle est très intuitive.
Pixelied est un outil de conception riche en fonctionnalités, qui propose une vaste bibliothèque de plus de 2000 templates, de 3 millions de photos, d’icônes, d’illustrations et une sélection de palettes de couleurs et de vecteurs. Plus de 25 formats sont disponibles et l’outil est entièrement collaboratif, permettant de travailler en équipe, de partager des créations… L’outil se présente comme une alternative à des outils bien connus par les Community Manager à savoir Canva, Crello, PicMonkey ou bien Venngage.[26]

PixelTrue

PixelTrue plus de 1000 illustrations et animations [27] 170+ Vecteur libre - Illustrations & Animations Les publications d'illustrations et d'animations chaque semaine ! Pour être le premier à être informé des prochaines illustrations gratuites, consultez notre newsletter . Ces illustrations SVG gratuites ET animations Lottie sont disponibles gratuitement pour un usage personnel et commercial (licence MIT).

CANVA

Canva [28]est une plate-forme de conception graphique qui permet aux utilisateurs de créer des graphiques, des présentations, des affiches, des documents et d'autres contenus visuels sur les médias sociaux.

CRELLO

Crello [29] est un outil de conception graphique gratuit en ligne. Cette application permet de créer du visuel pour les réseaux sociaux, les sites web, les évènements, etc.

• Plus de 30 000 templates
• 140 millions d'images
• Formats Facebook, Instagram, Youtube, Twitter, etc.
• Affiches, infographies, cartes professionnelles ou brochures
• Formats : png, pdf, mp4, gif, png transparence.
• Partage direct sur les réseaux sociaux de la conception
• Intégration du lien sur le site

L'audio

Audacity

Audacity [30] est un logiciel d’édition audio ainsi que d’enregistrement de sons numériques. Totalement gratuit, ce logiciel open-source est disponible pour Windows, MacOS, Linux et d’autres systèmes d’exploitation de type Unix.
En plus de permettre l’enregistrement audio depuis des sources multiples, Audacity peut être utilisé pour le post-processing de tous types de fichiers audio, ce qui inclut les podcasts en ajoutant des effets tels que la « normalization », le trimming et des fadings in et out.
Audacity est également connu pour avoir permis l’enregistrement d’albums musiques complets comme Tune-Yards. Il est aussi utilisé pour l’examen anglais OCR National Level 3 ICT dans son unité sur la création de sons.

Extraction de la voix

LaLal.ai [31] est un outil en ligne gratuit de base très simple d'utilisation malgré l'interface en anglais. Il permet d'extraire et de séparer la partie instrumentale et la voix.
La version gratuite ne permet d'extraire que 1 minute et 10 secondes de votre fichier audio. Des formules payantes Lite et Pro sont disponibles pour extraire l'intégralité de 10 chansons numériques (ou 90 minutes au total), ou 30 musiques (soit 500 minutes au total).

• Importer le fichier au format MP3, WAV, ou Flac par glisser-déposer ou en parcourant vos fichiers via le bouton Select File
• Démarrer le traitement. L'application convertie automatiquement le fichier dans le format (mp3 >> mp3).
• Télécharger les 2 fichiers générés pour les importer dans un logiciel de montage audio ou vidéo...

Vocaroo - Enregistrement audio

Vocaroo [32] une application en ligne d'enregistrement vocal. L'enregistrement peut être téléchargé, partagé sur un réseau social ou embarqué sur un site web.

La vidéo

Des applications OpenSource

Shotcut

Shotcut [33]est un éditeur vidéo gratuit, open source et multiplateforme.

• Prise en charge de nombreux formats. Il prend en charge des centaines de formats et de codecs audio et vidéo grâce à FFmpeg. Aucune importation requise, ce qui signifie un montage natif, ainsi que des lignes de temps, des résolutions et des fréquences d'images multiformat au sein d'un projet. Recherche d'images précises prise en charge pour de nombreux formats vidéo.
  
• Options de périphériques et de transport. Blackmagic Design SDI et HDMI pour l'entrée et le contrôle de la prévisualisation. Il permet la capture d'écran, de webcam et d'audio. Il prend en charge des résolutions allant jusqu'à 4k et la capture à partir de dispositifs SDI, HDMI, webcam, JACK & Pulse audio, flux IP, écran X11 et Windows DirectShow.
• Interface élégante et intuitivePlusieurs panneaux ancrables et désancrables, y compris les propriétés détaillées des médias, les fichiers récents avec recherche, la liste de lecture avec affichage des vignettes, le panneau de filtre, l'affichage de l'historique, le panneau d'encodage, la file d'attente des travaux et le serveur et la liste de lecture fusionnés. Il prend également en charge le glisser-déposer de ressources à partir du gestionnaire de fichiers.

Vidéos Shotcut

   Retrouvez toutes les vidéos utiles pour maitriser l'application

OpenShot Vidéo

OpenShot [34] est un éditeur vidéo, libre et open-source pour Linux, Mac et Windows. Il est disponible en français. Cette application est très simple d'utilisation. OpenShot peut lire et écrire la plupart des formats vidéo et image. Les pistes sont utilisées pour disposer en couche les images, les vidéos, et l'audio dans un projet. Vous pouvez créer autant de couches que nécessaire, tels que les filigranes, les pistes audio d'arrière plan, les vidéos en arrière plan, etc... N'importe quelle transparence sera visible à travers le niveaux qui sera en dessous de lui. Les pistes peuvent être montées, descendues ou bien bloquées. - Plus de 400 transitions sont incluses dans OpenShot, lesquelles vous permettent de passer graduellement d'un clip à un autre. La rapidité et la netteté des transitions peuvent également être ajustées à l'aide d'images clés (si besoin). Le chevauchement de 2 deux clips créera une nouvelle transition automatiquement. - Plus de 40 gabarits de titres vectoriels sont inclus dans OpenShot, lesquels rendent amusant et facile leur ajout dans votre projet. Vous pouvez aussi créer vos propres titres vectoriels, et utiliser ceux-ci au lieu de ceux fournit. Ajuster rapidement la police, la couleur, et le texte de vos titres dans notre éditeur de titres intégré.

DaVinci Resolve

DaVinci Resolve [35] est un puissant logiciel gratuit de montage et d'étalonnage professionnel. Il est utilisé la plupart du temps en post-production au cinéma ou à la télévision, cet outil propose une foule de possibilité pour le long et le court métrage, la publicité et la production audiovisuelle. Grâce à sa ligne du temps multicouches et à la prise en charge du montage multicaméras, ce logiciel fournit un espace de travail intuitive et complet. Parmi les autres possibilités à sa disposition, l'utilisateur peut à sa guise ajouter des transitions dynamiques, recadrer ses plans et ajouter des titres à l'aide de l'outil prévu à cet effet. L'application s'installe par défaut en anglais. Pour changer la langue, il faut sélectionner dans les Préférences / User / Interface / Langue.

DavVinci propose un programme très complet pour se former au montage, aux effets visuels, à l'étalonnage et à l'audio en vidéo. Toutes les ressources sont à disposition sur le site.

L'export d'un diaporama en vidéo

Avec PowerPoint

PowerPoint permet d'export un diaporama dans un format vidéo

Avec LibreOffice

LibreOffice permet l'export du diaporama dans un format vidéo .swf

Fichier / Exporter / sélectionner l'extension "flash" .swf Il suffit de convertir le fichier .swf dans un format .mp4. Des convertisseurs en ligne permettent de faire cette manipulation Convertio

MAIL - Sendspark, le message en vidéo

Cette application en ligne très intuitive permet de créer des mails avec des vidéos personnelles incrustées . Il suffit de se filmer puis d'embarquer le message vidéo dans votre mail à la place d'un écrit long et impersonnel. L'application est gratuite pour 30 vidéos.

Parfait pour le marketing, les ventes et la réussite des clients : vous pouvez utiliser Sendspark [36] pour faire participer les clients, collaborer avec les membres de l'équipe et vous connecter avec n'importe qui en ligne.[37]

• Améliorer vos bulletins d'information marketing, vos séquences d'e-mails automatiques et vos messages personnels rapides,
• Établir des relations personnelles avec les clients,
• Montrer votre produit en action,
• Favoriser l'engagement et les conversions,
• Augmenter la satisfaction et la fidélisation des clients.

Sendspark facilite la messagerie vidéo.

Téléchargez l'extension pour Chrome [38]

Les icônes et les textures

Les icônes sont des symboles graphiques, incontournables du web, affichés sur l'écran d'un ordinateur et correspondant, au sein d'un logiciel, à l'exécution d'une tâche particulière. Ce symbole est un pictogramme représentant une action, un objet, un logiciel, un type de fichier, etc.[39]

Icon8

Icon8 [icons8.com] propose gratuitement plus de 133000 icônes. Cette plateforme propose aussi des outils de personnalisation.

Iconfinder

Iconfinder [40] propose dans sa version "free" des icônes très variées plus de 5 M. La sélection peut se faire dans la barre de recherche ou par catégorie, style ou par popularité.