GIMP i webmastering: Nagłówki stron WWW
Informacje z dnia: 27.06.08
Czytaj wiêcej...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.
Polecamy:
informacje z dnia: 27.06.08
| 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. Zobacz oryginaln± tre¶æ |
| Przygotowanie obrazu w formacie XCF jest pierwszym etapem wykonania szablonu strony WWW. W artykule zajmiemy siÄ™ przeksztaÅ‚ceniem pliku graficznego XCF w witrynÄ™ WWW. SzczególnÄ… uwagÄ™ zwrócimy na kilka haczyków dotyczÄ…cych poprawnoÅ›ci kodu HTML oraz wyglÄ…du witryny w starszych przeglÄ…darkach. Zobacz oryginaln± tre¶æ |
| 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. Zobacz oryginaln± tre¶æ |
| 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. Zobacz oryginaln± tre¶æ |
|
Zobacz oryginaln± tre¶æ |
Zobacz oryginaln± tre¶æ |
| czê¶ci do wózków wid³owych Wózki wid³owe japoñskich marek, tzw. japoñczyki Toyota i Mitsubishi, nale¿± do ¶cis³ej czo³ówki mocno wydajnych i zaawansowanych technologicznie urz±dzeñ do transportu wewnêtrznego. Jeste¶my firm± specjalizuj±c± siê w imporcie, sprzeda¿± oraz napraw± wózków wid³owych. Sprowadzamy wózki wid³owe o parametrach standardowych oraz nietypowych na ¿yczenie klienta. W sprzedawanych wózkach wid³owych s± wykonywane remonty, w razie potrzeby dokonujemy napraw i serwisu. Firma zajmuje siê importem wózków wid³owych od roku 1997 ró¿nych marek, a od roku 1999 skupi³a siê na imporcie sprzêtu japoñskiego marki Toyota i Mitsubishi. Zobacz oryginaln± tre¶æ |
| Wózki wid³owe oraz wypadki. Przegl±daj±c fora internetowe, na których wspomina siê wózki wid³owe, czêsto poruszany jest temat wypadków z nimi zwi±zanych. Czêsto te¿ mo¿e spotkaæ wypowiedzi z nimi zwi±zane na³adowane bardzo emocjami. wózki wid³owe i praca z ich wykorzystaniem odbierana jest wtedy czêsto jako niebezpieczny kawa³ek chleba. ¦cieraj± siê ze sob± chêæ pracy razem z obrazami wypadków. Niestety czêsto to opisy niepotrzebnie odstraszaj± od pracy. Kiedy mówi siê o wypadku mo¿emy przeczytaæ opis tego co siê sta³o. Rzadko jednak dowiemy siê z czyjej winy dosz³o do wypadku. Czy by³a to wina maszyny czy te¿ po prostu b³±d cz³owieka. Czytaj±c ró¿nego typu wypowiedzi dotyka nas nie raz brak obiektywizmu innych. Podobnie jest z wypadkami zwi±zanymi z prac± wózków wid³owych. Zobacz oryginaln± tre¶æ |
| GłównÄ… cechÄ… obrazów tworzonych w GIMP-ie jest wielowarstwowość. Obraz skÅ‚ada siÄ™ z dowolnej liczby warstw, które sÄ… niezależnymi obrazami. W drugim spotkaniu z GIMP-em omówiÄ™ wszystkie cechy warstw: wymiar, widoczność, przezroczystość, krycie, tryb, zachowanie przezroczystoÅ›ci, miejsce na stosie warstw oraz grupowanie. Zobacz oryginaln± tre¶æ |
| Animowane menu strony, którego opcje reagujÄ… na wskaźnik myszki, jest bardzo atrakcyjne. W artykule przedstawimy w jaki sposób wykonać takie menu, gdy dysponujemy obrazem narysowanym w GIMP-ie. Kod HTML menu bÄ™dzie wykorzystywać elementy div oraz arkusze stylów. Zobacz oryginaln± tre¶æ |
| 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. Zobacz oryginaln± tre¶æ |
| 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. Zobacz oryginaln± tre¶æ |
| 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. Zobacz oryginaln± tre¶æ |
| 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. Zobacz oryginaln± tre¶æ |
| 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. Zobacz oryginaln± tre¶æ |
| 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. Zobacz oryginaln± tre¶æ |
| 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. Zobacz oryginaln± tre¶æ |
| 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. Zobacz oryginaln± tre¶æ |
| ZnikajÄ…ce obrazy tworzÄ… bardzo atrakcyjne kompozycje. Efekt taki wykonujemy stosujÄ…c maskÄ™ warstwy oraz ewentualnie warstwÄ™ przysÅ‚aniajÄ…cÄ…. Zobacz oryginaln± tre¶æ |