Veb səhifələrdə ən çox yayılmış şəkil formatları. HTML-də veb-səhifədə qrafika. Fayldan qrafik təsvirin yerləşdirilməsi

nömrələnmiş siyahı qeyd edilənə çox bənzəyir. Yeganə fərq ondadır ki, nömrələnmiş siyahıda qrafik markerlər əvəzinə hər bir elementin qarşısında avtomatik olaraq ardıcıl rəqəmlər və ya hərflər yerləşdirilir.

Nömrələnmiş siyahı etiketlərdən istifadə etməklə müəyyən edilir. kimi markerli siyahı, hər bir elementə bir etiket verilir

açar söz TAPE.

TAPE=1 - Standart nömrələmə (1,2,3,4,5, ...)

TAPE=A - Böyük hərflər (A, B, C, D, ...)

TAPE=a - Təcili məktublar (a, b, c, d, ...)

TAPE=I - Roma rəqəmləri (I, II, III, IV, ...)

TAPE=i - Kiçik Roma rəqəmləri (i, ii, iii, iv, ...)

Tərif siyahıları digər siyahı növləri ilə müqayisədə bir az fərqli görünür. Bu halda, hər bir siyahı elementini təsvir etmək üçün bir teq deyil, iki teq istifadə olunur

1. . Tag
   dəstləri ayrı element, yəni müəyyən edilən termin və etiket
   - növbəti girintili sətirdə göstərilən məlumatın qalan hissəsi. İkinci məlumat xətti deyilir tərifi. Təriflərin siyahısı digər siyahılarla eyni şəkildə müəyyən edilir. Yeganə fərq ondadır ki, hər bir element iki etiket tələb edir.

   Siyahıların ən yaxşı cəhətlərindən biri onların bir-birinin içərisinə yerləşdirilə bilməsidir. Siyahının siyahı içərisində yerləşdirilməsi sadəcə siyahı yaratmaqla eyni şəkildə həyata keçirilir. Xüsusi yoxdur HTML teqləri. Brauzeri qarışdırmamaq üçün hər bir daxili siyahını etiketlə bağladığınızdan əmin olun. Hətta bir-birinizə investisiya edə bilərsiniz Müxtəlif növlər siyahıları.

   Yuxarıdakı siyahıların hamısını oynayın

   Siyahıların bir çatışmazlığı var - onlar bir ölçülüdür. Bu o deməkdir ki, məlumatı yalnız ardıcıl sətirlərə yerləşdirə bilərsiniz. Cədvəllər isə məlumatları təkcə sətirlərdə deyil, həm də sütunlarda təşkil etməyə imkan verir.

   Cədvəlləri müəyyən etmək üçün bir sıra etiketlərdən istifadə olunur. etiketlər

   Və bütün cədvəli çərçivəyə salır və bir sıra digər teqlər məlumatın necə göstəriləcəyini müəyyən edir. Cədvəl göstərir Tam təsvir masa etiketləri.

   
   
   

   Cədvəl qurmaq üçün HTML teqləri:

   Teqlər Təsviri

   və Bu etiketlər cədvəli əhatə edir. Tag

   brauzerlərə cədvəlin təsvirinin aşağıdakı kimi olduğunu bildirir. Satır və sütunları ayıran torun görünməsini istəyirsinizsə, BORDER açar sözünü əlavə edin.

   başlıq kimi göstərilir. Başlığı təyin etmək üçün teqlərdən də istifadə edə bilərsiniz. Və.

   Teqlər mətni sətir və ya sütun başlıqları kimi bir qədər böyük qalın şriftlə göstərir.

   Və Teqlər hər bir cədvəl sırasını müəyyənləşdirir. Tag isteğe bağlıdır, lakin bu, HTML kodunuzu daha dolğun və başa düşülən edir.

   Bu teq cütü hər bir cədvəl xanasının mətnini ayırır.

   Beş sətir və beş sütundan ibarət bir cədvəl qurduğunuz fayl yaradın.

   Cədvəlin fonunu və grid rənglərini təyin etməyə imkan verən bir sıra teqlər var. Birinci halda, BGCOLOR açar sözü etiketə daxil edilir

   və bu teqlərlə işarələnmiş mətn,

   Və
   Və

   aşağıdakı şəkillər:

   BGCOLOR açar sözünə əlavə olaraq, rəngə nəzarət etməyin başqa yolları da var:

   BORDERCOLOR Cədvəl şəbəkəsinin rəngini dəyişdirin

   BORDERCOLORDARK/ Şəbəkəni dəyişmək üçün istifadə olunur

   Əlavə üçölçülü effekt üçün BORDERCOLORLIGHT

   3D effekti ilə masanın grid rəngini dəyişdirin.

   Dərs 12-13. Qrafikdən istifadə

   Şəkillər və qrafiklər WWW üçün çox vacibdir. Bu, eyni vaxtda ekranda şəkillərə və mətnə ​​baxmaq imkanı verən yeganə İnternet alətidir.

   Veb səhifədə şəkil yerləşdirmək üçün etiketin necə tətbiq olunacağını bilməlisiniz . Etiket daxil edin və hansı qrafiklərin yüklənəcəyini müəyyən etmək üçün SRC= açar sözü.

   

   Bu teqi daxil edərkən qeyd edin ki, fayl HTML faylınızla eyni qovluqda olmalıdır.

   Qrafik və trafik

   Veb səhifələrin dizaynının gözəlliyinə və ifadəliliyinə olan tələblər müasir veb hostinqin texniki imkanları ilə daim ziddiyyət təşkil edir. Buna görə də, sayt dizayneri dizayner və istifadəçi arasında vasitəçi olmalı və vizual cəlbedicilik və İnternetdə məlumatın ağlabatan çatdırılma sürəti arasında tarazlığı ciddi şəkildə saxlamalıdır. Bu problemi uğurla həll etmək üçün İnternetdə istifadə olunan bütün qrafik formatları bilmək, onların arasındakı fərqləri, tətbiq sahələrini və istifadə üsullarını başa düşmək lazımdır.

   İnternetdə qəbul edilmiş çox sayda format və protokolla məşğul olmaq və öz səhifənizi yaratmaq üçün xüsusi məqsədlərinizə ən uyğun olanı seçməlisiniz. Bəzi formatlar yalnız bir brauzer üçün xüsusi ola bilər, digərləri isə xüsusi plugin tələb edəcək. Biz bütün müxtəlif formatlardan yalnız populyar saytların müəllifləri tərəfindən ən çox istifadə olunan və istifadəçilər tərəfindən qəbul edilənləri seçmişik.

   GIF və JPEG ən məşhur şəkil formatlarından ikisidir və uzun müddət WWW-də istifadə üçün faktiki standartlar olmuşdur. Hər ikisi olduqca universaldır, əksər brauzerlər tərəfindən oxunur və xüsusi tələb etmir proqram təminatı(və ya əlavə modullar). GIF və JPEG rastr şəkil formatlarıdır ki, bu cür şəkilləri ekranda göstərərkən müvafiq olaraq sabit formatı (qətnaməsini) müəyyən edir. Ölçməyə çalışdığınız zaman (bəzi brauzerlərdə verilir), bitmap (piksel) şəkillər çox keyfiyyət itirir. 8 bitlik (256 rəngli) GIF formatı üçün əlavə olaraq rəng palitrasının seçimi ciddi problemdir.

   Vektor qrafika formatları internetdə istifadə üçün daha cəlbedicidir. Bitmaplardan fərqli olaraq vektor qrafikası verilənlərin riyazi (həndəsi) təsvirinə əsaslanır. Bu cür şəkillər saxlama / ötürmə baxımından daha kiçikdir, asanlıqla miqyaslanır və heç bir transformasiya zamanı praktiki olaraq keyfiyyətini itirmir. Təəssüf ki, vektor formatları internetdə hələ də az istifadə olunur, lakin standartlar artıq formalaşıb və dizaynerlər üçün maraqlı olmalıdır.

   Bir neçə vektor standartları nisbətən yaxınlarda təklif edilmişdir və PGML və VML formatları hazırda Ümumdünya İnternet Konsorsiumu (W3C) tərəfindən nəzərdən keçirilir. Bununla belə, VML-i təbliğ edən Macromedia öz vektor formatını çoxdan açıb. Şok dalğası Flaş digər tərtibatçılara və populyar brauzerlər üçün bu formatda qrafiklərə baxmaq üçün əlavə modullar tətbiq etdi.

   Bununla belə, yeni alətlər bütün tətbiqlər üçün mütləq ən yaxşısı deyil. İnternetdə dərc olunan ən çox yayılmış şəkillər hələ də çox zəhmət tələb edən və vektor formatına çevirmək çətin olan rəqəmsal fotoşəkillər, rəsmlər və skan edilmiş şəkillərdir.

   Buna görə də, format seçimi son nəticədə tapşırıqlarınızdan və hansı şəkillərin ehtiyaclarınız üçün daha uyğun olduğundan asılıdır. hədəf auditoriyası, bu Səndən asılıdır.

   GIF - dizayn üçün format

   CompuServe əvvəlcə GIF formatını interaktiv proqramlar üçün nəzərdə tutmuşdu əlillər fərdi kompüterdə standart qrafika. Bu, əvvəlcə 4 bitlik, daha sonra isə maksimum 256 rəngi dəstəkləyən 8 bitlik rəng xəritəli bitmap formatı idi. Formatın əhəmiyyətli üstünlüklərindən biri odur ki, şəkillər müəyyən bir palitraya (rənglər dəsti) indeksləşdirilə bilər, JPEG şəkilləri isə palitraya “əlaqələndirilə bilməz” və onların “düzgün” göstərilməsi həmişə mümkün olmur. Bu xüsusiyyət, bu və ya digər sistemin hansı rəng dərinliyi ilə işləməsindən asılı olmayaraq, istisnasız olaraq bütün platformalar (istər PC, Mac, Web-TV və ya digərləri) üçün təsvirin göstərilməsini optimallaşdırmaq üçün palitranın indeksləşdirilməsindən istifadə edən tərtibatçılar üçün xüsusilə vacibdir. Bu universallığa həm Windows-da, həm də, məsələn, MacOS-da istifadə olunan bütün ümumi rəngləri ehtiva edən 216 rəngdən ibarət məhdud palitra ilə nail olmaq olar. Saytın universal palitrada dizaynı ardıcıl, çarpaz platforma və aparatdan müstəqil ekrana zəmanət verir. Bundan əlavə, GIF formatında itkisiz sıxılma sxemindən istifadə olunur (sadə təkrar kodlaşdırma alqoritmi ilə: eyni rəngli baytların ardıcıllığı iki baytlıq bir sözlə əvəz olunur, onlardan biri doldurma nümunəsini ehtiva edir, ikincisi isə nömrəni müəyyənləşdirir. təkrarların sayı), buna görə də bu formatdakı qrafik məlumatlar sıxılma və bərpa prosesində məlumatı itirmir.

   Bununla belə, məhz bu daxili rəng məhdudiyyətlərinə görə GIF formatı yalnız məhdud sayda rəngə malik olan şəkillər üçün istifadə edilə bilər, məsələn, qara-ağ sxemlər və ya böyük ərazilər cizgi filmi çərçivələri və ya tək rəngli dolgu ilə rəqəmsal təsvirlər kimi bir rəngli. Əlbəttə ki, siz rəng tonlarının hamarlanması (dithering) adlanan üsulu tətbiq etməklə istənilən şəkli GIF formatında saxlaya bilərsiniz və beləliklə, kifayət qədər layiqli keyfiyyət əldə edə bilərsiniz, lakin bu halda tətbiq edildikdən sonra fayl ölçüsündə əhəmiyyətli artımla "çalışmaq" riskiniz var. yuxarıda təsvir edilən yaddaş sıxılma təkrarları (degenerativ vəziyyətdə, təsvirdə bitişik təkrarlar olmadıqda, sıxılmamış orijinal ilə müqayisədə faylda tam iki dəfə artım əldə edəcəksiniz).

   Beləliklə, GIF formatının əsas üstünlükləri itkisiz sıxılmanın istifadəsi və aydın haşiyə və ciddi rəng keçidləri ilə bərk rəng sahələrinin qənaətli qorunmasıdır. JPEG formatı təsvir ediləndən onunla fərqlənir ki, sıxılma səviyyəsindən asılı olaraq orada bərk sahələr məhv edilir və kəskin rəng keçidləri hamarlanır və ya yuyulur.

   GIF formatını seçmək üçün əsas meyar: özünüz eyni rəngli böyük sahələri olan Photoshop və ya Painter kimi qrafik paketində bir şəkil çəkmisinizsə və ya mövcud təsviri emal etmisinizsə və yüksək kontrastı saxlamaq istəyirsinizsə (lazımdır, məsələn, mətni göstərərkən), sonra onu bu formatda saxlayın (xüsusilə ağ-qara və ya rəngsiz rəsmlər üçün).

   Hamar rəng keçidlərindən (qradientlərdən) istifadə edən fotolar, video çərçivələr və ya digər tam rəngli şəkillər üçün istifadə edin jpeg formatı.

   Həm də yadda saxlamaq lazımdır ki, əgər siz davamlı tonlu GIF şəkillərini saxlamağa çalışırsınızsa, ehtimal ki, təsvirin hazırlanması prosesində (onu sabit palitraya çevirərkən) və GIF-in sıxılmasında çoxlu məlumatı atmalı olacaqsınız. metod o qədər səmərəsiz olacaq ki, siz də maddi cəhətdən itirəcəksiniz (həm əmək xərcləri, həm də fayl ölçüsü baxımından).

   Digər şeylər arasında, GIF formatı sözdə interlaced görünüşü (Interlaced) təmin edir, bu da qəbulun əvvəlində yavaş kanalları olan istifadəçilərə şəklin məzmununu qiymətləndirməyə kömək edir (effekt tədricən kəskin olmayan bir şəkil çəkməyə bənzəyir) şəkil) və onun tam ötürülməsi üçün tələb olunan vaxt və nəticədə onu götürməyə davam etmək və ya ondan imtina etmək barədə qərar qəbul etmək. Lakin, mütərəqqi JPEG-dən fərqli olaraq, burada təsir realdan daha çox psixolojidir (şəklə bax).

   GIF formatının bəzi hallarda bütün çatışmazlıqları ilə belə aradan qaldırıla bilməyən vacib bir üstünlüyü də yadda saxlamalısınız, şəffaflıq dəstəyidir (GIF89a genişləndirilməsi), bu da düzbucaqlı olmayan konturları olan silueti göstərməyə imkan verir. mövcud fon. GIF formatında şəffaflıq primitiv şəkildə həyata keçirilir - şəffaf olaraq bir rəng (adətən fon) təyin edilir. Bu üstünlük səhifə dizaynında düymələr və nişanlar yaratarkən tez-tez istifadə olunur (JPEG heç bir şəffaflıq dəstəyi təklif etmir).

   Sonda aşağıdakıları deyə bilərik: GIF - ən yaxşı seçim mövcud aparat və proqram təminatı arasında effektiv kompromis əldə etmək və 8 bitlik GIF şəklini 216 universal rəngə qədər indeksləşdirmək bacarığı, şəkillərinizin çoxsaylı brauzerlərdə və naməlum platformalarda nümayiş etdirilməsi nəzərdə tutulduqda vacibdir.

   JPEG - fotoşəkillər və video çərçivələr üçün format

   JPEG formatı öz adını 80-ci illərin sonu və 90-cı illərin əvvəllərində bu standartı yaradan Birgə Fotoqrafiya Mütəxəssisləri Qrupu komitəsinin (Joint Committee of Photographic Experts) abbreviaturasından almışdır. JPEG formatı itkili sıxılma alqoritminə (diskret kosinus çevrilməsinə) əsaslanır, onun vasitəsi ilə şəkliniz bölgələrə bölünür (adətən 8x8 piksel kvadratlar), onun daxilində rənglərin paylanması riyazi funksiya və yalnız əmsallar ilə əvəz olunur. bu funksiya saxlanılır və onun formasını bərpa etməyə imkan verir. Təbii ki, siz müəyyən keyfiyyət itkisi ilə üzləşəcəksiniz (şəkildən asılı olaraq funksiyanın mürəkkəbliyi təsviri əvəz etmək üçün istifadə olunur) və bərpa edildikdən sonra siz artıq real şəkil deyil, onun riyazi "surroqatı" alacaqsınız. Bununla belə, orijinalınızın keyfiyyətindən və sıxılma dərəcəsindən asılı olaraq, keyfiyyət itkisi tamaşaçı üçün tamamilə görünməz ola bilər. Lakin JPEG-in GIF-dən əsas üstünlüyü ondan ibarətdir ki, GIF yalnız 8 bit (256 rəng), JPEG isə 24 bitdir və 16,7 milyon rəng göstərə bilir.

   Bu səbəbdən, tam rəngli JPEG təbii olaraq GIF-dən daha çox video məlumatını əks etdirir. Bu format real həyat şəkilləri - skan edilmiş şəkillər və ya rəqəmsal fotoşəkillər, həmçinin rəqəmsallaşdırılmış video çərçivələr və ya göstərilən 3D kompüter qrafikası səhnələri üçün ən uyğundur.

   JPEG-in digər üstünlüyü ondan ibarətdir ki, GIF-dən fərqli olaraq o, orijinal təsvirə tətbiq edilən sıxılma miqdarını təyin etməyə imkan verir ki, bu da ölçü və keyfiyyət arasında lazımi balansı saxlamağa imkan verir.

   Sıxılma əmsalları istifadə edilən şəkil redaktə proqramından asılı olaraq JPEG-lər üçün geniş şəkildə dəyişir, lakin Veb səhifələr adətən məqbul keyfiyyəti təmin edən 10:1 və ya 20:1 (həcmi ilə orijinal təsvirə nisbət kimi ifadə edilir) nisbətlərindən istifadə edir. . Buna baxmayaraq, görüntünü 100:1 ifrat dəyərlərə qədər sıxışdırmaq mümkündür (əlbəttə ki, əhəmiyyətli keyfiyyət itkisi ilə).

   Beləliklə, JPEG formatında fotoşəkillə işləyərkən 16,7 milyon rənglə 24 bitlik təsviri saxlamaq imkanınız var və sıxılma zamanı keyfiyyətinin itirilməsinə baxmayaraq, o, yenə də 256 rəngli GIF-dən çox orijinala uyğun gəlir. performans. Bu halda, keyfiyyətin qaçılmaz itkisi orijinal təsvirin ölçüsündən, keyfiyyətindən və növündən çox asılıdır.

   Bundan əlavə, JPEG sizə mütərəqqi displey adlananı təyin etməyə imkan verir, yəni yüklənərkən dərhal ekranda təsvirin "kobud" təsviri görünəndə, daha çox məlumat alındıqca, tədricən yaxşılaşır (aşağıda eyni zamanda, yükləmə tamamlanmamışdan əvvəl qidalanan materialın mahiyyəti haqqında lazımi fikri əldə edə və istənilən mərhələdə prosesi dayandıra bilərsiniz, bu da şəbəkə məzmununu nəzərdən keçirmə vaxtına xeyli qənaət edir).

   İstədiyiniz zaman bu vasitələrdən istifadə edə bilərsiniz və belə bir mərhələli təzahür kanallarda tıxaclara qarşı mübarizədə yaxşı kömək ola bilər. Mütərəqqi JPEG ilə bağlı yeganə problem (interlaced GIF-dən fərqli olaraq) köhnə brauzerlərin onu dəstəkləməməsidir.

   PNG - universal rastr yeniliyi

   Növbəti nəsil rastr formatları PNG həm JPEG, həm də GIF-in ən yaxşı xüsusiyyətlərini götürdü və təsvirin təqdimatına özünəməxsus yanaşma əlavə etdi ki, bu da bir fayla yerləşdirməyi mümkün edir. müxtəlif versiyalar aşağı, orta və yüksək qətnamələr üçün eyni şəkil.

   PNG (Portable Network Graphics) formatı W3C konsorsiumu tərəfindən standart kimi təsdiq edilmiş nisbətən yeni rastr qrafika formatıdır və tədricən hər iki "köhnəlmiş" formatı əvəz etməlidir: həm GIF, həm də JPEG. PNG həm rəng indeksləşdirmə (256 rəngə qədər), həm 24, həm də 48 bit rəng (True-Color) üçün dəstək və şəffaflıq kanalı (alfa kanalı) ilə işləməyi təklif edir, bundan əlavə, ənənəvi bitmap yaddaşından daha səmərəlidir. formatlar.

   Tam rəngli şəkil üçün sıxılma alqoritmi keyfiyyətcə JPEG-i üstələyir və məhdud indeksləşdirilmiş palitranın (256 rəngə qədər) dəstəyi ilə yeni format GIF formatında tətbiq olunandan 10-30% daha yaxşı itkisiz sıxılma həyata keçirir. istənilən halda istifadə üçün optimal edir. Təəssüf ki, yeni format JPEG formatında olduğu kimi daha yüksək sıxılma nisbəti müqabilində təsvirin keyfiyyətini qurban verməyə imkan vermir.

   PNG şəffaflıq dəstəyi, GIF-dən fərqli olaraq, tam hüquqludur, yəni şəffaf şəkillər və ya haşiyələr qura bilərsiniz, buna görə də GIF faylında şəffaflıqdan istifadə edərkən həll etmək çox çətin olan "təmiz" sərhədlər problemi burada asanlıqla aradan qaldırılır. .

   Bununla belə, PNG-nin təklif etdiyi bütün təkmilləşdirmələrə baxmayaraq, yeni format yalnız veb sayt dizaynerləri və proqram təminatı istehsalçıları tərəfindən həm şəkilləri yeni formatda göstərmək, həm də onları nəşrə hazırlamaq üçün istifadə edildikdən sonra işə düşəcək. Bu vaxt həm Netscape Navigator, həm də Microsoft Internet Explorer-də bu formatın dəstəyinin bu yaxınlarda daxil edilməsinə baxmayaraq, İnternetin istənilən yerində PNG şəkillərini tapmaq olduqca çətindir.

   Baxmayaraq ki, onlar son versiyalar və PNG-ni dəstəkləyirlər, bunu çox məhdud şəkildə edirlər. Hal-hazırda tam PNG faylını görmək istəyən istifadəçilər üçün yeganə həll yolu plug-in (PNG Live kimi) özləri quraşdırmaqdır.

   Göründüyü kimi, tərtibatçılar istifadəçilərin yeni formatlara tam keçidini gözləyərək yavaşlayırlar. Yaxşı, sağlam mühafizəkarlıq heç vaxt zərər vermir, amma yenə də GIF formatının ən azı bütün mövcud istifadələrini əvəz edərək tədricən PNG-yə keçməyi tövsiyə edirik.

   Vektor təmsili

   Həm JPEG, GIF, həm də PNG təsvirin diskret (piksel və ya nöqtə) təsvirinə əsaslanan rastr formatlarıdır, vektor formatları isə riyazi düsturlara (şəkillərin həndəsi təsviri) əsaslanır. Vektor qrafikası xüsusilə diaqramlara, mətnlərə və sənaye qrafiklərinə gəldikdə rastr üzərində əhəmiyyətli üstünlüklər təmin edir (və formatların səmərəliliyi İnternet üçün böyük əhəmiyyət kəsb edir).

   Beləliklə, birinci üstünlük, bitmaplarla müqayisədə vektor şəkillərinin əhəmiyyətli dərəcədə kiçik ölçüsüdür, çünki təsvirin hər bir pikseli deyil, bütün rəqəm təsvir olunur (məsələn, bir dairə qurmaq üçün 3-4 rəqəmi köçürməlisiniz: radius, mərkəzin koordinatları və bəlkə də xəttin növü və ya qalınlığı və onun atributları). Vektor təsvirini təsvir edən riyazi düsturlar fərdi piksellərə və onların atributlarına nisbətən daha az yer tutur.

   Vektor təsvirinin digər mühüm üstünlüyü, təsvirin həlli və ya aydınlığında heç bir itki olmadan təsvirin faktiki olaraq qeyri-məhdud miqyasını (və ya onun hissələrini təfərrüatlandırmaq) imkanıdır. Vektor təsvirini xüsusi palitraya, platformaya, aparata və ya dizayna uyğunlaşdırmaq üçün heç bir səy tələb olunmur; və sıxılma sxemi və ekran keyfiyyəti heç bir problem olmadan uyğun gəlir.

   Bununla belə, hər rastr təsviri vektor formasına çevirmək olmur (məsələn, fotoşəkillər, skan edilmiş şəkillər və ya rastr təsvirləri vektorlaşdırmaq çətindir). Ancaq xüsusi hazırlanmış vektor təsvirləri (məsələn, xətt sənəti, piktoqramlar, texniki illüstrasiyalar, xəritələr, məlumat qrafikası və tarixən vektor olan digərləri) bu gün olduğu kimi İnternetdə dərc olunmaq üçün rasterləşdirmək sadəcə axmaqlıqdır.

   zamanı vektor qrafiklərinin göstərilməsi ilə bağlı problemlər dünya geniş şəbəkəsi rastrdan başqa heç bir göstərmə üsulu olmadığından və ortaya çıxan PDF formatında faylları göstərmək üçün plug-in lazımi çevikliyi təmin etmədiyindən və bütün məzmunun bir formada - PDF-də saxlanmasını tələb etdiyi üçün yarandı.

   Vektor qrafikasının hər hansı əlavə proqram təminatı olmadan ənənəvi HTML formatına qüsursuz şəkildə daxil edilməsini təmin etmək üçün hazırda W3C Standartlar Komitəsi tərəfindən iki yeni vektor standartı nəzərdən keçirilir: PGML (Precision Graphics Mark-up Language) və VML (Vector Mark-up Language) . PGML Adobe Systems, IBM, Netscape və Sun Microsystems tərəfindən, VML isə Microsoft, Hewlett-Packard, Autodesk, Macromedia və Visio tərəfindən dəstəklənir. Hər iki standart XML işarələmə dilinin genişləndirilməsinə əsaslanır, HTML-nin davamçısı kimi internetdə istifadə üçün təbliğ edilir və gələcəkdə istifadə üçün W3C tərəfindən tövsiyə olunur.

   Lakin hazırda brauzerlərin heç biri vektor qrafikası standartlarını dəstəkləmir, baxmayaraq ki, plaginlər artıq mövcuddur. Bu gün İnternetdə statik vektor şəkillərini nümayiş etdirməyin ən populyar üsulları arasında Macromedia-nın SWF (Shockwave Flash) formatı və hələ də qiymətləndirilməmiş Xara Flare formatı var.

   Məşəl - yaxşı qərar, bu, bir səhifənin təfərrüat səviyyəsini demək olar ki, qeyri-məhdud şəkildə artırmağa imkan verən vektor şəkillərini daxil etməyə imkan verir, halbuki onların ölçüləri Shockwave Flash ilə müqayisə olunur. Bu o demək deyil ki, şəkillərə baxmaq üçün əlavə modullardan istifadə o qədər də əlverişsizdir, ancaq səhifələrinizdə bu cür vasitələrdən istifadə etdiyiniz zaman istifadəçini bu barədə xəbərdar etməyi unutmayın və ona getməzdən əvvəl müvafiq modulu yükləmək imkanı verin. bu elementləri ehtiva edən səhifə. Qısa müddətdə bu, əlbəttə ki, axtarış prosesini yavaşlatacaq yeni istifadəçilər, lakin müvafiq vasitələr nəhayət daxil edilənə qədər getdikcə daha çox tərəfdar qazanacaqsınız növbəti versiya Yeni başlayanlar üçün brauzer və əlavə modul artıq lazım olmayacaq.

   Animasiya, interaktivlik və qarşılıqlı əlaqə

   Ümumiyyətlə, GIF şəkilləri bir faylda xüsusi yığın kimi yerləşdirilə bilər və nəticədə əldə edilən “film” (flipbook) sadə bitmap animasiyası yaratmaqla oxuna bilər. Həm Netscape, həm də Microsoft brauzerlərinin üçüncü versiyalarından bəri "animasiya edilmiş" GIF formatını dəstəkləyir, ona görə də onların İnternetdə mövcudluğundan qaçmaq indi çətindir. Belə GIF yığınlarını yaratmağa imkan verən çoxsaylı GIF animatorları geniş istifadə olunur (həm kommersiya, həm də ictimai). Bununla belə, GIF formatını "canlandırmaq" idarəolunmaz hala gətirə bilər fayl ölçüləri, çünki belə bir yığının hər bir "səviyyəsi" fərdi GIF-şəkildir, ona görə də kompüter animasiyası üçün saniyədə tipik 15 kadr saysız-hesabsız kilobayt "istehsal edə" bilər.

   Java və ya JavaScript ilə birlikdə siz həmçinin istifadəçiyə cavab verəcək interaktiv animasiyalar yarada bilərsiniz.

   İndi isə veb animasiya və istifadəçinin interaktiv qarşılıqlı əlaqəsi üçün digər həll yollarına nəzər salaq və burada əsas rolu bazara çoxdan Shockwave və Flash proqramları ilə daxil olan və məhsullarını davamlı olaraq təkmilləşdirərək, onların səmərəliliyini artıran Macromedia oynamağa davam edir. istifadəçilərin və dizaynerlərin ehtiyaclarına uyğun olaraq. .

   Əvvəlcə Macromedia Director üçün format kimi yaradılmış Shockwave, əsasən İnternetdə istifadə üçün xüsusi olaraq yaradılmış interaktiv və qrafik məzmunun istehsalına yönəlmiş protokollar ailəsidir. Shockwave Flash ümumiyyətlə unikal bir vasitədir və ən çox biridir daha yaxşı yollar animasiya yaratmaq və onu Web səhifəsində dərc etmək. Shockwave Flash çox kiçik fayllar yaradır (çünki o, əsasən vektor təsvir formatından istifadə edir) və digər formatlarla müqayisədə hazırlıq baxımından ən əlverişlidir.

   Səhifələrinizdə belə bir animasiya dərc edərkən istifadəçiyə bu barədə məlumat verməyi unutmayın ki, o, əvvəlcədən əlavə modul yığsın və yükləməni yorucu gözləməyə hazırlaşsın. Bununla belə, həm Netscape Navigator-un son versiyaları, həm də internet Explorer hətta əsas paketdə Flash animasiyalar üçün izləyicilərə sahib olun. Netscape, Navigatorun gələcək versiyalarında hətta kod səviyyəsində belə Flash üçün bu dəstəyin olacağını təsdiqlədi.

   Son qərar sizindir

   Beləliklə, veb məzmunun təqdimatına münasibət dəyişir, yeni məlumat formatları və onları dəstəkləyən inkişaf alətləri meydana çıxır. Bununla belə, köhnə formatlar (qrafikləri təmsil etmək üçün GIF və JPEG-dir) hələ də kifayət qədər populyardır. Onlar demək olar ki, bütün brauzerlər tərəfindən dəstəklənir və əksər tərtibatçılar onlarla işləməkdə böyük təcrübəyə malikdirlər. Şəkil keyfiyyəti və fayl ölçüləri arasında tarazlığı təmin etmək üçün xüsusi tətbiqiniz üçün düzgün formatdan istifadə etmək vacibdir. Məsələn, bir GIF şəkli daha çox yer tuta və JPEG şəklinə nisbətən daha aşağı keyfiyyətli nəticə verə bilər, digəri isə əksinə olacaq.

   Bununla belə, bitmap şəkillərini təqdim edərkən PNG daha çox üstünlük təşkil edir və daha da irəli gedib vektor təsvirindən istifadə etməyə çalışsanız, Macromedia-nın Shockwave Flash formatı bu gün sizin xidmətinizdədir.

   SWF (Shockwave Flash) formatı çox istifadə olunan deyil, Macromedia Flash proqramının daxili vektor formatıdır (bax " Macromedia-dan dərslər CD-ROM-da Flash"), buna görə də öz şəklinizi və ya animasiyanızı əldə etmək üçün Macromedia-dan müvafiq multimedia paketini almalı olacaqsınız və istifadəçi nəticəni vizuallaşdırmaq üçün əlavə modul quraşdırmalı olacaq. Beləliklə, sadəcə olaraq veb səhifənizdə vektor rəsmini yerləşdirmək üçün bir sıra çətinlikləri aradan qaldırmalısınız.

   Buna baxmayaraq, digər vektor formatları yoldadır, bu da tezliklə standart olacaq.

   ComputerPress 5 "1999

   Şəklin əlavə edilməsi iki mərhələdə baş verir: əvvəlcə istədiyiniz formatda və ölçüdə qrafik fayl hazırlanır, sonra elementdən istifadə etməklə fayl səhifədə göstərilir. .

   Fayl formatları

   Veb qrafikası üçün iki format geniş istifadə olunur - PNG və JPEG. Onların çox yönlü olması, çox yönlü olması, sayt üçün kifayət qədər keyfiyyətə malik kiçik mənbə faylları onlara yaxşı xidmət etdi, əslində onları veb-şəkillər üçün standart kimi müəyyənləşdirdi. Onlara əlavə olaraq saytlarda GIF və SVG formatlarından istifadə olunur.

   PNG-8 formatı

   PNG-8 (Portable Network Graphics, portable network graphics) GIF-i əvəz etmək üçün yaradılmış pulsuz formatdır. uzun müddətə xüsusi alqoritmlərdən istifadə edilmişdir.

   Xüsusiyyətlər

   • Şəkildə 8 bitlik palitradan (256 rəng) istifadə edir və bunun üçün öz adında səkkiz rəqəmini alır. Bu halda, faylda neçə rəngin saxlanacağını seçə bilərsiniz - 2-dən 256-a qədər.
   • GIF-dən fərqli olaraq o, animasiya göstərmir.

   Tətbiq sahəsi

   PNG-24 formatı

   PNG-24 PNG-8-ə bənzər formatdır, lakin 24-bit rəng gamutundan istifadə edir.JPEG kimi, fotoşəkillərdə rənglərin parlaqlığını və tonunu qoruyur. GIF və PNG-8 kimi, xətt sənəti, loqolar və ya illüstrasiyalar kimi təsvir detallarını qoruyur.

   

   Xüsusiyyətlər

   • Fayl başına təxminən 16,7 milyon rəng istifadə edir, buna görə də bu format tam rəngli şəkillər üçün istifadə olunur.
   • Çox səviyyəli şəffaflığı dəstəkləyir, bu, təsvirin şəffaf sahəsindən rəngə hamar bir keçid yaratmağa imkan verir.
   • İstifadə olunan sıxılma alqoritmi təsvirdəki bütün rəngləri və pikselləri dəyişməz saxladığına görə, digər formatlarla müqayisədə PNG-24 qrafik faylın ən böyük yekun ölçüsünə malikdir.

   Tətbiq sahəsi

   Fotoşəkillər, şəffaf və yarımşəffaf sahələr olan çertyojlar, çoxlu rənglər və kəskin təsvir kənarları olan rəsmlər.

   JPEG formatı

   JPEG (Joint Photographic Experts Group) internet saytları yaratmaq və fotoşəkilləri saxlamaq üçün geniş istifadə olunan məşhur şəkil fayl formatıdır. JPEG 24 bit rəngi dəstəkləyir və fotoşəkillərdə rənglərin parlaqlığını və çalarlarını toxunulmaz saxlayır. Bu format itkili sıxılma adlanır, çünki JPEG alqoritmi məlumatları seçici şəkildə rədd edir. Sıxılma üsulu, xüsusən mətn, incə detallar və ya kəskin kənarları ehtiva edərsə, təsvirə təhrif yarada bilər. JPEG formatı şəffaflığı dəstəkləmir. Şəkili bu formatda saxladığınız zaman şəffaf piksellər göstərilən rənglə doldurulur.

   

   Xüsusiyyətlər

   • Şəkildəki rənglərin sayı təqribən 16,7 milyondur ki, bu da təsvirin foto keyfiyyətini qorumaq üçün kifayətdir.
   • Formatın əsas xarakteristikası son fayl ölçüsünü idarə etməyə imkan verən "keyfiyyət" dir. Keyfiyyət 0-dan 100-ə qədər ölçülür, dəyər nə qədər yüksək olarsa, şəkil daha yaxşı olar, lakin fayl ölçüsü də artır.
   • Proqressiv JPEG adlanan texnologiyanı dəstəkləyir, bu texnologiyada təsvirin özü tam yüklənməmişdən əvvəl görüntünün aşağı rezolyusiyaya malik versiyası görüntü pəncərəsində görünür.

   Tətbiq sahəsi

   Əsasən fotoşəkillər üçün istifadə olunur. Şəffaf sahələr, kiçik detallar və ya mətn olan rəsmlər üçün çox uyğun deyil.

   GIF formatı

   GIF (Graphics Interchange Format) animasiya şəkilləri yaratmaq üçün geniş istifadə olunan qrafik fayl formatıdır. GIF 8 bitlik rəngdən istifadə edir və şəkil təfərrüatını saxlayarkən bərk rəngli sahələri effektiv şəkildə sıxışdırır.

   

   Xüsusiyyətlər

   • Şəkildəki rənglərin sayı 2 ilə 256 arasında ola bilər, lakin 24 bitlik palitradan istənilən rəng ola bilər. GIF faylında şəffaf sahələr ola bilər. Ağdan başqa fon istifadə edilərsə, o, şəkildəki "deşiklərdən" görünəcək.
   • Sadə animasiyalar yaratmaq üçün formatı məşhur edən şəkillərin kadr-kadr dəyişdirilməsini dəstəkləyir.
   • İtkisiz sıxılma metodundan istifadə edir

   Tətbiq sahəsi

   Mətn, loqolar, iti kənarları olan illüstrasiyalar, animasiyalı qrafika, şəffaf sahələri olan şəkillər, bannerlər.

   SVG formatı

   SVG (Scalable Vector Graphics, scalable vektor qrafikası) təsvirin piksellərdən deyil, obyektlərdən və əyrilərdən ibarət olduğu vektor formatıdır. Bu səbəbdən o, nöqtələrdən ibarət rastr fotoşəkillər üçün uyğun deyil, lakin fərqli konturları olan illüstrasiyalar üçün əladır.

   Xüsusiyyətlər

   • SVG formatında olan şəkillər, şəkil keyfiyyətini itirmədən istədiyiniz qədər ölçülə bilər.
   • Fayl ölçüsü adətən kiçik olur.
   • Animasiya və interaktivliyi dəstəkləyir.

   Tətbiq sahəsi

   Mətn, loqolar, kəskin kənarları olan illüstrasiyalar.

   Şəkil əlavə edilir

   Veb səhifəyə şəkil əlavə etmək üçün elementdən istifadə olunur. , src atributu qrafik faylın ünvanını təyin edir. Şəkil əlavə etmək üçün ümumi sintaksis aşağıdakı kimidir.

   "alt="<альтернативный текст>!}">

   Həm src, həm də alt atributları tələb olunur.

   src atributu gedən yolu müəyyən edir qrafik fayl, onu müəyyən etmək üçün mütləq və ya nisbi ünvandan istifadə edilə bilər. Sonra, bir neçəsini nəzərdən keçirin fərqli yollar, veb-səhifədə yerləşdirmək üçün şəklin yolunu necə müəyyənləşdirmək olar. Nümunə olaraq saytın kökünün şəkillər qovluğunda saxlanılan target.png adlı faylı götürək.

   http://example.ru/images/target.png
   Əgər ünvan protokolla (http:// və ya https://) başlayırsa, o, mütləq ünvandır. Veb səhifə yerli kompüterdə saxlansa belə, şəkil həmişə göstərilən İnternet ünvanından endiriləcək.

   //example.ru/images/target.png
   Bu, protokol göstərilmədən şəklin mütləq ünvanıdır. Brauzer müstəqil olaraq saytın işlədiyi tələb olunan protokolu (http:// və ya https://) əvəz edəcək. Nəzərə alın ki, bu tip ünvanlar yerli veb-səhifələrdə işləmir, ancaq veb serverin nəzarəti altında İnternetdə işləyir.

   /images/target.png
   Əgər ünvanın əvvəlində slash (/) varsa, bu o deməkdir ki, şəkillər qovluğu saytın kökündə yerləşir. Bir qovluq digərinin içərisinə yerləşdirilə bilər, buna görə də yol arta bilər. Məsələn, /assets/images/target.png o deməkdir ki, aktivlər qovluğu saytın kökündə yerləşir, o, daxilində target.png faylının yerləşdiyi şəkillər qovluğunu ehtiva edir.

   ../images/target.png
   İrəli iki kəsik (../) şəkil qovluğunun HTML sənədindən qovluq strukturunda bir səviyyə yüksək olduğunu göstərir. Əncirdə. Şəkil 1-də target.png şəklinin daxil edilməli olduğu source.html faylı göstərilir.

   

   düyü. 1. Fayl yerləşdirilməsi

   images/target.png
   Ünvanın əvvəlində heç bir nöqtə olmayan qovluq adı HTML sənədi ilə təsviri olan qovluğun eyni səviyyədə olduğunu göstərir (şək. 2).

   

   düyü. 2. Fayl yerləşdirilməsi

   target.png
   Tək fayl adı təsvirin və veb səhifənin eyni yerdə yerləşdiyini göstərir (Şəkil 3).

   

   düyü. 3. Faylın yerləşdirilməsi

   Nümunə 1 veb səhifəyə şəkil əlavə etməyin bir neçə yolunu göstərir.

   Misal 1: Şəkillərin əlavə edilməsi

   

   

   

   

   Alternativ mətn

   Alternativ mətn şəkillərin mühüm hissəsidir və şəkilləri görə bilməyən və eşitmə qabiliyyətindən istifadə edərək saytdan məlumat ala bilməyən gözdən əlil insanlar üçün nəzərdə tutulub. Xüsusi ekran oxuyucuları saytdan mətn oxuyur və şəkillər əvəzinə alt atributunda yazılmış mətni tələffüz edirlər. Normal brauzerlərdə alt məzmun yalnız hansısa səbəbdən veb-səhifədə şəkillər göstərilmədikdə göstərilir.

   Alt atributu təsvirin məzmununu təsvir etməlidir və əgər şəkil dekorativ funksiyanı yerinə yetirirsə və heç bir məna daşımırsa, alt işarəni boş qoyun (nümunə 2).

   Misal 2: Alt istifadə

   

   

   Şəkillər görünən işarə tələb edirsə, onda siz sadəcə şəkillərə deyil, istənilən elementə əlavə oluna bilən qlobal başlıq atributundan istifadə etməlisiniz. Şəklin üzərinə apardığınız zaman başlıq atributunun dəyərini ehtiva edən mətn görünəcək (nümunə 3).

   Misal 3: Başlıqdan istifadə

   

   Alət ipucunun görünüşü xüsusi brauzerdən asılıdır və dəyişdirilə bilməz. Əncirdə. 2 Firefox brauzerində alət ipucunu göstərir.

   

   düyü. 2. Alət məsləhətinin növü

   Şəklin ölçüsünü dəyişdirin

   Elementin şəklinin ölçüsünü dəyişmək üçün atributlar eni (en) və hündürlüyü (hündürlük) verilir. Dəyər olaraq piksellər və ya faizlər istifadə olunur. Misal 4 bu atributların necə əlavə olunacağını göstərir .

   Nümunə 4. Rəsm ölçüləri

   

   
   

   Genişlik və hündürlük atributları isteğe bağlıdır, təsviri yüklədikdən sonra brauzer avtomatik olaraq orijinal ölçüsünü təyin edəcəkdir. Əsasən, bu atributlar aşağıdakı məqsədlər üçün istifadə olunur:

   • şəkil çəkmək üçün yer ayırın;
   • böyük fotoşəkillərin ölçüsünü azaltmaq;
   • Retina displeyləri üçün şəkil keyfiyyətini yaxşılaşdırın.

   Şəklin ölçüləri açıq şəkildə göstərilibsə, onda brauzer sənədin yüklənməsi zamanı şəklə uyğun olan boş sahəni göstərmək üçün onlardan istifadə edir. Əks halda, brauzer təsvirin tam yüklənməsini gözləyir və sonra şəklin enini və hündürlüyünü dəyişir. Bu halda, mətnin yenidən formatlaşdırılması baş verə bilər, çünki əvvəlcə şəklin ölçüsü məlum deyil və avtomatik olaraq kiçik olaraq təyin olunur.

   Şəklin eni və hündürlüyü həm yuxarı, həm də aşağı dəyişdirilə bilər. Brauzer avtomatik olaraq əlavə pikselləri siləcək və ya əksinə uyğun ölçülü bir şəkil əldə etmək üçün çatışmayanları tamamlayacaq. Yaranan şəklin keyfiyyəti onun məzmunundan çox asılıdır, hər halda yadda saxlamalıyıq ki, yalnız bir filmdə detalları itirmədən təsviri böyütmək mümkündür.

   Retina displeylər yüksək piksel sıxlığı və təsvir detalları ilə xarakterizə olunur, ona görə də adi şəkillər onlarda bir az bulanıq görünür. Keyfiyyətini yaxşılaşdırmaq üçün şəkillər ikiqat ölçülür. Məsələn, əgər veb səhifə 400 piksel enində fotoşəkil tələb edirsə, onda biz 800 piksel enində fotoşəkil çəkirik, lakin eni atributunun qiymətində 400 piksel eni buraxırıq.

   Genişlik və hündürlük atributlarının bir araya gəlməsi lazım deyil. Bu atributlardan hər hansı biri göstərilməyibsə, o zaman brauzer avtomatik olaraq şəklin aspekt nisbətinə əsasən istədiyiniz dəyəri əvəz edəcək.

   

   Şəklin enini və hündürlüyünü müstəqil şəkildə əvəz etdiyimizə görə, şəkli şaquli və ya üfüqi şəkildə uzatmaqla onun nisbətlərini qəsdən təhrif edə bilərik.

   

   Piksellərə əlavə olaraq faizlər ölçülər kimi istifadə edilə bilər. Bu halda, eni ana elementə nisbətəndir.

   

   Belə hallarda hündürlüklə bağlı çətinliklər var, çünki şəklin hündürlüyü faizlə yalnız onun anasının hündürlüyü açıq şəkildə müəyyən edildikdə nəzərə alınır. Əgər ana elementin hündürlüyü heç bir şəkildə göstərilməyibsə, o zaman height="100%" kimi giriş nəzərə alınmır.

   Yüzlərlə şəkil formatı var, lakin yalnız bir neçəsi veb brauzerlər tərəfindən dəstəklənir. Bu yazıda biz veb-dizaynerlər üçün mövcud olan müxtəlif qrafik fayl formatlarını və hansı halda onlardan istifadə edilməli olduğunu təsvir edəcəyik.

   Ən məşhur veb-brauzerlər tərəfindən dəstəklənən qrafik fayl formatları bunlardır: Qrafik Mübadilə Formatı (GIF), Birgə Fotoqrafik Ekspertlər Qrupu (JPEG), Portativ Şəbəkə Qrafikası (PNG) və vektor qrafikası. Qrafik faylların bəzi xüsusiyyətləri:

   • Şəffaflıq - bu xüsusiyyət təsvirin bərk vəziyyətdən tam şəffaflığa qədər müxtəlif şəffaflıq dərəcələrində olmasına imkan verir.
   • Sıxılma - Bu xüsusiyyət, bir qrup pikseli tək element kimi müalicə etmək üçün riyazi alqoritmlərdən istifadə edərək, təsviri daha kiçik bir faylda saxlamağa imkan verir.
   • Toxunma - təsviri əvvəlcə tək xətlərə, sonra isə cüt xətlərə yükləməyə imkan verir. Bu, ziyarətçiyə şəkli daha tez görməyə imkan verir.
   • Animasiya - ardıcıl çəkilişlər seriyası vasitəsilə hərəkət görünüşünü yaradır. Animasiyalı GIF brauzer plagini tələb etmir və demək olar ki, bütün cihazlarda işləyə bilər.
   • Proqressiv yükləmə toxuculuğa bənzəyir, çünki o, əvvəlcə təsvirin yalnız bir hissəsini yükləyir, lakin alternativ xətlərə əsaslanmır.

   GIF 1980-ci ildə yaradılıb və 1990-cı illərin əvvəllərində veb-dizaynerlər tərəfindən veb səhifələr üçün əsas qrafik format kimi qəbul edilib. GIF faylları sürətli yükləmə üçün fayl ölçüsünü kiçik saxlayan sıxılma alqoritmindən istifadə edir. GIF 256 rənglə (8 bit) məhduddur, şəffaflığı və interlaced qrafikləri dəstəkləyir. Bu formatdan istifadə etməklə animasiyalı qrafika yaratmaq da mümkündür. Bütün brauzerlər GIF fayllarını problemsiz göstərə bilər.

   GIF-lərin üstünlükləri:

   • Ən çox dəstəklənən qrafik formatı
   • Diaqramlar bu formatda daha yaxşı görünür
   • Şəffaflıq dəstəyi

   Fayllar sıxılmışdır, lakin "əsl rəngləri" dəstəkləyir (24 bit) və keyfiyyətin çox vacib olduğu fotoşəkillər üçün üstünlük verilən formatdır. JPEG proqressiv formatı dəstəkləyir, bu, sizə demək olar ki, dərhal təsviri görməyə imkan verir və yükləmə tamamlandıqdan sonra keyfiyyəti yaxşılaşacaq.

   GIF fayllarından fərqli olaraq, veb dizaynerləri idarə edə bilər sıxılmış fayllar Müxtəlif səviyyələrdə şəkil keyfiyyətinə və fayl ölçülərinə imkan verən JPEG.

   JPEG-in üstünlükləri:

   • Daha böyük sıxılma daha sürətli yükləmə sürəti deməkdir.
   • Fotoşəkillər və mürəkkəb təsvirlər üçün əla keyfiyyət yaradır.
   • 24 bit rəng dəstəyi.

   PNG, GIF faylları üçün alternativ olaraq təqdim edilən nisbətən yeni formatdır. PNG 24 bitə qədər rəng dəstəkləyir, şəffaflıq, toxunma və qısa ehtiva edə bilər mətn təsviri axtarış motorlarında istifadə olunan şəkil.

   PNG-nin üstünlükləri:

   • GIF-in 8 bitlik rəng məhdudiyyətlərini aradan qaldırır
   • Axtarış motorları üçün şəkillərin mətn təsvirinə imkan verir
   • Şəffaflığı dəstəkləyir
   • Sxemlər JPEG-lərdən daha yaxşı görünür

   Vektor qrafikası

   Əksər veb qrafiklər rəngli piksellər şəbəkəsindən ibarət bitmaplar və ya çertyojlardır. Təsvirin xətt formalarını və rənglərini təşkil edən hər bir elementin riyazi təsvirindən ibarət olan vektor qrafikasında illüstrasiyalar yaradılmalıdır. kimi proqramlardan istifadə etməklə vektor qrafikası yaradılır Adobe Illustrator və ya CorelDRAW. Veb səhifələrdə istifadə üçün vektor qrafikası istənilən GIF, JPEG və ya PNG formatına çevrilməlidir.

   Hansı formatdan istifadə edilməlidir?

   Veb dizayneri əksər istifadə üçün GIF və ya JPEG formatını seçə bilər. Lakin, GIF faylları ölçüsü ilə müqayisədə kiçik olduğuna görə jpeg faylı, əksər veb-dizaynerlər fonlar, qutular, çərçivələr və 8 bitlik rənglə əla görünən hər hansı digər qrafik üçün GIF formatından istifadə edəcəklər.

   Əksər dizaynerlər sıxılmanın təsvirin vizual keyfiyyətinə xələl gətirmədiyi fotoşəkillər və illüstrasiyalar üçün JPEG formatını seçəcəklər.