Ositusten yleiskatsaus

Kun suunnittelet grafiikkaa verkkoon, kuvan eri osien on usein toimittava itsenäisesti.Yksi alue voi linkittyä URL-osoitteeseen, toinen voi latautua nopeammin ja kolmas voi tarvita erilaiset parannusasetukset.Ositukset jakavat yhden kuvan ruudukoksi pienempiä osia, jotka toimivat yhdessä verkkosivuna, mutta joista jokaista voidaan hallita erikseen.

Photoshop koostaa ositetut kuvat verkkosivuille HTML-taulukoiden tai CSS-tasojen avulla.Kun viet ositetun kuvan komennolla Tiedosto > Vie > Tallenna verkkoon, Photoshop tallentaa kunkin osituksen erillisenä tiedostona.Se luo myös HTML- tai CSS-koodin, joka tarvitaan kuvan näyttämiseen yhtenä kokonaisuutena selaimessa.

Miten ositukset toimivat

Ositukset jakavat kuvan näkymättömien ruudukkoviivojen mukaan suorakulmaisiin osiin, jotka toimivat itsenäisinä tiedostoina.Jokainen ositus säilyttää paikkansa kokonaisasettelussa, mutta toimii samalla erillisenä elementtinä, jolla on omat ominaisuudet, parannusasetukset ja toimintatavat.

Tällä menetelmällä on muutamia käytännön etuja:

• Luo napsautettavia navigointielementtejä määrittämällä eri URL-linkit
• Tasapainota laatua ja tiedostokokoa eri alueilla erilaisilla pakkausasetuksilla
• Päivitä yksittäisiä osia viemättä koko kokonaisuutta uudelleen

Ositustyypit luontitavan mukaan

Photoshop luokittelee ositukset niiden luontitavan perusteella, ja jokainen tyyppi toimii eri tavalla kuvaa muokattaessa.

• Käyttäjän ositukset: Osat, jotka määrität itse Ositus -työkalulla.Voit hallita täysin niiden kokoa, sijaintia ja ominaisuuksia, ja ne pysyvät paikoillaan, kunnes siirrät tai muokkaat niitä.
• Tasoihin perustuvat ositukset: Ositukset sisältävät kaikki tason pikselit.Niiden rajat päivittyvät automaattisesti, kun siirrät tai muokkaat tasoa.Ne toimivat hyvin usein muuttuvalle sisällölle, mutta tarjoavat vähemmän hallintaa tarkkaan sijoitteluun kuin käyttäjän ositukset.
• Automaattiset ositukset: Ositukset, jotka täyttävät kuvan jäljellä olevan tilan, jota käyttäjän ositukset tai tasoihin perustuvat ositukset eivät kata.Photoshop luo nämä automaattisesti ja luo ne uudelleen aina, kun lisäät, poistat tai muokkaat muita viipaleita.Kaikilla kuvan automaattisilla osioilla on samat parannusasetukset.
• Aliosiot: Erikoistunut automaattisen osion tyyppi, joka näkyy, kun osiot menevät päällekkäin. Aliosiot näyttävät, miten Photoshop jakaa päällekkäiset alueet, kun tallennat parannetun tiedoston. Aliosioita ei voi valita tai muokata erillään niiden taustalla olevista osioista.

Osion tyyppi sisällön mukaan

Osiot luokitellaan myös niiden sisältämän sisällön tyypin mukaan.

• Kuvaosiot: Visuaalisen sisällön oletusosiotyyppi, joka sisältää kuvatietoja Photoshop-asiakirjastasi.
• Ei-kuvaosiot: Tyhjiä taulukon soluja HTML-tekstiä tai tasavärejä varten.Photoshop ei vie näitä kuvatiedostoina, joten ne sopivat hyvin elävälle, valittavalle tekstille.
• Taulukko-osiot: Osiot, jotka määrittävät, miten Photoshop rakentaa HTML-taulukon, jota käytetään osioidun kuvan kokoamiseen selaimessa.

Osioiden visuaaliset vihjeet

Photoshop käyttää visuaalisia merkkejä, jotta erotat osiotyypit toisistaan työskennellessäsi.

• Osioviivat: Yhtenäiset viivat merkitsevät käyttäjän osioita tai tasopohjaisia osioita, ja katkoviivat merkitsevät automaattisia osioita.
• Osioiden värit: Siniset symbolit ilmaisevat käyttäjän osioita ja tasopohjaisia osioita, ja harmaat symbolit merkitsevät automaattisia osioita.
• Osionumerot: Kunkin osion vasemmassa yläkulmassa olevat numerot etenevät vasemmalta oikealle ja ylhäältä alas, ja ne päivittyvät automaattisesti, kun järjestät osioita uudelleen tai muokkaat niitä.
• Osiotunnukset: Pienet kuvakkeet ilmaisevat osion sisällön ja tyypin. Esimerkiksi kuvake merkitsee käyttäjän osiota, jossa on kuvasisältöä, yliviivattu kuvake merkitsee käyttäjän osiota, jossa ei ole kuvasisältöä, ja tasokuvake merkitsee tasopohjaista osiota.

Kun tunnistat nämä visuaaliset erot, löydät osiotyypit nopeasti ja työskentelet tehokkaammin monimutkaisten osioasettelujen kanssa, kun osioit verkkosivuja.