Obraz, który ma być wyświetlony na stronie, powinien mieć tło przezroczyste. Wskaż format graficzny, w którym należy zapisać taki plik.
A. JPEG
B. PNG
C. CDR
D. BMP
Pytanie z egzaminu CKE, czerwiec 2021 (arkusz EE.09-SG-21.06).
Format PNG jest właściwym wyborem, gdy obraz na stronie WWW ma mieć tło przezroczyste. PNG, czyli Portable Network Graphics, obsługuje kanał alfa, a więc informację o stopniu przezroczystości każdego piksela. Dzięki temu grafika może ładnie leżeć na różnych tłach strony: białym, kolorowym, gradientowym albo na zdjęciu w tle. To bardzo praktyczne przy logotypach, ikonach, przyciskach, elementach interfejsu i grafikach dekoracyjnych w HTML/CSS. Moim zdaniem to jeden z podstawowych formatów, które trzeba znać przy robieniu stron, bo używa się go naprawdę często.
PNG stosuje kompresję bezstratną, więc po zapisaniu pliku nie pojawiają się typowe artefakty kompresji, jak w JPEG. Ma to znaczenie szczególnie przy ostrych krawędziach, napisach, zrzutach ekranu i prostych ilustracjach. W dobrych praktykach webowych PNG wybiera się wtedy, gdy potrzebna jest przezroczystość i wysoka jakość detali, choć warto też pamiętać o optymalizacji rozmiaru pliku, na przykład przez kompresory PNG. W nowoczesnych projektach czasem używa się też WebP lub SVG, ale z podanych odpowiedzi to właśnie PNG spełnia wymaganie przezroczystego tła.
PNG stosuje kompresję bezstratną, więc po zapisaniu pliku nie pojawiają się typowe artefakty kompresji, jak w JPEG. Ma to znaczenie szczególnie przy ostrych krawędziach, napisach, zrzutach ekranu i prostych ilustracjach. W dobrych praktykach webowych PNG wybiera się wtedy, gdy potrzebna jest przezroczystość i wysoka jakość detali, choć warto też pamiętać o optymalizacji rozmiaru pliku, na przykład przez kompresory PNG. W nowoczesnych projektach czasem używa się też WebP lub SVG, ale z podanych odpowiedzi to właśnie PNG spełnia wymaganie przezroczystego tła.
Jeżeli wybrany został format inny niż PNG, to najpewniej pomyliły się dwa różne tematy: samo wyświetlanie obrazu na stronie oraz możliwość zapisania przezroczystości w pliku graficznym. Strona WWW może oczywiście osadzić wiele typów plików, ale nie każdy format nadaje się do grafiki z przezroczystym tłem. W tym pytaniu kluczowe jest wsparcie dla kanału alfa, czyli informacji, które piksele są widoczne, półprzezroczyste albo całkiem niewidoczne.
CDR to format związany głównie z programem CorelDRAW i grafiką wektorową. Może być używany podczas projektowania, ale nie jest standardowym formatem do bezpośredniego wyświetlania w przeglądarce internetowej. W praktyce projekt z CDR trzeba zwykle wyeksportować do formatu webowego, na przykład PNG, SVG albo JPEG, zależnie od potrzeb.
BMP kojarzy się z prostą grafiką rastrową, ale w zastosowaniach internetowych jest niepraktyczny. Pliki BMP są zwykle duże, słabo zoptymalizowane pod WWW i nie są dobrym wyborem do nowoczesnych stron. Nawet jeśli jakaś odmiana może przechowywać dodatkowe informacje, to nie jest to format, który stosuje się jako dobrą praktykę w web designie.
JPEG jest bardzo popularny, ale głównie do zdjęć. Ma kompresję stratną i nie obsługuje przezroczystości w typowym użyciu na stronach. Częsty błąd polega na tym, że ktoś widzi biały obszar wokół logo w JPEG i myśli, że to tło przezroczyste. Ono nie jest przezroczyste, tylko po prostu zapisane jako białe piksele. Gdy taki obraz wstawisz na kolorowe tło, biały prostokąt będzie widoczny i wygląda to mało profesjonalnie. Dlatego przy ikonach, logotypach i elementach interfejsu z przezroczystością wybiera się PNG, ewentualnie w nowszych projektach WebP lub SVG, ale z dostępnych odpowiedzi poprawny jest PNG.
CDR to format związany głównie z programem CorelDRAW i grafiką wektorową. Może być używany podczas projektowania, ale nie jest standardowym formatem do bezpośredniego wyświetlania w przeglądarce internetowej. W praktyce projekt z CDR trzeba zwykle wyeksportować do formatu webowego, na przykład PNG, SVG albo JPEG, zależnie od potrzeb.
BMP kojarzy się z prostą grafiką rastrową, ale w zastosowaniach internetowych jest niepraktyczny. Pliki BMP są zwykle duże, słabo zoptymalizowane pod WWW i nie są dobrym wyborem do nowoczesnych stron. Nawet jeśli jakaś odmiana może przechowywać dodatkowe informacje, to nie jest to format, który stosuje się jako dobrą praktykę w web designie.
JPEG jest bardzo popularny, ale głównie do zdjęć. Ma kompresję stratną i nie obsługuje przezroczystości w typowym użyciu na stronach. Częsty błąd polega na tym, że ktoś widzi biały obszar wokół logo w JPEG i myśli, że to tło przezroczyste. Ono nie jest przezroczyste, tylko po prostu zapisane jako białe piksele. Gdy taki obraz wstawisz na kolorowe tło, biały prostokąt będzie widoczny i wygląda to mało profesjonalnie. Dlatego przy ikonach, logotypach i elementach interfejsu z przezroczystością wybiera się PNG, ewentualnie w nowszych projektach WebP lub SVG, ale z dostępnych odpowiedzi poprawny jest PNG.