Multimedia opetusohjeet - kuvien käyttö Webissä

Tämä artikkeli selittää yksityiskohtaisesti, missä olosuhteissa kuvia ja tekstiä käytetään, miten kuvien latausta voidaan nopeuttaa sekä miten voidaan valita sopiva kuvamuoto.

Kun kuvaa käytetään

Useimmille kuville yksi kuva voi puhua tuhat sanaa. On kuitenkin huomattava, että kukaan ei kiinnitä huomiota puhuviin ihmisiin. Ensimmäinen ja tärkein asia on, että dokumentin grafiikkaa käytetään visuaalisena työkaluna eikä sen vuoksi ilman syytä. Ne tulisi tukea tekstisisältöä ja auttaa lukijaa navigoimaan dokumentissa. Kuvien käyttö tekee dokumentin sisällöstä selkeämmän ja voi lisätä huomautuksia tai esimerkkejä. Tukemaan sisältöä ovat luonnollisesti ja sopivasti valinnat kuten valokuvat, kaaviot, kurvagramit, kartat ja piirrokset. Esimerkiksi tuotteiden valokuvat ovat erittäin tärkeitä osia verkkokatalogeissa ja ostosoppaissa. Myös linkkejä sisältävät ikonit ja painike symbolit, mukaan lukien animaatioilla varustetut kuvat, voivat olla erittäin tehokkaita ohjausvisuaaleja sisältöä tai ulkoisia resursseja varten. Jos jokin kuva ei ole millään tavalla edistänyt dokumenttia, sen tulisi heittää pois!

Kun harkitaan dokumenttiin lisättävää kuvaa, toinen tärkeä huomio on, että kuvien hakemisesta aiheutuvat viiveet, kun dokumentti siirretään verkossa, erityisesti modeemin kautta. Yleinen dokumentti voi sisältää enintään 10-15 kilobyttia, kun taas kuva voi helposti olla satoja kilobyttejä suurempi. Lisäksi dokumentin kokonaislatausaika ei ole vain sen kaikkien osien summa, vaan myös otettava huomioon verkon kuormituksen aiheuttamat viiveet.

Yhteyden nopeuden (eli宽带) mukaanbandwidthYleensä nopeus ilmaistaan bps:illä tai b/s:illä) ja mahdollisesti hidastaa yhteyden nopeutta verkkojärjestelmän ruuhkautumisesta, mahdollisesti aamulla kello 1-2, kun suurin osa ihmisistä nukkuu, yhden 100 KB:n kuvan sisältävän tiedoston lataaminen 57,6 Kbps:n modemia käyttäen kestää noin 15 sekuntia, tai keskellä päivää 9600 bps:n modemia käyttäen voi kestää yli 10 minuuttia. Saitko tämän kuvan?

Totta kai, kuvien ja muiden multimediatietojen käyttö kannustaa Internet-palveluntarjoajia jatkuvasti kehittämään nopeampia, parempia ja vakaampia tapoja tarjota Web-sisältöä. Pian 56 Kbps -modemiyhteydet jäävät historiaan (kuten 9600 bps -modemit), ja ne korvataan uusilla tekniikoilla, kuten kaapelimodemilla ja ADSL:llä. Itse asiassa useimmat yhteydet ylittävät pian 1 Mbps -nopeuden.

Hinnan laskiessa verkon käyttö lisääntyy jatkuvasti, mikä tuo mukanaan ruuhkautumisongelmia. Jos yrität käyttää ylikuormitettua palvelinta, niin nopeastaan riippumatta verkkoyhteyksistäsi, et voi suorittaa tätä toimintaa oikein.

Kun käyttää tekstiä

Teksti ei ole vanhentunut. Jotkut käyttäjät voivat käyttää vain tekstejä asiakirjoissaan. Suosittelemme, että useimmissa tapauksissa asiakirjojen tulisi olla kaikkien saatavilla, mukaan lukien ne, jotka eivät voi selata kuvia tai jotka ovat otettu pois selaimen automaattisen kuvien latauksen toiminto. Vaikka kuvien lisääminen asiakirjaan voi olla erittäin välttämätöntä, joskus puhtaan tekstitiedoston käyttö voi olla merkittävämpi.

Muista muotoja muutettuna verkkosivuiksi olevat asiakirjat sisältävät harvoin sisäänrakennettuja kuvia, ja viittaukset ja muut vakavat sisällöt ovat yleensä täysin käytettävissä puhtana tekstinä.

Kun nopeus on erittäin tärkeää, tulisi luoda puhtaita tekstitiedostoja. Jos tiedät, että käyttäjät saattavat kiirehtiä asiakirjasi noutamista, tulisi välttää kuvien käyttö asiakirjassa, jotta voidaan mukautua näiden käyttäjien tarpeisiin. Joissakin äärimmäisissä tapauksissa voi tarjota etusivun (ohje sivun), jossa käyttäjät voivat valita teoksensa kaksi versiota: yksi sisältää kuvia ja toinen ei (yleiset selaimet ovat varustettu erityisillä kuvakkeilla, jotka varataan ladataan tulevia kuvia varten, ja nämä paikannimet voivat häiritä asiakirjan asettelua jopa niin paljon, että se muuttuu lukemattomaksi).

Jos haluat, että asiakirjasi on helppo löytää Internetissä olevista lukuisista hakupalveluista, teksti on paras muoto - yksinomaan tuki kuville, ei koristeluja tai tarpeettomia grafiikoita. Mutta nämä hakukoneet yleensä ohittavat kuvien olemassaolon. Jos sivun pääasiallinen sisältö tarjotaan kuvina, asiakirjaasi liittyvä tieto verkkojen hakemistossa on usein vähäistä.

