Mācoties par programmēšanu, var saskarties ar divām atšķirīgām fāzēm
-
Mācīšanās par pamatiem: jūs sākat izpētīt datorprogrammas anatomiju, iemācāties domāt par vienkāršām problēmām loģisko vienību izteiksmē un sākat formalizēt šīs vienības koda instrukcijās. Šajā posmā jūs mācāties par abstraktiem priekšmetiem un vienkāršu praksi. Ja tas tiek darīts pareizi un dots atbilstošs laiks, ikviens spēs saprast un rakstīt vienkāršas loģiskās programmas, izmantojot izvēlēto valodu.
-
Otrajā fāzē, kas lielākajai daļai cilvēku šķiet mazliet biedējošāka, ir izstrādes ekosistēmas apgūšana: dabiskais nākamais solis pēc vienkāršu programmēšanas zināšanu iegūšanas ir programmēšanas apakšdomēna izvēle (tīmekļa izstrāde, mobilo aplikāciju izstrāde, iegultās sistēmas un tamlīdzīgi). ) un sāciet uzzināt, kā atrisināt problēmas, izmantojot konkrēto platformu. Grūtības šeit ir tādas, ka vairs nav nepieciešams aptvert pamatprincipu kopumu, praktizēt katru jēdzienu un atkārtot. Bieži vien nav iespējams aptvert katru instrumentu, katru tehnoloģiju un ievērot visus principus. Pareizais veids, kā to izdarīt, ir veikt veselīgu eksperimentu un pētījumu apjomu. Iespējams, jums būs jāapgūst tikai dažas prasmes un jāizmanto vairāki rīki, lai sāktu veikt vienkāršus uzdevumus. Kad esat apmierināts ar šo līmeni, varat mēģināt paplašināties ar jaunu rīku komplektu un nepārtraukti attīstīties. Izmantojot šo metodiku, mēs centīsimies izveidot stabilu pamatu tīmekļa izstrādes jomā, izpētot tehnoloģijas un rīkus, kas tiek izmantoti vienkāršu galveno lapu veidošanā.
Šajā emuāra ziņojumā mēs īsi izpētīsim priekšgala tīmekļa izstrādes ainavu, koncentrējoties uz galvenās lapas izstrādi. Mēs izskatīsim dažādus resursus, kurus iesakām pārbaudīt, lai uzzinātu dažādas izstrādes daļas, ar kurām jūs varētu saskarties. Līdz šī raksta beigām jums būs daudz skaidrāks priekšstats par to, kā izveidot galveno lapu. Noskatieties šo pavadošo videoklipu, lai iegūtu praktisku piemēru.
Galvenās lapas izstrādes ainava
Galvenā lapa ir termins, ko sākotnēji izmantoja digitālā mārketinga eksperti, lai apzīmētu atsevišķu tīmekļa lapu, ko izmanto mārketinga un reklāmas kampaņas nolūkos. Koncepcija ir diezgan vienkārša: apmeklētājs, kurš interesējas par uzņēmuma piedāvāto preci vai pakalpojumu, noklikšķina uz minētā produkta saites, pēc tam “nokļūst” tīmekļa lapā, kurā ir bagātīgs apraksts, kurā apvienots preces teksts, attēli utt. pakalpojumu. Lapā ir pirkuma poga, ko sauc par “CTA” (Call To Action), lai pārvērstu apmeklētāju par maksājošu klientu. Kā jau jūs varētu gaidīt, labas reklāmguvumu līmeņa nodrošināšanai ir ļoti svarīgi nodrošināt labu lietotāja pieredzi.
Šajā rakstā mēs uzzināsim par daudziem veidiem un rīkiem, kas ļaus mums izveidot galvenās lapas, kas pilda savu lomu. Ir svarīgi pieminēt, ka, veidojot galvenās lapas, kas saistītas ar SEO (Search Engine Optimization), ir jāņem vērā arī citi apsvērumi. SEO tiks apskatīts turpmākajos semināros.
Dizaina iedvesma
Neatkarīgi no tā, vai esat pieredzējis galveno lapu veidošanā vai tikai sākat darbu, jūs atklāsiet, ka bieži vien ir grūti precīzi noteikt, kādu vēlaties, lai jūsu vietne izskatās. Tāpat nereti, strādājot ar klientiem, viņi nezina, kādu dizainu vēlas savai mājas lapai. Parasti dizaina maketu un prototipu izstrādātājam nodod tīmekļa dizaineris, kas specializējas šāda veida darbos. Var būt noderīgi izveidot uzticamu tīmekļa dizaina avotu. Šādi avoti ļaus jums sekot līdzi dizaina tendencēm, veicināt jūsu radošumu un… sākt darbu. Divi no labākajiem resursiem, ko varat izmantot, lai gūtu iedvesmu sava nākamajam projektam, ir Dribbble un Behance.
Dribble
Dribbble, iespējams, ir vispopulārākais resurss tīmekļa dizaina jomā. Tā ir dizaineru kopiena, kas dalās savos darbos, lai uzlabotu savas prasmes, palīdzētu viens otram un saņemtu konstruktīvas atsauksmes. Tajā ir iekļauts plašs dizainu klāsts gandrīz jebkurā priekšmetā vai jomā, ko radījuši radoši cilvēki no visas pasaules, kā arī atsauksmes no kopienas, padarot to par ideālu vietu iedvesmas gūšanai.
Behance
Behance ir vēl viena populāra dizaina kopiena, kas var palīdzēt jums smelties iedvesmu. Šī vietne piedāvā izvērstās meklēšanas funkcijas, kas ļauj ērti piekļūt konkrētam jūs interesējošam darbam, izmantojot atslēgvārdus, laukus un krāsu paleti. Ir arī svarīgi atzīmēt, ka Behance ir daļa no Adobe un lieliski integrējas ar Adobe radošo mākoni.
Gan Dribbble, gan Behance ir lieliskas platformas tīmekļa dizaina iedvesmai, un jūs nevarat kļūdīties. Mēs aicinām jūs sākt izpētīt dizainu un nākt klajā ar savu!
Dizaina prototipu veidošana
Tagad, kad esat iedvesmojies no talantīgu dizaineru darba, ir pienācis laiks sākt izstrādāt savas galvenās lapas dizaina prototipu. Prototipu izstrāde ir svarīgs galvenās lapas izveides posms. To var definēt kā eksperimentālu procesu, kurā idejas tiek īstenotas redzamās struktūrās, lai tās varētu pilnveidot un apstiprināt kopā ar savu komandu vai klientu. Līdz prototipu izstrādes fāzes beigām jums būs dizains, kas ir gatavs atdzīvināšanai jūsu galvenajā lapā.
Ir daudz programmatūras risinājumu, ko var izmantot ēku projektēšanas prototipiem. Faktiski to ir tik daudz, ka ātri var kļūt sarežģīti novērtēt, salīdzināt un izvēlēties vienu rīku. Mēs izmantosim Figma, jo to parasti izmanto ux/ui dizaineri. Ja vēlaties uzzināt, kā izmantot Figma prototipu veidošanai, varat skatīt mūsu avārijas kursu vietnē YouTube tieši šeit.
Figma
Figma ir universāls projektēšanas rīks, kas ļauj UX dizaineriem un izstrādātājiem viegli izveidot un sadarboties ar dizaina prototipiem uz pārlūkprogrammas balstītā mākoņa mitinātā platformā. . Figma liek uzsvaru uz vienkāršību un lietošanas ērtumu.
Figma saskarne ļauj izveidot elementus un veidot to stilu, kontrolējot teksta, režģu un citu komponentu izskatu visā lapā. Tas piedāvā plašu papildu spraudņu klāstu, piemēram, Autoflow, lai parādītu lietotāju plūsmas, Figmotion animācijām un daudz ko citu.
Ikonas un fonti
Tipogrāfija un stila ikonas ir dažas no vienkāršākajām funkcijām, ko izmantot, lai uzlabotu jebkuras tīmekļa lapas izskatu. Savā galvenajā lapā vēlaties izmantot pareizo fontu un ikonas, lai tas atbilstu vispārīgajai idejai, par kuru vēlaties sazināties. Par laimi, ir viegli atrast un lietot lielu fontu un ikonu izvēli, izmantojot Font Awesome vai Google Fonts.
Fonts Lielisks
Font Awesome ir fontu un ikonu rīkkopa, kuras pamatā ir CSS un Less . 2020. gadā Font Awesome izmantoja 38% vietņu, kurās tiek izmantoti trešo pušu fontu skripti, ierindojot to otrajā vietā pēc Google fontiem (Wikipedia).
Font Awesome atbalsta daudzas priekšgala bibliotēkas, piemēram, Bootstrap, kurai tas sākotnēji tika izveidots. Font Awesome padara fontu un ikonu integrāciju tīmekļa lapā tikpat vienkāršu kā CDN saites iekļaušanu. Šī lietošanas vienkāršība, kā arī tā lielā fontu un ikonu izvēle padarīja to par populārāko risinājumu šajā telpā.
Google fonti
Google fonti ir bezmaksas atvērtā koda tīmekļa pakalpojums, ko piedāvā Google fontu iegulšanai vietnēs. Tas piedāvā nevainojamu integrāciju un augsta līmeņa elastību un pielāgojumus.
Izvietojiet savu galveno lapu
Tagad, kad esat izveidojis savu galveno lapu, ir pienācis laiks dalīties tajā ar visu! Pēdējais solis ir galvenās lapas izvietošana, izmantojot mitināšanas pakalpojumu sniedzēja risinājumu. Github Pages un Vercel ir mūsu labākās izvēles. Tie ir vispopulārākie un visvieglāk lietojami. Vercel ir mūsu darbnīcā ieviestais rīks, taču Github Pages darbojas līdzīgi.
Github lapas
Ja pašlaik mācāties kodēt, iespējams, esat dzirdējuši par Github. Github ir platforma koda kopīgošanai un mitināšanai kā daļa no atvērtā pirmkoda kopienas. Tā piedāvā funkciju ar nosaukumu GitHub Pages, kas ir publisko tīmekļa lapu mitināšanas pakalpojums, ko var izmantot privātpersonas un organizācijas. Visas lapas tiek brīvi mitinātas GitHub domēnā github.io vai pielāgotā domēna nosaukumā, ja jums tāds pieder. GitHub lapas ir vienkāršs un efektīvs veids, kā bez maksas mitināt savus projektus, ja jau izmantojat Github versiju kontrolei.
Vercel
Vercel ir Github Pages alternatīva, kas piedāvā plašu funkciju un konfigurāciju klāstu. Tam ir bezmaksas versija. Mēs iesakām Vercel ikvienam, kam ir sarežģīts projekts, jo tas nodrošina lielisku izstrādātāja pieredzi un sniedz lielisku atbalstu. Code Labs Academy to izmanto kā daļu no izstrādes procesa.
Secinājums
Šajā rakstā tika iepazīstināti ar noderīgiem rīkiem galvenās lapas izstrādei. Atkal! Labākais veids, kā mācīties, ir darot, tāpēc mēs ļoti mudinām jūs izmantot šos rīkus savā personīgajā projektā! Liela daļa izstrādātāja darba ir izpētīt esošos risinājumus problēmām, ar kurām viņi saskaras, un izvairīties no riteņa atkārtotas izgudrošanas. Programmēšanas kopienas labākā lieta ir tās sadarbības raksturs. Aicinām izmantot citu kopīgo darbu un dot savu ieguldījumu!
Un, ja vēlaties uzzināt vairāk par lielisku vietņu izstrādi un to veidošanu, skatiet mūsu UX/UI dizains un Web Development Bootcamps!
