INHOUDSOPGAWE:

Afmetings van leerbare beelde: 13 stappe
Afmetings van leerbare beelde: 13 stappe

Video: Afmetings van leerbare beelde: 13 stappe

Video: Afmetings van leerbare beelde: 13 stappe
Video: Kleuters op familiefeest 😂 2024, November
Anonim
Afmetings van instruksionele beelde
Afmetings van instruksionele beelde

Het u probleme om die beelde korrek te grootte? Is u beelde te groot en loop die raam oor soos die hierbo? Hierdie opdragbare pogings om op te som wat ek geleer het om hierdie probleem op te los.

Deur instruksionele personeel is ek meegedeel dat alle opgelaaide beelde in verskillende aspekverhoudings gedupliseer word. Hierdie poel beelde word dan van verskillende grootte getrek, afhangende van watter toestel u die instruksies bekyk. Daar is geen manier om in die gewone redakteur te spesifiseer watter grootte en verhouding dit moet vertoon nie.

Hulle het toe voorgestel dat "'n Ander opsie wat kan werk, is as u beelde oplaai wat 'n meer tradisionele aspekverhouding het. Alles van 16: 9 tot 4: 3 moet baie mooi vertoon."

Let op dat hulle sê dat dit 'mag' werk. Hier is wat ek gevind het in my stryd om my beelde ordentlik te laat vertoon. (Let op: ek gebruik beelde van my "maklik gemaakte Rubik -kubus", dus al die kubusbeelde!)

Die foto hierbo is die oorspronklike grootte (600x195), wat nie in die reeks tradisionele aspekverhoudings is nie. Soos u kan sien, vertoon Instructables hierdie prentjie te groot, met die linker- en regterkant afgesny. Kom ons kyk wat ons kan doen om hierdie beeld behoorlik te vertoon.

Stap 1: Kom ons probeer 16: 9 -aspekverhouding

Kom ons probeer die aspekverhouding van 16: 9
Kom ons probeer die aspekverhouding van 16: 9

Kom ons probeer die 16: 9 (breedte: hoogte) aspekverhouding. Ek hou die oorspronklike breedte van 600 pixels, 16: 9 beteken dat die hoogte 338 pixels moet wees, so ons maak 'n doekgrootte van 600x338 en gooi die 600x195 -prent daarin.

Laat ons dus kyk hoe hierdie 600x338 (16: 9 aspekverhouding) beeld lyk. Dit is interessant dat dit perfek pas toe ek hierdie prentjie ingooi en 'n voorskou daarvan kry - die linker- en regterkant is nie afgesny nie! Ek het 'n kiekie daarvan geneem net as bewys, sien dit in die volgende skyfie.

Maar as ek dit in my blaaier (Chrome) sien, wat ek in die prent hierbo sien, is dat die regter- en linkerkant weer afgesny is! Uit hierdie eksperiment blyk dit dus dat die grootte van 'n 16: 9 -verhouding nie ons probleme gaan oplos nie!

As 'n bykomende opmerking, 16: 9 is die 'nuwe' algemene aspekverhouding, bekend as 'widescreen', terwyl 4: 3 die 'volle skerm' van die ou skool is wat in die televisiedae gereeld gebruik is. Ja, jy duisendjarige het waarskynlik nie 'n idee waarvan ek praat nie.

Stap 2: 16: 9 Prent vars opgelaai soos in die voorskou gesien

16: 9 -prentjie vars opgelaai soos in die voorskou gesien
16: 9 -prentjie vars opgelaai soos in die voorskou gesien

Hierdie foto is die skermopname wat wys dat ons 16: 9 -beeld perfek lyk in die voorskou. Sukses reg? Wel, nie so vinnig nie - kyk wat gebeur as ons hierdie bladsy eintlik in ons blaaier (Chrome) sien! Die linker- en regterkant word weer afgekap! Gaan net terug om die vorige skyfie te laat kyk en kyk self.

Les geleer - moenie die Voorskou vertrou nie! Wat goed lyk in die voorskou, word anders weergegee in werklike kyk met 'n blaaier!

Ja, daar is baie wit ruimte onder my beeld. Dit is omdat ek 'n 600x195 -beeld in 'n 600x338 -doek laat val het en dit bo -aan gesit het, so daar is al die leë wit spasie onderaan. Wat kan ons daaraan doen? Wel, ons sal probeer om dit in 'n latere skyfie aan te spreek.

Laat ons dus aanhou kyk hoe ons hierdie beeld in sy geheel kan vertoon.

Stap 3: 16: 9 vertoon met L & R -kante afgesny

16: 9 vertoon met L & R -kante afgesny
16: 9 vertoon met L & R -kante afgesny

