Содержимое курса
Дизайн сайта. Макет
0/15
Веб-қосымшалардың дизайнын жасау

Зертханалық жұмыс: Типографияны қолдану

Мақсат: Веб-дизайындағы мәтіннің оқылымдылығын, эстетикасын және қабылдауын жақсарту үшін типографияны талдауды және қолдануды үйрену.

Бағалау критерийлері:

  • Типографияны талдайды және қолданады.
  • Шрифттерді таңдау және үйлестіру қағидаларын пайдаланады.
  • Мәтін параметрлерін (өлшем, жоларалық интервал, туралау) орнатады.

Жұмыс барысы:

  1. Дайындық кезеңі:
    • Типографияның негізгі қағидаларымен танысыңыз:
      • Шрифт таңдау (декоративті, қарапайым, моношрифт т.б.).
      • Мәтін оқылымдылығы (өлшем, контраст, жоларалық интервал).
      • Туралау және жол ұзындығы.
    • Веб-дизайндағы типография мысалдарын қарастырыңыз.
    • Google Fonts, Adobe Fonts құралдарымен жұмыс жасаңыз.
  1. Талаптарды талдау:
    • Жобаға сәйкес мәтін стилін анықтаңыз:
      • Ресми (корпоративтік сайт).
      • Жеңіл және заманауи (блог, лендинг).
    • Қандай мәтіндер қолданылатынын айқындаңыз (тақырыптар, қосымша тақырыптар, негізгі мәтін, сипаттамалар).
  1. Шрифт таңдау:
    • Жобаға 2–3 шрифт таңдаңыз:
      • Біреуі тақырыптарға.
      • Біреуі негізгі мәтінге.
      • Қажет болса акцентке қосымша шрифт.
    • Шрифттердің үйлесімділігін тексеріңіз (FontPair сияқты құралдармен).
  1. Мәтін параметрлерін орнату:
    • Шрифт өлшемін анықтаңыз:
      • Тақырыптар (H1–H3): 24–48 px.
      • Негізгі мәтін: 14–18 px.
    • Жоларалық интервал (line-height):
      • Тақырыптар: 1.2–1.4.
      • Негізгі мәтін: 1.5–1.8.
    • Туралау:
      • Негізгі мәтін – сол жақтан.
      • Тақырыптар – орталықтан немесе сол жақтан.
    • Жол ұзындығы: 50–75 таңба.
  1. Типографияны қолдану:
    • Бірнеше бет немесе макет жасаңыз.
    • Тақырыптар мен мәтіннің айырмашылығын айқын көрсетіңіз.
    • Акцент үшін стильдерді қолданыңыз (жирный, курсив).
  1. Сапаны тексеру:
    • Мәтіннің оқылымдылығын бағалаңыз:
      • Тақырыптар айқын ба?
      • Контраст жеткілікті ме?
    • Әртүрлі құрылғыларда мәтіннің біркелкі көрінетініне көз жеткізіңіз.
  1. Жұмысты рәсімдеу:
    • Есеп жасаңыз:
      • Таңдалған шрифттер мен параметрлер сипаттамасы.
      • Мәтін блоктарының мысалдары (скриншот, сурет).
      • Жобада типографияны таңдаудың негіздемесі.

Күтілетін нәтиже:

  • Таңдалған типографиясы бар бет немесе мәтін блоктарының үлгісі.