A modern lapok és kijelzők úgy vannak kialakítva, hogy teljes mértékben reagáljanak az összes eszközön, ami azt jelenti, hogy a kijelzőkben használt képek méretezése eltérő lesz attól függően, hogy hol jelenítik meg őket, milyen elrendezést használnak, és milyen eszközön nézik meg őket. A modern weblapok például úgy vannak kialakítva, hogy nagyszerűen nézzenek ki a mobileszközökön, az automatikus képméretezés pedig segít megteremteni ezt a vonzó élményt.
Mely képméretek működnek a legjobban?
A rugalmas lapterv miatt nincs megadva egy adott képpontmagasság vagy -szélesség, amely biztosítaná, hogy egy kép megőrizze egy adott alakját a különböző eszközökön és elrendezéseken. A rendszer automatikusan átméretezi és körülvágja a képeket, hogy a lehető legjobb eredményt nyújtsa számos különböző eszközön és elrendezésben. Van azonban néhány irányelv, amellyel biztosíthatja, hogy képei nagyszerűen jelenjenek meg a lapjain.
A laphoz leginkább illő képméretek kiválasztása az alábbi tényezőktől függ:
- Oldalarány: a képek magassága és szélessége közötti kapcsolat.
- Hasábelrendezés: az oldalon található hasábok típusa és száma
- A kijelző elrendezése: az a elrendezés, amelyet ahhoz a kijelzőhöz választ, amelyben a képet használni szeretné
Méretarány
A méretarány a képek szélességének és magasságának kapcsolata. Általában két számmal fejezik ki (például 3:2, 4:3 vagy 16:9). A szélesség mindig az első szám. A 16:9 arány például 1600 képpont szélességű és 900 képpont magas lehet. Vagy lehet 1920 x 1080, 1280 x 720 vagy bármilyen más olyan szélesség-magasság kombináció, amely 16:9 méretaránynak számítható. Az online és néhány fényképszerkesztő eszközben oldalarány-kalkulátorok segítenek a képek oldalarányának meghatározásában.
A legtöbb esetben a modern kijelzőkben lévő képek akkor működnek a legjobban több elrendezésben vagy eszközön, ha a méretarányuk az elrendezéstől függően 16:9 vagy 4:3.
Hasábelrendezések
A lapelrendezést különböző hasábtípusú és elrendezésű szakaszokra lehet felépíteni, például teljes szélességű hasábokat, egy hasábot, két hasábot, három hasábot, egyharmad bal oldali és egyharmad jobb oldali hasábokat. Az oszlopszélességet várhatóan kitöltő képekre vonatkozó általános szabály az, hogy legalább akkora szélességűek legyenek, mint az az oszlop, amelyben el vannak helyezve. Egy Kép kijelzőn szereplő képnek például az egyik oszlopban legalább 1204 képpont szélességűnek kell lennie.
Az alábbiakban az egyes hasábelrendezések szélességére vonatkozó irányelvek találhatók:
| Elrendezés | Szélesség képpontban |
|---|---|
| Teljes szélességű oszlop | 1920 |
| Egy hasáb | 1204 |
| Két hasáb | 586 oszloponként |
| Három oszlop | 380 oszloponként |
| Egyharmad bal oszlop | 380 a bal oldali oszlophoz; 792 a jobb oldali oszlophoz |
| Egyharmad jobb oszlop | 792 a bal oldali oszlophoz; 380 a jobb oldali oszlophoz |
A lapok rugalmas jellege miatt a teljes szélességű oszlopokban lévő képek mindig a képernyő teljes szélességében jelennek meg, a képernyő méretéhez igazodó automatikus magassággal.
Az egyéb hasábelrendezésekben elhelyezett képek magassága a méretaránytól függ. Az alábbiakban a 16:9 és a 4:3 méretarányra vonatkozó magasság/szélesség arányra vonatkozó irányelveket találja (felfelé/lefelé kerekítve a legközelebbi képpontra). Ez akkor hasznos, ha a képeket a mobileszközökhöz méretezhetőnek megfelelően szeretné tartani, ilyenek például az alábbiak:
| MÉRETARÁNY ELRENDEZÉS |
16 x 9 Szélesség x Magasság képpontban |
4 x 3 Szélesség x Magasság képpontban |
|---|---|---|
| Egy hasáb | 1204 x 677 | 1204 x 903 |
| Két hasáb | 586 x 330 | 586 x 439 |
| Három oszlop | 380 x 214 | 380 x 285 |
| Egyharmad bal oszlop | 380 x 446 a bal oldali oszlophoz; 792 x 446 a jobb oldali oszlophoz | 380 x 594 a bal oldali oszlophoz; 792 x 594 a jobb oldali oszlophoz |
| Egyharmad jobb oszlop | 792 x 446 a bal oldali oszlophoz; 380 x 446 a jobb oldali oszlophoz | 792 x 594 a bal oldali oszlophoz; 380 x 594 a jobb oldali oszlophoz |
Kijelzőelrendezések
A használt kijelzők elrendezése szintén befolyásolja a képek méretezését. Az alábbi példák különböző kijelzőket, valamint néhány használható beállítást és méretarányt mutatnak be.
| Fő kép kijelző | A Csempék és rétegek elrendezések oldalarányai a következők:
|
| Kiemelt tartalom kijelző | A Körhinta, a Filmszalag és a Rács elrendezés méretaránya a 16:9. Lássunk egy példát a 16:9 oldalarányra. Az első képen a Filmszalag elrendezés, a másodikon pedig a Rács elrendezés látható: 
|
| Kép kijelző | A képek mérete a kijelzőt tartalmazó szakasz szélességéig terjed. Íme egy példa a Kép kijelzőben lévő 16:9 oldalarányú képre. 
A képszerkesztő eszközzel módosíthatja a méretarányt vagy szabadkézi körülvágást is végezhet, illetve a méretezőpontok segítségével növelheti vagy csökkentheti a kép méretét. 
|
| Képgyűjtemény kijelző | A következő méretarányok használhatók a különböző elrendezésekben:
|
| Hírek kijelző | Az elrendezéstől függően a képek 4:3, 16:9 vagy 21:9 méretűek lehetnek a Hírek kijelzőben. Íme egy példa a felső történet és a körhintanézet képeire: 
|
| Lap címterülete | Fekvő, illetve 16:9 vagy nagyobb méretarányú képek akkor mutatnak a legjobban, ha legalább 1 MB méretűek. Állítson be egy fókuszpontot is a kép legfontosabb részének szem előtt tartásához, különösen akkor, ha a képet miniatűrökben, hírelrendezésekben és keresési eredményekben használja. Példa (eredeti kép 16:9-es oldalarányban), amelyben fókuszpont van beállítva a hangszórón: 
|
| Lap miniatűrje | A lapok miniatűrjei olyan helyeken jelennek meg, mint a keresési eredmények, a kiemelt tartalomtalálatok, a hírek és egyebek. Alapértelmezés szerint a miniatűr a lap címterületéről vagy a lap első sorrendjében lévő kijelzőből (például az oldalelrendezés bal felső részéből) származik. Felülbírálhatja az alapértelmezett beállítást, és módosíthatja az oldal miniatűrjét. Ilyenkor a legjobb, ha 16:9-es méretarányú képet használ. Példa (eredeti kép 16:9): 
|
| Gyorshivatkozások kijelző | A Gyorshivatkozások kijelzőnek hat különböző elrendezése van. Az előre beállított méretarányok a következők:
|
Tipp:
Amikor egy lap címterületéhez vagy a Fő kép kijelzőhöz ad hozzá képet, célszerű a fókuszt a mindig megjeleníteni kívánt kép területére állítani. Ha többet szeretne megtudni a fókuszpont beállításáról ebben a két forgatókönyvben, olvassa el A Fő kép kijelző használata és A Modern lapok létrehozása és használata egy SharePoint-webhelyen című témakört.
Javaslatok a webhelyfejléc képére
A lapok mellett előfordulhat, hogy egyéni emblémákat vagy képeket szeretne hozzáadni bővített elrendezésben. Az alábbiakban méretekre vonatkozó javaslatokat talál ezekhez az elemekhez.
| Elem | Leírás | Javaslat Szélesség x Magasság képpontban |
|---|---|---|
| Webhelyembléma | Nagyobb embléma, amely a feltöltött tervtől függően lehet nem négyzet alakú és átlátszó. | 192 x 64 Formátum: PNG, JPEG, SVG (SVG nem engedélyezett csoporthoz csatlakoztatott webhelyeken) |
| Webhelyembléma miniatűrje | Négyzet alakú embléma miniatűrje, amely akkor szükséges, ha nincs feltöltve webhelyembléma, illetve ha négyzetes formátumot kell beállítani. Ez az elem kötelező. |
64 x 64 Formátum: PNG, JPEG, SVG (SVG nem engedélyezett csoporthoz csatlakoztatott webhelyeken) |
| Bővített elrendezésű webhelyembléma | A kiterjesztett fejléc-elrendezés kiterjesztett szélességű webhelyemblémával rendelkezik. | 300 x 64 Formátum: JPEG, PNG, SVG |
| Bővített elrendezés háttérképe | Új háttérkép, amely a kibővített élőfejjel használható. | 2560 x 164 Formátum: JPEG, PNG |