Canva тегін және ақылы нұсқаларының айырмашылығы

Жұмыс түрі: Дипломдық жұмыс
Тегін: Антиплагиат
Көлемі: 57 бет
Таңдаулыға:

ҚЫСҚАРТЫЛҒАН СӨЗДЕР
HTML - HyperText Markup Language
CSS - Cascading Style Sheets
URL - Uniform Resource Locator
WWW - World Wide Web
CD-ROM - Compact Disc Read-Only Memory
SQL - Structured Querly Language
ДЕК - Дербес есептеуіш компьютер

КІРІСПЕ
Біз 21 ғасыр ұрпағымыз - ғылыми-техникалық прогрестің уақыты, сондықтан технология біздің өмірімізде маңызды орын алады. Оларсыз біз өз өмірімізді елестете алмаймыз.
Көбімізде смартфондар, ноутбуктер, планшеттер, сымсыз құлаққаптар, динамиктер және басқа да құрылғылар бар, біз оларды күнделікті байқамай-ақ оңай пайдаланамыз. Интернет достармен қашықтан сөйлесуге және әлемде болып жатқан барлық оқиғалардан хабардар болуға мүмкіндік береді. Арнайы қосымшалардың көмегімен біз сатып алулар жасап, төлеуге, тұрмыстық техника мен интерактивті ойыншықтарды басқаруға, қала бойынша көліктердің қозғалысын бақылауға және т.б.
Технологияның тоқтамайтынына және күн сайын дерлік таң қалдыра беретініне қуаныштымын. Көліктердің, смартфондардың, компьютерлердің жаңа жетілдірілген үлгілері пайда болды. Мүлдем жаңа гаджеттер ойлап табылуда, біздің әлемді барған сайын заманауи ететін жаңа технологиялық процестер ойлап табылуда. Мысалы, біз өздігінен жүретін көліктердің, жасанды интеллекттің, жаңартылатын энергияға көшу және т.б. Мұның бәрі адамдарға аз жұмыс істеуге, ал көбірек шығармашылықпен, отбасымен айналысуға, көбірек саяхаттауға, қарым-қатынас жасауға және т.б. мүмкіндік береді.
Дипломдық жобада Веб-дизайнер мамандығына арналған арналған цифрлық стенд әзірленген. Берілген электронды оқу құралы іс жүзінде маңызы зор. Бұл бағдарламалық өнімді барлық оқу орындары қажет етеді. Себебі есептеу кешенінің операциялық жүйелері жан-жақты қарастырылып, болашақ маман кеңейтілген түрде мәлімет ала алады.
Қолданушы интерфейсі, бағдарламалау жүйесінде өте маңызды рөль атқарады. Себебі ол қолданушының бағдарламамен жұмыс істеу күйін анықтайды. Мысалыға, егер бағдарламашы өз бағдарламасы үшін ашық түстерді қолданатын болса, бағдарлама қолданушы көзін тез шаршап қалуына әкеледі.
Білім берудің кез - келген саласында Электронды курстарды пайдалану студенттердің танымдық белсенділігін арттырып қана қоймай, логикалық ойлау жүйесін қалыптастыруға, шығармашылық пен еңбек етуіне жағдай жасайды.
Дипломдық жобаның мақсаты: CSS, HTML, JavaScript, Canva, Меморис бағдарламаларын қолдана отырып, Веб-дизайнер мамандығына арналған цифрлық стенд әзірлеп, оны оқытушыларға әдістемелік дидактикалық құрал ретінде, ал студенттерге негізгі құрал ретінде ұсыну.
Дипломдық жобаның өзектілігі: Мамандықты өздігінен үйренуге арналған оқу үрдісіне көмекші қосымшаны, яғни электронды оқу құралын қолдану арқылы Веб-дизайнер мамандығына деген студенттердің белсенділігін арттыру.
Дипломдық жобаның міндеттері:
Веб-дизайнер мамандығы бойынша жұмыстық бағдарламаны саралау;
Веб-дизайнер мамандығы бойынша оқулықтардың мазмұнымен танысып, сабақты қызықты өткізу мүмкіндіктерін зерттеу;
пәнді өздігінен үйренуге арналған оқу үрдісіне көмекші қосымша электронды оқу құралын құру.
Жобаның практикалық маңыздылығы:
Дипломдық жобаның материалын оқу орындары Веб дизайнер мамандығын оқытуда практикалық жұмыстарды ұйымдастыра отырып, қолдануға болады. Әсіресе тақырыпты талдау және орындау кезінде, студенттер мен оқытушыларға аталған электронды оқу құралын қолдануды ұсынамыз.
Дипломдық жоба мынадай бөлiмдерден тұрады: кіріспе, қойылымдық бөлім, жобалық бөлім, дипломдық жобаны өңдеудің аспаптық құралдары,эксплуатация, экономикалық бөлімі, қауіпсіздік ережесі және қоршаған ортаны қорғау бойынша іс-шаралары бөлімі, қорытынды, пайдаланылған әдебиеттер және қосымша
ҚОЙЫЛЫМДЫҚ БӨЛІМ
1.1 Есеп қойылымының тұжырымдамасы
Дипломдық жобаның тапсырмасы Веб дизайнер мамандығына арналған цифрлық стенд құру болып табылады.
Цифрлық стендтің құрамының ерекшелігі: Бірінші Qr code-ті сканерлеу арқылы Веб дизайнер мамандығына арналған ақпараттар бар сайтқа өтеді. Ақпараттар жиынтығы сайтында қолданушыға өз білімін нығайтуға арналған HTML, CSS, Дизайн туралы мәліметтер және қолданушыға көмек ретінде Видеосабақтар орналасқан. Жоба мемлекеттік тіл-қазақ тіліне де, ресми тіл-орыс тіліне де аударылып, қолданушыға ыңғайлы етіп жасалды. KZ- батырмасы арқылы қазақ тіліне, ал RU- батырмасы арқылы орыс тіліне аударылады. Бағдарламалық өніммен шектеусіз қолданушылар саны қолдана алады.
Веб дизайнер мамандығына арналған цифрлы стенд қолданушы жұмысын тиімді, әрі жылдам орындау үшін арналған. Сондықтан да бағдарламалық кешеннің құрамы Веб дизайнер мамандығы бойынша қажетті ақпараттар жиынтығынан тұрады және кез-келген бөлімге тез қатынауды жүзеге асырады. Стендте көрсетілген екінші Qr-code-ті сканерлеу арқылы қолданушылар үйренген білімдерін нақтылап, тест тапсыра алады. Берілген тест сұрақтарын оқып, бірнеше жауаптардың ішінен дұрыс деп санаған жауапты таңдап,бірден ол жауаптың дұрыс немесе бұрыс екендігін біле алады. Ал үшінші Qr-code-ті сканерлеу арқылы тірілетін фотодан Веб дизайнер мамандығына арналған видеоны көре аласыздар.

