Jak przygotować zdjęcia na stronę

Artykuł porusza kwestie pomniejszenia i wgrania zdjęcia na stronę opartą o system CMS.

Zdjęcia są ważnym elementem każdej strony, w zależności od potrzeb przedstawiają opisywane przez nas rzeczy, nas samych lub po prostu stanowią element dekoracyjny.

Często przygotowując zdjęcia na stronę zastanawiamy się jaki powinny mieć rozmiar w pikselach czy wielkość (wagę) w kilobajtach (KB). W tym artykule pomożemy Ci w łatwy i szybki sposób dokonać obróbki zdjęć przed włożeniem ich na stronę. Przykładem będzie tutaj prosta strona oparta o darmowy i polecany przez nas skrypt Quick.Cms natomiast zdjęcia będziemy edytowali programem IrfanView darmowym do użytku domowego.

  1. Parametry zdjęcia
  2. Pobranie i instalacja IrfanView
  3. Surowe zdjęcia
  4. Edycja zdjęcia - zmiana rozmiaru
  5. Dodawanie zdjęcia na stronę
  6. Wybór CMSa dla prostej strony

1. Parametry zdjęcia

Najpierw zastanowimy się jakie są odpowiednie parametry dla zdjęć na Twoją stronę. Musisz pamiętać, żeby miały one taki rozmiar, aby mieściły się na ekranie większości użytkowników sieci, dobrym zwyczajem jest nie przekraczanie 900px dla dłuższego boku zdjęcia. Dodatkowo ważne jest, aby zdjęcie nie miało więcej niż 200-300 KB, wtedy ktoś kto posiada łącze o prędkości 1 megabit nie będzie czekał na załadowanie zdjęcia dłużej niż 2 sekundy. Czasem także przed umieszczeniem zdjęć na stronie należy je obrócić lub wykadrować. Jeśli potrzebujesz wykonać którąś z tych czynności to dobrze trafiłeś.

2. Pobranie i instalacja IrfanView

Zainstaluj program IrfanView, możesz go pobrać w polskiej wersji językowej ze strony http://irfan-view.pl/pobierz. Zainstaluj także dostępny na tej stronie pakiet językowy, aby móc korzystać z poskiej wersji językowej aplikacji.

Pobierz IrfanView

3. Surowe zdjęcia

Posłużymy się kilkoma zdjęciami słoneczników. Mają one już zmienioną nazwę na taką, która mówi o ich zawartości więcej niż domyślne nazwy nadawane przez aparaty cyfrowe (np. DSC04491.jpg czy IMG_1464.JPG)

Lista zdjęć 1 Lista zdjęć 2

Jednak jak widać na pierwszy rzut oka mają one zbyt dużą wielkość.

4. Edycja zdjęcia - zmiana rozmiaru

Aby spawdzić rozmiar zdjęcia otwórz go w programie IrfanView i wybierz z menu "Obraz" -> "Informacje".

Rozmiar zdjęcia 1

Jak widać jest ono większe niż zalecane:

Rozmiar zdjęcia 2

Aby zmniejszyć zdjęcie wybierz z menu "Obraz" -> "Zmień Rozmiar obrazu" i w oknie zmiany rozmiaru zmień wartość dla dłuższego boku (w tym wypadku Szerokość) na 900px. Kliknij OK i zapisz zdjęcie.

Jak widzisz zdjęcie pomniejszone ma prawie dziesięciokrotnie mniejszy rozmiar niż oryginał.

Lista zdjęć 3

5. Dodawanie zdjęcia na stronę

Aby dodać przygotowane zdjęcia na stronę opartą o Quick.Cms zaloguj się do panelu administracyjnego i podczas edycji strony wybierz z prawej strony zakładkę, "Dodaj pliki", a następnie kliknij w przycisk "Pliki z komputera".

Dodawanie zdjęć 1

Wybierz przygotowane przez siebie pliki i kliknij otwórz. Możesz potwarzać tą czynność ładując więcej plików.

Dodawanie zdjęć 2

Zdjęcia załadują się na serwer i będziesz je mógł wybrać z listy plików na serwerze wybierając ich lokalizację i rozmiar miniaturek. Po wszystkich kliknij "Zapisz".

Dodawanie zdjęć 3

Zdjęcia pojawią się na stronie tak jak np. zdjęcie słonecznika na początku tego artykułu.

6. Wybór CMSa dla prostej strony

Zaprezentowany wyżej przykład zmiany rozmiaru zdjęcia i wgrania go na stronę internetową został oparty o darmowy skrypt Quick.Cms.

Wybraliśmy ten CMS ze względu na to, że jest bardzo prosty w obsłudze, świetnie nadaje się dla prostych stron internetowych, posiada wsparcie w języku polskim a jego twórcami są Polacy.

Więcej informacji na temat tego skryptu znajdziesz na stronie producenta http://opensolution.org/