Viena žyma naudojama vaizdui įterpti į tinklalapio tekstą. (P 1 lentelė). Šios žymos atributai nustato visus puslapyje įdėto vaizdo parametrus. Būtinas SRC atributas, apibrėžiantis grafinio failo adresą ir pavadinimą. Jei SRC atributas nenustatytas, bus rodoma tik tuščio vaizdo piktograma.

Žymės struktūra su SRC atributu atrodo taip:

.

Jei grafinis failas, pavadintas Institute, yra tame pačiame aplanke kaip ir tinklalapis, norėdami jį įdėti, turėtumėte parašyti:

.

Failo pavadinimo formatas

Norėdami įdėti grafinį failą pavadinimu MINSK, esantį adresu D:\Collection\Cities\MINSK.GIF, turėtumėte parašyti .

Naudojant žymą tinklalapyje yra grafinis failas, esantis kitame kompiuteryje pasaulinis tinklas"internetas".

Norėdami sukurti tinklalapį su mūsų instituto nuotrauka, kuri parodyta Fig. 4.1, turite įvesti šį HTML kodą:

Mūsų institutas

Ryžiai. 4.1. Interneto puslapis su instituto nuotrauka

Aukščiau pateiktame pavyzdyje nuotraukos aukštis (HEIGHT) yra 200 pikselių, o plotis (WIDTH) – 300 pikselių. Norėdami įdėti nuotrauką, sukuriama pastraipa su lygiavimu centre.

Horizontalios linijos

Horizontalios linijos tinklalapyje dedamos naudojant vieną žymą

Pažvelkime į kelis pavyzdžius, paaiškinančius horizontalių linijų išdėstymą:

1.

2.

WIDTH = "200" ALIGN="RIGHT"> – horizontali žalios spalvos linija, 15 pikselių storio, 200 pikselių pločio ir sulygiuota į dešinę.

3.

4.

WIDTH = "300" ALIGN = "LEFT"> – horizontali raudonos spalvos linija, 20 pikselių storio, 300 pikselių pločio ir sulygiuota į kairę.

Keturių įrašytų pavyzdžių eilutės ekranas parodytas Fig. 4.2.

Ryžiai. 4.2. Eilutės tinklalapyje

LENTELĖS

Lentelių kūrimas

Lentelė sukuriama naudojant suporuotą žymą

Bet kuri lentelė susideda iš eilučių, o eilutės – iš langelių. Šios žymos naudojamos lentelės eilutėms ir langeliams formuoti:

... – nauja linija;

... – antraštės langelis;

... – įprasta lentelės ląstelė.

Šios žymos parašytos suporuotoje žymoje

Lentelė formuojama eilė po eilutės – pirmiausia nurodoma viena eilutė ir joje nurodomas reikiamas langelių skaičius, po to antra eilutė ir t.t.

Norėdami gauti lentelę, parodytą pav. 5.1, turite įvesti šį HTML kodą:

Ryžiai. 5.1. Lentelės puslapis

Tekstas lentelės antraštės langeliuose (5.1 pav.) rodomas pusiau paryškintu šriftu ir išlygiuotas su langelio centru, o įprastuose langeliuose tekstas nepažymėtas ir lygiuojamas į kairę.

Reikėtų pažymėti, kad aukščiau esančio puslapio HTML kode žyma

tada išorinės kraštinės storis bus 6 pikseliai. Kad lentelių kraštinės nebūtų rodomos, turite nustatyti BORDER atributą į 0 arba tiesiog praleisti šį atributą.

Kaip minėta, HTML šiandien yra bet kurio tinklalapio rašymo pagrindas World Wide Web. At naudojant CSS HTML kodavimas labai keičiasi. Galite atsisveikinti su nepatogių HTML žymų pertvarkymu, kad gautumėte tam tikrus vaizdinius efektus. Apie kai kurias HTML žymas ar atributus, pvz., nebenaudojamą žymą...

Pradžia

Užsisakykite svetainę ir pradėkite verslą!

Šią frazę galima išgirsti ir pamatyti daugelyje svetainių, ir tai ne veltui!

Svetainė — tai įmonės veidas. Ir tai yra moderniausias ir efektyviausias komunikacijos su potencialiais vartotojais kanalas. Tik interneto svetainės galimybės leidžia pilnai išnaudoti visus informacinio pranešimo vartotojui perdavimo būdus. Teksto, garso ir vaizdo informacija gali būti pateikiama vienoje svetainėje, kad vartotojas su jais būtų supažindintas.