1.2 Кіріс және шығыс ақпаратының сипаттамалары
Бағдарламадағы құжаттар негізгі екі түрге бөлінеді. Олар кіріс және шығыс деп аталады. Кіріс құжаттар дегеніміз кеңейтілуі әртүрлі болатын, яғни бағдарламаға кіретін құжаттарды айтады, ал шығыс дегеніміз бағдарламадан шығатын құжаттарды айтуға болады. Көрсетілген өнімде кіріс ақпараттар құрамына суреттер, кестелер, сызбалар кіреді, ал шығыс ақпараттарға оқулық негізін құрайтын мәлімет беттері болып табылады.
Бағдарламаның экрандық интерфейсі қолданушы жұмысының ыңғайлылығын көп мәнде анықтайды және еңбек тиімділігіне әсер ететін ең маңызды факторларының бірі болып табылады. Барлық қажетті функцияларды орындайтын, жоғарғы жылдамдыққа ие бағдарламалар, алайда қолданушы жұмысына қолайсыз болатын интерфейс себебінен жұмысқа жарамсыз болуы мүмкін.
Веб дизайнер мамандығына арналған цифрлық стенді қолданушыға ыңғайлы және қолайлы болып келеді. Барлық жазулардың шрифті мен түсін қабылдап, қолданғанға ыңғайлы болып келеді. Формадағы түстер көзді ауыртпайды.

ЖОБАЛЫҚ БӨЛІМ
2.1 Цифрлық стендтерді құру жолдары және оларға қойылатын талаптар
Цифрлық стенд дегеніміз - мультимедиялық оқулық, сондықтан электронды оқулықтың құрылымы сапалы жаңа деңгейде болуға тиіс. Цифрлық стенд оқушының уақытын үнемдейді, оқу материалдарын іздеп отырмай, өтілген және оқушының ұмытып қалған материалдарын еске түсіруге зор ықпал етеді. Себебі, оқушының өзіне көрнекілік қолданған тиімді қажет элементінің жанында жазуы болады.
Электронды оқыту бейне, аудио, мультимедиа технологиясы мен олардың әр түрлі комбинацияларын енгізуге байланысты болып отыр.
Электронды оқытудың негізгі мәселелері ақпараттық-коммуникативтік технология негізінде ақпараттық білім беру ортасын құру және оны тиімді пайдалану болып табылады.
Цифрлы стенд мынандай жағдайларда тиімді: кері байланыспен лезде қамтамасыз ете алады; гипермәтіндік түсініктемелердің көп рет қолданған кезде уақытты үнемдейді; белгілі бір бөлім бойынша білімді тексереді; қысқа мәтінмен көрсете, айта және модельдей алады.
Цифрлы стенд пен электронды оқытудың негізгі мақсаты: "Оқыту процесін үздіксіз және толық деңгейін бақылау, сонымен қатар ақпараттық ізденіс қабілетін дамыту". Білім берудің кез келген саласында "Электронды оқулықтарды" пайдалану окушылардың танымдық белсенділігін арттырып қана коймай ойлау жүйесін калыптастыруға шығармашылықпен еңбек етуіне жағдай жасайды.
Оқыту үрдісінде оқыту әдістерін тиімді пайдалану, білім беру жүйесін тұтастай ақпараттандыру арқылы жаңа оқыту технологиясын енгізу оқыту процесінде толыққанды дамуына мүмкіндік жасайды. Оқыту процесінде компьютерге негізделген жеке әдістемелер оқу мақсаттары мен жағдайларына байланысты тиімді қолданылуы қажет.
Оқытудың тиімділігі оқытудың жеке тұлғалық стиліне, яғни, оқушыға оқу материалын тиімді сипаттайтындай қабылдау механизміне тәуелді болады. Осыған байланысты оқу іс-әрекетін тиімді қамтамасыз ету бәрінен бұрын студенттердің өзіндік іс-әрекетін, оқытушының әрбір оқушымен жеке тұлғалық оқу іс-әрекетін сүйемелдеуді және жобалар мен оқу жұмыстарын оқытушылармен бірге ұйымдастыруды жобалайды.
Осылайша ақпараттық технологиялардың дамуы жаңа әдіс-тәсілдердің пайда болуына және сонымен бірге оның сапасын жоғарылатады.
Электронды оқытудың технологиялық құралдарын былайша топтастыруға болады:
аппараттық құралдар, мультимедиалық бағдарламалар және Интернет;
электронды оқытуды әзірлеудің бағдарламалық құралдары;
оқу үрдісін басқарудың ақпараттық жүйесі.
Мемлекеттік стандарт бойынша электронды оқулықтың басылымына мынадай талаптар қойылады: оның құрылымы, функциясы, мазмұны, оқыту элементтері, көркемделуі, құжаттандырылуы.

