Оптимизирајте и зачувајте слики во GIF формат


По креирањето на анимација во Photoshop, треба да ја зачувате во еден од достапните формати, од кои едната е Gif. Карактеристика на овој формат е дека е наменета за прикажување (репродукција) во прелистувачот.

Ако сте заинтересирани за други опции за зачувување на анимацијата, Ви препорачуваме да го прочитате овој напис тука:

Лекција: Како да зачувате видео во Фотошоп

Процес на создавање Gif Анимацијата е опишана во една од претходните лекции, а денес ќе разговараме за тоа како да ја зачувате датотеката Gif и поставувања за оптимизација.

Лекција: Креирајте едноставна анимација во Photoshop

Зачувување на GIF

За да започнете, повторете го материјалот и погледнете го прозорецот за зачувување. Се отвора со кликнување на предметот. "Зачувај за веб" во менито "Датотека".

Прозорецот се состои од два дела: блок за преглед

и блок поставувања.

Прегледен блок

Изборот на бројот на опции за гледање е избран во горниот дел од блокот. Во зависност од вашите потреби, можете да ја одберете саканата поставка.

Сликата во секој прозорец, освен оригиналот, е конфигурирана одделно. Ова е направено така што можете да ја изберете најдобрата опција.

Во горниот лев дел од блокот постои мал сет на алатки. Ќе користиме само "Рака" и "Скала".

Со помош на "Раце" Можете да ја преместите сликата во избраниот прозорец. Изборот е исто така направен со оваа алатка. "Скала" врши истото дејство. Можете исто така да зумирате и одзумирате со копчињата на дното од блокот.

Само подолу е означено копчето "Прикажи". Ја отвара избраната опција во стандардниот пребарувач.

Во прозорецот на прелистувачот, покрај збир на параметри, можеме да добиеме HTML код gifs

Блокирај поставки

Во овој блок, параметрите за слика се поставени, ајде да го разгледаме подетално.

  1. Боја шема. Оваа поставка одредува која индексирана табела на боја ќе се примени на сликата за време на оптимизацијата.

    • Перцептуален, туку едноставно "шема на перцепција". Кога се применува, Photoshop создава табела на бои, водена од тековните нијанси на сликата. Според програмерите, оваа табела е колку што е можно поблиску до тоа како човечкото око ги гледа боите. Плус - најблиску до оригиналната слика, боите се зачувуваат што е можно повеќе.
    • Селективен Шемата е слична на претходната, но најчесто користи бои кои се безбедни за веб. Исто така се фокусира на приказ на нијанси близу до оригиналот.
    • Адаптивно. Во овој случај, табелата е создадена од бои кои почесто се наоѓаат на сликата.
    • Ограничена. Се состои од 77 бои, од кои некои се заменети со бела боја во вид на точка (жито).
    • Прилагодено. При изборот на оваа шема, можно е да креирате сопствена палета.
    • Црно-бело. Оваа табела користи само две бои (црна и бела), исто така, со користење на жито.
    • Во сива боја. Тука се применуваат разни 84 нивоа на нијанси на сива боја.
    • MacOS и Windows. Овие табели се собираат врз основа на карактеристиките на прикажување на слики во прелистувачи кои работат на овие оперативни системи.

    Еве неколку примери за користење на шеми.

    Како што можете да видите, првите три примероци имаат доста прифатлив квалитет. И покрај фактот дека визуелно тие тешко се разликуваат едни од други, овие шеми ќе работат поинаку на различни слики.

  2. Максималниот број на бои во табелата со боја.

    Бројот на нијанси на сликата директно влијае на неговата тежина, и соодветно на тоа, брзината на преземање во прелистувачот. Најчесто користени вредности 128Бидејќи оваа поставка нема речиси никакво влијание врз квалитетот, додека ја намалува тежината на GIF.

  3. Веб бои. Ова поставување ја поставува толеранцијата со која тоновите се претвораат во еквивалент од безбедна веб-палета. Тежината на датотеката се одредува со вредноста поставена од лизгачот: вредноста е поголема - датотеката е помала. Кога поставувате веб-бои, не заборавајте за квалитетот.

    Пример:

  4. Dithering ви овозможува да ги изедначите транзициите помеѓу боите со мешање на нијанси кои се содржани во избраната табела за индексирање.

    Прилагодувањето, исто така, ќе помогне, колку што е можно, да ги зачува градиентите и интегритетот на монохроматичните области. Кога се користи dithering, тежината на датотеката се зголемува.

    Пример:

  5. Транспарентност. Формат Gif поддржува само апсолутно транспарентни, или апсолутно непроѕирни пиксели.

    Овој параметар, без дополнително прилагодување, лошо прикажува искривени линии, оставајќи ги пикселните скали.

    Прилагодување се повикува "Матирано" (во некои изданија "Граница"). Може да се користи за мешање на пикселите на сликата со позадина на страницата на која ќе се наоѓа. За најдобар екран, одберете боја која одговара на бојата на позадината на страницата.

  6. Испреплетени. Една од најкорисните поставки за Веб. Во тој случај, ако датотеката има значителна тежина, таа ви овозможува веднаш да ја прикажете сликата на страната, како што е вчитана, подобрување на нејзиниот квалитет.

  7. Конверзијата sRGB помага да се задржи максимумот на оригиналните бои на сликата при зачувување.

