Akoranga: Me pehea te whakatakoto i tetahi whaarangi paetukutuku ki te Adobe Whakaahua

He nui nga momo taputapu hei hoahoa wharangi paetukutuku me te mahi ma te mahi ngawari me te kore e uru ki te waehere pa ranei. E kore e taea te tatau, i tukuna e nga tono (Adobe Dreamweaver he tauira) he tika ranei na nga papaaho ipurangi pera i a Wix. Heoi, mo te kaihoahoa paetukutuku, he mea nui te mohio ki nga tikanga a-ringa. Ko te HTML5 me te CSS nga pou nui mo te whakatakotoranga o nga paetukutuku me nga whaarangi taunga.

Heoi, i te nuinga o te wa ka tatari koe, me tahuri koe ki nga tono penei i te Indesign ranei Adobe Photoshop hei awhina i o mahi whakatakotoranga kia tino oti ai. I tenei ra ka kite taatau i tenei akoranga nui, me pehea te whakatakoto i tetahi whaarangi paetukutuku ma te Adobe Whakaahua. I tenei waahanga tuatahi ka noho tonu taatau mahi mai i WhakaahuaWhakaahua, ahakoa i nga waahanga o muri ake nei ka kite taatau me pehea te whakamahi tika i tenei mahi ki te waehere HTML kia pai ai te mahi.

Ka tiimata me te hoahoa o ta maatau pou waea

Hei tiimata me te whakatakotoranga me te hoahoa o te whaarangi paetukutuku, he mea nui kia tiimata ma te tautuhi he aha nga mea timatanga, koinei te koiwi. Ma tenei hanganga e tautoko hei pupuri i nga korero katoa (ahakoa he tuhinga, he rongorau ranei). Ma te tautuhi i nga waahanga katoa e hanga ana i ta maatau whaarangi ka taea e taatau te mahi ki a raatau me te tino tika me te whakarato i tetahi hoahoa tirohanga e tino tika ana.

He mea nui kia whai whakaaro tatou ki nga waahanga o ta taatau paetukutuku, mena he pouaka ranei Whanui-katoa. Kei roto tetahi wharangi paetukutuku mekemeke i roto i tetahi ipu iti no reira ka kitea he waahi huri noa. Engari, ko te paetukutuku whakairo katoa ka noho ki te mata katoa o te taputapu e whakaputa uri ana i te whaarangi. Ko te kowhiri i waenga i tetahi tikanga, i tetahi atu ranei, ka whakautu ki nga paatai ​​taatai ​​anake ka pa ki nga hiahia o te kaupapa e mahi nei maatau. Ka mahi maatau i tenei tauira me te momo pouaka, na reira kaore e pau katoa nga waahi i te kaitoro.

 

Hei waihanga i to taura waea, ko te mea tuatahi me whakauru te tono Adobe Photoshop me te whakauru i nga waahanga e hiahia ana ta maatau whaarangi. I roto i tenei tauira ko ta maatau whaarangi 1280 pika te whanui. Heoi, ka rere ke te rereketanga o te rahi i runga i te waahanga mutunga ko te taputapu ranei e hiahia ana matou ki te whakaputa uri i to maatau whaarangi Kaore e ruarua mena ka tika te mahi o te hoahoa paetukutuku, me tino whai kiko aro a me urutau ki nga taputapu katoa i te maakete. Heoi, i tenei waa ka mahi maatau ki te hanga i tetahi tauira e taea ana e taatau ki te rorohiko rorohiko. Ahakoa, ko te take whakautu ka aro atu tatou a muri ake nei, i tenei wa, anei te hiranga o nga waahanga mata hei mahi ma tenei tauira. Kia mahara ma tenei ka mahi maatau ki te whakatakoto i te whaarangi taunga ki te Adobe Photoshop ka neke atu ki HTML5 AND CSS3. Ko te kaupapa o tenei mahinga iti ko te huri i tetahi hoahoa i hangaia i te WhakaahuaWhakaahua hei hoahoa paetukutuku whaihua hei whakawhitiwhai ki nga nekehanga a te kaiwhakamahi.

Nga inenga mo nga waea pukoro

iPhone 4 me te 4S: 320 x 480

iPhone 5 me te 5S: 320 x 568

iPhone6: 375x667

iPhone 6+: 414x736

Nohonga 4: 384 x 598

Nohonga 5: 360 x 598

Tupuni S3, S4, S5: 360 x 640

HTC One: 360 x 640

Nga inenga papa

iPad nga tauira katoa me te iPad Mini: 1024 x 768

Tupuni Ripa 2 me te 3 (7.0 inihi): 600 x 1024

Tupuni Ripa 2 me te 3 (10.1 inihi): 800 x 1280

Nohonga 7: 603 x 966

Nohonga 10: 800 x 1280

Microsoft Mata W8 RT: 768 x 1366

Microsoft Mata W8 Pro: 720 x 1280

Nga inenga mo te rorohiko papamahi

Nga mata iti (hei tauira mo nga netbook): 1024 x 600

Whakaaturanga Waenga: 1280 x 720/1280 x 800

Nga mata nui: te whanui nui ake i te 1400 pika, hei tauira 1400 x 900 1600 x 1200 ranei.

 

Hei tiimata ki te tohatoha i nga waahanga me te tohatoha i nga waahanga i roto i ta maatau tawai paetukutuku, he mea nui kia whai whakaaro tatou ki nga waahanga hei whakarite kia taea te panui me te ngawari. He mea nui kia whakamahi koe i nga ture me nga whiringa kaiarahi ka kitea e koe i te rarangi runga Tiro. Ki te mahi tika me te tika, ko te mea pai me mahi tatou mai i nga örau. Ka paatohia e maatau te raarangi tirohanga ka paatoihia te tohu «Aratohu Hou» hei whiriwhiri i te ritenga o te wehenga. I tenei ka wehea e wha nga wehenga poutū i te 25% a ka tangohia e maatau hei tohu ki te tuu i a maatau whakaahua ki te hiku me te ahua o ta maatau tohu ki te pane.

Kei kona tetahi tohu ki te tohu i ia waahanga ka noho ki o maatau tauira me nga mahi ka riro ma tena, ma tena. Hei tauira, hei tohu i te rohe ka noho tetahi ahua, ka hangaia he tapawhā me tetahi momo ripeka. Hei tohu e hiahia ana maatau ki te whakauru i nga riipene ataata ki tetahi waahanga, ka whakauruhia e matou te tohu whakaari ki roto i ta maatau ipu. I tenei tauira tuatahi ka mahi noa maatau me nga whakaahua, i te whakaahua o runga ka kitea e koe te rohe e tohu mai i ta maatau paetukutuku.

Koinei te mutunga o a maatau waea. Kei te kite taatau, kua wehea ki te pane o te ahua e kitea ai te tohu ka waiho hei hono ki te whaarangi kaainga me nga taapiri e rua, he miihini rapu me nga patene e wha i te pouaka rapu. Hei taapiri, kua uru ke ki roto i te tinana, kua taapirihia e matou tetahi taha taha e mau ana i te pae wehewehe me nga waahanga waahanga e whakariterite ana i nga momo korero kei runga i ta maatau paetukutuku. Ko tetahi atu waahanga me te tatauranga e whakauru ana i nga whakauru ka uru mai ki ta maatau papanga, me te mutunga he raarangi me nga tohu meta hei kanohi mo ta maatau papaanga.

I te waahanga ihirangi, ka tautuhia e tetahi waahanga ka whakauru ihirangi whakahaere-a-ake, ka kitea e maatau nga korero o a maatau tuhinga. I tenei wa, ko nga kongakonga he paraoa ranei (e tohu ana i te hanganga rauropi o ta maatau paetukutuku, te taitara o te tuhinga, te metadata, he whiti hei tuhinga mo te tinana, kei roto nei tetahi whakaahua e whakauru ana

Hei hiku kua whakauruhia e matou etahi whakaahua e wha hei hono ki etahi atu waahanga o ta maatau whaarangi. I konei ka taea e taatau te whakauru i nga waitohu, i etahi atu waahanga whakamere ranei. Ahakoa te mea pono, ka rite te ahua o tenei rohe Tuhinga o mua, i te mea ko te hiku tonu ka heke ki raro me te kaupapa here whakamahi, panui ture me te mana pupuri.

Ka oti i a maatau te tautuhi i te anga taketake, te angaanga ranei o ta maatau whaarangi, me haere ki te taumata e whai ake nei. Kei tenei te hoahoa tika mo ia waahanga o ta maatau paetukutuku. I etahi atu kupu, ka tiimata taatau ki te "whakakii" i ia waahanga me nga korero ka uru mai ki ta maatau paetukutuku. E taunaki ana kia kaua e tiimata te hoahoa i enei waahanga i mua i te mahi i runga i te pou waea na te mea pea ka mahia e tatou i roto i tenei ota, ka whai ake me whakarereke a raatau waahanga. Ka raru pea ta maatau whakaahua me mahi ano i te hoahoatanga o ia waahanga, ka noho waikore te waa, he hua kounga iti ranei.

I tenei wa, ko te hoahoa o ta maatau paetukutuku ka tino maamaa. Ka whakamahia e matou te ture hoahoa rauemi, mai i te mea ka whakamahia e matou te tohu a Google hei whakatauira i tenei mahinga. Me matua whakamarama ahau ko te kaupapa o tenei akoranga he whakaatu i nga mohiotanga hangarau, no reira kaore he take o te hua ataahua o tenei keehi. Kei te kite koe, ka paku haere ta maatau whakakii i te waahi ki nga waahanga katoa i whakatauhia e maatau i ta maatau kaupapa. Heoi, i mahia e maatau he whakarereketanga iti i te meneti whakamutunga. Kua kite pea koe, kua whakaitihia e maatau te rahi o ta maatau tohu a kua whakauruhia he raina wehe ki te rohe pane o raro e hono tino ana ki te raarangi o runga. I tenei kua whakamahia e matou nga paatene me nga rauemi mai i te peeke rauemi. Ka rite ki nga kaihoahoa ka taea e taatau te hanga ta raatau, (ina koa ko tenei waahanga ka taunakitia mena ka hiahia taatau kia whakaatuhia he taera rite ki te mea e whakaatuhia ana e te waitohu waitohu me te waitohu)

He mea nui kia mau ki o tatou mahara kia pai ai te hanga i tenei tauira ka mahi maatau i nga taumata e rua. I tetahi taha, ka mahi maatau i nga taonga me tetahi atu taha te ahua o te paetukutuku. Ara, i tetahi o nga ringa o te angaanga o ta maatau paetukutuku me tetahi atu ringa katoa nga waahanga e rere mai ana ka tautokohia e tenei koiwi. Ka kite koe kei kona nga waahi kaore e rere noa, penei i te rohe e noho ai to maatau taha, te kaitautoko o mua, te papa wehewehe ranei e wehe ai te pane mai i te tinana.

Nga Hangahanga 1, 2, 3 me te 4 ka whai waahi ki te papamuri mai i ta maatau paetukutuku, no reira kaore e tika kia tukuna atu e taatau mai i Adobe Photoshop, ahakoa ka taea e taatau, kaore e tika. Ka tae ana ki Tae papa (tetahi o nga ahuatanga nui o te hoahoa papaaho me te hoahoa rauemi, ka taea te whakamahi ma te waehere ma te whakamahi i te raarangi CSS). Heoi, ko era atu waahanga ka tiakina kia whakauruhia a muri ake ki ta maatau waehere HTML. I roto i tenei hoahoa iti kua whakaputaina ano e maatau nga waahanga o te papamuri o te whaarangi kia mohio ai matou he aha te ahuatanga whakamutunga mo ta maatau papaanga.

Ka taea e koe ki te mohio, ko te tikanga o te hanga i tenei kaupapa i roto i te Adobe Photoshop ko te tiki i te tino waahanga o ia waahanga, me te whakamaarama i te whakaritenga me te hanganga o ia waahanga. Ae ra, kaore he waahi o nga tuhinga tuhituhi i roto i tenei waahanga o te waahanga mai i te mea me penei i tukuna mai i ta maatau etita waehere. Me tohu ano hoki ko tenei mahi, ka mahi maatau me nga paatene me nga waahanga tuuturu, ahakoa te tikanga ka whakamahia enei mai i nga anga penei i te Bootstrap, mai i te Jquery ranei.

I te wa i hangaia ai e maatau nga waahanga ka hanga i ta maatau wharangi paetukutuku, kua tae ki te waa ki te tiimata ki te kaweake me te penapena i nga waahanga whakaahua kei roto i te kōpaki kaupapa HTML. He mea nui kia waia koe ki te kaweake mai i to anga waea waea, na te mea pea ka whakarerekehia e koe etahi o nga mea taketake i runga i te whirihoranga angaiwi. (Hei tauira, i tenei ke, kua whakarereke te rahi o nga paatene taketake, te waitohu me te nuinga o nga waahanga o te waahanga, tae atu ki nga whakaahua kei te rohe o raro).

He mea nui kia ako tatou ki te penapena takitahi i tetahi taonga hei whakaora i a ratau me o raatau waahanga me te tikanga tika. Ko nga hapa katoa, ahakoa he iti nei, ka whakaawe i nga waahanga katoa o to paetukutuku. Kia maumahara ka uru atu tetahi ki tetahi, me tino whai kiko kia taea ai te whakauru mai i te HTML ki te paetukutuku whakamutunga. I tenei wa, me tapahi takitahi e tatou me te penapena i enei waahanga e whai ake nei:

• To maatau tohu.
• Ko nga patene katoa (ko era waahanga o te rarangi matua me era atu).
• Nga whakaahua katoa.

He maha nga huarahi ka taea e maatau ma tera pea ka kitea e koe tetahi atu huarahi e whai hua ake ana maau. Engari mena ko te wa tuatahi tenei mo te whakatakoto i tenei momo whakatakotoranga, ka tono atu ahau kia whai i nga tohutohu e whai ake nei.

• Tuatahi, me haere koe ki te kōpaki kei reira te konae PSD kei roto i ta maatau anga waea waea ka taarua kia rite ki nga waa e kawe atu ana koe. I tenei wa kua hangahia e matou he 12 kape mai i te mea taketake ka penapena i roto i te kopaki kotahi. Muri iho, ka whakaingoa ano e koe mo ia kape ka hoatu ki ia tangata o raatau te ingoa o te waahanga kei roto. Ka whakaingoahia a maatau kape 12: Moko, paatene tahua 1, paatene rarangi 2, pae rapu, paatene runga 1, paatene runga 2, paatene runga 3 me te paatene 4. Ko nga toenga e wha ka whakaingoa ano: Whakaahua 1, Whakaahua 2 Whakaahua 3 me te Whakaahua 4.
• Ka oti ana tenei ka whakatuwherahia e maatau te konae me te ingoa tohu.
• Ka haere maatau ki ta maatau papanga papaa ka kimi i te paparanga kei a maatau tohu. Kaatahi matou ka pehi Ctrl / Cmd i a maatau e paatohia ana te karakiki o tera paparanga. Ma tenei ka tohua ai te tohu noa.
• Ko te mahi ka whai ake ko te kii ki a Whakaahua e hiahia ana maatau kia tapahia atu taua tohu i runga i te tikanga tika. Mo tenei ka karanga noa taatau ki te taputapu poro mai i te matua matua, ki te whakahau ranei C.
• Ka oti ana tenei, ka paatohia e maatau te paatene Whakauru hei whakaū i te tapahi.
• Na, ka haere maatau ki te rarangi Kōnae o runga hei paato i te penapena. Ka tohua e maatau te ingoa, ka penei i tenei ko te «Moko» ka tohaina e matou he whakatakotoranga ki a ia teitei, na te mea koinei te konae e tuku ana i te kounga teitei ki te paetukutuku.
• Ka whakahouhia e maatau te mahinga me nga kape katoa me nga waahanga. Ka oti ana i a koe te whakapai, tirohia nga toenga o nga papa kei roto i a maatau papatae e kitea i whakakorea ranei. Ma tenei ka taea ai e taatau te penapena i ia waahanga me te maarama o muri.

I tenei waa kei te kowhirihia e maatau taatau tohu paati 2 mai i nga papa papa. Ka kite koe i te Whakaahuamata me pehea te kowhiri kua tohua nga rohe o ta matau paatene.

Ka tohua e maatau te taputapu tapahi mai i te matua C, ka whakaitihia taatau kaata ki nga waahanga o to paatene anake.

Koinei te wa ki te penapena takitahi i nga waahanga katoa hei waahanga o ta maatau paetukutuku me te whakauru ki roto i nga whakaahua whakaahua ka whakamahia e tatou i muri ake. Ka waea mai i ta maatau waehere, ka haere tonu me ta maatau whakatakotoranga engari mai i tenei wa mai i te etita waehere.

Ahakoa he maha nga taputapu me nga whirinoa ki te whakatakoto i tetahi whaarangi paetukutuku kia tino ngawari ai te mahinga, he mea nui kia ako tatou me pehea te mahi i roto i te ā-ringa. Ma tenei ka ako tatou he aha nga mea nui kei tua o te hoahoa o tetahi wharangi paetukutuku.

Whakarāpopoto:

1. Hoahoa te hanganga o te paetukutuku e aro nui ana ki nga korero e hiahia ana koe ki te tuku me nga waahanga me hanga e koe ki to paetukutuku.
2. Me mahi ki to kaiwi ranei waea mai i te Adobe Photoshop e whakaatu ana kohea nga waahanga ka puta nga korero me tana whakatakotoranga.
3. Ko te whakawhirinaki ki nga mehua me nga waitohu i hangaia e koe i mua, tiimata ki te hoahoa te mata o te paetukutuku. Kei roto katoa nga waahanga (e rewa ana, e tau ana ranei). Kaua e wareware ki te whakauru i nga patene, tohu me nga whakaahua e tika ana.
4. Tapahia takitahi nga waahanga katoa hei waahanga o te kaupapa. Kia mahara ki te mahi tika a raatau mahi, kaua hoki e raru i muri mai.
5. Penapenahia nga waahanga katoa i te whakatakotoranga teitei i roto i nga whakaahua atahanga i roto i te kōpaki kaupapa HTML.
6. Kia mahara ko tenei kaupapa ka puta he putanga ki te matapihi paetukutuku na he mea nui kia whai whakaaro koe ki te ahua tae me te tono RGB.
7. Whakauruhia koe e etahi atu paetukutuku e miharo ana koe i mua i to pakihi, kaua hoki e wareware ki te korerorero ki tenei me o mema o te roopu. Mena he kaupapa ma te kaihoko, ngana ki te piri ki te korero poto tae noa ki te taea.