2.2 QR код туралы түсінік
Qr коды - бастапқыда жапонияның автомобиль өнеркәсібі үшін әзірленген матрицалық штрих-кодтардың түрі (немесе екі өлшемді штрих-кодтар). Оның жасаушысы - масахиро хара.Терминнің өзі жапондық denso компаниясының тіркелген сауда белгісі болып табылады. Штрих-код - ол бекітілген нысан туралы ақпаратты қамтитын машина оқи алатын оптикалық жапсырма. Qr коды деректерді тиімді сақтау үшін төрт стандартталған кодтау режимін (сандық, әріптік-сандық, екілік және канжи) пайдаланады; кеңейтімдері де пайдаланылуы мүмкін.
Qr код жүйесі upc стандартты штрих-кодтарына қарағанда жылдам оқылатындығы мен жоғары сыйымдылығы арқасында автомобиль өнеркәсібінен тыс танымал болды. Кеңейтімдерге өнімді қадағалау, элементтерді сәйкестендіру, уақытты бақылау, құжаттарды басқару және жалпы маркетинг жатады.
Qr коды ақ фонда төртбұрышты торға орналастырылған қара шаршылардан тұрады, оларды камера сияқты бейнелеу құрылғылары арқылы оқуға болады және сурет дұрыс танылғанға дейін рид-соломон кодтары арқылы өңдеуге болады. Содан кейін қажетті деректер кескіннің көлденең және тік құрамдас бөліктерінде болатын үлгілерден алынады.
QR коды жоқ күндері Denso зауытында әртүрлі штрих-кодтармен компоненттерді сканерлеу жүргізілді. Алайда, олардың саны 10-ға жуық болғандықтан, жұмыс тиімділігі өте төмен болды, ал жұмысшылар тез шаршайтынына шағымданды, сонымен қатар қарапайым штрих-кодқа қарағанда көбірек ақпаратты қамтитын код жасауды сұрады. Осы жұмысшының сұрауына жауап беру үшін Denso-Wave жоғары жылдамдықты құрамдас сканерлеуді қосу үшін қосымша ақпаратты қамтитын кодты жасауға кірісті.Бұл үшін әзірлеу бөлімінде жұмыс істеген Масахиро Хара 1992 жылдан бастап жаңа кодты әзірлеуге кірісті.QR кодының шабыты Масахиро Хара түскі үзіліс кезінде ойнаған Go ойынынан алынды.Ол жобаның мақсаты код ақпаратының көлемін ұлғайту ғана емес, сонымен қатар дәл және жылдам оқу, сонымен қатар кодты оқылатын және май дақтарына, ластануға және зақымдануға төзімді ету деп шешті. сәйкес салаларда қолданылады. QR кодын жапондық Denso-Wave компаниясы 1994 жылы екі жылдық даму кезеңінен кейін енгізді. Ол автокөлік бөлшектерін шығаратын зауыттар мен дистрибьюторлық орталықтарда пайдалану үшін Toyota компаниясының Kanban (Дәл уақытында) өндіріс жүйесін ескере отырып жасалған. Дегенмен, оның қателерді анықтау және түзету мүмкіндігі жоғары болғандықтан және ашық бастапқыда жасалғандықтан, ол Toyota компаниясының өндірістік жеткізу тізбегінің тар шеңберінен шығып, басқа салаларда қолданылды, бұл оның қазір ғана емес, кеңінен қолданылуына әкелді. Жапонияда, бірақ бүкіл әлемде. Жапонияда штрих-кодтардың үлкен танымалдылығы олардағы кодталған ақпараттың көп ұзамай салаға сәйкес келмей қалуына әкелді. Жапондықтар графикалық суреттегі шағын көлемді ақпаратты кодтаудың жаңа заманауи әдістерін тәжірибе жүзінде қолдана бастады. QR коды әлемдегі екі өлшемді кодтың ең көп қолданылатын түрлерінің біріне айналды. QR коды спецификациясы деректер пішімін сипаттамайды.
Жіңішке сәулемен сканерленетін ескі штрих-кодтан айырмашылығы, QR коды сенсор немесе камера арқылы екі өлшемді кескін ретінде анықталады. Кескіннің бұрыштарындағы үш шаршы және кодтағы кішірек уақыт квадраттары кескін өлшемі мен бағытын, сондай-ақ сенсор кескін бетіне орналасатын бұрышты қалыпқа келтіреді. Ұпайлар бақылау сомасын тексеру арқылы екілік сандарға түрлендіріледі.
QR-кодтың басты артықшылығы - оны саудада, өндірісте және логистикада пайдалануға мүмкіндік беретін жабдықты сканерлеу арқылы оңай тану.QR коды DENSO корпорациясының тіркелген сауда белгісі болса да, кодтарды пайдалану роялтиге жатпайды және олар ISO стандарттары ретінде сипатталады және жарияланады.
Ең танымал QR кодты қарау құралдары келесі деректер пішімдерін қолдайды: URL, браузер бетбелгі, Электрондық пошта (тақырып жолымен), нөмірге SMS (тақырып жолымен), MeCard, vCard, географиялық координаттар, Wi-Fi желісіне қосылым.
Сондай-ақ, кейбір бағдарламалар GIF, JPG, PNG немесе MID файлдарын 4 КБ-тан кіші және кодталған мәтінді тани алады, бірақ бұл форматтар танымал болған жоқ.
Ең кіші QR коды (1-нұсқа) 21x21 пиксель, ең үлкені (40-нұсқа) 177x177 пиксель. Нұсқа нөмірі мен модульдер саны арасындағы байланыс қарапайым - келесі нұсқаның QR коды алдыңғысынан көлденең және тігінен қатаң 4 модульге үлкен.
QR кодтарының төрт негізгі кодтауы бар:
Сандық: 10 бит үш таңбалы, 7089 цифрға дейін.
Әріптік-сандық: 10 цифр, А-дан Я-ға дейінгі әріптер және бірнеше арнайы таңбаларға қолдау көрсетіледі. Екі таңбаға 11 бит, 4296 таңбаға дейін
Байт: кез келген қолайлы кодтаудағы деректер (әдепкі бойынша ISO 8859-1), 2953 байтқа дейін.
Канджи: әр таңбаға 13 бит, 1817 таңбаға дейін.
Сондай-ақ псевдокодтаулар бар: деректердің кодталуын көрсету, ұзын хабарламаны бірнеше кодтарға бөлу және т.б.
Қателерді түзету үшін 8 биттік код сөзі бар Рид-Соломон коды қолданылады. Артықшылықтың төрт деңгейі бар: 7, 15, 25 және 30%. Қатені түзетудің арқасында суретті QR кодына қоюға және оны оқуға болатын етіп қалдыруға болады.
Кодта сканерді шатастыратын элементтер болмауы үшін деректер аймағына арнайы маскамен 2 модулі қосылады. Дұрыс жұмыс істейтін кодтаушы маска опцияларының барлығын қолданып көруі керек, арнайы ережелерге сәйкес әрқайсысы үшін айыппұл ұпайларын есептеп, ең сәттісін таңдауы керек.
QR-кодта ақпаратты кодтаудың бірнеше жолы бар және белгілі бір әдісті таңдау қандай белгілер қолданылатынына байланысты. Егер тек 0-ден 9-ға дейінгі сандар ғана пайдаланылса, онда цифрлардан басқа латын әліпбиінің әріптерін, бос орын мен $%*+-.: таңбаларын, әріптік-сандық кодтауды кодтау қажет болса, онда сандық кодтауды қолдануға болады. пайдаланылады. Сондай-ақ қытай және жапон таңбаларын кодтау үшін қолданылатын канжи кодтау және байт кодтау бар. Әрбір кодтау әдісінің алдында бос бит тізбегі жасалады, содан кейін ол толтырылады.
Бұл кодтау түрі 3 таңбаға 10 бит қажет. Бүкіл символдар тізбегі 3 цифрдан тұратын топтарға бөлінеді және әрбір топ (үш таңбалы сан) 10 разрядты екілік санға аударылады және разрядтық тізбегіне қосылады. Егер символдардың жалпы саны 3-ке еселік болмаса, онда соңында 2 таңба қалса, алынған екі таңбалы сан 7 битпен, ал 1 символ болса, 4 битпен кодталады.
Мысалы, кодтауды қажет ететін 12345678 жолы бар. Тізбек сандарға бөлінеді: 123, 456 және 78, содан кейін әрбір сан екілік түрге түрленеді: 0001111011, 0111001000 және 1001110 және бір разрядтық ағынға біріктіріледі: 0001111011011100110.
Сандық кодтаудан айырмашылығы, 2 таңбаны кодтау үшін 11 бит ақпарат қажет. Таңбалар тізбегі 2 топқа бөлінеді, топта әрбір таңба Әріптік-цифрлық кодтаудағы таңба мәндері кестесіне сәйкес кодталады. Бірінші таңбаның мәні 45-ке көбейтіледі, содан кейін екінші таңбаның мәні осы көбейтіндіге қосылады. Алынған сан 11-разрядты екілік санға түрлендіріліп, разряд тізбегіне қосылады. Егер соңғы топта бір таңба қалса, онда оның мәні 6 разрядты сан ретінде кодталады. Мысалды қарастырайық: "PROOF". Таңбалар тізбегін топтарға бөлеміз: PR, OO, F. Әр топ үшін таңбаларға сәйкес мәндерді табамыз (кестеге қараңыз): PR - (25.27), OO - (24.24), F - ( 15). Әр топтың мәндерін табыңыз: 25 x 45 + 27 = 1152, 24 x 45 + 24 = 1104, 15 = 15. Әр мәнді екілік санаға түрлендіру: 1152 = 10010000000, 1104 = 10001010000, Co1100, Co1100. реттілік: 1001000000010001010000001111.
Кез келген символды осылайша кодтауға болады. Кіріс таңбалар ағыны кез келген кодтауда кодталады (UTF-8-де ұсынылады), содан кейін екілік пішімге түрлендіріледі, содан кейін ол бір биттік ағынға біріктіріледі.
Мысалы, Юникодта (HEX) Әлем сөзін UTF-8-де кодтаймыз: M - D09C; және - D0B8; p - D180. Әрбір мәнді екілік жүйеге аударамыз: D0 = 11010000, 9C = 10011100, D0 = 11010000, B8 = 10111000, D1 = 11010001 және 80 = 10000000; бір разрядқа біріктіру: 11010000 10011100 11010000 10111000 11010001 10000000.
Иероглифтерді (басқа белгілер сияқты) кодтау визуалды түрде қабылданатын кестеге немесе олардың кодтары бар иероглифтердің кескіндерінің тізіміне негізделген. Мұндай кесте таңбалар жиыны деп аталады. Жапондар үшін екі таңбалар кестесінің маңыздылығы бар: JIS 0208:1997 және JIS 0212:1990. Олардың екіншісі біріншісіне қосымша қызметін атқарады. JIS 0208:1997 94 таңбадан тұратын 94 бетке бөлінген. Мысалы, 4-бет - хирагана, 5-ші бет - катакана, 7-ші - кириллица, 16-43 - 1-деңгей канжи және 48-83 - 2-деңгей канжи. 2-деңгейдегі канжи (JIS daini suijun kanji) перне бойынша, ал олардың ішінде штрих саны бойынша реттелген.

2.3 Цифрлық стендтің жасалу жолы
Цифрлық стендтің ең маңызды құрамы QR-code болғандықтан, ең алдымен соған тоқталып өтсем.
Кодты шифрлау алгоритмі өте күрделі, бірақ соған қарамастан барлық генераторлар кез келген QR кодын санаулы секундтарда жасай алады.Мен QR Coder.ru генераторын қолдандым (2.3.1-сурет).

2.3.1-сурет. QR Coder.ru генераторы
Qr-code жасау үшін ең алдымен QR-code-қа салғымыз келген сайтымыздың URL адресін көшіріп аламыз (2.3.2-сурет).

2.3.2-сурет. URL - адрес
URL адресті көшіріп алғаннан кейін генератордың арнайы сілтемені салатын батырмасына саламыз. Осыдан кейін бізге генератор QR-code-ті шығарып береді (2.3.3-сурет).

2.3.3-сурет.Дайын QR-code
Ал енді цифрлық стендтің жасалу жолына тоқталсам. Цифрлық стендті Canva редакторлық бағдарламасы өте ыңғайлы,әрі жеңіл болғандықтан осы бағдарламада жасадым (2.3.4-сурет).

2.3.4-сурет.Canva бағдарламасының негізгі беті
Жаңа жобаны бастап,ең алдымен Элементы батырмасындағы фонға түс беру функциясы арқылы фонға түс беріп,қажетті фотоларды қиып қоямыз (2.3.5-сурет).

2.3.5-сурет. Элементы батырмасы
Екінші кезекте Тексты батырмасын басу арқылы стендке жазылатын сөйлемдерді жазып, қоямыз (2.3.6-сурет).

2.3.6-сурет. Тексты батырмасы
Осындай қарапайым әдістермен біздің цифрлық стенд дайын болды (2.3.7-сурет).

2.3.7-сурет. Цифрлық стендтің дайын нұсқасы

ДИПЛОМДЫҚ ЖОБАНЫ ӨҢДЕУДІҢ АСПАПТЫҚ ҚҰРАЛДАРЫ
3.1 Canva бағдарламасы туралы түсінік
Canva - әлеуметтік медиа иллюстрацияларынан басып шығару макеттеріне дейін графикалық дизайн элементтерін жасауға арналған онлайн қызмет. 2012 жылы Австралияда құрылған.
Бұл редактордың басты артықшылығы - оның қарапайымдылығы. Сервис дизайнды барлығына, тіпті сурет сала алмайтындарға да қолжетімді етуге тырысады. Canva ақылы да, тегін де қол жетімді. Рас, екінші жағдайда кейбір шектеулер бар, олар төменде талқыланады.
Canva тегін және ақылы нұсқаларының айырмашылығы
Тегін нұсқада келесідей мүмкіндіктер бар:
Жүктеп салынған фотосуреттерді, бейнелерді және басқа элементтерді сақтау үшін тек 1 ГБ беріледі.
Үлгілердің, кескіндердің және басқа элементтердің бір бөлігі ғана пайдаланушыға қолжетімді. Ақылы элементтерді енгізсеңіз, олар су белгісімен белгіленеді.
Дизайнмен бір уақытта бір адам ғана жұмыс істей алады.
Қолдау қызметі жоқ.
Тек кірістірілген қаріптерді пайдалануға болады.
Мүмкіндіктердің ақылы нұсқасында, әрине, әлдеқайда көп:
Дизайндар мен жүктеп салынған файлдарды сақтау үшін 100 ГБ немесе одан көп беріледі.
Сіз барлық шаблондарды пайдалана аласыз және олардың кемінде 400 мыңы бар.
Сіз өзіңіздің қаріптеріңізді жүктей аласыз, тіпті өзіңіздің корпоративті түстер палитрасын жасай аласыз.
Қолдау қызметі көрсетілген.
Бір дизайнмен бір уақытта бірнеше адам жұмыс істей алады.
Бағдарламаның артықшылықтары
Қолдануға оңай.
Тегін шаблондар, суреттер, бейнелер, белгішелер және т.б.
Әртүрлі мақсаттағы дизайнды жасау.
Қорытынды жобаны әртүрлі форматтарда сақтау.
Браузер арқылы да, компьютерлер мен смартфондарға арналған қолданбаларды пайдалану мүмкіндігі.
Кемшіліктер
Тегін нұсқаға арналған Canva кемшіліктері:
Қаріптерге қатысты елеулі шектеулер.
Кескін өлшемін өзгерту мүмкін емес.
Стандартты үлгілердің шектеулі саны.
Canva қалай пайдалануға болады?
Ең алдымен тіркеліп, профиліңізді енгізуіңіз керек. Мұнда Google, Facebook немесе Apple тіркелгілері арқылы кіруге болады.
Бірінші жүйеге кіргеннен кейін сіз редактордың негізгі мүмкіндіктері мен құралдары туралы айтып беретін қысқаша кіріспе курсын өте аласыз.
Сіз түсінгеніңіздей, Canva-да әртүрлі мақсаттарға арналған көптеген шаблондар бар - визиткалардан бастап қону беттерінің макеттеріне дейін. Олардың барлығы негізгі беттегі сәйкес бөлімде қол жетімді.
Қаласаңыз, макет ішіндегі барлық элементтерді ауыстыра аласыз, қажет емес мәліметтерді алып тастай аласыз немесе коллекциядан жаңа белгішелер қоса аласыз - мұнда бәрі тек сіздің қиялыңызбен шектеледі.
Ал енді ең қызығы, сіз үлгіні тікелей редакторда өзгерте аласыз. Сіз бір нұсқаны таңдадыңыз делік, бірақ жол бойы сізге ұнамады. Үлгілер мәзірін ашып, кез келген басқа үлгіні таңдаңыз.
Canva-да кескіндермен жұмыс істеуге арналған көптеген құралдар бар. Мысалы, бөлек қосылуды қажет ететін әсерлер жиынтығы, қазірдің өзінде орнатылған көптеген сүзгілер, жарықтық, қанықтылық және т.б. параметрлері.
Canva да тамаша, өйткені оның мәтіннің көрінісін теңшеуге арналған тамаша құралдар жинағы бар. Қалыңдықты, курсив пен астын сызуды стандартты өзгертуден басқа, бір рет басу арқылы регистрді өзгертуге, нөмірленген және маркерленген тізімдерді жасауға және әртүрлі тәсілдермен туралауға болады.
Қаріптердің көптігіне де назар аударғым келеді. Айтпақшы, олардың кейбіреулері үшін қалың және курсив сияқты стиль параметрлерін пайдалану қол жетімді емес. Құралдар тақтасындағы элементті таңдау арқылы барлық үлгілерді көруге болады.
Айтпақшы, өлшемді екі жолмен өзгертуге болады. Біріншісі - құралдар тақтасындағы сәйкес өрісте ең жақсы опцияны жай ғана көрсету. Екіншісі - мәтінді құлағынан тарту.
Иә, Adobe Photoshop-та жасалғандай, Canva-да қабаттар санын қарай алмайсыз. Бірақ екінші жағынан, элементтерді жоғарғы немесе төменгі жоспарға жылжытуға, түзетуге және көшіруге, бірнеше элементтерді бір топқа топтастыруға болады, осылайша оларды жылжыту оңайырақ болады.
Кез келген нысан, ол мәтін, сурет немесе бейне болсын, мөлдір етіп жасауға болады. Бұл параметрді реттеу үшін жоғарғы оң жақ бұрышта арнайы белгіше бар. Оны басқаннан кейін жүгірткі пайда болады, оның көмегімен таңдалған элементтің мөлдірлігін реттеуге болады.
Canva-да қолданылатын барлық дерлік нысандарда жұмыс істейді. Сізге тек бір элементті таңдау керек, содан кейін жоғарғы оң жақ бұрыштағы ролик белгішесін басып, басқа нысанға пішімдеуді қолданыңыз. Фондағы фотосуретті ауыстырған кезде де жұмыс істейді.
Сүйреп апару мүмкіндігі осы қызметке белгілі бір себептермен енгізілген. Сіз өзіңіздің фотосуреттеріңіз бен кескіндеріңізді, бейнелеріңізді, логотиптеріңізді және тіпті музыканы енгізе аласыз. Мұның бәрі содан кейін аттас Жүктеулер бөлімінде қолжетімді болады.
Дегенмен, бос есептік жазбадағы жад шегін есте ұстаған жөн (1 ГБ). Кейде мен болашақта сізге пайдалы болмайтын файлдарды жоюды ұсынамын.
Кірістірілген жинақтағы бейнелерден таңдауға, сондай-ақ файлдарды компьютерден енгізуге болады. Бейне тым ұзын болса, оны кіріктірілген құралды пайдаланып кесіңіз.
Canva-ның тағы бір ерекшелігі - графиктерді құру және өзгерту мүмкіндігі. Сіз өзіңізге ұнайтын кез келген пішінді таңдай аласыз, деректерді енгізе аласыз және түстерді реттей аласыз. Диаграммада элементтердің кез келген саны болуы мүмкін, ешқандай шектеулер жоқ. Диаграмманы кірістіру үшін әдетте Қосымша қойындысында орналасқан Диаграммалар бөліміне өту керек.
Бұл редактордың әзірлеушілері әртүрлі қызметтерді біріктіру мүмкіндігін берді. Мысалы, сіз QR кодын, эмодзи эмотикондарын, Google Maps-тен орынды, Google Drive немесе Dropbox-тан кез келген файлдарды, YouTube бейнелерін, Flickr фотосуреттерін, GIPHY анимацияларын және т.б. енгізуге болады. Мұның бәрі, айтпақшы, жұмыс мәзірінің ең төменгі жағында орналасқан Қосымша қойындысында қол жетімді.
Дайын дизайнды Canva қызметінен экспорттаудың екі жолы бар - оны құрылғының жадына жүктеп алу немесе кез келген әлеуметтік желіге жіберу. Мүмкін болса, үлгіні басып шығаруға дереу жіберуге болады. Айтпақшы, жүктеп алу үшін көптеген танымал форматтар ұсынылады.
Басқа адамдармен бөлісудің үш әдісі бар - қарау, өңдеу және үлгіні пайдалану (соңғысы тек жазылым арқылы қол жетімді). Тегін нұсқа арқылы сіз дизайныңызды көруге немесе өңдеуге басқа пайдаланушыны шақыра аласыз. Мұның бәрі Бөлісу түймесін басқаннан кейін қол жетімді. Сілтеме жіберуге немесе қызметке тіркелу үшін пайдаланған электрондық пошта мекенжайын енгізуге болады.
Бірінші жағдайда, мысалы, маған сурет керек, бірақ қажетті өлшем шаблондарда жоқ. Бұл жағдайда Дизайн жасау түймесін басу керек, содан кейін Пайдаланушы параметрлер тармағына өту керек. Сәйкес өрістерге мен қажетті ұзындық пен енді енгіземін және сіз оларды пиксел, дюйм, миллиметр немесе сантиметрмен көрсете аласыз. Өлшемдері бар өрістердің астында Дизайн жасау түймесі жанады - мен оны басамын.
Көптеген кәсіби дизайнерлер Canva-ға күдіктенеді және тіпті мысқылдайды. Мұның бәрі мүмкіндігінше қарапайым болғандықтан және кез келген адам ондағы жұмысты меңгере алады. Иә, иә, Canva-да жұмыс істей отырып, сіз кәсіпқой болмайсыз, бірақ тапсырманы мүмкіндігінше қысқа мерзімде және қиындықсыз орындаңыз.

3.2 HTML-тілі және web-дизайнның негізгі ұғымдары
HTML (ағылшын тілінен HyperText Markup Language) -- мәтінді гипермәтіндік белгілеу тілі. Бұл веб-бетте элементтерді орналастыру үшін қажет: мәтін, суреттер, кестелер және бейнелер.
Сайтқа кірген кезде браузер веб-беттің құрылымы мен мазмұны туралы ақпараты бар HTML файлын жүктейді. HTML сайттың көрнекі негізін салады, бірақ сайтты өздігінен "іске қоспайды". Ол тек элементтердің қай жерде орналасқанын, олардың негізгі дизайны қандай болатынын, элементтер мен сценарийлер үшін стильдерді қайдан алуға болатындығын көрсетеді (әдетте олар JavaScript-те жазылады).
HTML тегтерден тұрады-браузерге орналастырылған мәтінді қалай көрсету керектігін көрсететін командалар. Әр тегтің аты бар бұрыштық жақшалар және .
Мысалы, мәтін әдетте p тегіне орналастырылады:
pСәлем, Әлем!p
Тегтер жұптастырылған және жұпталмаған. Жұптар екі тегтен тұрады -- ашу және жабу, ал жұпталмаған -- бір. Айтуынша, жұпталмаған тегті де жабуға болады, бірақ бұл міндетті емес.
Мысалы, сайтта суретті орналастыруға мүмкіндік беретін img тегі-жұпталмаған:
img scr='сурет.jpg' alt='photo of bird'
Әр тегтің атрибуттары бар. Олардың көмегімен сіз веб-беттің элементтеріне қосымша деректерді жібере аласыз: өлшемдер, элементтің бірегей идентификаторы, суреттерге сілтемелер және т.б.
Img элементі екі негізгі атрибутты қамтиды-src және alt. Біріншісі файлға сілтеме қосады, ал екіншісі файл жүктелмесе пайда болатын суретке қолтаңба қосады.
P тегі жұптастырылған, ол әрқашан pтегімен жабылуы керек. Жұптастырылған тегтер блоктарды белгілеу үшін қолданылады -- басқа элементтерді (соның ішінде блоктарды) салуға болатын элементтер. Оларға мыналар жатады:
контейнерлер (div);
абзацтар;
тақырыптар;
тізімдер;
кестелер.
P және img тегтері бар веб-бет коды осылай көрінеді:
p
Кейбір ілеспе мәтін. Әдетте мысалдарда қолданылады
p
img src='image.png'
p содан кейін бос орынды толтыру үшін тағы бір абзац бар.
Енді тағы бір тег қосыңыз -- center. Ол элементтерді экранда орталықтандырады. Содан кейін оған p және imgтегтерін салыңыз:
center
p
Кейбір ілеспе мәтін. Әдетте мысалдарда қолданылады
p
img src='image.png'
pсодан кейін бос орынды толтыру үшін тағы бір абзац бар.p
center
HTML сайттарда қалай жұмыс істейді?
Браузерлердің HTML файлдарын пайдаланып веб-беттерді қалай салатынын талдап көрейік.
Белгілеудің жұмыс принципі келесідей:
Сіз мекен-жай жолына сайттың немесе беттің мекен-жайын енгізесіз.Браузер осы мекен-жайға сұрау жібереді және файлды HTML форматында алады.
Алынған файлдың коды визуалды нысандарға дәйекті түрде түрлендіріледі.
Сонымен қатар, әр шолғыш элементтерді көрсету Ережелерін басшылыққа алады. Бұрын әзірлеушілер Internet Explorer, Firefox, Opera және басқа браузерлер үшін сайттардың бөлек нұсқаларын жасауға мәжбүр болды.
HTML-бұл сайттың қаңқасы. Онда браузер веб-бетті көрсетеді, CSS көмегімен "сұлулықты" бағыттайды және JavaScript арқылы логиканы қосады. Мысалы, HTML файлында тіркеуге болады:
гиперсілтемелер;
кестелер;
суреттер;
блоктар;
абзацтар;
пішіндер;
тақырыптар.
Сіз тіпті қарапайым дизайнды тікелей HTML-ге орната аласыз-мысалы, мәтін түсі мен қаріпін немесе блоктың фондық түсін орнатыңыз. Алайда, мамандар мұны ұсынбайды-CSS файлында стильдерді көрсеткен дұрыс. Онда сіздің қиялыңыз ештеңемен шектелмейді: кез-келген шегіністерді орнатыңыз, элементтерді стандартты емес тәсілдермен орналастырыңыз, мөлдірлікпен, көлеңкелермен және анимациямен ойнаңыз.
Әзірге пайдаланушылардың әрекеттері негізінен JavaScript және оның шеңберлері арқылы өңделеді. Бірақ кейбір функциялар біртіндеп HTML-ге келеді. Мысалы, нысандарды сүйреп апару немесе Drag & Drop бұрын тек JavaScript-те қол жетімді болды.
Қарабайыр беттерді құруға жеткілікті негіздерді бір сағат ішінде үйренуге болады. Яғни, бұл мақала жазылғаннан жылдамырақ. Бірақ шеберлік тәжірибемен келеді. Тек жақтауды жасау жеткіліксіз-оның барлық жерде дұрыс көрсетілгеніне көз жеткізу керек.
Қисық емес жауап беретін сайтты жаза алатын мамандар жұмыс берушілерде бағаланады. Бірақ жай ғана HTML макеті болу тиімсіз. Бүгінде бұл өте сирек кездесетін және жалақысы төмен мамандық. Алдыңғы немесе артқы дамуды бірден зерттеген дұрыс, ал HTML бұл процесте міндетті түрде пайдалы болады.
Негізгі HTML - файлының түрі:
HTML
HEAD
TITLE информатика TITLE
HEAD
BODY
1-ші курс студенті
BODY
HTML
Блакнотқа енгізіп, Internet Explorer браузерінде ашсақ TITLE тегінде орналасқан Информатика терезенің тақырып қатарына, BODY тегінде орналасқан 1-ші курс студенті терезенің жұмыс аймағында орналасады.
Мәтін үзінділерін ерекшелеу тэгтері жеке символдар мен сөздердің бейнелеуін басқаруға мүмкіндік береді.
Тегтер қолданылуы нәтижесі
B...B
BЖартылай қалыңB
I...I
IКурсивтіI
U...U
UАсты сызылғанU
TT...TT
TTМашинкалықTT
S...S
SСызылғанS
BIG...BIG
BIGҮлкенBIG
SMALL...SMALL
SMALL Кішкентай SMALL
SUP ... SUP
Жоғарғы - x SUPиндексSUP
SUB...SUB
Төменгі - x SUBиндексSUB
Шрифт өлшемін, гарнитурасын және түсін беру FONT тегі гарнитурамен және мәтін түсімен өлшемді басқару мүмкіндіктерінен тұрады. Шрифт гарнитурасын өзгерту FONT тегіне FACE атрибутын қосу арқылы жүзеге асады. SIZE атрибуты 1-ден 7-ге дейінгі шрифт өлшемін көрсетеді. Шрифт түсін өзгерту үшін FONT тегінде COLOR = "түс" атрибутын қолдануға болады.
Мысалы: FONT FACE="ARIAL" COLOR=blue size=7 1-ші курс студенті FONT
Веб-дизайнер веб - сайттар мен қосымшалардың дизайнын жасайды, бірақ кейде бірнеше тапсырмалар бірден түсініледі: UI және UX дизайны, брендинг, қону дизайны. Бұл веб-дизайнердің шеберлігіне байланысты, адам бетте қалады ма, сайттағы баннерді нұқып, мыңдаған адамдар арасында қызмет белгішесін бірден таба алады ма.
Графикалық дизайнерден айырмашылығы, веб-дизайнер жасайтын барлық нәрсе интернетке байланысты: сайттар, баннерлер, мобильді қосымшалар, онлайн қызметтер. Бұл дегеніміз, барлық жұмысты онлайн режимінде жасауға болады және әртүрлі материалдар мен бояғыштардың ерекшеліктерін зерттемейді. Веб - дизайнерлердің қозғалмалы және 3D дизайнерлерінен айырмашылығы, олар негізінен екі өлшемді және статикалық элементтермен жұмыс істейді.
Веб-сайт дизайнері жұмысының басқа да ерекшеліктері бар:
сайт немесе қолданба әртүрлі құрылғыларда, соның ішінде шағын экраны және сурет сапасы төмен құрылғыларда қалай көрінетінін жақсы елестету керек;
әзірлеушілермен, UX копирайтерлерімен және веб-талдаушылармен командада жұмыс істей білу, олардың тілектерін тыңдау маңызды.
Веб-дизайнердің міндеттеріне компанияның немесе брендтің мақсатты аудиториясына ұнайтын визуалды шешімді табу кіреді. Әдетте веб-дизайнердің жұмысы бірнеше қадамдардан тұрады:
Тапсырыс берушіден, жоба менеджерінен немесе арт-директордан техникалық тапсырма алыңыз. ТК-де, әдетте, өнімнің сипаттамасы, сілтемелер, мақсатты аудитория, мерзімдер мен бюджет бар.
Тапсырмаға сүңгу. Аудиторияны және оның қалауын зерттеңіз, бәсекелестердің веб-сайттарын және осы саладағы ең жақсы жұмыстарды зерттеңіз.
Алғашқы эскиздерді жасаңыз. Болашақ сайттың немесе қосымшаның эскиздерін стильдердің, түстердің және графикалық элементтердің әр түрлі үйлесімімен жасаңыз.
Прототип жасаңыз. Клиент бекіткен эскиздерді егжей-тегжейлі деңгейде және пайдаланушы сценарийлерін ескере отырып аяқтаңыз.
Дайын макет жасаңыз. Прототипті бекіткеннен кейін, сайттың орналасуы үшін қажет форматтағы барлық беттердің макеттерін жасаңыз және әзірлеушілер үшін егжей-тегжейлі TC жазыңыз.
Веб-дизайнердің кәсіби дағдыларын оқу және тәжірибе кезінде меңгеруге болады:
Дизайн бағдарламалары мен редакторлары-ең алдымен Figma. Бұл веб-дизайнердің негізгі құралы, онда ол фотосуреттер мен графикалық элементтерді жинайды, макеттер жасайды, оларды әртүрлі форматта түсіреді немесе әріптестерімен бірге жұмыс істейді. Сонымен қатар, Adobe Illustrator немесе Photoshop сияқты графикалық және фото редакторларды зерттеуге болады.
Композиция және перспектива негіздері, түс комбинациясы және қаріптер.
UX және UI дизайн негіздері, интерфейстерді қалай жобалау керектігін түсіну және пайдаланушының мақсатты әрекетке, мысалы, затқа тапсырыс беру жолын қайталау.
Веб-аналитика негіздері, Пайдаланушының сайтта өзін қалай ұстайтынын, қай жерде қиындықтар туындайтынын және оны қалай түзетуге болатындығын түсіну, мысалы, түймені айқынырақ ету немесе экранның басқа бөлігіне көшіру.
Веб-дизайн жасау кезінде түймелер мен бөлімдер үшін қай атауларды таңдаған дұрыс екенін түсіну үшін UX копирайтинг негіздері.
Жыпылықтайтын түйме немесе қалқымалы мәтін сияқты қарапайым эффектілерді жасау үшін анимация негіздері.
Веб-дизайнердің икемді дағдыларын дамыту әлдеқайда қиын, егер адам оған табиғи түрде бейім болмаса:
Диалог жүргізу қабілеті. Веб-дизайнердің міндеттеріне көбінесе клиенттермен және басқа топ мүшелерімен келіссөздер кіреді. Қажетті ақпаратты алу, клиенттің тілектерін тыңдау, өз ұстанымын дәлелдеу және сынды сабырлы түрде қабылдау қажет.
Жақсы дәм. Сәтті веб-дизайн пайдаланушыларды қызықтырады және оларды сайтта мүмкіндігінше ұзақ болуға шақырады. Бірақ бұған әрдайым ұтымды түрде қол жеткізуге болмайды: тәжірибелі дизайнер түстердің немесе қаріптің сәйкес келмейтінін және басқа нұсқаларды іздеу керек екенін анықтай алады.
Табандылық. Веб-сайт дизайнері Шабыт бойынша жұмыс істемейді. Кейде дайын макеттің алдында бірнеше апталық еңбек пен ондаған аралық нұсқалар болады. Бұл жағдайда сіз егжей-тегжейге мұқият болуыңыз керек және дизайндағы ұқыпсыздыққа жол бермеуіңіз керек.
Эмпатия бір қарағанда "жабысатын" эмоционалды және жауап беретін дизайнды жасау үшін пайдалы. Ол үшін аудиторияға не ұнайтынын және оның қалай көрінетінін жақсы түсіну керек.

3.3 CSS (Cascading Style Sheets)-стильдердің каскадты кестелері
Стильдердің каскадты кестелері немесе жай стильдер кестесі (CSS - Cascading Style Sheets) - HTML кодтың түрлі фрагменттерін форматтауды жазатын және одан бөлек сақталатын ережелер терісі. Қандай да бір фрагментті форматтауды немесе фрагмент кодының біртипті тобын форматтауды көрсететін ережені стиль деп атайды. Стильдер кестесі CSS ерекше тілінде жазылып, css кеңейтілімге ие ерекше файлдарда сақталынады. Стильдер кестесін өз іс-тәжірибеңізде үйренгеніңіз жөн.
CSS алдымен 1997 жылы веб-әзірлеушілерге өздері жасаған веб-беттердің визуалды көрінісін анықтауға мүмкіндік беретін құрал ретінде жасалды. Веб-мамандар веб-сайттың кодының мазмұнын және құрылымын көрнекі дизайннан ажыратуға мүмкіндік берді, бұл осы уақытқа дейін мүмкін болмады.
Құрылымның және стилдің бөлінуі HTML-ға бастапқыда негізделген функцияны көбірек орындауға мүмкіндік береді - мазмұнның белгіленуі, беттің өзін дизайны мен сезімі деп аталатын беттің дизайны мен орналасуына алаңдамай, беттің.
Веб-браузерлер осы таңбалау тілінің негізгі қаріптері мен түстік аспектілерінен артық пайдалана бастаған кезде, 2000-ға дейін CSS танымал болмады. Бүгінде барлық заманауи браузерлер CSS-тің барлық деңгейі 1-де, CSS-нің 2-деңгейінің көпшілігін және тіпті CSS-нің 3-деңгейінің көптеген аспектілерін қолдайды. CSS бұрынғыдай дамып келе жатқанда және жаңа стильдер енгізілсе, веб-браузерлер бұл браузерлерге CSS-ді жаңа CSS-ті қолдана алатын модульдерді енгізе бастады және веб-дизайнерлерге жұмыс істеу үшін қуатты жаңа стилі құралдарын береді.
Көптеген жылдар өткеннен кейін веб-сайттарды жобалау және дамыту үшін CSS-ні пайдаланудан бас тартқан веб-дизайнерлер таңдалды, бірақ бұл тәжірибе бүгінгі күні саладан кетіп қалды. CSS қазір веб-дизайнда кеңінен қолданылатын стандарттар болып табылады және бүгінгі күні салада жұмыс істейтін кез-келген адамды табу үшін қиындық тудыруы мүмкін, ол кем дегенде осы тіл туралы негізгі түсінікке ие болмады.
Жоғарыда айтылғандай, CSS термині Каскадты стиль кестесін білдіреді. Осы фразаны осы құжаттардың немен айналысатындығын толығымен түсіндіру үшін біраз қысқартамыз.
Стильдік парақ сөзі құжаттың өзін білдіреді (HTML сияқты, CSS файлдары - әртүрлі бағдарламалармен редакциялауға болатын нақты мәтіндік құжаттар). Стиль кестелері көптеген жылдар бойы құжат ... жалғасы

Сіз бұл жұмысты біздің қосымшамыз арқылы толығымен тегін көре аласыз.