1. Dlaczego trzeba dostosować zdjęcia na potrzeby stron internetowych
1.1 Wyświetlanie
Użycie niektórych znaków w nazwie zdjęcia może powodować błędy w ich wyświetlaniu na niektórych urządzeniach lub przeglądarkach.
1.2 Szybkość prezentowania treści (czas "załadowania" strony )
Im większy rozmiar zdjęcia, tym zdjęcie więcej “waży”, a więc dłużej się wczytuje co ma wpływ na odbiór strony przez użytkownika. Jeśli dana strona wczytuje się dłużej niż 3 sekundy, wielu użytkowników z niej wychodzi, zamiast poczekać dłużej. Ma to znaczenie szczególnie wtedy, gdy na stronie przetwarzanych jest wiele fotografii jednocześnie (w galeriach). Niestety, ale to właśnie zdjęcia są najczęstszym powodem, że strona wolno się ładuje.
W trosce o powyższe w Portalu UJ zobowiązujemy redaktorów do właściwego przygotowania zdjęć - zanim zostaną one umieszczone w portalowej Bibliotece Dokumentów i Grafik
2. Wytyczne dotyczące zdjęć
2.1 Waga zdjęć
Optymalnie ciężar grafik nie powinien przekroczyć 200 kB. Im mniej tym lepiej - należy znaleźć kompromis pomiędzy wagą zdjęcia a jego czytelnością.
Uwaga! W galeriach zdjęcia o zbyt dużym rozmiarze będą ładować się wolniej, ponieważ system będzie je na bieżąco skalował.
2.2 Wymiary grafik w nowym motywie
- Zdjęcia w Galerii: Szerokość max. 1200 px, Wysokość max. 900 px
- Miniatura dla głównej strony: 450 x 150 px
- Miniatura dla agregatora listy artykułów: 300 x 230 px
- Box: 450 x 216 px
- Box-agregator: 450 x 146 px
- Baner statyczny: 1430 x 170 px
- Baner dynamiczny: 1430 x 530 px (min. Wysokość 201 px)
- Wizytówka (osoba), zdjęcie osoby: 190 x 230 px
- Wizytówka (osoba), zdjęcie-cytat: 451 x 356 (px)
- Zdjęcie jednostki: 300 x 195 px
- Zdjęcie kierownik: 225 x 270 px
- Pierwsza klatka w materiale video: 930 px x 520 px
2.3 Nazwa plików i folderów
-
Najlepiej nie dodawać zdjęć o nazwach DSC0001.jpg – nazwa powinna określać zawartość zdjęcia.
-
W nazwie pliku i folderów nie używamy polskich znaków, spacji ani znaków specjalnych.
-
Najlepiej jeśli w nazwie pliku wszystkie litery będą małe a spacje zastąpione myślnikami
np. pierwsze-testowe-zdjecie.jpg
2.4 Rozszerzenie
- W przypadku fotografii używamy rozszerzenia .jpg (niewskazane .bmp ani .tiff )
- W przypadku logotypu lub ikon używamy rozszerzenia .png
2.5 Orientacja zdjęć
W trosce o estetykę strony zalecamy, aby wszystkie zdjęcia w obrębie galerii miały te same wymiary i orientację. Lepiej sprawdzają się zdjęcia poziome niż pionowe - większość ekranów jest horyzontalna.
3. Jak przygotować zoptymalizowane zdjęcia
Do optymalizacji zdjęcia służą programy graficzne. Istnieją darmowe wersje np.:
- IrfanView https://www.irfanview.com/
- FastStone Image Viewer
- GIMP https://www.gimp.org/
4. Wrzucenie zdjęć na serwer (ang. upload)
-
Maksymalnie 50 zdjęć w katalogu (w galerii)
-
Maksymalna ilość galerii na stronie: 1 - na jednej stronie może się znaleźć tylko jedna fotogaleria!
Przy publikacji należy pamiętać o prawach autorskich do publikowanych zdjęć - odpowiedzialność za publikacje ponosi redaktor, który uploadował w bibliotece grafik i dokumentów oraz redaktor, który opublikował na stronie
5. Podpisy (SEO, WCAG)
Roboty wyszukiwarek (np. Google) oraz przeglądarki tekstowe (którymi posługują się np. osoby z problemami wzroku) nie potrafią stwierdzić co jest na obrazku. Redaktor powinien im w tym pomóc. Służy do tego znacznik „alt” - pole do wprowadzania tekstu alternatywnego, w którym należy zamieścić krótki opis.
W Portalu można zrobić to na kilka sposobów:
- w bibliotece Dokumentow i grafik przy każdym zdjeciu jest pole Opis (w działaniach wybrać "Edycja")
- w publikowanym artykule - jeśli to jest galeria - można umieścic dla całej galerii wspólny opis - uzupełniając pole "Opis zdjęć"
- w publikowanym artykule w zdjeciach umieszczanych w polu html nalezy wprowadić atrybut alt="tutaj opis" w kodzie albo użyć narzędzi edytora ("obrazek" > "Tekst zastępczy") - jak opisane jest w tutorialu.
Więcej informacji na temat dostępności znajduje się w zakładce portal.uj.edu.pl/wcag oraz w witrynie Działu ds. Osób Niepełnosprawnych.