Naudojant programinė įranga Svetainėje galite priimti mokėjimus, kalbėtis telefonu, tvarkyti duomenų bazes, siųsti ir gauti faksogramas, keistis SMS žinutėmis ir atlikti daugybę kitų veiksmų. Šiuolaikinė interneto svetainė yra informacijos centras ne tik bet kuriai įmonei, bet ir bet kuriam interneto vartotojui.

Ir tai yra abipusiai naudingas būdas efektyviai ir tuo pat metu paprastai ir aiškiai perteikti savo idėjas ar pokyčius plačiajai auditorijai. Ir šiandien žiniatinklio dokumentai, parašyti hiperteksto žymėjimo kalba HTML, ir toliau yra pagrindinė duomenų pateikimo forma žiniatinklio aplinkoje.

Svarbiausi HTML pranašumai yra šie:

• paprastumas, leidžiantis išmokti HTML per trumpiausią įmanomą laiką.
• galimybė kurti savo tinklalapius
• ir HTML veikia lygiai taip pat visose šiandien egzistuojančiose platformose, nereikia pirkti papildomos įrangos. Ir pakanka naudoti bet kurį turimą teksto rengyklę, pavyzdžiui, „Notepad“.

Šioje svetainėje pabandžiau išsamiai aprašyti visą jūsų svetainės kūrimo procesą, būtent baigto projekto paskelbimą internete, kad visiems vartotojams būtų suteikta prieiga prie jo.

Tikiuosi, kad mano straipsniai daugeliui bus labai naudingi, nes pats nesu programuotojas, bet mane šis darbas labai įkvepia.

Grafika ir srautas

Interneto puslapių dizaino grožio ir išraiškingumo reikalavimai nuolat prieštarauja technines galimybes moderni interneto priegloba. Todėl svetainės kūrėjas turi tapti tarpininku tarp dizainerio ir vartotojo bei griežtai išlaikyti balansą tarp vizualinio patrauklumo ir protingo informacijos pateikimo internete greičio. Norint sėkmingai išspręsti šią problemą, reikia išmanyti visus internete naudojamus grafinius formatus, suprasti jų skirtumus, pritaikymo sritis ir naudojimo ypatybes.

Norėdami suprasti daugybę internete priimtų formatų ir protokolų ir sukurti savo puslapį, turite pasirinkti, kas labiausiai tinka jūsų konkretiems tikslams. Kai kurie formatai gali būti būdingi tik vienai naršyklei, o kitiems reikės specialaus papildinio.

GIF ir JPEG yra du populiariausi grafiniai formatai, kurie jau seniai tapo de facto standartais naudoti WWW. Abi yra gana universalios, skaitomos daugumos naršyklių ir nereikalauja specialios programinės įrangos (ar papildomų modulių). GIF ir JPEG yra rastriniai vaizdo formatai, kurie atitinkamai nustato fiksuotą formatą (raišką), kai tokie vaizdai rodomi ekrane. Kai bandote keisti mastelį (kai kuriose naršyklėse numatyta), rastriniai (pikselių) vaizdai žymiai praranda kokybę.

8 bitų (256 spalvų) GIF formato spalvų paletės pasirinkimas taip pat yra didelė problema.

Vektorinės grafikos formatai yra daug patrauklesni naudoti internete. Skirtingai nuo bitmaps, vektorinė grafika yra pagrįsta matematiniu (geometriniu) duomenų atvaizdavimu. Tokie vaizdai yra žymiai mažesni pagal saugojimo/perdavimo tūrį, lengvai keičiami ir praktiškai nepraranda kokybės jokio konvertavimo metu. Deja, vektoriniai formatai internete dar mažai naudojami, tačiau standartai jau susiformavo ir turėtų sudominti dizainerius.

Palyginti neseniai buvo pasiūlyti keli vektorių standartai, o PGML ir VML formatus šiuo metu svarsto World Wide Web Consortium (W3C). Tačiau VML reklamuojanti „Macromedia“ jau seniai atvėrė savo „Shockwave Flash“ vektorinį formatą kitiems kūrėjams ir įdiegė papildomus modulius grafikos peržiūrai šiuo formatu populiarioms naršyklėms.