Net vir die rekord, as u blaaier hierdie 16: 9 -beelde om watter rede ook al perfek vertoon, is dit waaroor ek praat. Hier is 'n skermkiekie van hoe ek my 16: 9 -beeld in stap 1 sien vertoon nadat ek 'ingetrek' het na die aanvanklike voorskou - let op dat links en regs afgesny is.

As u sien dat my stap 1 -beeld perfek vertoon word, wel, wonderlik. Laat my weet! Maar dit is hoe ek dit sien. Ja, dit is baie beter as die oorspronklike prent van die titelblad, maar dit is steeds afgesny. Dus, ten spyte van die advies van die personeel van Instructables, het die beeldverhouding van 16: 9 dit nie heeltemal verminder nie. Kom ons gaan na die aspekverhouding 4: 3.

Stap 4: Kom ons probeer 4: 3 -aspekverhouding

Kom ons probeer 4: 3 -aspekverhouding
Kom ons probeer 4: 3 -aspekverhouding

Laat ons dus die 4: 3 -aspekverhouding probeer. Ek hou die oorspronklike breedte van 600 pixels, 4: 3 beteken dat die hoogte 450 pixels moet wees, sodat ons 'n doekgrootte van 600x450 maak en die 600x195 -prent daarin laat val.

Hoe lyk hierdie 600x450 (4: 3 aspekverhouding) beeld?

Weereens, as ek dit die eerste keer ingooi, lyk die prentjie goed (behalwe al die wit spasie onderaan). Links en regs word fyn vertoon. As u dit in 'n blaaier bekyk, lyk dit asof regs en links steeds goed vertoon word.

Soos voorheen opgemerk, is al die leë wit spasie onder die prentjie omdat ek my 600x195 -prent in 'n 600x450 -doek laat val het en dit net bo -op geplaas het.

Les geleer - dit lyk asof die beeldverhouding 4: 3 nodig is sodat die regter- en linkerkant nie afgesny word nie. Ongelukkig beteken dit dat daar baie wit ruimte is vir afbeeldings wat kort en breed is, want u moet die beelde in 'n 4: 3 -grootte doek gooi. Ja, u kan u beeld sentreer sodat daar gelyk en wit ruimte aan die bokant en onderkant is, maar ongeag, daar is baie wit ruimte bo of onder u beeld, maar sover ek weet, is dit die kompromie moet in instruksies gemaak word sodat u beelde ongeskonde vertoon.

Stap 5: 4: 3 Met beeld gesentreer

4: 3 Met beeld gesentreer
4: 3 Met beeld gesentreer

Hier is dieselfde 600x195 -prent wat in 'n doek van 600x450 gedruk is, maar in die middel sodat 'n gelyke wit spasie bo en onder is. Dit lyk 'n bietjie beter, die teks lyk nie so ver van die prentjie nie.

Stap 6: 4: 3 Met die prentjie onderaan

4: 3 met die beeld onderaan
4: 3 met die beeld onderaan

En laastens, dieselfde prentjie val in en skuif na onder. Daar is 'n ton leë wit spasie bo -op die prentjie. Die beeld is nou regtig geskei van die titelbalk, maar dit is nader aan die teks. Dit is dus u kompromieë en geleerde lesse:

  • 4: 3 blyk die aspekverhouding te wees wat u moet gebruik om beelde in hul geheel in Instructables te vertoon.
  • moenie die voorskou vertrou nie - dit kan u beeld perfek vertoon, maar dele kan in die werklike blaaier afgekap word

Stap 7: Wat is die minimum breedte?

Wat is die minimum breedte?
Wat is die minimum breedte?

Kom ons kyk nou wat die minimum breedte moet wees. Die prentjie is 382x206, naby 2: 1, dit lyk regtig groot, nie waar nie? Dit is duidelik dat Instructables die beeld vergroot het sodat dit by 'n vaste breedte pas, waarskynlik 640 pixels, ek is nie seker nie.

Maar dit pas wel omdat dit meer 'vierkantig' is - dit wil sê, dit is nie te breed vir sy hoogte nie. O wag, ek is weer mislei deur die voorskou! Dit pas eintlik nie - die R & L -kante word weer afgekap.

Dit is eintlik vreemd, dit is nie net die voorskou wat deurmekaar is nie. Ek het eintlik in die blaaier daarna gekyk en dit is eers behoorlik weergegee (dit wil sê, die R & L -rande is nie afgesny nie). Maar as ek weer deur die blaaier kyk, word die grootte van die beeld nou weergee met die R & L -rande afgeknip. Vreemd.

Laat ons dus probeer om die prentjie kleiner te maak. Ons sal die beeld tot 200x108 krimp, met dieselfde 2: 1 aspekverhouding.

Stap 8: Krimp die beeld, maar behou die beeldverhouding

Krimp die beeld maar behou die aspekverhouding
Krimp die beeld maar behou die aspekverhouding

Dus verander ek die grootte van die prent na 200x108, met dieselfde 2: 1 -aspekverhouding.

Nou lyk dit of dit aanvanklik pas (met die resolusie (beeldkwaliteit) wat aansienlik versleg het!), Maar natuurlik kyk u waarskynlik en dit pas glad nie, en lyk presies soos die oorspronklike beeld, behalwe dat die oorspronklike beter resolusie. Weereens, Instructables brei die beeld uit sodat dit by 'n vaste breedte pas, so daarom lyk hierdie kleiner (200x108) beeld so aaklig, baie erger as die oorspronklike 382x206.

Ek sê 'waarskynlik', want ek het regtig geen idee hoe Instructables hierdie beelde in u blaaier vertoon nie. Om watter rede ook al, as ek my kas herlaai en hierdie Instructable hersien, lyk my beeldgroottes nie konsekwent nie, so ek weet regtig nie wat Instructables doen nie, behalwe dat dit inkonsekwent kan wees. Daarom is die doel van hierdie Instructable - om uit te vind hoe om beelde te grootte sodat hulle ten minste effens konsekwent vertoon word!

Stap 9: Bewys dat beelde eers korrek weergegee word

Bewys dat beelde eers korrek weergegee word
Bewys dat beelde eers korrek weergegee word

Dit is wat ek eers gesien het nadat ek die prent opgelaai het - dit pas! (Let daarop dat ek die bogenoemde skermkiekie in 'n 1600x1200 -prent (d.w.s. 4: 3 -verhouding) moes inpas om Instructables die hele skermkiekie te laat vertoon!)

Maar u weet natuurlik dat as u na die beeld kyk, 'n paar nou terugskakel, dit pas nie meer nie. Kom ons kyk wat die minimum breedte moet wees om dit te laat pas.

Stap 10: Probeer 382x287 (verhouding 4: 3)

Probeer 382x287 (verhouding 4: 3)
Probeer 382x287 (verhouding 4: 3)

Ek het die 382 -breedte behou en die oorspronklike 382x206 -beeld in 'n 382x287 -doek laat val om 'n 4: 3 -aspekverhouding te maak, want ons het voorheen ontdek dat Instructable 'n beeld nodig het om by die verhouding 4: 3 te pas om dit in sy geheel te vertoon.

Nou is daar baie leë wit ruimte daaronder. Dit pas by niks wat afgekap is nie, maar dit is weer uitgebrei tot 'n vaste breedte, sodat die beeld nie skerp is nie. Kom ons probeer om uit te vind wat hierdie perfekte instruksiebreedte is.

Stap 11: Verruim die beeld van 300x206 tot 600x206 om te sien of dit beter vertoon

Verruim die beeld van 300x206 tot 600x206 om te sien of dit beter vertoon
Verruim die beeld van 300x206 tot 600x206 om te sien of dit beter vertoon

Ek het die oorspronklike 382x206 (2: 1) beeld in 'n 600x206 (3: 1) doek laat val net om te sien of dit tot 600 pixels sou vergroot dat Instructables die hele prentjie sou vertoon. Weereens, dit het aanvanklik gedoen, maar soos u kan sien, is dit nie nou nie.

Dit is regtig vreemd - elke keer as u 'n prentjie inbring, lyk dit asof Instructables die prentjie korrek vertoon, ongeag die grootte of aspekverhouding van die prent. Hierdie keer het ek selfs by Instructables afgemeld en die oortjie gesluit, en dan weer die instruksies "vars" besoek om te sê of die prent nog behoorlik vertoon word. Gewoonlik is dit genoeg om Instructable in staat te stel om sy ding te doen en die grootte van die beelde wat nie in 'n 4: 3 -aspekverhouding is nie, te verander en dit met linker- en regterkant te laat afkap.

Tot my verbasing, het ek die eerste keer dat ek hierdie Instructable "fresh" besoek het, hierdie beeld in sy geheel vertoon, maar helaas, nadat ek weggestap het om iets anders te doen en miskien 'n uur of wat later daar aangekom het, het hierdie beeld begin verskyn vergroot met die L & R -kante weer afgekap net soos u dit hierbo sien.

Waarom of hoe gebeur dit? Ek het geen idee nie. Ek het geen idee hoekom 'n tydperk na die oplaai van 'n prentjie sou veroorsaak dat Instructables dit anders weergee nie, maar dit is wel so. As bewys sal ek my skermopname van die bogenoemde prent wys, wat perfek vertoon word in die eerste oh, 10-15 minute nadat ek dit in die volgende skyfie opgelaai het.

Stap 12: Bewys dat prente aanvanklik behoorlik vertoon word nadat dit opgelaai is

Bewys dat prente aanvanklik behoorlik vertoon word nadat dit opgelaai is
Bewys dat prente aanvanklik behoorlik vertoon word nadat dit opgelaai is

Hier is 'n skermopname wat toon dat die 600x206 -beeld onmiddellik na die oplaai in sy geheel verskyn. Dit is 'n skermopname van die vorige skyfie. Gaan terug na die vorige skyfie, en u kan sien hoe opvallend die prentjie nou is!

Let op dat my skermopname eintlik 1563x766 groot was, maar soos ek geleer het uit my eksperimente aan die begin van hierdie instruksies, het ek geweet, aangesien dit nie by die 4: 3 -aspekverhouding pas nie (1563x766 is ongeveer 4: 2), so as ek pas die skermkiekie in sy oorspronklike grootte opgelaai. Instrueerbaar sou die rande afsny. Dus het ek die prent in 'n 4: 3 -doek laat val, daarom is daar baie leë wit ruimte onder my skermkiekie.

Let op dat die skermkiekie ook geneem is voordat ek die titel van stap 11 verander het en al hierdie teks ingevoer het, as u daaroor wonder!

Les geleer - om u opgelaaide prent onmiddellik na u oplaai in 'n blaaier te sien, sal nie noodwendig wys hoe dit in die toekoms vertoon sal word nie. Om watter rede ook al, dit lyk asof die beeld van bykans elke grootte en/of aspekverhouding mooi vertoon word onmiddellik na die oplaai, en selfs ongeveer 10-15 minute na die oplaai en selfs nadat u by Instructables afgemeld het en dit vars gesien het vanaf 'n nuwe blaaiersessie, ens.

Maar wag ongeveer 'n uur of meer, en dinge verander! U beeld, as dit nie pas by die 4: 3 -aspekverhouding nie, word aangepas (gewoonlik vergroot) deur Instructable sodat die rande afgeknip word.

Stap 13: Bottom line - wat ek geleer het

Bottom line - wat ek geleer het
Bottom line - wat ek geleer het

So, wat het ek geleer?

1. Om 'n beeld in sy geheel te vertoon, is 'n vereiste 'n verhouding van 4: 3 (breedte: hoogte)!

2. Gebruik oorspronklike beelde wat groot is met die hoogste resolusie en plaas dit in 'n doek van 4: 3 -verhouding. As die instruksies te groot is, sal u dit kleiner maak en sal u mooi skerp beelde kry.

3. As u beeld te klein is (baie minder as 600 pixels breed), kan Instructable u beeld uitbrei en ten minste 600 pixels breed maak, wat dit minder skerp maak. Ek sê "ish", want ek weet nie presies watter breedte Instructable gebruik nie, maar dit lyk na ongeveer 600. Dit is waarskynlik 640, wat 'n algemene breedte in die ou skoolbuismonitor -dae was.

600x450 en 640x480 is 4: 3 aspekverhoudings. Alle ou -skool "volskerm" buismonitors was 640x480 (breedte x hoogte).

4. Wat om te doen as u oorspronklike prentjie nie ten minste 600 pixels breed is nie? Omtrent alles wat u kan doen, is om dit in 'n doek te plaas wat pas by die 4: 3 -verhouding wat u beeld naby die oorspronklike grootte vertoon. As u oorspronklike prentjie klein is, is daar baie wit spasie, dus probeer om die prentjie te sentreer of die wit ruimte bo of onder u prentjie te plaas en dit die beste te laat lyk.

Sover my kennis strek, is dit die kompromie wat u in Instructables moet maak, sodat u beelde ongeskonde vertoon.

As voorbeeld is die prent hierbo 'n doekgrootte van 600x450, met 'n beeld van 382x206 wat daarin gesentreer is, sodat ons 'n gelyke wit spasie bo en onder het. Die prentjie word ongeveer in die oorspronklike grootte vertoon, ek dink dat Instructables dit moontlik sal uitbrei tot 640x480 (weglaatbare uitbreiding), so dit is ongeveer die beste wat ons met die oorspronklike beeld kan doen.

5. Vertrou NIE die voorskou nie, of vertrou nie op die manier waarop u beeld die eerste paar uur nadat u dit na Instructable opgelaai het, gelyk het nie! Om watter rede ook al, dit lyk asof die beeldgroottes nie konsekwent bly tot 'n paar uur nadat u dit opgelaai het nie.

Elke keer as u 'n prent vir die eerste keer ingooi, lyk dit asof Instructables die prentjie korrek sal vertoon, ongeag die grootte of aspekverhouding van die prent. Dit kan selfs 'n geruime tyd daarna korrek vertoon word, maar word nie mislei nie, want dit verander uiteindelik die grootte en gee u probleme, tensy u die 4: 3 -reël volg!

Hoop dit help en asb. Laat weet my as u 'n beter manier vind of ander wenke het!

Aanbeveel: