Вывучаючы праграмаванне, можна сустрэць дзве розныя фазы
-
Вывучэнне асноў: вы пачынаеце вывучаць анатомію камп'ютарнай праграмы, вучыцеся разглядаць простыя задачы з пункту гледжання лагічных адзінак і пачынаеце фармалізаваць гэтыя адзінкі ў інструкцыі кода. На гэтым этапе вы даведаецеся аб абстрактных прадметах і просты практыцы. Калі ўсё зроблена правільна і нададзена адпаведная колькасць часу, кожны зможа навучыцца разумець і пісаць простыя лагічныя праграмы на мове на выбар.
-
Другі этап, які большасць людзей лічыць крыху больш складаным, складаецца з вывучэння экасістэмы распрацоўкі: натуральным наступным крокам пасля атрымання простых ведаў праграмавання з'яўляецца выбар субдамена праграмавання (вэб-распрацоўка, распрацоўка мабільных дадаткаў, убудаваных сістэм і падобнае ) і пачніце вывучаць, як вырашаць праблемы з дапамогай гэтай канкрэтнай платформы. Цяжкасць тут заключаецца ў тым, што гэта ўжо не пытанне ахопу набору асноў, практыкі кожнай канцэпцыі і паўтарэння. Часта немагчыма ахапіць кожны інструмент, кожную тэхналогію і прытрымлівацца ўсіх прынцыпаў. Правільны спосаб зрабіць гэта - правесці здаровую колькасць эксперыментаў і даследаванняў. Хутчэй за ўсё, вам трэба будзе набыць толькі некалькі навыкаў і выкарыстоўваць шэраг інструментаў, каб пачаць выконваць простыя задачы. Калі вы адчуеце сябе камфортна на гэтым узроўні, вы можаце паспрабаваць перайсці на новы набор інструментаў і няўхільна развівацца. Прытрымліваючыся гэтай метадалогіі, мы паспрабуем пабудаваць трывалую аснову ў галіне вэб-распрацоўкі праз вывучэнне тэхналогій і інструментаў, якія выкарыстоўваюцца для стварэння простых мэтавых старонак.
У гэтым паведамленні ў блогу мы зробім кароткае даследаванне ландшафту вэб-распрацоўкі інтэрфейсу з акцэнтам на распрацоўцы мэтавай старонкі. Мы разгледзім падборку рэсурсаў, якія рэкамендуем вам праверыць для розных частак распрацоўкі, з якімі вы можаце сутыкнуцца. Да канца гэтага артыкула ў вас будзе больш дакладнае ўяўленне аб тым, як стварыць мэтавую старонку. Паглядзіце гэта суправаджальнае відэа для практычнага прыкладу.
Ландшафт развіцця мэтавай старонкі
Мэтавая старонка - гэта тэрмін, які першапачаткова выкарыстоўваўся экспертамі па лічбавым маркетынгу для абазначэння аўтаномнай вэб-старонкі, якая выкарыстоўваецца ў мэтах маркетынгу і рэкламнай кампаніі. Канцэпцыя даволі простая: наведвальнік, зацікаўлены ў прадукце або паслузе, якія прадстаўляюцца кампаніяй, пстрыкае па спасылцы названага прадукту, затым «прызямляецца» на вэб-старонку, якая змяшчае багатае апісанне прадукту або тэксту, малюнкаў і г.д. абслугоўванне. На старонцы ёсць кнопка пакупкі, якая называецца «CTA» (Call To Action), каб пераўтварыць наведвальніка ў плацежаздольнага кліента. Як вы можаце чакаць, стварэнне добрага карыстацкага досведу мае першараднае значэнне для добрага каэфіцыента канверсіі.
У гэтым артыкуле мы даведаемся пра мноства спосабаў і інструментаў, якія дазволяць нам ствараць мэтавыя старонкі, якія выконваюць сваю ролю. Важна адзначыць, што ёсць і іншыя меркаванні пры стварэнні мэтавых старонак, звязаных з SEO (пошукавая аптымізацыя). SEO будзе разгледжана на будучых семінарах.
Натхненне для дызайну
Незалежна ад таго, маеце вы вопыт у стварэнні мэтавых старонак або толькі пачынаеце, вы ўбачыце, што часта бывае цяжка дакладна вызначыць, як менавіта вы хочаце, каб выглядаў ваш сайт. Пры працы з кліентамі таксама часта бывае, што яны не ведаюць дакладна, які дызайн хочуць для сваёй вэб-старонкі. Звычайна макет дызайну і прататып перадаюцца распрацоўніку вэб-дызайнерам, які спецыялізуецца на такіх работах. Можа быць карысна мець надзейную крыніцу вэб-дызайну. Такія крыніцы дазволяць вам быць у курсе тэндэнцый дызайну, падштурхнуць ваш творчы патэнцыял і... дапамогуць вам пачаць працу. Два з лепшых рэсурсаў, якія вы можаце выкарыстоўваць, каб атрымаць натхненне для дызайну для вашага наступнага праекта, гэта Dribbble і Behance.
Дрыббл
Dribbble, верагодна, самы папулярны рэсурс у прасторы вэб-дызайну. Гэта супольнасць дызайнераў, якія дзеляцца сваёй працай, каб палепшыць свае навыкі, дапамагчы адзін аднаму і атрымаць канструктыўную зваротную сувязь. Ён змяшчае шырокі спектр дызайнаў практычна па любой тэме або вобласці, створаных творчымі людзьмі з усяго свету, разам з водгукамі супольнасці, што робіць яго ідэальным месцам для натхнення.
Behance
Behance - яшчэ адна папулярная супольнасць дызайнераў, якая можа дапамагчы вам знайсці натхненне. Гэты вэб-сайт прапануе пашыраныя функцыі пошуку, якія даюць вам лёгкі доступ да канкрэтнай працы, якая вас цікавіць, з дапамогай ключавых слоў, палёў і каляровай палітры. Таксама важна адзначыць, што Behance з'яўляецца часткай Adobe і акуратна інтэгруецца з творчым воблакам Adobe.
Dribbble і Behance - выдатныя платформы для натхнення для вэб-дызайну, і вы не памыліцеся з імі. Мы рэкамендуем вам пачаць вывучаць дызайн і прыдумаць свой!
Прататып дызайну
Цяпер, калі вы натхніліся працамі таленавітых дызайнераў, прыйшоў час пачаць ствараць прататып дызайну вашай мэтавай старонкі. Стварэнне прататыпа - важны этап стварэння мэтавай старонкі. Яго можна вызначыць як эксперыментальны працэс, у якім вы ўкараняеце ідэі ў бачныя структуры, каб вы маглі ўдакладніць і пацвердзіць іх са сваёй камандай або кліентам. Да канца этапу стварэння прататыпа ў вас будзе дызайн, гатовы да ўвасаблення ў жыццё на вашай мэтавай старонцы.
Існуе мноства праграмных рашэнняў, якія можна выкарыстоўваць для стварэння прататыпаў дызайну. На самай справе іх так шмат, што хутка можа стаць складана ацаніць, параўнаць і выбраць адзін інструмент. Мы збіраемся выкарыстоўваць Figma, паколькі яна звычайна выкарыстоўваецца ux/ui дызайнерамі. Калі вы жадаеце даведацца, як выкарыстоўваць Figma для стварэння прататыпаў, вы можаце азнаёміцца з нашым паскораным курсам на YouTube тут.
Фігма
Figma - гэта ўніверсальны інструмент дызайну, які дазваляе дызайнерам і распрацоўшчыкам UX лёгка ствараць і супрацоўнічаць над прататыпамі дызайну на воблачнай платформе на аснове браўзера . Figma робіць акцэнт на прастаце і лёгкасці выкарыстання.
Інтэрфейс Figma дазваляе ствараць элементы і стылізаваць іх, кіруючы выглядам тэксту, сетак і іншых кампанентаў на старонцы. Ён прапануе шырокі спектр дадатковых плагінаў, такіх як Autoflow для дэманстрацыі патокаў карыстальнікаў, Figmotion для анімацыі і шмат іншага.
Значкі і шрыфты
Значкі тыпаграфікі і стылю - гэта адны з самых простых функцый, якія можна выкарыстоўваць для паляпшэння выгляду любой вэб-старонкі. Вы хочаце выкарыстоўваць правільны шрыфт і значкі на сваёй мэтавай старонцы ў адпаведнасці з агульнай ідэяй, якую вы хочаце паведаміць. На шчасце, лёгка знайсці і прымяніць вялікі выбар шрыфтоў і значкоў з дапамогай Font Awesome або Google Fonts.
Выдатны шрыфт
Font Awesome - гэта набор інструментаў для шрыфтоў і значкоў на аснове CSS і Less . Па стане на 2020 год Font Awesome выкарыстоўваўся на 38% сайтаў, якія выкарыстоўваюць сцэнарыі шрыфтоў іншых вытворцаў, што паставіла яго на другое месца пасля Google Fonts (Wikipedia).
Font Awesome падтрымліваецца многімі інтэрфейснымі бібліятэкамі, такімі як Bootstrap, для якой ён першапачаткова быў створаны. Font Awesome робіць інтэграцыю шрыфтоў і значкоў у вэб-старонку такой жа простай, як уключэнне спасылкі CDN. Такая прастата выкарыстання разам з вялікім выбарам шрыфтоў і значкоў зрабіла яго самым папулярным рашэннем у прасторы.
Google Fonts
Google Fonts - гэта бясплатны вэб-сэрвіс з адкрытым зыходным кодам, які прапануе Google для ўбудавання шрыфтоў на вэб-сайты. Ён прапануе бясшвоўную інтэграцыю і высокі ўзровень гнуткасці і налад.
Разгарніце мэтавую старонку
Цяпер, калі вы стварылі мэтавую старонку, прыйшоў час падзяліцца ёю з усім! Апошнім крокам з'яўляецца разгортванне вашай мэтавай старонкі з дапамогай рашэння хостынг-правайдэра. Старонкі Github і Vercel - наш галоўны выбар. Яны найбольш папулярныя і простыя ў выкарыстанні. Vercel - гэта інструмент, прадстаўлены на нашым семінары, але Github Pages працуе падобным чынам.
Старонкі Github
Калі вы зараз вучыцеся праграмаваць, хутчэй за ўсё, вы чулі пра Github. Github - гэта платформа для абмену і размяшчэння кода ў рамках супольнасці з адкрытым зыходным кодам. Ён прапануе функцыю пад назвай GitHub Pages, якая з'яўляецца паслугай хостынгу для публічных вэб-старонак, якімі могуць карыстацца прыватныя асобы і арганізацыі. Усе старонкі бясплатна размяшчаюцца на дамене github.io GitHub або на карыстальніцкім даменным імені, калі вы ім валодаеце. Старонкі GitHub - гэта просты і эфектыўны спосаб бясплатнага размяшчэння вашых праектаў, калі вы ўжо выкарыстоўваеце Github для кантролю версій.
Верцэль
Vercel - гэта альтэрнатыва Github Pages, якая прапануе шырокі спектр функцый і канфігурацый. Ён пастаўляецца з бясплатнай версіяй. Мы рэкамендуем Vercel для тых, хто мае складаны праект, таму што ён забяспечвае выдатны вопыт распрацоўшчыка і прапануе выдатную падтрымку. Code Labs Academy выкарыстоўвае яго як частку свайго працэсу распрацоўкі.
Выснова
У гэтым артыкуле прадстаўлены карысныя інструменты для стварэння мэтавай старонкі. Зноў! Лепшы спосаб вучыцца на практыцы, таму мы настойліва рэкамендуем вам выкарыстоўваць гэтыя інструменты ў вашым асабістым праекце! Вялікая частка працы распрацоўшчыка заключаецца ў даследаванні існуючых рашэнняў праблем, з якімі яны сутыкаюцца, і ўхіленні ад вынаходніцтва ровары. Самае выдатнае ў супольнасці праграмістаў - гэта яе характар супрацоўніцтва. Мы заклікаем вас скарыстацца працай, якой падзяліліся іншыя, і ўнесці свой уклад!
І калі вы хочаце даведацца больш аб распрацоўцы класных вэб-сайтаў і іх стварэнні, тады вы хочаце праверыць нашы UX/UI Design і Вэб-распрацоўка Навучальныя лагеры!
- Станьце прафесіяналам кадавання ў сваім уласным тэмпе! Далучайцеся да Code Labs Academy Code Labs Academy Online Part-Time Bootcamp і павысіце навыкі кадавання. Падбярыце навучанне да свайго раскладу і пачніце свой шлях у тэхналогію сёння!*
