Grafika na stronach WWW - kurs cz. I - pliki graficzne - upload

Na pojawiające się w ostatnim czasie liczne prośby klientów firmy, postanowiłem napisać krótki kurs wstawiania zdjęć i plików graficznych do edytowanych dokumentów, przy wykorzystaniu narzędzi oferowanych przez autorski system TOMcms Administrator. Niniejszy kurs zawierać będzie także nieco teorii poświęconej językowi HTML w zakresie opisania znacznika < IMG /> oraz jego atrybutów.

W celu umieszczenia pliku graficznego w edytowanej podstronie wchodzącej w skład naszej witryny www, musimy najpierw umieścić ten plik na serwerze. Dokument napisany w języku HTML to w istocie tylko zwykły plik tekstowy, w którym odpowiednie „komendy” a mówiąc fachowo „tagi” lub inaczej „znaczniki” odpowiadają, po odpowiednim zinterpretowaniu ich przez przeglądarkę, za wstawianie i formatowanie poszczególnych elementów strony internetowej. Wszystkie elementy graficzne jakie widzimy na naszych stronach internetowych, to niezależne pliki graficzne (zdjęcia, tekstury, buttony, tła, ect.) które głównie za pomocą taga < IMG /> są wstawiane na strony web. Część elementów graficznych, wstawiane jest na strony za pomocą innych metod, np.: jako ustawienie tła tabelek za pomocą atrybutu background lub styli CSS, niemniej jednak w tym artykule te zagadnienia nie będą poruszane, ponieważ stanowią one zupełnie inny zakres tematyczny.

Upload pliku graficznego na serwer krok po kroku

CMS - menu główne Przy korzystaniu z systemu TOMcms Administrator, użytkownicy mają do dyspozycji dwie metody wgrywania obrazków na serwer. Do wykonania tej czynności można wykorzystać możliwości zakładek „Pliki” lub „Galerie”. Należy pamiętać że dedykowana do tego zadania jest zakładka Galerie, gdyż zawiera ona szereg dodatkowych, dedykowanych rozwiązań, poszerzających funkcjonalność CMSa. Natomiast zakładka Pliki może być wykorzystywana w pewnych, specyficznych sytuacjach, gdy zależy nam np. na zachowaniu nie zmienionych nazw uploadowanych plików, gdy spodziewamy się że będą one stosunkowo często podmieniane.

Informacja: zdarzały się przypadki blokowania uploadu plików .jpg zapisanych bezpośrednio w aparatach cyfrowych. Funkcja uploadująca blokowała takie pliki. Rozwiązaniem w takiej sytuacji jest otwarcie i ponowne zapisanie pliku .jpg w jakimkolwiek programie graficznym. Spowoduje to zmianę nagłówka pliku .jpg, akceptowalną przez funkcję uploadującą.



Zakładka Galerie

Edytor galerii zdjęć To główne i najczęściej stosowane
w praktyce narzędzie służące do uploadu obrazków. Po kliknięciu w nią użytkownik widzi dwa edytory - listę rozwijalną zawierającą nazwy galerii oraz pole edycyjne, w którym podajemy nazwę nowotworzonej galerii. Oczywiście po wpisaniu nazwy nowej galerii, należy kliknąć przycisk „Dodaj”. Celem galerii jest wygodne pogrupowanie zapisanych w systemie plików graficznych w odpowiednich podgrupach, zawierających funkcjonalnie powiązane pliki graficzne. Mówiąc inaczej, galerie stanowią swoiste foldery służące racjonalnegu grupowaniu zdjęć. Ponadto w sytuacji gdy zamierzamy skorzystać z funkcji dynamicznych galerii, zintegrowanej z niektórymi CMSami wykonanymi przez firmę, musimy mieć na uwadze, że wszystkie pliki graficzne z określonych galerii będą się wyświetlały na naszej stronie WWW, poniżej wprowadzonego tekstu.