Tačiau nauji produktai nebūtinai yra geresni visoms programoms. Dažniausiai internete skelbiami vaizdai vis dar yra skaitmeninės nuotraukos, piešiniai ir skenuoti paveikslėliai, kurie yra labai daug darbo reikalaujantys ir vargu ar patartina juos konvertuoti į vektorinį formatą.

Todėl formato pasirinkimas galiausiai priklauso nuo jūsų tikslų, o jūs turite nuspręsti, kurie vaizdai geriausiai tinka jūsų tikslinei auditorijai.

„CompuServe“ iš pradžių savo GIF formatą numatė interaktyvioms programoms, atsižvelgiant į ribotas standartinės grafikos galimybes asmeniniame kompiuteryje. Iš pradžių tai buvo 4 bitų, o vėliau 8 bitų rastrinis formatas su nurodyta spalvų palete, kuri palaikė daugiausiai 256 spalvas. Vienas iš reikšmingų formato privalumų yra tai, kad vaizdus galima indeksuoti pagal konkrečią paletę (spalvų rinkinį), o JPEG vaizdų negalima „užrakinti“ paletėje ir ne visada įmanoma „teisingai“ juos atvaizduoti.

Ši savybė ypač svarbi tiems kūrėjams, kurie naudoja paletės indeksavimą, kad optimizuotų vaizdų perdavimą visoms platformoms (ar PC, Mac, Web-TV ar kitose), neatsižvelgiant į tai, su kokiu spalvų gyliu veikia konkreti sistema. Šis universalumas pasiekiamas naudojant ribotą 216 spalvų paletę, kuri apima visas įprastas spalvas, naudojamas tiek Windows, tiek, pavyzdžiui, MacOS. Svetainės sukūrimas universalioje paletėje garantuoja nuoseklų, įvairiose platformose ir nuo aparatinės įrangos nepriklausomą ekraną. Be to, GIF formatas naudoja be nuostolių glaudinimo schemą (su paprastu pasikartojimo kodavimo algoritmu: tos pačios spalvos baitų seka pakeičiama dviejų baitų žodžiu, iš kurių viename yra šešėlių raštas, o antrasis nustato skaičių pakartojimų), kad šio formato grafiniai duomenys neprarastų informacijos glaudinimo ir atkūrimo proceso metu. Tačiau būtent dėl ​​šių integruotų spalvų apribojimų GIF formatas gali būti naudojamas tik vaizdams, turintiems ribotą spalvų skaičių, pvz., nespalvotoms diagramoms arba tiems, kuriuose yra dideli vienos spalvos plotai, pvz. animacinių filmų rėmeliai arba skaitmeniniai piešiniai su vientisomis spalvomis.Žinoma, galite išsaugoti bet kurį vaizdą

Taigi, pagrindiniai GIF formato privalumai yra be nuostolių suspaudimo naudojimas ir ekonomiškas vientisų spalvų plotų su aiškia riba ir griežtais spalvų perėjimais išsaugojimas. JPEG formatas skiriasi nuo aprašytojo tuo, kad, priklausomai nuo suspaudimo lygio, vientisos sritys yra sunaikinamos, o ryškūs spalvų perėjimai išlyginami arba susilieja.

Pagrindinis GIF formato pasirinkimo kriterijus: jei pats nupiešėte paveikslėlį grafikos pakete, pvz., „Photoshop“ ar „Painter“, kuriame yra dideli tos pačios spalvos plotai, arba apdorojote esamą vaizdą ir norite išsaugoti didelis kontrastas(būtina, pavyzdžiui, rodant tekstą), tada išsaugokite šiuo formatu (visų pirma tai taikoma nespalvotiems arba prastos spalvos piešiniams).

Nuotraukoms, vaizdo įrašams ar kitiems spalvotiems vaizdams, kuriuose naudojami sklandūs spalvų perėjimai (gradientai), naudokite JPEG formatą.

Taip pat svarbu atsiminti, kad jei bandysite išsaugoti nepertraukiamų atspalvių vaizdus kaip GIF, greičiausiai turėsite atmesti tiek daug informacijos ruošiant vaizdą (konvertuojant jį į fiksuotą paletę) ir GIF glaudinimo. metodas bus toks neveiksmingas, kad prarasite ir finansiškai (tiek dėl darbo sąnaudų, tiek dėl failo dydžio).

Be kita ko, GIF formatas suteikia vadinamąją susipynusią išvaizdą, kuri padeda vartotojams, turintiems lėtus kanalus pačioje priėmimo pradžioje, įvertinti nuotraukos turinį (efektas panašus į laipsnišką išorinio vaizdo piešimą). fokusuoti nuotrauką) ir laikas, reikalingas visam jo perdavimui, ir dėl to priimti sprendimą, ar toliau fotografuoti, ar geriau nustoti fotografuoti.

Tačiau, skirtingai nei progresyvus JPEG, čia poveikis yra labiau psichologinis nei tikras (žr. pav.).

Taip pat turėtumėte prisiminti vieną svarbų GIF formato privalumą, kurio kai kuriais atvejais nepavyksta išvengti net ir su visais trūkumais, yra skaidrumo palaikymas (plėtimas GIF89a), leidžiantis esamame fone rodyti siluetą su ne stačiakampiais kontūrais. . Skaidrumas GIF formate įgyvendinamas primityviai – viena spalva (dažniausiai fonas) priskiriama kaip skaidri. Šis pranašumas dažnai naudojamas kuriant mygtukus ir piktogramas puslapio dizaine (JPEG nepalaiko skaidrumo). Apibendrinant galime pasakyti: GIF - Norint pasiekti veiksmingą esamos aparatinės ir programinės įrangos kompromisą, o galimybė indeksuoti 8 bitų GIF vaizdą iki 216 universalių spalvų yra būtina, kai vaizdus ketinama rodyti įvairiose naršyklėse ir nežinomose platformose.

JPEG – nuotraukų ir vaizdo kadrų formatas

JPEG formatas gavo savo pavadinimą iš akronimo Joint Photographic Experts Group Committee, kuris sukūrė šį standartą devintojo dešimtmečio pabaigoje ir 90-ųjų pradžioje. JPEG formatas yra pagrįstas nuostolingo glaudinimo algoritmu (diskrečiuoju kosinuso transformavimu), kuris suskaido vaizdą į sritis (dažniausiai 8x8 pikselių kvadratus), kuriose spalvų pasiskirstymas pakeičiamas matematine funkcija ir išsaugomi tik šios funkcijos koeficientai, leidžiantys atkurti jo išvaizdą. Natūralu, kad susidursite su nežymiu kokybės praradimu (atsižvelgiant į paveikslėlio pakeitimo funkcijos sudėtingumą) ir po atkūrimo gausite nebe tikrą vaizdą, o matematinį jo „pakaitinį“. Tačiau, priklausomai nuo originalo kokybės ir suspaudimo laipsnio, kokybės praradimas gali būti visiškai nepastebimas žiūrovui.

Tačiau pagrindinis JPEG formato pranašumas, palyginti su GIF, yra tas, kad nors GIF yra tik 8 bitų (256 spalvos), JPEG yra 24 bitų ir gali rodyti iki 16,7 milijono spalvų. Dėl šios priežasties spalvotas JPEG atkuria daug daugiau vaizdo informacijos nei GIF. Šis formatas geriausiai tinka realiems vaizdams – nuskaitytoms nuotraukoms arba skaitmenines nuotraukas

, taip pat suskaitmeninti vaizdo kadrai ar perteiktos 3D kompiuterinės grafikos scenos.

Kitas JPEG privalumas yra tas, kad, skirtingai nei GIF, jis leidžia savarankiškai nustatyti šaltinio vaizdo glaudinimo laipsnį, o tai leidžia išlaikyti reikiamą dydžio ir kokybės pusiausvyrą.

Taigi, dirbdami su nuotrauka JPEG formatu, turite galimybę išsaugoti 24 bitų vaizdą su 16,7 milijono spalvų ir, nepaisant kokybės praradimo glaudinant, jis vis tiek daug labiau atitinka originalą nei 256 bitų vaizdas. spalvotas GIF našumas. Šiuo atveju neišvengiamas kokybės praradimas labai priklauso nuo originalaus vaizdo dydžio, kokybės ir tipo.

Be to, JPEG leidžia apibrėžti vadinamąjį progresyvųjį ekraną, tai yra, kai įkeliant ekrane iš karto pasirodo „šiurkštus“ vaizdo vaizdas, kuris, kai jis gaunamas papildomos informacijos, pamažu tobulėja (tuo pačiu metu dar nepasibaigus atsisiuntimui galite gauti reikiamą supratimą apie pateikiamos medžiagos esmę ir bet kuriame etape nutraukti procesą, o tai žymiai sutaupo laiko peržiūrint internetinį turinį).

Šiuos įrankius galite naudoti kaip norite, o toks žingsnis po žingsnio pasireiškimas gali būti gera pagalba kovojant su kanalų perkrova. Vienintelė progresyvaus JPEG problema (priešingai nei supainioti GIF) yra ta, kad senesnės naršyklės gali jo nepalaikyti.

PNG – universali rastrinė naujovė

Naujos kartos rastrinių formatų PNG atstovas perėmė geriausias JPEG ir GIF ypatybes ir pridėjo savo unikalų požiūrį į vaizdo pateikimą, leidžiantį jį įterpti į vieną failą. skirtingos versijos tas pats vaizdas žemai, vidutinei ir aukštai skyrai.

PNG (Portable Network Graphics) formatas yra palyginti naujas rastrinės grafikos formatas, kurį W3C konsorciumas patvirtino kaip standartą ir turėtų palaipsniui pakeisti abu „pasenusius“ formatus: ir GIF, ir JPEG. PNG siūlo spalvų indeksavimą (iki 256 spalvų), 24 ir 48 bitų spalvų palaikymą (True-Color) ir darbą su skaidrumo kanalu (alfa kanalu), be to, jis yra daug efektyvesnis nei tradiciniai saugojimo formatai. rastriniai vaizdai.

Spalvoto vaizdo glaudinimo algoritmas savo kokybe yra pranašesnis už JPEG, o palaikydamas ribotą indeksuotą paletę (iki 256 spalvų), naujasis formatas užtikrina 10–30% geresnį glaudinimą be nuostolių, nei įdiegtas GIF formatu. todėl jis yra optimalus naudoti bet kokiu atveju. Deja, naujasis formatas neleidžia paaukoti vaizdo kokybės mainais į didesnį suspaudimo laipsnį, kaip yra.

JPEG formatu Skaidrumo palaikymas skirtingai nei GIF, jis yra visavertis, tai yra, galite kurti permatomus vaizdus ar kraštelius, todėl „švarių“ kraštinių problema, kurią taip sunku išspręsti naudojant GIF failo skaidrumą, čia yra lengvai įveikiama.

Tačiau, nepaisant visų PNG siūlomų patobulinimų, naujasis formatas pradės veikti tik tada, kai jį naudos svetainių dizaineriai ir programinės įrangos kūrėjai, norėdami pateikti vaizdus nauju formatu ir paruošti juos publikavimui. Tuo tarpu gana sunku rasti PNG vaizdų bet kurioje interneto vietoje, nepaisant to, kad neseniai buvo įtrauktas šio formato palaikymas tiek „Netscape Navigator“, tiek „Microsoft Internet Explorer“.

Ir nors jie naujausios versijos ir palaiko PNG, jie tai daro labai ribotai. Šiuo metu vienintelis sprendimas vartotojams, norintiems matyti visą PNG failą, yra patiems įdiegti išorinį modulį (panašų į PNG Live).

Matyt, kūrėjai delsia, laukdami, kol vartotojai visiškai persijungs į naujus formatus. Na, sveikas konservatyvumas niekada nepakenks, bet vis tiek primygtinai rekomenduojame palaipsniui pereiti prie PNG, pakeičiant bent visus esamus GIF formato naudojimo būdus.

Vektorinis vaizdavimas

Tiek JPEG, tiek GIF, tiek PNG yra rastriniai formatai, pagrįsti diskrečiu (pikseliu arba tašku) vaizdo atvaizdavimu, o vektoriniai formatai yra pagrįsti matematinėmis formulėmis (geometrinis formų atvaizdavimas). Vektorinė grafika turi didelių pranašumų prieš rastrinę, ypač kai kalbama apie diagramas, tekstą ir pramoninę grafiką (ir ekonomiški formatai yra labai svarbūs internetui).

Taigi, pirmasis privalumas yra žymiai mažesnis vektorinių vaizdų dydis, palyginti su bitmaps, nes aprašomas ne kiekvienas atskiras vaizdo pikselis, o visa figūra (pavyzdžiui, norint nurodyti apskritimą, reikia perduoti 3-4 skaičius: spindulį, centro koordinates ir galbūt linijos tipą arba storį bei jos atributus). Matematinės formulės, apibūdinančios vektorinį vaizdavimą, užima daug mažiau vietos nei atskiri pikseliai ir jų atributai.