Персонализација "Сместена транспарентност" значително го деградира квалитетот на сликата, но за параметарот "Загуби" ќе разговараме во практичниот дел од лекцијата.

За најдобро разбирање на процесот на поставување на зачувување на GIFs во Photoshop, треба да вежбате.

Пракса

Целта на оптимизирање на слики за интернетот е да се минимизира тежината на датотеката додека се одржува квалитетот.

  1. По обработката на сликите одете на менито "Датотека - зачувај за веб".
  2. Изложувајте го режимот за прикажување "4 опции".

  3. Следна ви е потребна една од опциите за да се направи што е можно поблиску до оригиналот. Нека биде сликата десно од изворот. Ова е направено со цел да се процени големината на датотеката со максимален квалитет.

    Поставките на параметарот се како што следува:

    • Боја шема "Селективен".
    • "Бои" - 265.
    • "Исчезнување" - "Случаен", 100 %.
    • Отстранете го полето за избор пред параметарот "Преплетување", бидејќи конечниот волумен на сликата ќе биде доста мал.
    • "Веб бои" и "Загуби" - нула.

    Споредете го резултатот со оригиналот. На дното од прозорецот за примероци, можеме да ја видиме моменталната големина на gif и брзината на преземање на наведената интернет брзина.

  4. Оди на сликата подолу само конфигуриран. Да се ​​обидеме да го оптимизираме.
    • Шемата е оставена непроменета.
    • Бројот на бои е намален на 128.
    • Значење "Исчезнување" сведена на 90%.
    • Веб бои не допирајте, бидејќи во овој случај тоа нема да ни помогне да го одржиме квалитетот.

    Големина на GIF се намали од 36,59 KB до 26,85 KB.

  5. Бидејќи веќе има некои жито и мали дефекти на сликата, ние ќе се обидеме да се зголеми "Загуби". Овој параметар одредува прифатливо ниво на загуба на податоци за време на компресија. Gif. Променете ја вредноста на 8.

    Успеавме и понатаму да ја намалиме големината на датотеката, а губиме малку во квалитет. Gifka сега тежи 25,9 килобајти.

    Значи, можевме да ја намалиме големината на сликата за околу 10 KB, што е повеќе од 30%. Многу добар резултат.

  6. Понатамошните активности се многу едноставни. Притиснете го копчето "Зачувај".

    Изберете место за зачувување, дајте го името на gif и потоа кликнете на "Зачувај ".

    Забележете дека постои можност заедно со Gif создаде и HTML документот во кој нашата слика ќе биде вградена. За ова е подобро да изберете празна папка.

    Како резултат на тоа, добиваме страница и папка со слика.

Совет: кога именувате датотека, пробајте да не користите кирилични знаци, бидејќи не сите прелистувачи можат да ги читаат.

Во оваа лекција за зачувување на слики во формат Gif завршено. На него, дознавме како да ја оптимизирате датотеката за поставување на интернет.