Kwalifikacje w Zawodzie - Testy zawodowe online | Egzaminy Zawodowe

KWALIFIKACJA PGF4 - STYCZEŃ 2021



PYTANIE NR 25.
Które narzędzie programu Adobe Photoshop umożliwia podział layoutu zapisanego w formacie PSD na elementy edytowalne w kodzie HTML?
A.
B.
C.
D.
Wyjaśnienie poprawnej odpowiedzi:
Narzędzie "Cięcie na plasterki" służy do dzielenia projektu na prostokątne obszary (plasterki), które można eksportować jako oddzielne pliki i w klasycznym workflow web zapisać wraz z prostą strukturą HTML. "Kadrowanie" zmienia tylko obszar obrazu, a "Pióro" i "Zaznaczenie prostokątne" nie realizują funkcji podziału layoutu na plasterki.

Pełne wyjaśnienie:

Narzędzie "Cięcie na plasterki" (plasterki/slices) w Adobe Photoshop zostało zaprojektowane do podziału projektu graficznego na wiele prostokątnych fragmentów. Każdy fragment może być potem eksportowany jako osobny plik graficzny, a w starszym (legacy) podejściu do grafiki internetowej możliwe było także zapisanie eksportu wraz z prostą stroną HTML, która "układała" te fragmenty w całość.

Dlatego odpowiedź "Cięcie na plasterki" pasuje do opisu: chodzi o podział layoutu na elementy, które da się dalej wykorzystać w kodzie strony (przynajmniej na poziomie eksportu fragmentów i pomocnicznej struktury HTML).

Pozostałe odpowiedzi nie spełniają tego celu:

  • "Kadrowanie" zmienia granice/obszar widocznej części obrazu lub kompozycji. To operacja "przytnij całość", a nie "podziel na części". Nie tworzy zestawu niezależnych fragmentów do eksportu.
  • "Pióro" służy do rysowania ścieżek i krzywych Béziera (wektory), np. do precyzyjnych zaznaczeń czy kształtów. Nie jest narzędziem do dzielenia layoutu na wiele eksportowanych elementów.
  • "Zaznaczenie prostokątne" tworzy zaznaczenie pikseli do edycji (kopiowania, wypełniania, maskowania). Samo zaznaczenie nie tworzy "plasterków" ani nie organizuje eksportu layoutu w postaci osobnych zasobów.

Wskazówka egzaminacyjna: gdy w pytaniu pojawia się słowo "podział" projektu na elementy do eksportu dla internetu, najczęściej chodzi o "plasterki". Warto jednak pamiętać, że współcześnie typowy proces tworzenia HTML opiera się na narzędziach webowych i pracy programistycznej, a Photoshop pełni rolę narzędzia do przygotowania grafiki i zasobów.

Dodatkowe pytania

Dodatkowe pytania (FAQ):
Co to są plasterki w Adobe Photoshop?
Plasterki (slices) to prostokątne obszary, na które dzieli się projekt graficzny, aby łatwo eksportować jego fragmenty jako osobne pliki. W starszych workflow web umożliwiały też zapis pomocniczego HTML, który układał wyeksportowane elementy w siatkę.
Jakie narzędzie w Photoshopie tworzy plasterki?
Do tworzenia i edycji plasterków służy narzędzie "Cięcie na plasterki". Pozwala wyznaczyć obszary eksportu, modyfikować ich wymiary oraz zarządzać podziałem projektu na fragmenty. Nie należy mylić go z kadrowaniem, które przycina cały obraz.
Dlaczego kadrowanie nie dzieli layoutu na elementy HTML?
Kadrowanie zmienia granice całej kompozycji (usuwa część obrazu poza kadrem), ale nie tworzy zestawu niezależnych fragmentów do eksportu. Aby uzyskać wiele części projektu, potrzebujesz mechanizmu podziału na obszary, czyli plasterków, a nie jednego nowego rozmiaru dokumentu.
Czy Photoshop potrafi wygenerować edytowalny kod HTML z projektu?
Photoshop może (w podejściu legacy) wygenerować bardzo prostą strukturę HTML towarzyszącą eksportowi plasterków, ale nie zastępuje to ręcznego kodowania nowoczesnych stron. W praktyce Photoshop jest narzędziem do przygotowania grafiki i zasobów, a HTML/CSS tworzy się w narzędziach webowych.
Kiedy stosuje się plasterki zamiast eksportu całego obrazu?
Plasterki stosuje się, gdy projekt ma zostać rozbity na mniejsze elementy (np. tła, przyciski, ikony, paski), które będą używane osobno w interfejsie lub prototypie. To ułatwia kontrolę jakości i rozmiarów plików, a także przekazanie zasobów do wdrożenia.
Jakie są typowe błędy przy pytaniach o plasterki na egzaminie?
Najczęstszy błąd to wybór "Kadrowanie", bo kojarzy się z cięciem. Inny błąd to wybór narzędzi zaznaczania ("Zaznaczenie prostokątne") lub wektorów ("Pióro"), bo tworzą kształty, ale nie definiują obszarów eksportu i nie zarządzają podziałem projektu.
Jak działa "Zapisz dla Internetu (starsze)" w kontekście plasterków?
W trybie "Zapisz dla Internetu (starsze)" można eksportować fragmenty zdefiniowane jako plasterki do osobnych plików (np. PNG, JPG) oraz opcjonalnie zapisać plik HTML, który układa te elementy. To historyczny workflow, ale często pojawia się w pytaniach testowych.
Jak odróżnić "Pióro" od narzędzia plasterków w zadaniach testowych?
"Pióro" służy do rysowania ścieżek i krzywych (precyzyjne kształty, kontury, zaznaczenia), a nie do przygotowania eksportu fragmentów layoutu. Jeśli pytanie dotyczy dzielenia projektu na części do wycięcia/eksportu, właściwym tropem są "plasterki".
Jakie elementy projektu web najczęściej eksportuje się jako osobne pliki?
Najczęściej eksportuje się ikony, logotypy, elementy nawigacji, tła sekcji, ilustracje i pojedyncze komponenty UI, które muszą zachować jakość i transparentność. Część elementów lepiej jednak realizować w CSS (np. proste cienie, gradienty), aby strona była lżejsza.
Jak przygotować się do zadań o narzędziach Photoshopa na egzaminie?
Warto powtórzyć: narzędzia zaznaczania, kadrowanie, pędzle, tekst, warstwy, maski oraz narzędzia web/eksport (w tym plasterki). Pomaga ćwiczenie: dopasuj narzędzie do celu (zaznacz, narysuj, przytnij, podziel, wyeksportuj) i eliminuj skojarzenia "na skróty".
info

To pytanie poprawnie rozwiązuje 63% zdających egzamin. średnie

Według specjalistów z branży: ""Kadrowanie" zmienia tylko obszar obrazu, a "Pióro" i "Zaznaczenie prostokątne" nie realizują funkcji podziału layoutu na plasterki."

Źródła:

  • Adobe Help Center (Helpx): Photoshop — "Slice tool" (narzędzie plasterków), https://helpx.adobe.com/photoshop/using/slice-tool.html (dostęp: 01.03.2026)
  • Adobe Help Center (Helpx): Photoshop — "Save for web" / "Save for Web (Legacy)" (eksport dla internetu), https://helpx.adobe.com/photoshop/using/save-for-web.html (dostęp: 01.03.2026)
  • Adobe Help Center (Helpx): Photoshop — Export/eksport zasobów (np. eksport warstw/zasobów), https://helpx.adobe.com/photoshop/using/export-artboards-layers.html (dostęp: 01.03.2026)

Materiały:

  • Dokumentacja Adobe Photoshop: narzędzie "Slice/Plasterki"
  • Dokumentacja Adobe Photoshop: "Save for Web (Legacy)" i eksport grafik dla internetu
  • Materiały o współczesnym procesie projektowania UI: przekazywanie zasobów i style guide (asset export/hand-off)
Zobacz też:

Aktualizacja pytania: 31.03.2026



Aktualizacja pytania: 31.03.2026
📡 Brak połączenia internetowego