Kuvien latausnopeuden nopeuttaminen

Paitsi huolellisesta valinnasta, mitä sisällytetään asiakirjaan, on monia tapoja parantaa kuvista aiheutuvaa kuormitusta ja viiveongelmia:

Pysy yksinkertaisuudessa

Täysin näyttöinen 24-bittinen värikäs kuva vie edelleen suuren osan verkkobandwiddestä, vaikka sen koko pienenee standardeissa (esim. GIF tai JPEG). Siksi on parasta käyttää erilaisia kuvien hallintatyökaluja optimoidaksesi kuvien mittoja ja vähentää värimääriä mahdollisimman pienelle kuvapikseleille. Yksinkertaista piirrustustasi, älä käytä maisemia ja vältä suuria tyhjiä taustapohjia, tarpeettomia reunuksia ja muita tilaa vieviä elementtejä. Vältä myös häiriötekstejä (sekaisin sekoitettu kaksi lähellä olevaa väriä saadakseen kolmannen väri), koska tämä teknologia voi merkittävästi vähentää kuvan kompressiokykyä. Päinvastoin, käytä mahdollisimman paljon suuria yhtenäisiä värejä, koska GIF- tai JPEG-muodot ovat helppoja kompressoida.

Kuvien uudelleenkäyttö

Tämä pätee erityisesti kuvakkeisiin ja GIF-animointeihin. useimmat selaimet tallentavat paikalliselle tallennusvälineelle tuodut asiakirjainholeet välimuistiin, mikä mahdollistaa nopeamman tiedon saamisen ja vähemmän käytettyjen verkkoyhteyksien määrän. Pikku GIF-animointifilejä varten on hyvä valmistaa jokainen jatkuvan kuvan sarja, jotta vain ne osat päivitetään, jotka muuttuvat animaation aikana, eikä koko kuvaa päivitetä (tämä voi myös nopeuttaa animaation omaa näyttämistä).

Suuren asiakirjan jakaminen osiin

Tämä on yleinen periaate kuvien sisällyttämisessä. Monet pienet asiakirjapiirteet ovat järjestetty yhteen hyperlinkkien (totta kai!) ja tehokkaan hakemiston avulla, mikä tekee käyttäjälle helpommaksi hyväksyä kuin koko suuri asiakirja. Yleisesti ottaen ihmiset haluavat selata useita sivuja, eivät heidän aikaa tuhlaa odottaa suuren asiakirjan lataamista (tämä muistuttaa TV-kanavien selailusyndroomaa). Hyvä kokemus on pitää jokainen asiakirja noin 50 KB:n suuruisena, jotta lukijat eivät tunne ärsyttävää, vaikka he käyttävät hitaampaa yhteyttä.

Isolaation tarpeen mukaan suuri kuva

Tarjoa suuri kuva erityiselle linkille, joka voi olla kuvan tiivistelmä, jotta lukija voi päättää, haluaako hän ladata koko kuvan ja milloin. Lisäksi tällaiset kuvat eivät ole sisäänrakennettuja kuvia samalla tavalla kuin asiakirjan muut elementit, joten ne ovat helposti tunnistettavissa ja tallennettavissa paikalliselle tallennusvälineelle tulevaa tutkimusta varten.

Määritä kuvan mitat

Lopuksi, toinen tapa parantaa suorituskykyä on sisällyttää kuvan reunan korkeus ja leveys sen merkintään. Näiden mittojen määrittämisen avulla voidaan välttää joitakin muita lisävaiheita, eikä laajennettujen toimintojen selaimen tarvitse enää suorittaa lisävaiheita kuvan kokoonpanon lataamiseksi, tarkistamiseksi ja laskemiseksi asiakirjassa. Tämä menetelmä on kuitenkin epäedullinen. Jos käyttäjä sulkee automaattisen kuvien latauksen toiminnon, selain näyttää edelleen kuvan varattu tila määritettyjen mittojen mukaisesti. Tämä jättää lukijalle yleensä tyhjän kehikon, vaikka tähän ongelmaan ei ole vielä ratkaisua, kannustamme silti käyttämään näitä mittojen ominaisuuksia, koska kannustamme kaikkea, mikä parantaa verkkosuorituskykyä.

JPEG vai GIF?

Jos kuvien lähde tai työkalusi ohjelmisto suosii tiettyä muotoa, voit käyttää vain yhtä JPEG- tai GIF-kuvasta. Nyt molemmat muodot ovat saavuttaneet laajan tuen selaimissa, joten ei ole kysymys siitä, voivatko käyttäjät selata niitä.

Kuitenkin suosittelemme, että käytät työkaluja luodaksesi tai muuntamaan näitä muotoja, jotta voit hyödyntää niiden omia ominaisuuksia parhaalla mahdollisella tavalla. Esimerkiksi, voit käyttää GIF:n läpinäkyvyyttä ikoneissa ja pienissä koriste-esineissä. Käytä JPEG:iä suurten, värikäsien kuvien kompressointiin nopeuttaaksesi latausnopeutta.

<img> -tagi

<img> -tagi mahdollistaa grafiikkakuvien viittauksen tai lisäämisen dokumentin nykyiseen dokumenttiläjään. Lisätietoja tästä tagista löydät tarkemmin: