Single Blog

Witaj, świecie!

26 czerwca 2017, Written by 0 comment

Każdy czasem może mieć mały problem z odpowiednim zarządzaniem treścią na swojej witrynie. Szczególnie jeśli chodzi o prawidłowe publikowanie zdjęć. Kilku moich klientów poprosiło mnie o więcej wskazówek na ten temat, a ja obiecałem coś napisać więc zaczynamy.

Rozmiar zdjęć

Obecnie wszystkie strony jakie powstają w „internetach” są mobilne czyli responsywne. Dostosowują się układem treści i grafiki do przeglądarki w której są wyświetlone. Pięknie prezentują się na Twoim smartfonie, tablecie lub większym monitorze. Tego nie musze obiecywać, tak to po prostu działa.

Nie każdy wie że google oczekuje takich właśnie stron i je ocenia. Można więc powiedzieć że jest to absolutnym standardem.

Wracając do tematu, jak w zasadzie działa wyświetlanie zdjęć na takich stronach www?

Technologicznie rzecz ujmując, one również zostaną dostosowane do wielkości przeglądarki. Oznacza to mniej więcej tyle że zdjęcie osiągnie rozmiar idealnie pasujący do szerokości naszego ekranu, naszej przeglądarki. No dobrze czyli jaki? Najłatwiej jest przyjąć założenie że wymiar zdjęcia nie powinien stanowić więcej jak 1920 pixeli szerokości. A to dlatego że znacząca większość urządzeń pracuję w maksymalnie, takiej właśnie rozdzielczości 1920 pixel lub mniejszej. Nie wierzysz? Nie ma problemu, kliknij tu i sprawdź. Oczywiście są też komputery stacjonarne których obraz wyświetlany jest przez większe monitory w rozdzielczości 5K wynoszącej nawet 5120×2880. Ale tym nie musimy się przejmować, ponieważ strona zaprezentuje się wówczas w nieco mniejszym obszarze przeglądarki. W praktyce będzie to wyglądało mniej więcej tak:.

Jak widać w oknie mamy bardzo dużo wolnej przestrzeni, „śniegu”, a sama strona stanowi obszar centralny, mieszczący się w założonej 1920 pikselowej szerokości. Czasami ustawienia okna dla wyświetlania obrazów, obejmuje dopasowanie zdjęcia do szerokości przeglądarki. Wówczas wygląda to tak:

Zdjęcie zostało dopasowane do szerokości przeglądarki, a wiec jego  wysokość została skrócona w skali, a sama jakość zdjęcia jest nieco gorsza. W tym przypadku jest to jednak nieistotne. Zdjęcie nie prezentuje produktu, ani nie stanowi ważnej informacji, jest mało znaczącą ilustracją.

Zobaczmy ten sam przykład, w dużo mniejszej rozdzielczości przeglądarki, prezentuje się tak:.

Jest lepiej prawda? W układzie dla mniejszych urządzeń typu laptop, tablet nasze zdjęcie widoczne jest niemal całe. Reasumując sami musimy ocenić czy zdjęcie które zobrazować ma naszą treść, jest właściwie przez nas dobrane. Niemniej jednak, jeśli założysz sobie podstawową wartość, 1920 pikseli szerokości dla każdego jpg który chcesz umieścić na stronie, w 95 przypadkach na sto, będzie to prawidłowy i wystarczający format.

Co do wysokości zdjęcia, tu raczej nie koncentrował bym się na tym parametrze. Musimy tylko ocenić, czy nasze zdjęcie jest poprawnie skadrowane względem ogólnej prezentacji obrazu. Większość przeglądarek zdjęć używanych na stronach www, dopasuje wielkość obrazów do wysokości i szerokości ekranu. Podobnie dzieje się z obrazami wplecionymi w treść. Tu też warto ustawić sobie wymiar jaki chcemy aby nasze zdjęcie prezentowało:.

Przygotowanie zdjęć i ich waga w MB.

Bardzo istotnym czynnikiem jest waga zdjęcia, czyli to ile nasz obraz zajmuje pamięci. Dla obecnych na rynku komputerów, dysków i pendrive-ów, ten parametr dawno przestał być istotny. Każdy dziś wie że zdjęcia w telefonie ważą średnio po kilka megabajtów, a mamy ich przecież setki czy tysiące i wszystko się mieści w jednym małym urządzaniu. W publikacji internetowej jest nieco inaczej, tu panują zupełnie inne zasady gry. Przede wszystkim wujek google sprawdza naszą stronę i wie czy zdjęcia nie są zbyt duże. Jeśli tak wujaszek będzie srogi i słabo oceni naszą stronę.

Wszystko sprowadza się do dbałości o szybkość wyświetlania się obrazów. Ktoś może powiedzieć co to za ściema? Na moim komputerze, wszystkie zdjęcie w internecie wyświetlają się w sekundę. Brawo oklaski, jesteś super. Ale być może to urządzenie korzysta z szybkiego stałego łącza internetowego lub jeśli jest mobilne, posiada bardzo dobry zasięg sieci Wi-Fi czy komórkowej. Googole myśli też jednak o skrajnie odwrotnej sytuacji, gdzie łącze jest słabe lub jego sygnał znikomy. Nikt chyba by nie chciał, aby strona którą właśnie ma wyświetlić jego telefon ładowała się zbyt długo? Dodam jeszcze że google mierzy to w milisekundach i to chyba już mówi wszystko.

Format zapisu.

Co mamy więc zrobić, wiedząc już że nasze obrazy powinny mieć maksymalną szerokość 1920 pikseli oraz powinny zajmować jak najmniejszą ilość pamięci? I tu pojawia się temat odpowiedniego formatu zapisu. Najcześciej stosowany zapis dla obrazów w internecie to oczywiście jpg. Czy to dobrze czy źle? Ani dobrze, ani źle. Znajdziecie wiele artykułów w sieci na temat kompresji i zapisu zdjęć. Ja jestem zdania że spokojnie można stosować format jpg. No chyba że ktoś prowadzi sklep internetowy i ma w nim 50 tysięcy produktów, a więc około 200 tysięcy zdjęć i ze względu na zasoby serwera, każdy kilobajt ma znaczenie. Wówczas warto stosować zapis PNG. Jeżeli możecie stosujcie go jeśli nie, JPG też będzie bardzo ok.

Przygotowując obrazy dla naszej strony www, pilnujmy aby podczas zapisu ustawienia jakości były zoptymalizowane. Najczęściej mamy do wyboru w jakiej jakości zapiszemy nasz plik i jak wiele KB będzie on ważył. Wybierzmy: medium, standard, fine, itp. W zależności, co dany program nam podpowiada.  Jeśli przekształcamy obrazy bardzo duże przeznaczone do druku z zamiarem umieszczenia ich w „internetach” zmieńmy ich rozdzielczość na 72 DPI to w zupełności wystarczy.

Chętnie odpowiem na pytania, pisz, komentuj lub zwyczajnie daj lajka jeśli przydał Ci się ten artykuł. Na dziś to tyle z „marketingu po południu”.

Administrator200

Leave a reply

Your email address will not be published. Required fields are marked *