|
|
Menu:
Informatyka, komputery
Media
Informacje
Informacje regionalne
Sport
Gospodarka
Technologie
Praca
Motoryzacja
Dla kobiet
Gazety i prasa
Nauka, edukacja
Gry komputerowe
Grafika komputerowa
|
GIMP i webmastering: Projekt witryny
data: 07.03.08
Gdy znamy podstawowe cechy GIMP-a, umiemy pracować z warstwami, wprawnie operujemy selekcjami oraz wybranymi narzędziami, możemy przystąpić do pracy nad bardziej wyrafinowanymi projektami. W tym artykule zajmiemy się przygotowaniem witryny WWW. Obsługa dziesiątek formatów graficznych, wraz z możliwością pełnej obróbki z poziomu przeglądarki internetowej, to marzenie każdego właściciela strony WWW. W tym artykule zaprezentujemy, co w praktyce potrafi stworzone w tym celu narzędzie ImageMagick i dlaczego wśród podobnych rozwiązań nie ma sobie równych. Obrazy tworzone w GIMP-ie mogą zawierać proste elementy wektorowe. Służą do tego ścieżki. Wykonując przykład zwróćmy szczególną uwagę na fakt, że ścieżki można przekształcać na zaznaczenia, a zaznaczenia na ścieżki. Daje to duże możliwości tworzenia kształtów i ich obrysowywania. Omawiany szablon witryny Magazynu INTERNET jest wykonany przy użyciu podstawowych narzędzi i opcji GIMP-a: zaznaczeń prostokątnych, gradientu, operacji zaokrąglania zaznaczenia, obracania warstwy oraz zmiany stopnia krycia warstwy.
Selekcja, nazywana również zaznaczeniem lub maską, jest kluczowym narzędziem w edytorach grafiki rastrowej. Wskazuje ona obszar obrazu, który będzie poddawany działaniu narzędzi edycyjnych. GIMP posiada sześć wbudowanych narzędzi do zaznaczania obszaru oraz bogaty zestaw metod przekształcania selekcji. W kolejnym szablonie przedstawię połączenie trzech technik: ujemnych marginesów, udawanych kolumn oraz wymiany obrazów FIR. Dzięki użyciu tych technik otrzymany kod XHTML jest w pełni semantyczny, zaś w przypadku szablonu tekstowego także częściowo elastyczny.
Szablon, który przygotowałem w tym odcinku ma układ dwukolumnowy. Kolumny o stałej szerokości wyśrodkowane na stronie rozciągają się na całą wysokość okna przeglądarki. Wydawałoby się, nic prostszego. Jak się okaże, problemem jest wyznaczanie wysokości elementów pływających.
Wkomponowanie kolażu fotografii w baner i włączenie go w projekt strony uczyni ją bardziej profesjonalną i przyciągnie wzrok. Co będziemy tworzyć? Kompletną stronę WWW z banerem witryny, który będzie działać w oknach przeglądarki o różnej szerokości. Grafika po prawej stronie banera pojawia się lub znika w miarę zmieniania szerokości okna przeglądarki. Jeśli będzie ono bardzo szerokie, baner przejdzie w kolor tła. Wykorzystując możliwości warstw, ścieżek i selekcji zajmiemy się przygotowaniem szablonu witryny WWW. Szablon ten będzie wykorzystywał dwupunktowy efekt rollover oraz wskaźnik wybranej opcji. Artykuł ten rozpoczyna nowy cykl poświęcony przygotowywaniu szablonów witryn WWW w programie GIMP. W każdym odcinku będzie szczegółowo opisany jeden szablon. W dzisiejszym spotkaniu przygotujemy wizytówkę firmy z branży motoryzacyjnej.
Znikające obrazy tworzą bardzo atrakcyjne kompozycje. Efekt taki wykonujemy stosując maskę warstwy oraz ewentualnie warstwę przysłaniającą.
Animowane GIF-y pojawiają sie na stronach WWW jako osobne animacje bądź jako efekty wzbogacające interfejs witryny. Wyjaśnimy podstawowe cechy formatu GIF i pokażemy w jaki sposób tworzyć animowane GIF-y w programie GIMP. Wykorzystując efekty typu rollover możemy pokosić się o dodanie wskaźnika wybranej opcji. Wskaźnik taki będzie informować użytkownika o bieżąco dokonanym wyborze.
Opisywany szablon jest podzielony na trzy poziome obszary. Jest to szablon stałej szerokości, wyśrodkowany na stronie. Środkowy pas wykorzystuje sztuczkę udawanych kolumn, zaś etykiety opcji menu są wyśrodkowane poziomo i pionowo. W artykule nauczymy się przygotowywać loga (w formie szerokich banerów) na strony WWW: o stałej szerokości, z tłem wypełniającym całe okno przeglądarki oraz z ilustracją powielaną dowolną ilość razy. Przygotowywana w tym odcinku witryna wykorzystuje prowadnice, gradienty, zaznaczenia, ścieżki, warstwy i maski, wklejanie elementów do obrazu oraz zaokrąglone prostokąty. Do ułożenia ikon opcji menu użyłem kwadratów i prostokątów. Metoda ta gwarantuje, że każda z ikon zajmie dokładnie tyle samo miejsca oraz to, że ikony będą równoodległe, co ma znaczenie podczas przygotowywania kodu HTML.
Polecamy:
1. GIMP i webmastering: Kopiuj-wklej, czyli kompozycje wielowarstwowe
data: 07.03.08
Jedna z podstawowych technik tworzenia projektów graficznych polega na łączeniu elementów pochodzących z różnych zdjęć w jedną całość. W GIMP-ie wykorzystujemy do tego dobrze znaną technikę kopiuj-wklej. Ilustracje tworzone w ten sposób składają się z wielu warstw - każda z nich jest osobnym obrazem i może być przekształcana niezależnie.
2. Galeria internetowa w 5 minut - IrfanView w roli "galernika"
data: 07.03.08
IrfanView to program znany przede wszystkim jako znakomita, darmowa przeglądarka graficzna. Jednak mało kto wie, że za pomocą Irfana można z powodzeniem szybko i łatwo wykonać galerię internetową. Zobaczmy, jak to się robi.
3. GIMP i webmastering: Projekt witryny
data: 07.03.08
Gdy znamy podstawowe cechy GIMP-a, umiemy pracować z warstwami, wprawnie operujemy selekcjami oraz wybranymi narzędziami, możemy przystąpić do pracy nad bardziej wyrafinowanymi projektami. W tym artykule zajmiemy się przygotowaniem witryny WWW.
4. Galernik. Najlepszy do galerii
data: 07.03.08
Jak można szybko i łatwo stworzyć galerię internetową za pomocą polskiego programu Galernik NxG.
5. GIMP i webmastering: Nagłówki stron WWW
data: 07.03.08
W artykule nauczymy się przygotowywać loga (w formie szerokich banerów) na strony WWW: o stałej szerokości, z tłem wypełniającym całe okno przeglądarki oraz z ilustracją powielaną dowolną ilość razy.
6. Obróbka grafiki w ImageMagick
data: 07.03.08
Obsługa dziesiątek formatów graficznych, wraz z możliwością pełnej obróbki z poziomu przeglądarki internetowej, to marzenie każdego właściciela strony WWW. W tym artykule zaprezentujemy, co w praktyce potrafi stworzone w tym celu narzędzie ImageMagick i dlaczego wśród podobnych rozwiązań nie ma sobie równych.
7. GIMP i webmastering: Efekt znikania obrazów
data: 07.03.08
Znikające obrazy tworzą bardzo atrakcyjne kompozycje. Efekt taki wykonujemy stosując maskę warstwy oraz ewentualnie warstwę przysłaniającą.
8. GIMP i webmastering: Obrysowanie menu przy użyciu ścieżek
data: 07.03.08
Obrazy tworzone w GIMP-ie mogą zawierać proste elementy wektorowe. Służą do tego ścieżki. Wykonując przykład zwróćmy szczególną uwagę na fakt, że ścieżki można przekształcać na zaznaczenia, a zaznaczenia na ścieżki. Daje to duże możliwości tworzenia kształtów i ich obrysowywania.
9. Sposób na efektowną czcionkę
data: 07.03.08
Zobacz, jak korzystając z Photoshopa, można w twórczy sposób wykorzystać w zwykłych czcionkach artystyczne obrysowania i efekty, dzięki którym niepozorne dotąd kształty nabiorą życia.
10. Dwupunktowe rollovery ze wskaźnikiem wybranej opcji
data: 07.03.08
Wykorzystując efekty typu rollover możemy pokosić się o dodanie wskaźnika wybranej opcji. Wskaźnik taki będzie informować użytkownika o bieżąco dokonanym wyborze.
|
|
|
