Witamy na stronie Learn Images!

Ten kurs jest przeznaczony zarówno dla początkujących, jak i zaawansowanych programistów stron internetowych, i obejmuje wszystkie zagadnienia – od podstaw zapewniania sprawnego pobierania i renderowania źródeł obrazów po szczegóły na temat komunikacji między serwerem a klientem w popularnych formatach obrazów. W ramach tego kursu dowiesz się, jak uzyskać najmniejszy możliwy rozmiar przesyłanych zdjęć bez obniżania ich jakości, a przynajmniej nie w żaden sposób, który będzie widoczny dla wszystkich.

Możesz przejrzeć tę serię od początku do końca, aby całościowo zrozumieć, jak działają obrazy we współczesnym internecie, lub wykorzystać je jako źródło informacji o konkretnych koncepcjach i wzorcach znaczników, których będziesz używać na co dzień.

Jeśli jesteś nowym użytkownikiem stron internetowych, zapoznaj się z kursami Nauka HTML, w których znajdziesz podstawy używania znaczników, z kursów Naucz się CSS podstaw projektowania oraz Naucz się elastycznego projektowania stron, aby dowiedzieć się, jak będą renderowane obrazy w układach elastycznych.

Oto czego się nauczysz:

Krótka historia obrazów w internecie

Historia obrazów w internecie, począwszy od elementu graficznego w 1993 r.

Kluczowe problemy ze skutecznością

Dowiedz się, jak uzyskać jak najmniejszą wydajność żądań dotyczących obrazów.

Obrazy wektorowe

Dowiedz się więcej o SVG, czyli formacie wektorowym wykorzystywany w internecie.

Obrazy rastrowe

Odkrywaj obrazy rastrowe, takie jak JPEG, GIF, PNG i WebP.

Formaty obrazu: GIF

Poznaj format obrazu GIF i wyjaśnij, jak działa jego kodowanie.

Formaty obrazu: PNG

Dowiedz się, kiedy najlepiej wybrać format PNG.

Formaty obrazu: JPEG

Dowiedz się więcej o najpopularniejszym formacie obrazów w internecie.

Formaty obrazu: WebP

Dowiedz się więcej o WebP i dowiedz się, czym różni się ten format od innych.

Formaty obrazu: AVIF

Format pliku obrazu AV1 (AVIF) to kodowanie oparte na kodeku wideo typu open source AV1.

Obrazy elastyczne

Szczegółowe informacje o obrazach elastycznych

Składni opisowe

Użycie atrybutów srcset i sizes w celu przekazania przeglądarce informacji o źródłach obrazów i sposobie ich wykorzystania.

Składni z przepisami

Dowiedz się więcej o elemencie „obraz”.

Automatyzacja kompresji i kodowania

Generowanie bardzo wydajnych źródeł obrazów stanie się płynnym elementem procesu programowania.

Generatory witryn, platformy i systemy CMS

Dowiedz się, jak systemy CMS, takie jak WordPress, oraz inne generatory witryn mogą ułatwić korzystanie z elastycznych obrazów.

Sieci dostarczania treści graficznych

Dowiedz się, jak sieci CDN dotyczące obrazów mają możliwość przekształcania i optymalizowania zawartości obrazu.

Podsumowanie

Dodatkowe materiały.

Chcesz nauczyć się korzystać z Grafiki?