Mga Larawan na Maaaring Ituro sa Laki: 13 Mga Hakbang

2024 May -akda: John Day | [email protected]. Huling binago: 2024-01-30 13:14

Mayroon ka bang mga problema sa pagkuha ng mga imahe sa laki nang tama? Masyadong malaki ba ang laki ng iyong mga imahe at umaapaw ang frame tulad ng nasa itaas? Itinuturo nitong pagtatangka na buod kung ano ang natutunan ko upang matugunan ang problemang ito.

Sinabi sa akin ng Staff na Maaaring Makatuturo na ang lahat ng na-upload na mga imahe ay na-doble sa iba't ibang mga ratio ng aspeto. Ang pool ng mga imahe na ito ay pagkatapos ay hinugot mula sa at sukat ng magkakaiba depende sa kung anong aparato tinitingnan mo ang itinuturo. Walang paraan upang tukuyin sa regular na editor kung anong laki at ratio ang ipapakita.

Iminungkahi nila pagkatapos na "Ang isa pang pagpipilian na maaaring gumana ay kung mag-a-upload ka ng mga imahe na isang mas tradisyonal na ratio ng aspeto. Anumang mula 16: 9 hanggang 4: 3 ay dapat na ipakita nang napakaganda."

Pansinin na sinabi nila itong "maaaring" gumana. Narito kung ano ang nakita ko sa aking mga pakikibaka upang maipakita nang disente ang aking mga imahe. (Tandaan Gumagamit ako ng mga imahe mula sa aking "Rubik's cube made easy" na itinuturo, samakatuwid lahat ng mga imahe ng kubo!)

Ang imaheng nasa itaas ay ang orihinal na sukat (600x195) na wala sa saklaw ng tradisyonal na mga ratios ng aspeto. Tulad ng nakikita mo, ang mga Instructable ay ipinapakita ang imaheng ito na pinalaki nang napakalaki nang putulin ang kaliwa at kanang bahagi. Tingnan natin kung ano ang maaari nating gawin upang maipakita nang maayos ang imaheng ito.

Hakbang 1: Subukan Natin 16: 9 Aspect Ratio

Subukan natin ang ratio ng aspeto na 16: 9 (lapad: taas). Itatago ko ang orihinal na lapad ng 600 mga pixel, ang 16: 9 ay nangangahulugang ang taas ay kailangang 338 mga pixel kaya gumawa kami ng isang laki ng canvas na 600x338 at ihuhulog ang 600x195 na imahe dito.

Tingnan natin kung paano ang hitsura ng 600x338 (16: 9 na aspektong ratio) na imahe. Nakatutuwa, nang ibagsak ko ang imaheng ito at i-preview ito, perpektong magkasya - ang kaliwa at kanang mga gilid ay hindi naputol! Kumuha ako ng isang screenshot nito para lamang sa patunay, tingnan ito sa susunod na slide.

Ngunit, kapag tiningnan ko ito sa aking browser (Chrome) kung ano ang nakikita ko sa imahe sa itaas, ay ang kanan at kaliwang panig ay muling tinadtad! Kaya mula sa eksperimentong ito, lilitaw na ang pagbabago ng laki sa isang 16: 9 na aspeto na ratio ay hindi malulutas ang aming mga problema!

Bilang isang tala sa gilid, ang 16: 9 ay ang "bagong" karaniwang aspeto ng ratio na kilala bilang "widescreen" samantalang ang 4: 3 ay ang "full screen" ng lumang paaralan na karaniwang bumalik sa mga araw ng tubo sa TV. Yeah, kamang millennial's marahil ay walang bakas kung ano ang sinasabi ko.

Hakbang 2: 16: 9 Na Sariwang I-upload ang Larawan Tulad ng Nakikita sa Preview

Ang larawang ito ay ang pagkuha ng screen na ipinapakita na ang aming 16: 9 na imahe ay mukhang perpekto sa Preview. Ang tagumpay di ba? Sa gayon, hindi masyadong mabilis - tingnan kung ano ang mangyayari kapag talagang tiningnan namin ang pahinang ito sa aming browser (Chrome)! Ang kaliwa at kanang mga gilid ay pinutol muli! Bumalik lamang upang hayaan ang nakaraang slide at makita para sa iyong sarili.

Natutuhan sa aralin - huwag magtiwala sa Preview! Ano ang hitsura ng maayos sa Preview na nai-render naiiba sa aktwal na pagtingin sa isang browser!

Gayundin, oo, maraming puting puwang sa ibaba ng aking imahe. Iyon ay dahil bumagsak ako ng isang 600x195 na imahe sa isang 600x338 canvas at ilagay ito sa itaas, kaya't mayroong lahat ng blangkong puting puwang sa ilalim. Ano ang magagawa natin tungkol doon? Sa gayon … susubukan naming tugunan iyon sa isang susunod na slide.

Kaya't patuloy nating makita kung paano natin magagawa ang pagpapakita ng imaheng ito sa kabuuan.

Hakbang 3: 16: 9 Ipinapakita Sa L&R Sides Cutting

Para lamang sa talaan, kung sakaling para sa anumang kadahilanan na ipinapakita ng iyong browser ang mga 16: 9 na imaheng ito na perpekto, ito ang sinasabi ko. Narito ang isang screenshot kung paano ko nakikita ang aking 16: 9 na imahe sa Hakbang 1 na ipinakita pagkatapos ng "pag-aayos sa" pagkatapos ng paunang preview - pansinin ang kaliwa at kanan ay naputol.

Kung nakikita mo ang aking imahe sa Hakbang 1 na ipinapakita nang perpekto, mabuti, mahusay. Ipaalam sa akin! Ngunit ito ang nakikita ko. Oo, mas mahusay ito kaysa sa orihinal na imahe mula sa pahina ng pamagat, ngunit naputol pa rin ito. Kaya para sa akin, sa kabila ng payo mula sa mga tauhan ng Instructables, ang 16: 9 na ratio ng aspeto ay hindi masyadong pinutol ito. Lumipat tayo sa ratio ng 4: 3 na aspeto.

Hakbang 4: Subukan Natin ang 4: 3 Aspect Ratio

Kaya't subukan natin ang ratio ng 4: 3 na aspeto. Itatago ko ang orihinal na lapad na 600 pixel, ang 4: 3 ay nangangahulugang ang taas ay kailangang 450 pixel kaya gumawa kami ng laki ng canvas na 600x450 at ihuhulog ang 600x195 na imahe dito.

Paano ang hitsura ng larawang ito ng 600x450 (4: 3 na aspeto)?

Muli, noong una ko itong naihulog, ang imahe ay mukhang mahusay (maliban sa lahat ng puting puwang sa ibaba). Kaliwa at Kanan ay ipinapakita ng maayos. Kung titingnan ito sa isang browser, mukhang Kanan at Kaliwa na lilitaw na patuloy na maipakita nang maayos.

Tulad ng naunang nabanggit, ang lahat ng blangkong puting puwang sa ibaba ng imahe ay dahil ibinagsak ko ang aking 600x195 na imahe sa isang 600x450 canvas at inilagay lamang ito sa itaas.

Natutuhan sa aralin - 4: 3 na ratio ng aspeto ay tila kinakailangan upang ang Kanan at kaliwang panig ay hindi maputol. Sa kasamaang palad, nangangahulugan ito na magkakaroon ng maraming puting puwang para sa mga imaheng maikli at malawak, dahil kailangan mong i-drop ang mga imaheng iyon sa isang 4: 3 na laki ng canvas. Yeah, maaari mong isentro ang iyong imahe upang may pantay na puting puwang sa itaas at ibaba ngunit hindi alintana, magkakaroon ng maraming puting puwang sa itaas o sa ibaba ng iyong imahe, ngunit sa abot ng aking pagkakaalam, ito ang kompromiso na iyong gagawin kailangang gawin sa Mga Tagubilin upang maipakita ang iyong mga imahe na buo.

Hakbang 5: 4: 3 Na Nakasentro sa Imahe

Narito ang parehong imahe ng 600x195 na nahulog sa isang 600x450 canvas ngunit nakasentro upang may pantay na blangkong puting puwang sa itaas at ibaba. Mukhang medyo mas mahusay, ang teksto ay tila hindi gaanong pinaghiwalay mula sa imahe.

Hakbang 6: 4: 3 Sa Imahe sa Ibabang

At ang panghuli, narito ang parehong imaheng bumagsak at lumipat sa ibaba. Ngayon ay may isang tonelada ng blangkong puting puwang sa tuktok ng imahe. Hiwalay na talaga ang imahe mula sa title bar, ngunit mas malapit ito sa teksto. Kaya ito ang iyong mga kompromiso at aral na natutunan:

• Ang 4: 3 ay tila ang ratio ng aspeto na kailangan mong gamitin para maipakita ang mga imahe sa kanilang kabuuan sa Mga Instructable.
• huwag magtiwala sa preview - maaari itong ipakita nang perpekto ang iyong imahe, ngunit ang mga bahagi ay maaaring maputol sa aktwal na browser

Hakbang 7: Ano ang Minimum na Lapad?

Tingnan natin ngayon kung ano ang dapat na minimum na lapad. Ang ipinakitang imahe ay sukat na 382x206, malapit sa 2: 1, tila talagang napakalaking di ba? Malinaw na, ang mga Instructable ay pinalaki ang imahe upang gawin itong magkasya sa ilang itinakdang lapad, marahil 640 na mga pixel, hindi ako sigurado.

Ngunit umaangkop ito sapagkat ito ay mas "parisukat" - ibig sabihin, hindi ito masyadong malawak para sa taas nito. Ay teka, niloko ulit ako ng Preview na yan! Talagang hindi ito magkasya - ang panig ng R&L ay pinutol muli.

Sa totoo lang, kakaiba ito, hindi lamang ang preview ang ginulo. Talagang tiningnan ko ito sa browser at noong una ay maayos itong na-render (ibig sabihin, ang mga gilid ng R&L ay hindi naputol). Ngunit ang pagtingin muli sa pamamagitan ng browser, ngayon ang imahe ay nai-render ang laki na pinutol ang mga gilid ng R&L. Kakatwa

Kaya't subukan nating gawing mas maliit ang imahe. Paliitin namin ang imahe sa 200x108, pinapanatili ang parehong ratio ng 2: 1 na aspeto.

Hakbang 8: Pagliit ng Larawan Ngunit Pagpapanatiling Aspect Ratio

Kaya't binago ko ang laki ng larawang iyon sa 200x108, pinapanatili ang parehong ratio ng 2: 1 na aspeto.

Ngayon muli ay tila umaangkop sa una (na may resolusyon (kalidad ng larawan) na lubos na lumala!) Ngunit syempre malamang na tinitingnan mo ito at hindi ito umaangkop sa lahat, at mukhang eksakto ang orihinal na imahe maliban sa orihinal na mas mahusay na resolusyon. Muli, pinapalawak ng mga Instructable ang imahe upang gawin itong magkasya sa ilang itinakdang lapad kaya't ito ang dahilan kung bakit ang mas maliit na (200x108) na imaheng ito ay napakasindak, mas masahol kaysa sa orihinal na 382x206.

Sinasabi kong "marahil" sapagkat wala talaga akong ideya kung paano ipinapakita ng mga Instructable ang mga larawang ito sa iyong browser. Para sa anumang kadahilanan, kung i-refresh ko ang aking cache at suriin ang Instructable na ito, ang laki ng aking imahe ay tila hindi mananatiling pare-pareho kaya hindi ko talaga alam kung ano ang ginagawa ng mga Instructable maliban na maaari itong maging hindi naaayon. Sa gayon ang layunin ng Ituturo na ito - upang malaman kung paano sukatin ang mga imahe upang maipakita ang hindi bababa sa medyo pare-pareho!

Hakbang 9: Patunay Na Imahe ang Pag-render ng Mga Imahe nang Una

Narito ang nakita ko muna kaagad pagkatapos na mag-upload ng imahe - umaangkop ito! (Tandaan na kailangan kong magkasya sa screenshot sa itaas sa isang 1600x1200 na imahe (ibig sabihin, 4: 3 na ratio) upang maipakita ng Mga Instructable ang buong screenshot!)

Ngunit syempre alam mo kapag tinitingnan mo ang imaheng iyon ang isang pares ay dumulas ngayon, hindi na ito angkop. Tingnan natin kung ano ang kailangan ng minimum na lapad upang magkasya ito.

Hakbang 10: Sinusubukan ang 382x287 (4: 3 Ratio)

Iningatan ko ang lapad na 382 at ibinagsak ang orihinal na imahe na 382x206 sa isang 382x287 canvas upang gawin itong isang 4: 3 na ratio ng aspeto dahil dati naming natuklasan na ang Instructable ay nangangailangan ng isang imahe upang magkasya sa 4: 3 na ratio upang maipakita ito sa kabuuan nito.

Kaya ngayon mayroong maraming blangkong puting puwang sa ilalim. Ito ay umaangkop sa walang tinadtad, ngunit muli ay pinalawak upang punan ang ilang mga itinakdang lapad, kaya ang imahe ay hindi matalim. Subukan nating hanapin kung ano ang perpektong Saklaw na maituturo na ito.

Hakbang 11: Pagpapalawak ng Larawan Mula sa 300x206 hanggang 600x206 upang Makita Kung Mas Maipapakita Ito

Inilapag ko ang orihinal na imahe na 382x206 (2: 1) sa isang 600x206 (3: 1) na canvas upang makita lamang kung ang pagpapalawak nito sa 600 na mga pixel ay magpapakita sa mga Instructable ng buong imahe. Muli, sa una ginawa ito, ngunit tulad ng nakikita mong hindi ito ngayon.

Ito ang talagang kakatwang bagay - sa bawat oras, kapag una kang nag-drop ng isang imahe, mukhang ipapakita nang tama ng mga Instructable ang imaheng iyon, anuman ang laki o aspektong ratio ng imaheng iyon. Sa pagkakataong ito ay nag-log out din ako sa Mga Instructable at isinara ang tab na iyon, at pagkatapos ay muling bisitahin ang "ma-presko" na Ituturo na ito upang magsalita upang mapatunayan kung ang imahe ay ipinakita pa rin nang maayos. Kadalasan ito ay sapat na upang payagan ang Instructable na gawin ang bagay nito at simulang baguhin ang laki ng mga imahe na wala sa isang 4: 3 aspeto na ratio at ipinapakita ang mga ito sa kaliwa at kanang bahagi na tinadtad.

Nagulat ako, ang unang pares ng mga beses na muling binisita ko ang Instructable na "sariwa" na imaheng ito ay nanatiling naipakita sa kabuuan, ngunit aba, pagkatapos kong lumayo upang gumawa ng iba pa at dumating siguro sa isang oras o mahigit pa, nagsimulang ipakita ang imaheng ito pinalaki ng mga gilid ng L&R na pinutol muli tulad ng nakikita mo sa itaas.

Bakit o paano ito nangyayari? Wala akong ideya. Hindi ko alam kung bakit ang paghihintay ng ilang tagal ng panahon pagkatapos mag-upload ng isang imahe ay gagawing naiiba ang pag-render ng Mga Instructionable, ngunit ginagawa ito. Bilang patunay, ipapakita ko ang aking pagkuha ng screen ng imaheng nasa itaas na nagpapakita ng perpektong sa unang oh, 10-15 minuto pagkatapos kong mai-upload ito sa susunod na slide.

Hakbang 12: Patunay Na Maipapakita nang Wastong Mga Imahe Pagkatapos ng Pag-upload

Narito ang isang pagkuha ng screen na ipinapakita ang 600x206 na imahe na nagpapakita ng kabuuan kaagad pagkatapos mag-upload. Ito ay isang pagkuha ng screen ng nakaraang slide. Bumalik sa nakaraang slide at maaari mong makita kung paano jacked up ang imahe ay ngayon!

Tandaan na ang aking pag-capture ng screen ay talagang laki ng 1563x766 ngunit sa natutunan ko mula sa aking mga eksperimento sa simula ng Instructable na ito, alam ko dahil hindi ito magkasya sa 4: 3 na ratio ng aspeto (1563x766 ay halos 4: 2) kaya kung gusto ko na-upload lamang ang screenshot na iyon sa orihinal na sukat na Maaaring maituro sa mga gilid. Kaya't ibinagsak ko ang imaheng iyon sa isang 4: 3 na canvas kaya't marami ang walang laman na puting puwang sa ilalim ng aking screenshot.

Tandaan na ang screenshot ay kinuha din bago ko binago ang pamagat ng Hakbang 11 at natapos na ang pag-type sa lahat ng teksto na ito kung sakaling nagtataka ka tungkol doon!

Natutunan ng aralin - ang pagtingin sa iyong nai-upload na imahe sa isang browser pagkatapos mong i-upload ay hindi ito kinakailangang ipakita kung paano ito ipapakita sa hinaharap. Para sa anumang kadahilanan, halos anumang laki at / o aspeto ng ratio ng imahe ay mukhang maipakita kaagad pagkatapos mag-upload, at kahit na para sa mga 10-15 minuto pagkatapos mag-upload at kahit na pagkatapos mong mag-log out sa Mga Instructable at tingnan itong sariwa mula sa isang bagong sesyon ng browser, atbp..

Ngunit maghintay ng halos isang oras o higit pa, at magbabago ang mga bagay! Ang iyong imahe, kung hindi ito umaangkop sa ratio ng 4: 3 na aspeto, ay aakma (karaniwang pinalaki) ng Instructable kaya't ang mga gilid ay pinutol.

Hakbang 13: Bottom Line - Ang Natutuhan Ko

Kaya't sa ilalim - ano ang natutunan ko?

1. Upang maipakita ang isang imahe sa kabuuan nito, ang pagpapanatili ng isang 4: 3 na aspektong ratio (lapad: taas) ay dapat!

2. Gumamit ng mga orihinal na imahe na malaki na may pinakamataas na resolusyon na maaari mong at i-drop ang mga ito sa isang 4: 3 ratio canvas. Kung masyadong malaki, sisirain ito ng mga Instructable at magkakaroon ka ng magagandang matatalas na mga imahe.

3. Kung ang iyong imahe ay masyadong maliit (mas mababa sa 600 mga pixel ang lapad) Maaaring maitaguyod ng instruksyon na palawakin ang iyong imahe at gagawin itong hindi bababa sa 600ish na pixel ang lapad kaya't ginagawang mas matalim. Sinasabi kong "ish" sapagkat hindi ko talaga alam kung ano talaga ang ginagamit ng lapad na Instructable ngunit tila malapit ito sa 600. Marahil ay 640, na isang karaniwang lapad pabalik sa mga araw ng monitor ng tubo sa paaralan.

Ang 600x450 at 640x480 ay 4: 3 na mga ratios na aspeto. Ang lahat ng mga lumang monitor ng "full screen" na tubo ay 640x480 (lapad x taas).

4. Ano ang gagawin kung ang iyong orihinal na imahe ay hindi bababa sa 600 mga pixel ang lapad? Tungkol sa lahat na magagawa mo ay ihulog ito sa isang canvas na umaangkop sa 4: 3 na ratio na ipinapakita ang iyong imahe malapit sa orihinal na laki nito. Kung ang iyong orihinal na imahe ay maliit, magkakaroon ng maraming blangkong puting puwang, kaya subukang isentro ang iyong imahe o ilagay ang puting puwang alinman sa itaas o sa ibaba ng iyong imahe at gawin itong pinakamahusay na magagawa mo.

Sa pagkakaalam ko, ito ang kompromiso na kakailanganin mong gawin sa Mga Tagubilin upang maipakita nang buo ang iyong mga imahe.

Bilang isang halimbawa, ang imahe sa itaas ay isang sukat na 600x450 na canvas na may isang imahe na 382x206 na nahulog dito at nakasentro sa gayon mayroon kaming pantay na blangkong puting puwang sa itaas at sa ibaba. Ang imahe ay halos ipinapakita sa kanyang orihinal na laki, sa palagay ko ang mga Instructable ay maaaring pinalawak ito sa 640x480 (bale-wala na paglawak) kaya't tungkol iyon sa pinakamahusay na magagawa natin sa orihinal na imaheng iyon.

5. HUWAG magtiwala sa preview o magtiwala sa hitsura ng iyong imahe sa unang ilang oras pagkatapos i-upload ang mga ito sa Instructable! Sa anumang kadahilanan, ang mga laki ng imahe ay tila hindi mananatili hanggang sa ilang oras pagkatapos mong mai-upload ang mga ito.

Sa tuwing, kapag nag-drop ka muna ng isang imahe, tila ang mga Instructable ay ipapakita nang tama ang imaheng iyon, anuman ang laki o aspektong ratio ng imaheng iyon. Maaari pa ring manatiling tama ang pagpapakita nito sa ilang tagal ng panahon pagkatapos, ngunit HUWAG MAGLOKO dahil sa paglaon, baguhin ang laki nito at bibigyan ka ng mga problema maliban kung sundin mo ang panuntunan na 4: 3!

Inaasahan kong makakatulong ito at mangyaring, kung nakakita ka ng isang mas mahusay na paraan o may anumang iba pang mga pahiwatig, ipaalam sa akin!