GIMP: Tworzenie szablonów stron WWW cz. 12
Informacje z dnia: 06.09.08
Czytaj więcej...Prezentowany szablon bazuje na układzie stałej szerokości. Wykorzystano w nim trzy triki: kafelkowanie (ang. sprites), pozycjonowanie względnie bezwzględne oraz FIR (ang. Fahrner Image Replacement).
Omawiany szablon jest płynny: wypełnia całe okno przeglądarki od rozdzielczości 800×600 wzwyż. Efekt ten jest osiągnięty dzięki ujemnym marginesom oraz rozsuwaniu tła. Zmiana kształtu nosa, ust czy łuków brwiowych oraz zabawy z makijażem mogą mieć różny cel: stworzenie odpowiedniej twarzy do witryny reklamowej, wizualizacji dla chirurga plastyka i wiele innych. Poznamy kilka sposobów wykorzystania dobrze znanych nam narzędzi, aby osiągnąć określony cel wizualny. Mając do dyspozycji kilka fotografii możemy spróbować połączyć ich wybrane fragmenty w jedno. Dzięki temu stworzymy niecodzienną kompozycję - mniej lub bardziej realną. W tej lekcji stworzymy dwie hybrydy: grejpfruta z kiwi oraz szczura z jeleniem. Dodatkowo zmodyfikujemy zdjęcie czapki poprzez doszycie wirtualnego futerka, które sami stworzymy. Futro będzie od nas wymagać inwencji i pewnej ręki. Każdy ruch i każda zmiana kąta pędzla da różnorodny efekt. A więc mamy pełne pole do eksperymentu.
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. Prezentowany szablon jest ograniczony od dołu i od góry przez poziome pasy. W ten sposób realizowane jest dostosowanie szablonu do rozdzielczości: pasy zawsze rozciągają się od lewej do prawej krawędzi przeglądarki. Środkowa część szablonu jest podzielona na dwie kolumny, których szerokość może być dowolnie zmieniana w CSS. 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.
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. Często wykorzystywanym efektem, stosowanym szczególnie w menu, jest reakcja na wskazanie wybranej opcji wskaźnikiem myszki. Wskazana opcja zmienia kolor, kształt lub zostaje wzbogacona o strzałkę informującą o wyborze. Do tego rodzaju trików stosowane są dwa rozwiązania. Jednym z nich jest pseudoklasa a:hover w arkuszach stylów, a drugim wymiana obrazów wykonywana w JavaScripcie, nazywana efektem rollover. Tym razem przygotujemy witrynę z bardziej skomplikowanym efektem rollover. Po wskazaniu wskaźnikiem myszki opcji menu wymienimy nie tylko ikonę opcji, ale także dodamy tytuł wybranej pozycji menu.
Kolor tła i tekstu to kluczowy element na każdej stronie internetowej. Złe założenia mogą potem być przyczyną wielu problemów. Warto więc poświęcić czas na wybór najlepszego schematu kolorów. Twórz lepsze i szybciej wczytujące się ilustracje, dowiedz się jak usprawnić pracę z plikami graficznymi, dodawaj wspaniałe efekty - wszystko po to, aby twoja strona znowu zachwycała odwiedzających GIMP, bezpłatny program do edycji grafiki rastrowej, z roku na rok zyskuje coraz większą popularność. W pierwszym odcinku nowego kursu "GIMP od podstaw" dowiesz się, skąd pobrać i jak zainstalować GIMP-a, poznasz bogaty zestaw wbudowanych filtrów do przetwarzania obrazu i nauczysz się nimi posługiwać.
Omawiany w tym odcinku szablon jest stałej szerokości. Ma on trzy kolumny, nagłówek oraz stopkę. Wewnątrz kolumn lewej i prawej znajdują się wielokrotne dwupoziomowe menu. Prezentowany szablon bazuje na układzie stałej szerokości. Wykorzystano w nim trzy triki: kafelkowanie (ang. sprites), pozycjonowanie względnie bezwzględne oraz FIR (ang. Fahrner Image Replacement). Goethe w swojej książce "Teoria kolorów" stwierdził, że gdy oko dostrzeże kolor, ulega natychmiastowemu pobudzeniu. Od XIX w. sporo nauczyliśmy się o kolorach, jednak ta podstawowa zasada sprawdza się do dziś, gdy malujemy obraz czy projektujemy strony.
Polecamy:
informacje z dnia: 15.11.08
| Blogi eksperckie, poświęcone jednej dziedzinie, powinny cechować się większym umiarkowaniem, kojarzącym się z profesjonalizmem. Dobierając szablony, postawiliśmy więc na czytelność, nie zapominając o świeżości i eleganckim, profesjonalnym wyglądzie. Zobacz oryginalną treść |
| Kolor tła i tekstu to kluczowy element na każdej stronie internetowej. Złe założenia mogą potem być przyczyną wielu problemów. Warto więc poświęcić czas na wybór najlepszego schematu kolorów. Zobacz oryginalną treść |
| Wśród bloggerów popularne jest powiedzenie "jeśli nie masz o czym pisać - zmień wygląd bloga". Oczywiście w sieci jest wiele darmowych szablonów, jednak jeśli chcesz się wyróżnić, postaw na własny projekt. To nie takie proste, na jakie wygląda - warto wiedzieć na co zwrócić uwagę, aby ułatwić użytkownikom korzystanie z serwisu. Zobacz oryginalną treść |
| Prawdopodobnie każda z osób tworzących projekty do wyświetlania na ekranie monitora (strony WWW, prezentacje) miała nieraz problem z odpowiednim wyborem palety kolorów. Dobór schematu barw można uprościć, korzystając z przygotowanych do tego narzędzi. Zobacz oryginalną treść |
| Pierwsze blogi zaczęły powstawać ponad 10 lat temu. Mało kto mógł wtedy sobie pozwolić na obejrzenie filmu przez sieć. Brak również było reklam - Google nie wystartowało z reklamami AdSens, bo nie było jeszcze samego Google. Dopiero z czasem na blogi zawitała efektowna grafika, materiały wideo oraz interaktywne gadżety. Szkoda tego nie wykorzystać. Najłatwiej to zrobić, korzystając z gotowych szablonów. Zobacz oryginalną treść |
| Dobre loga są odważne, oryginalne i łatwo je zapamiętać - jednak nieprawdopodobnie trudno je utworzyć. Elliot Jay Stocks odkrywa, jak najlepsi światowi twórcy poradzili sobie z wyzwaniem zaprojektowania tożsamości... Zobacz oryginalną treść |
| Jest to pierwszy z serii artykułów, w których poznamy możliwości programu Photoshop. Każda lekcja będzie oparta na praktycznym przykładzie omówionym krok po kroku. Zaczniemy od światła. Zobacz oryginalną treść |
| Mając do dyspozycji kilka fotografii możemy spróbować połączyć ich wybrane fragmenty w jedno. Dzięki temu stworzymy niecodzienną kompozycję - mniej lub bardziej realną. W tej lekcji stworzymy dwie hybrydy: grejpfruta z kiwi oraz szczura z jeleniem. Dodatkowo zmodyfikujemy zdjęcie czapki poprzez doszycie wirtualnego futerka, które sami stworzymy. Futro będzie od nas wymagać inwencji i pewnej ręki. Każdy ruch i każda zmiana kąta pędzla da różnorodny efekt. A więc mamy pełne pole do eksperymentu. Zobacz oryginalną treść |
| W tej lekcji skomponujemy własny krajobraz. Mając zdjęcia drzew, nieba, księżyca, czaszki, ziemi itd. stworzymy własne, niepowtarzalne miejsce. Trochę bajkowe, mało rzeczywiste, ale na pewno niecodzienne. Wystarczy kilka zdjęć i elementów, aby tworzyć własne zestawienia. Zobacz oryginalną treść |
| Prezentowany szablon jest ograniczony od dołu i od góry przez poziome pasy. W ten sposób realizowane jest dostosowanie szablonu do rozdzielczości: pasy zawsze rozciągają się od lewej do prawej krawędzi przeglądarki. Środkowa część szablonu jest podzielona na dwie kolumny, których szerokość może być dowolnie zmieniana w CSS. Zobacz oryginalną treść |
| Nic nie stanowi trudniejszego zadania niż wyseparowanie włosów. Szczególnie tych długich, kręconych, z rozwianymi kosmykami. Użycie narzędzia pióro jest wykluczone. Natomiast różdżka pozostawia wiele niedociągnięć. Zadanie należy wykonywać etapami, krok po kroku. W naszym przypadku należy osiągnąć efekt kontrastu czerni i bieli. Zobacz oryginalną treść |
| SVG to format grafiki wektorowej, powstały z myślą o stronach internetowych. Jednak korzystanie z SVG wciąż jest problemem, gdyż nie wszystkie przeglądarki go odczytują. Zobacz oryginalną treść |
| Szablon ten prezentuje menu z efektem rollover oraz wskaźnikiem wybranej opcji. Oba efekty są wykonane w CSS z wykorzystaniem kafelkowania (ang. sprites). Wskaźnik wybranej opcji wymaga dodania do kodu XHTML jednego elementu span dla każdej opcji oraz identyfikatora elementu body. Zobacz oryginalną treść |
| Zmiana kształtu nosa, ust czy łuków brwiowych oraz zabawy z makijażem mogą mieć różny cel: stworzenie odpowiedniej twarzy do witryny reklamowej, wizualizacji dla chirurga plastyka i wiele innych. Poznamy kilka sposobów wykorzystania dobrze znanych nam narzędzi, aby osiągnąć określony cel wizualny. Zobacz oryginalną treść |
| Prezentowany szablon bazuje na układzie stałej szerokości. Wykorzystano w nim trzy triki: kafelkowanie (ang. sprites), pozycjonowanie względnie bezwzględne oraz FIR (ang. Fahrner Image Replacement). Zobacz oryginalną treść |