Grafika, a WWW

Najpopularniejszymi formatami zapisu grafikii w Sieci są GIF i JPEG. Poniżej postaram się opisać je po krótce, aby naświetlić różnice pomiędzy nimi, a tym samym ułatwić wybór, który z formatów stosować do swoich prac.

Graphic Interchange Format

GIF, a dokładniej mówiąc CompuserveGIF to obecnie chyba najpopularnieszy format graficzny używany w Internecie. Format GIF jak należałoby się domyslać z oficjalnej nazwy został stworzony przez firmę CompuServe, jako środek komunikacji między różnymi komputerami. W praktyce oznacza to, że obraz w formacie GIF, mozna odczytać na dowolnej platformie, oczywiście o ile na danej maszynie znajduje się odpowiednie oprogramowanie. Zasadniczo istnieją dwie odmiany GIF'a: starszy GIF87, oraz jego ulepszona wersja (dodano mozliwosć zapisu przezroczystości, przeplot, oraz mozliwość przechowywania kolejnych ujęć (animacja!)). GIF'y doskonale nadają się do przechowywania znaków firmowych, ikon i prostych obrazków. Gorzj radzą sobie natomiast z obrazami bardziej skomplikowanymi, bogatymi w szczegóły jak np. fotografie. Powodem tego jest to iż format GIF jest w stanie zapisać tylko 256 kolorów. Tak więc fotografie wyeksportowane do tego formatu są znacznie gorszej jakości (ziarniste, poplamione, mniej wyraźne) niż ich pierwowzory w formacie JPEG.

Joint Photographic Expert Group

JPEG został zaprojektowany dla potrzeb przechowywania obrazów fotograficznych. Jego główną zaletą jest to, że w przeciwieństwie do formatu GIF potrafi on zapisać dowolną liczbę kolorów. Trochę gorzej od GIF'a radzi sobie natomiast z obrazami o duzych obszarach jednolitego koloru. Ponadto kompresja JPEG jest kompresją stratną tzn. pewne szczegóły obrazu sa z niego usuwane w celu pomniejszenia jego rozmiarów.

Algorytmy kompresji

Formaty GIF i JPEG wykorzystują rożne rodzaje kompresji, które nadaja się do róznych typów obrazów. Zatem wybór formatu powninniśmy uzależnić od charakteru wyjsciowego obrazu oraz od naszych wymagań co do jego jakości. Format GIF stosuje kompresje bezstratną (lossless compression) zwaną potocznie LZW (nazwa tego algorytmu pochodzi od inicjałów jego autorów: Lempel, Ziv i Welch. Działanie tego algorytmu polega na wyszukiwaniu w obrazie regularnych wzorów pikseli (sąsiadujących pikseli tego samego koloru). Im wiecej takich wzorów tym lepszy efekt kompresji (mniejszy rozmiar pliku). W praktyce oznacza to, że najlepiej zapisywac w formacie GIF obrazy o dużych jednobarwnych obszarach, gdyż stopień kompresji jest dla nich dość duzy. Inaczej sprawa się ma z fotografiami, które takich obszarów posiadają mało co oznacza iż w mniejszym stopniu podlęgają one działaniu kompresji LZW.

Jak już wspomniałem JPEG potrafi zapisać dowolną liczbę kolorów. Format ten korzysta z algorytmu kompresji , który egzaminuje grupy pikseli i zapisuje raczej różnice między nimi niz same piksele. System sprawdza się bardzo dobrze w przypadku szczegółowych fotografii, gdzie występują duże zróznicowania barw pomiędzy pikselami. W przypadku prostych, jednolitych obrazów algorytm JPEG nie dzaiła najlepiej (moze nawet spowodować rozbicie dużych płaszczyzn jednolitego koloru i wprowadzić zróżnicowania, gdzie wczesniej ich nie było). Nie jest więc prawdą że format JPEG jest zawsze lepszy niż GIF. Zapisując obraz w formacie JPEG możemy wybrać stopień kompresji. Od bezstratnej do najbardziej radykalnej kompresji stratnej. Im bardziej stratny stopień kompresji, tym mniejszy rozmiar pliku. Warto więc wypróbować kilka stopni kompresji, aby uzyskać kompromis pomiędzy jakością obrazu, a wielkoscią pliku.

 
 

Wykłady:

 
 

1. Sieci komputerowe

 
 
1.1 Pojęcia podstawowe
 
1.2. Internet - historia i współczesność
 
1.3. Rodzaje sieci
 

2. HTML 5.0

 
 
2.1. HTML - konwencje
 
2.2. Kod minimalny dokumentów .html
 
2.3. Znaki diakrytyczne i metainformacje
 
2.4. Podstawowe tagi
 
2.5. Formatowania tekstu
 
2.6. Obrazy
 
2.7. Odnośniki
 
2.8. Listy
 
2.9. Tabele
 

3. CSS

 
 
3.1. CSS - konwencje
 
3.2. Kolory
 
3.3. Tła
 
3.4. Model pudełkowy
 
3.5. Krawędzie
 
3.6. Marginesy
 
3.7. Dopełnienia
 
3.8. Wysokość i szerokość
 
3.9. Tekst
 
3.10. Czcionki
 
3.11. Opływanie
 
3.12. Technika zagnieżdżonych bloków, Display
 

4. Dodatki

 
 
4.1. Publikacja stron www
 
4.2. Grafika
 
4.3. Walidacja dokumentów
 
4.4. Linux (1)
 

Ćwiczenia:

Zakładanie kont


Tabele:

1  2  3  4  5  6
 

Ramki:

1  2  3  4  5  6  7
 
 

CSS: