Comment garder GIF dans Photoshop

Anonim

Comment garder GIF dans Photoshop

Après avoir créé une animation dans Photoshop, il doit être enregistré dans l'un des formats disponibles, dont l'un est gif. Une caractéristique de ce format est qu'il est destiné à afficher (jouer) dans le navigateur.

Si vous êtes intéressé par d'autres options pour sauver l'animation, nous vous recommandons de lire cet article:

Leçon: Comment sauvegarder la vidéo dans Photoshop

Le processus de création d'une animation GIF a été décrit dans l'une des leçons précédentes. Nous allons aujourd'hui parler de la manière de sauvegarder le fichier au format GIF et sur les paramètres d'optimisation.

Leçon: créer une animation simple dans Photoshop

Sauver GIF.

Pour commencer, nous répétons le matériel et lisons la fenêtre Sauvegarder les paramètres. Il s'ouvre en cliquant sur l'élément "Enregistrer pour web" dans le menu Fichier.

Point Enregistrer sur Web dans le menu Fichier pour enregistrer les gifs dans Photoshop

La fenêtre se compose de deux parties: un bloc d'aperçu

Une unité de recipigation dans les réglages des paramètres de la préservation des gifs dans Photoshop

et bloc de paramètres.

Paramètres de bloc dans la fenêtre Paramètres de conservation Gifki dans Photoshop

Aperçu du bloc

Sélectionnez le nombre d'options de visualisation est sélectionné en haut du bloc. Selon les besoins, vous pouvez sélectionner le paramètre souhaité.

Sélection des options de visualisation dans la fenêtre Paramètres de conservation GIFKI dans Photoshop

L'image dans chaque fenêtre, à l'exception de l'original, est configurée séparément. Ceci est fait afin que vous puissiez choisir l'option optimale.

Dans le côté gauche du bloc, il y a un petit ensemble d'outils. Nous n'utiliserons que la "main" et "échelle".

Outils de main et d'échelle dans la fenêtre Paramètres de conservation GIFKI dans Photoshop

Utilisation de la "main", vous pouvez déplacer l'image dans la fenêtre sélectionnée. Le choix est également fait par cet outil. "Échelle" effectue la même action. Environ et supprimer la photo peut également être des boutons au bas du bloc.

Échelle d'image dans la fenêtre Paramètres de conservation Gifki dans Photoshop

Bas ci-dessous est le bouton avec l'inscription "vue". Il ouvre l'option sélectionnée dans le navigateur par défaut.

Bouton Vue d'image dans le navigateur dans la fenêtre Paramètres des paramètres de gifting dans Photoshop

Dans la fenêtre du navigateur, à l'exception des paramètres de réglage, nous pouvons également obtenir le code GIF HTML.

Aperçu de l'image dans le navigateur par défaut, tout en maintenant les gifs dans Photoshop

Paramètres de blocs

Dans ce bloc, les paramètres d'image sont configurés, le considèrent davantage.

  1. Schéma de couleur. Ce paramètre détermine quelle table de couleurs indexées sera appliquée à l'image lors de l'optimisation.

    Sélection du schéma d'indexation des couleurs tout en conservant des gifs dans Photoshop

    • Perceptive, et simplement « système de perception. » Quand il est utilisé, Photoshop crée une table de couleurs, guidée par les nuances actuelles de l'image. Selon les développeurs, ce tableau est aussi proche que possible de la façon dont l'œil humain voit la couleur. Plus - l'image est le plus proche de l'original, les couleurs sont au maximum enregistrées.
    • Le système sélectif est similaire au précédent, mais les couleurs sont principalement utilisées dans ce relatives au Web sécurisé pour le Web. Il a également porté sur l'affichage des teintes approximative à celle initiale.
    • Adaptatif. Dans ce cas, la table est créée à partir des couleurs qui sont plus fréquentes dans l'image.
    • Limité. Se compose de 77 couleurs, certains des échantillons qui sont remplacés par blanc sous la forme d'un point (grain).
    • Personnalisé. Lors du choix de ce régime, il est possible de créer votre propre palette.
    • Noir et blanc. Ce tableau utilise deux couleurs (noir et blanc), également à l'aide du grain.
    • Dans les classes de gris. Il existe différents niveaux de 84 nuances de gris.
    • MacOS et Windows. Les données du tableau sont compilées à partir des caractéristiques des images cartographiques dans les navigateurs exécutant ces systèmes d'exploitation.

    Voici quelques exemples de schémas d'application.

    échantillons d'image en utilisant différentes couleurs d'indexation des tables tout en maintenant gifs dans Photoshop

    Comme vous pouvez le voir, les trois premiers échantillons ont une qualité tout à fait acceptable. Malgré le fait que visuellement ils ont presque ne diffèrent pas les uns des autres, sur les différentes images de ces systèmes fonctionneront différemment.

  2. Nombre maximum de couleurs dans la table des couleurs.

    Réglage du nombre maximum de couleurs dans le tableau d'indexation tout en maintenant les gifs dans Photoshop

    Le nombre de nuances dans l'image affecte directement son poids, et, par conséquent, la vitesse de téléchargement dans le navigateur. La valeur de 128 est le plus souvent utilisé, étant donné que ce paramètre ne presque pas d'incidence sur la qualité, tout en réduisant le poids du gif.

    Des exemples de paramètres pour le nombre maximum de couleurs dans le tableau d'indexation tout en maintenant les gifs dans Photoshop

  3. couleurs Web. Ce paramètre établit la tolérance avec laquelle les nuances sont converties en équivalent d'une palette Web sécurisée. Le champ de fichier est déterminé par la valeur définie par le curseur: la valeur est supérieure - le fichier est moins. Lors de la configuration des couleurs WEB ne devraient pas aussi oublier la qualité.

    Réglage de la tolérance de conversion d'image aux couleurs web tout en maintenant gifs dans Photoshop

    Exemple:

    Des exemples de mise en place de la conversion des couleurs à WEEB tout en maintenant gifs dans Photoshop

  4. Dysrying permet de lisser les transitions entre les couleurs en mélangeant les teintes qui sont contenues dans le tableau d'indexation sélectionné.

    Dystering réglage tout en maintenant gifs dans Photoshop

    En outre, le réglage aidera comment préserver les gradients et l'intégrité des sites monochromes. Lors de l'utilisation de distribution augmente le poids du fichier.

    Exemple:

    Des exemples de l'application des paramètres de dystering tout en maintenant gifs dans Photoshop

  5. Transparence. Le format GIF ne absolument transparents ou opaques pixels absolument.

    Réglage de la transparence du fond tout en maintenant gifs dans Photoshop

    Ce paramètre, sans réglage supplémentaire, affiche mal les lignes courbes, laissant dames de pixels.

    Des exemples de l'utilisation de la matte de réglage tout en maintenant les gifs dans Photoshop

    Le réglage est appelé « mate » (dans certains éditeurs « kaima »). Avec elle, il est configuré pour mélanger les images de pixels avec un arrière-plan de la page sur laquelle il sera situé. Pour le meilleur affichage, choisissez une couleur correspondant à la couleur de l'arrière-plan du site.

    Réglage du mélange d'images de pixels avec l'arrière-plan de la presse PAGES resoe dans Photoshop

  6. Entrelacée. L'un des plus utiles pour les paramètres Web. Dans le cas où le fichier a un poids considérable, vous permet d'afficher immédiatement une image sur la page, comme il charge l'amélioration de sa qualité.

    Réglage des entrelacée tout en maintenant gifs dans photoshop

  7. conversion sRGB permet d'économiser les couleurs de l'image d'origine tout en économisant le maximum.

    Réglage de la conversion des couleurs sRVB tout en maintenant gifs dans Photoshop

La mise en place « transparence Dysrying » aggrave considérablement la qualité de l'image, et nous allons parler du paramètre « perte » dans la partie pratique de la leçon.

paramètres Dysrying pour la perte de transparence et de données tout en maintenant gifs dans Photoshop

Pour la meilleure compréhension du processus de mise en place de la préservation des gifs dans Photoshop, vous devez pratiquer.

Entraine toi

L'objectif d'optimisation des images pour l'Internet est la réduction maximale du poids du fichier tout en maintenant la qualité.

  1. Après le traitement de l'image, allez dans le menu « Fichier - Enregistrer pour le Web » menu.
  2. Pièce le mode d'affichage "4 option".

    Le choix du nombre d'options pour l'affichage des résultats, tout en maintenant gifs dans Photoshop

  3. Ensuite, vous avez besoin d'une des options pour tirer le meilleur parti similaire à l'original. Que ce soit une image à droite de la source. Ceci est fait afin d'estimer la taille du fichier avec une qualité maximale.

    Réglages Les réglages sont les suivants:

    • Système de couleurs « sélective ».
    • "Couleurs" - 265.
    • "Diazering" est "aléatoire", 100%.
    • Retirez les geais en face du paramètre « entrelacée », puisque l'image finale de l'image sera assez faible.
    • « Couleurs Web » et « pertes » - zéro.

      Réglage des paramètres de l'image de référence, tout en maintenant les gifs dans Photoshop

    Comparez le résultat avec l'original. Au bas de la fenêtre de l'échantillon, on peut voir la taille gif actuelle et la vitesse de chargement à la vitesse d'Internet spécifiée.

    Comparaison du résultat de l'optimisation de l'image avec l'original, tout en maintenant les gifs dans Photoshop

  4. Aller à l'image ci-dessous vous venez de configurer. Nous allons essayer de l'optimiser.
    • Laissez le régime sans le modifier.
    • Le nombre de couleurs réduire jusqu'à 128.
    • La valeur de Dysmering réduite à 90%.
    • couleurs-Web ne touchent pas, parce que dans ce cas, il ne nous aidera à maintenir la qualité.

      Réglage des paramètres d'image cible tout en maintenant les gifs dans Photoshop

    taille gif est passée de 36,59 à 26,85 Ko Ko.

    Réduction de la taille de l'image après optimisation, tout en maintenant gifs dans Photoshop

  5. Étant donné que certains petits défauts et granulosité sont déjà présents dans l'image, nous allons essayer d'augmenter les « pertes ». Ce paramètre définit un niveau admissible de perte de données lors de la compression GIF. Modifiez la valeur à 8.

    Réglage du niveau de perte de données admissible lors de la compression GIF pour enregistrer les gifs dans Photoshop

    Nous avons encore réussi à réduire la taille du fichier, tout en perdant un peu de qualité. Gifs pèse maintenant 25,9 kilo-octets.

    Taille de l'image après la mise en place perte tout en maintenant gifs dans Photoshop

    Total, nous avons pu réduire la taille de l'image environ 10 Ko, ce qui est plus de 30%. Très bon résultat.

  6. D'autres actions sont très simples. Cliquez sur le bouton Enregistrer.

    bouton Enregistrer dans la fenêtre Paramètres de conservation Gifki dans Photoshop

    Nous avons choisi un endroit pour sauver, donner le nom du gif, et appuyez sur « Enregistrer » à nouveau.

    Choisir un lieu et nom de la préservation des gifs dans Photoshop

    S'il vous plaît noter qu'il ya un ensemble d'opportunité avec le GIF pour créer un document HTML auquel notre image sera construite. Pour ce faire, il est préférable de choisir un dossier vide.

    Enregistrement gifs avec le document HTML dans Photoshop

    En conséquence, nous obtenons une page et un dossier avec l'image.

    Dossier avec sauvé gif dans Photoshop

Conseil: Lors de l'attribution d'un nom de fichier, essayez de ne pas utiliser des caractères cyrilliques, car tous les navigateurs sont en mesure de les lire.

Cette leçon pour enregistrer l'image dans le format GIF est terminé. Là-dessus, nous avons découvert comment optimiser le fichier pour le placement sur Internet.

Lire la suite