Kitas svarbus vektorinio vaizdavimo pranašumas yra galimybė beveik neribotai keisti vaizdą (arba jo detales) neprarandant vaizdo skiriamosios gebos ar aiškumo. Nereikia jokių pastangų, norint pritaikyti vektorinį vaizdavimą prie konkrečios paletės, platformos, aparatinės įrangos ar dizaino ypatybių; o suspaudimo schemos ir rodymo kokybės derinimas vyksta be problemų.

Tačiau ne kiekvienas rastrinis vaizdas gali būti paverstas vektorine forma (pavyzdžiui, nuotraukas, nuskaitytus paveikslėlius ar rastrinius brėžinius sunku vektorizuoti). Tačiau specialiai paruoštus vektorinius brėžinius (pavyzdžiui, linijinius piešinius, piktogramas, technines iliustracijas, žemėlapius, informacinę grafiką ir kitus, kurie istoriškai yra vektoriniai) konvertuoti į rastrinę formą publikavimui internete, kas šiandien vyksta visur, yra tiesiog kvaila.

Ekrano problemos vektorinė grafika pasauliniame tinkle atsirado todėl, kad nebuvo kito rodymo būdo, išskyrus rastrinį, o pasirodęs integruotas modulis failams rodyti PDF formatu nesuteikė tinkamo lankstumo ir reikalavo visą turinį saugoti viena forma – PDF.

Siekiant suteikti galimybę sklandžiai įterpti vektorinę grafiką į tradicinį HTML formatą be jokios papildomos programinės įrangos, W3C standartų komitetas šiuo metu svarsto du naujus vektorinius standartus: PGML (Precision Graphics Mark-up Language) ir VML (Vector Mark-up Language). ). PGML palaiko Adobe Systems, IBM, Netscape ir Sun Microsystems, o VML palaiko Microsoft, Hewlett-Packard, Autodesk, Macromedia ir Visio. Abu standartai yra pagrįsti XML žymėjimo kalbos plėtiniais, reklamuojami naudoti žiniatinklyje kaip HTML įpėdiniai ir W3C rekomenduojami naudoti ateityje.

Tačiau šiuo metu nė viena naršyklė nepalaiko jokių vektorinės grafikos standartų, nors jau yra papildomų modulių (įskiepių). Tarp populiariausių būdų, kaip rodyti statinius vektorinius vaizdus internete šiandien, yra Macromedia SWF (Shockwave Flash) formatas ir vis dar neįvertintas Xara Flare formatas.

Raidas - geras sprendimas, kuri leidžia įtraukti vektorinius vaizdus, ​​kurie leidžia beveik neribotai padidinti puslapio detalumo lygį, o jų dydžiai yra panašūs į Shockwave Flash. Tai nereiškia, kad naudoti papildomus modulius vaizdams peržiūrėti yra taip nepatogu, tačiau kai naudojate tokius įrankius savo puslapiuose, būtinai perspėkite vartotoją apie tai ir suteikite jam galimybę atsisiųsti atitinkamą modulį prieš eidamas į puslapį. kuri apims šiuos elementus.

Per trumpą laiką tai, žinoma, sulėtins naujų vartotojų naršymo procesą, tačiau palaipsniui sulauksite vis daugiau ir daugiau gerbėjų, kol atitinkami įrankiai pagaliau bus įtraukti į kitą naršyklės versiją ir naujokams nebereikės papildomų modulis.

Animacija, interaktyvumas ir sąveika Paprastai tariant, GIF vaizdus galima sudėti kaip specialų krūvą viename faile, o gautą „filmą“ (flipbook) galima atkurti sukuriant paprastą rastrinę animaciją. Ir „Netscape“, ir „Microsoft“ teikia animuotų GIF palaikymą nuo trečiųjų savo naršyklių versijų, todėl dabar sunku išvengti jų buvimo internete. Daugybė GIF animatorių, leidžiančių kurti tokias GIF krūvas, yra plačiai paplitę (tiek komerciniai, tiek viešai prieinami). Tačiau GIF formato „atgaivinimas“ gali sukelti nekontroliuojamą

failų dydžiai

, nes kiekvienas tokio krūvos „lygis“ yra atskiras GIF vaizdas, todėl įprasta 15 kadrų per sekundę kompiuterinei animacijai gali sukurti nesuskaičiuojamą kiekį kilobaitų.

Kartu su Java arba JavaScript galite sukurti interaktyvią animaciją, kuri reaguos į vartotoją. Dabar pažvelkime į kitus žiniatinklio animacijos ir interaktyvios vartotojų sąveikos sprendimus, o pagrindinį vaidmenį čia ir toliau vaidina Macromedia, kuri jau seniai įžengė į rinką su savo Shockwave ir Flash programomis ir nuolat tobulina savo produktus, didindama jų efektyvumą pagal. atsižvelgiant į vartotojų ir dizainerių poreikius. sukurti animaciją ir paskelbti ją tinklalapyje. „Shockwave Flash“ sukuria labai mažus failus (nes daugiausia naudojamas vektorinio vaizdavimo formatas) ir, palyginti su kitais formatais, yra patogiausias paruošimo požiūriu.

Skelbdami tokią animaciją savo puslapiuose, nepamirškite apie tai pranešti vartotojui, kad jis iš anksto galėtų sukaupti papildomą modulį ir pasiruošti varginančiam atsisiuntimo laukimui. Tačiau naujausios „Netscape Navigator“ ir Internet Explorer net pagrindiniame pakete yra „Flash“ animacijų peržiūros moduliai. „Netscape“ patvirtino, kad būsimose „Navigator“ versijose bus palaikoma „Flash“, net ir kodo lygiu.

Galutinis sprendimas yra jūsų

Taigi keičiasi požiūris į Web turinio pateikimą, atsiranda naujų duomenų formatų ir juos palaikančių kūrimo priemonių. Tačiau senesni formatai (GIF ir JPEG grafikai pateikti) vis dar gana populiarūs. Juos palaiko beveik visos naršyklės, o dauguma kūrėjų turi didelę darbo su jomis patirtį. Svarbu naudoti konkrečiam tikslui tinkamą formatą, kad būtų užtikrinta vaizdo kokybės ir failų dydžių pusiausvyra. Pavyzdžiui, vienas vaizdas GIF formatu gali užimti daugiau vietos ir gauti prastesnės kokybės rezultatą nei JPEG formatu, o kito – priešingai.

Tačiau, vaizduojant taškinius vaizdus, ​​PNG tampa pirmenybė, o jei einate dar toliau ir bandote naudoti vektorinis vaizdas, tada šiandien Macromedia Shockwave Flash formatas yra jūsų paslaugoms.

SWF (Shockwave Flash) formatas nėra dažnai naudojamas, o vidinis vektorinis formatas Flash programos iš Macromedia (žr. „Macromedia Flash Lessons“ kompaktiniame diske), todėl norėdami gauti savo vaizdą ar animaciją, turėsite įsigyti atitinkamą multimedijos paketą iš Macromedia, o vartotojas turės įdiegti papildomą modulį vizualizuoti rezultatas.

Taigi, norėdami tiesiog patalpinti vektorinį vaizdą savo tinklalapyje, turėsite įveikti daugybę nepatogumų.

Tačiau kiti vektoriniai formatai yra kelyje ir netrukus taps standartais.

ComputerPress 5"1999

Yra du išdėstymo būdai grafiniai vaizdai puslapyje:

• atskirų paveikslėlių įterpimas;
• fono užpildymas paveikslėliu.

Bet kokiu atveju grafinis vaizdas paimtas iš failo.

Grafikos įterpimas

Grafinis vaizdas iš grafinio formato failo į puslapį įterpiamas naudojant žymą (iš anglų kalbos, vaizdas - vaizdas), kaip argumentą nurodant failo adresą SRC atributas:

< IMG SRC = "адрес_графического_файла" >

Grafinio failo adresas yra URL arba failo pavadinimas, galbūt su keliu. Pavyzdžiui, norėdami parodyti grafinį failą logotip.jpg, turėtumėte parašyti žymą:

< IMG SRC = "logotip.jpg" >

Padidinti žymoje esančio grafinio vaizdo perdavimo greitį galite naudoti atributą ( papildomas parametras) LOWSRC, kuris kaip argumentą priima grafinio failo adresą. Galite sukurti du grafinius failus: viename (pavyzdžiui, logotipas.jpg) yra didelės raiškos vaizdas, o kitame (pavyzdžiui, logotipas.gif) – mažos raiškos vaizdas. Tada žyma:

< IMG SRC = "logotip.jpg" LOWSRC = "logotip.gif" >

...paveda naršyklei pirmiausia atsisiųsti logotip.gif failą, o tada jį gavus pakeisti logotipu.jpg failu.

Kitas būdas pagreitinti grafikos įkėlimą yra nustatyti stačiakampio ploto, kuriame bus įdėta grafika, dydį naudojant atributus PLOTIS(plotis) ir AUKŠTIS(aukštis), matuojamas pikseliais. Jei nurodysite šiuos atributus, naršyklė pirmiausia paskirs vietos grafikai, paruoš dokumento maketą, atvaizduos tekstą ir tik tada įkels grafiką. Atminkite, kad naršyklė suspaudžia arba ištempia vaizdą, kad tilptų į nurodytą rėmelio dydį. Vaizdo matmenų nustatymo pavyzdys:

< IMG SRC = "logotip.gif" WIDTH = 40 HEIGHT = 20 >

Grafika dažniausiai naudojama kartu su tekstu, todėl iškyla teksto ir grafikos derinimo problema. Ši problema išspręsta naudojant atributą LYGIUOTIžyma naudojant įvairius argumentus. Pavyzdžiui, galime norėti, kad tekstas tekėtų aplink paveikslėlį į dešinę arba į kairę. Paprastai paveikslėlis yra glaudžiai įtrauktas į tekstą, kuris gali būti negražus. Norėdami to išvengti, aplink iliustraciją galite nustatyti tuščias paraštes. Laukai kuriami naudojant atributus VSPACE viršutinei ir apatinei paraštėms ir ERDVĖžymos šoninėms paraštėms . Šių atributų argumentai nurodomi kaip skaičiai, nurodantys laukų dydį pikseliais. Norėdami atšaukti teksto apvyniojimą aplink grafiką, naudokite žymą
.

Ši žyma nustato logotipo.jpg failo grafiką į dešinę (vaizdas bus teksto kairėje):

< IMG SRC = "logotip.jpg" ALIGN = LEFT >

Jei norite įdėti vaizdą teksto dešinėje, jums reikia atributo LYGIUOTI priskirti argumentą TEISINGAI:

< IMG SRC = "logotip.jpg" ALIGN = RIGHT >

Norėdami nustatyti paraštes aplink vaizdą, turite parašyti tokią žymą:

< IMG SRC = "logotip.jpg" ALIGN = LEFT HSPACE = 20 VSPACE = 10 >

Čia skaičiai 20 ir 10 nustato laukų dydį.

Pažiūrėkime į pavyzdį dalijimasis grafika ir tekstai. Atidarykite užrašų knygelę ( teksto redaktorius Notepad) Windows. Įrašykite jame HTML kodą naudodami aukščiau aptartas žymas. Žemiau yra programa, kuri išveda tekstą ir grafiką. Kaip grafinį failą galite naudoti bet kurį iš turimų failų. Čia naudojamas failas logotip.gif.

< HTML >

< HEAD >

< TITLE >1 pratimas< / TITLE >

< / HEAD >

< BODY BGCOLOR = "YELLOW" >

< IMG SRC = "logotip.gif " ALIGN = LEFT >

< H1 >Tekstas apgaubia grafiką dešinėje< / H1 >

Suteikia plačias galimybes tiksliai išdėstyti paveikslėlius (kaip ir kitus elementus) puslapyje lenteles Ir stiliai. Šios HTML elementai bus aptarta vėliau. Pavyzdžiui, galite apibrėžti lentelę be matomų rėmelių, o šios lentelės langeliuose dėti paveikslėlius, tekstus ir kitus elementus.

Spalvos lentelėje

Kaip sukurti lentelę puslapyje

Sąrašai sąrašuose

Apibrėžčių sąrašai

Sunumeruotas sąrašas

Sąrašas su ženkleliais

Kaip sukurti sąrašą puslapyje

Yra trys pagrindiniai sąrašų tipai: su ženkleliais, sunumeruoti ir apibrėžimų sąrašai. Pagrindinis skirtumas tarp išvardytų tipų yra numeravimo metodas ir struktūra.

Dažniausiai naudojamas nenumeruotas arba ženklelių sąrašas. Sąrašas su ženkleliais nurodomas žymomis, o sąrašo elementai tarp šių žymų nurodomi žyma