CMS - edytor galerii zdjęć - widok modułu uploadu grafik Po wejściu „krok głębiej” czyli do wybranej z listy rozwijalnej galerii (wejście następuje samoczynnie po kliknięciu w nazwę galerii) naszym oczom ukazuje się niewielkie okienko edytorka, w którym po kliknięciu przycisku „Przeglądaj” wyszukujemy i zaznaczamy plik graficzny zapisany na naszym twardym dysku. Następnie klikamy przycisk „Dodaj” i po chwili możemy cieszyć się wgranym obrazkiem na serwer. W praktyce system CMSa wykonał jednocześnie na serwerze dwie kopie naszego uploadowanego pliku: plik zasadniczy i miniaturkę. W celu zabezpieczenia systemu informatycznego przed problemami związanymi np.: z polskimi znakami w nazwach plików, w czasie uploadu generowane są nowe nazwy plików, złożone z losowego ciągu cyfr. W nowych CMSach wykonywanych począwszy od stycznia 2009 roku, użytkownicy mogą ustawiać kolejność wyświetlanych miniaturek za pomocą strzałek, znajdujących się poniżej obrazków. Nowe CMSy zawierają ponadto możliwość ustalania podpisów obrazków, aczkolwiek funkcjonalność ta, uzależniona jest od budowy strony zasadniczej, edytowanej za pośrednictwem CMSa. Oczywiście znajdujące się obok ikonki przedstawiające dwie skrzyżowane ze sobą czerwone linie, służą do usuwania zdjęć. Nieopatrzne kliknięcie w te ikonki na szczęście nie grozi jeszcze jakimikolwiek negatywnymi konsekwencjami - usuwanie obrazków zabezpieczone jest dodatkowym pytaniem potwierdzającym.

UWAGA - jeśli nasz obrazek jest podlinkowany w kodzie źródłowym strony, konsekwencją jego usunięcia będzie wyświetlenie symbolu „braku obrazka” pod wskazanym adresem URL wprowadzonym w kodzie źródłowym.

Kolejnym atutem uploadu plików graficznych w zakładce Galerie, jest opcjonalne pomniejszanie obrazków do określonych rozmiarów. Rozmiary te, zarówno dla miniaturek jak i dla zasadniczych obrazów, możemy ustawiać na zakładce Konfiguracja. Do dyspozycji mamy cztery pola edycyjne, osobo ustalające w pikselach szerokość (width) i wysokość(height) miniaturek i głównych grafik. Ważne - w czasie pomniejszania zachowywane są proporcje, np.: prostokąt po pomniejszeniu nadal będzie prostokątem, a nie kwadratem ;-) Oczywiście w sytuacji gdy uploadowany obrazek jest mniejszy niż maksymalnie rozmiary wprowadzone w Konfiguracji, zostanie zapisany on bezpośrednio, bez ingerencji w jego rozmiary.



Zakładka Pliki

Edytor uploadu plików Dedykowana jest głównie do uploadowania plików, które następnie mogą trafić np. jako dokumenty do pobrania przez osoby odwiedzające nasze strony. Niemniej jednak, w pewnych sytuacjach okazuje się być niezwykle pomocna. Jak wspomniano wcześniej podczas wykonywania za jej pomocą uploadu plików na serwer, nie są zmieniane ich nazwy (ale uwaga - działają za to zabezpieczenia blokujące pliki z nazwami mogącymi przysporzyć trudności np.: podczas edycji linków do plików). Ponadto w przypadku zakładki „Pliki”, w czasie uploadu nasz plik jest zapisywany bezpośrednio - nie są generowane jakiekolwiek miniaturki, a sam plik nie jest pomniejszany. Niestety w sytuacji braku miniaturek nie mamy podglądu do pliku - do dyspozycji mamy tylko linki otwierające pliki w nowym oknie.

Dalsza część kursu poświęconego grafice na stronach WWW, znajduje się w kolejnym artykule poświęconym obsłudze edytora wizualnego i sposobom na umieszczanie w nim obrazków.

[ Czytaj dalej ]