Jak przygotować obrazy do publikacji online


Jak wybrać najlepszy rozmiar obrazu dla swojej witryny
Przygotowanie obrazów do publikacji online pomaga szybciej ładować witrynę. To tylko dwa kroki. Po pierwsze, należy zmienić szerokość i wysokość obrazu za pomocą edytora zdjęć, na przykład darmowego edytora online. Następnie należy skompresować obraz za pomocą kompresora obrazu - zmniejszy to rozmiar pliku.
Mniejsze obrazy ładują się szybciej. Rozmiar obrazu zależy od dwóch parametrów:
1. Szerokość i wysokość obrazu w pikselach — obrazy o rozmiarze 3000 x 2000 pikseli są większe niż obrazy o wymiarach 300 x 200 pikseli).
2. Zawartość obrazu - im więcej szczegółów i kolorów zawiera obraz, tym większy jest jego rozmiar.

Zalecamy przygotowanie obrazu do opublikowania w trybie online, najpierw go przyciąwając, a następnie usuwając z niego niepotrzebne szczegóły, aby jeszcze bardziej przyspieszyć jego ładowanie.
Jaki jest idealny rozmiar obrazu?
Podczas przesyłania do Tildy wszystkie duże obrazy są automatycznie zmieniane w dół do 1680 pikseli. Obrazy mniejsze niż 1680 pikseli zachowują swój oryginalny rozmiar.

Ponieważ jest to proces zautomatyzowany, może obniżyć jakość obrazu ze względu na szybsze ładowanie. Dlatego możesz chcieć ręcznie edytować zdjęcia: w ten sposób możesz lepiej zachować ich jakość.
Przed przesłaniem dużego obrazu do Tildy zmniejsz rozmiar obrazu do co najmniej 1680 pikseli, jeśli mierzony jest względem jego najdłuższej krawędzi.
W idealnej sytuacji należy przesyłać obrazy o takim rozmiarze, w jakim powinny pojawiać się na stronie internetowej. Jeśli zdjęcie nie ma rozmiaru, jaki powinien mieć w układzie strony, przeglądarka automatycznie skompresuje lub rozciągnie obraz. Słabo sobie radzi, więc zdjęcie może być niewyraźne.

Aby sprawdzić rozmiar swojego obrazu, dodaj blok tekstu do strony, włącz siatkę w ustawieniach bloku, a zobaczysz, ile kolumn zajmie obraz. Szerokość jednej kolumny to 60 pikseli, odległość między kolumnami to 40 pikseli.
Jak zminimalizować rozmiar pliku obrazu?
Możesz użyć specjalnego oprogramowania, które kompresuje obrazy, łącząc podobne kolory. Takie programy łączą kolory w tak skomplikowany sposób, że nie będziesz w stanie odróżnić "przed" od "po". Mogą zmniejszyć rozmiar obrazu nawet o 70%.

Może chcesz sprawdzić:
Przykłady optymalizacji obrazu
Użyjmy tego obrazu Christopha Bengtssona Lissalde , który pobraliśmy z Unsplash, aby pokazać, jak działa optymalizacja obrazu.

Oryginalny rozmiar obrazu: 4405 х 2478 piksele, rozmiar pliku: 3.5MB.
Prześlijmy obraz do Tildy takim, jaki jest. Obraz zostanie przycięty do 1680 x 945 pikseli, a jego rozmiar wyniesie 1,2 MB.

Otwórz oryginalny plik w Photoshopie, zmień rozmiar obrazu na 1680 х 945 pikseli i zapisz go — jego rozmiar zostanie zmniejszony do 832 KB.

Prześlij zdjęcie do TinyPNG , aby je skompresować, a otrzymasz obraz o rozmiarze 353 KB.
Udało nam się zachować jakość obrazu.
Wykonane na
Tilda