Шрифти для веб

Інформація про навчальний заклад

ВУЗ:
Національний університет Львівська політехніка
Інститут:
Не вказано
Факультет:
Не вказано
Кафедра:
Не вказано

Інформація про роботу

Рік:
2024
Тип роботи:
Лабораторна робота

Частина тексту файла (без зображень, графіків і формул):

МІНІСТЕРСТВО ОСВІТИ І НАУКИ УКРАЇНИ НАЦІОНАЛЬНИЙ УНІВЕРСИТЕТ «ЛЬВІВСЬКА ПОЛІТЕХНІКА»  Лабораторна робота No6 «Шрифти для веб» Ознайомитися з теоретичними матеріалами щодо веб-типографіки, основними характеристиками шрифтів та особливостями веб-форматів. Завантажити нестандартний шрифт (наприклад, сервіси Fontesk, Fontsquirrel) та під’єднати його до сторінки. Оформити даним шрифтом певні елементи (заголовки, пункти навігації тощо). Під’єднати до сторінки Google-шрифт. Застосувати його до певних елементів (заголовки чи особливі ділянки сторінки). Ознайомитися з ресурсами, що надають у використання іконкові шрифти. Уважно прочитати документацію щодо уставляння іконок та особливостей надання їм стилів. Створити певну ділянку на сторінці, де розмістити художньо оформлені іконки з відповідною інформацією. Протестувати сторінку на різних браузерах та пристроях. Розмістити сторінку на хостингу. Результат виконання демонструвати в Інтернеті. Під час виконання роботи робити скріншоти основних етапів роботи. Оформити звіт.  Рис.1 Файли  Рис.2 Код css  Рис.3 Код body  Рис.4 текст body іншої сторінки  Рис.5 Скрін першої сторінки  Рис.6 Скрін другої сторінки Поcилання на сайт:  lab5lesn.wuaze.com Висновок: У ході виконання цієї лабораторної роботи я ознайомився з використанням шрифтів для сайтів, навчився підключати їх та модифікувати їх стилі. Також повправлявся у підключенні іконок. Також попрактикувався у розробці самого сайту, вивчення методичних матеріалів. У ході виконання роботи зіткнувся з нерозпізнаванням іконки, на що був змушений підключити їх ще й через посилання. Основні сімейства комп’ютерних шрифтів: Serif (з зарубками) – мають невеликі штрихи або зарубки на кінцях літер (наприклад, Times New Roman). Sans-serif (без зарубок) – не мають додаткових штрихів (наприклад, Arial, Helvetica).Monospace (моноширинні) – всі символи мають однакову ширину (наприклад, Courier).Cursive (рукописні) – імітують рукописний текст (наприклад, Comic Sans).Fantasy (декоративні) – використовуються для створення незвичайного вигляду (наприклад, Papyrus).Найкраще сімейство для сайтів:Sans-serif шрифти є найбільш оптимальними для використання на вебсайтах завдяки їхній читабельності на екранах. Категорії шрифтів для веб:Шрифти з сімейства без зарубок (sans-serif) – найбільш поширені для веб-дизайну через їх простоту і легкість у читанні.Шрифти з зарубками (serif) – також можуть використовуватися, особливо для заголовків або стилізованих вебсайтів. Відомі веб-формати шрифтів:WOFF (Web Open Font Format)WOFF2 – стиснутий варіант WOFF.TTF (TrueType Font)OTF (OpenType Font)OT (Embedded OpenType) Підходи для застосування довільного шрифта на сторінці:Підключення через Google Fonts або інші онлайн-ресурси.@font-face у CSS, який дозволяє завантажувати шрифти з сервера.Характеристики шрифта для використання на сайті:Читабельність на різних екранах та роздільних здатностях.Швидкість завантаження – важливо використовувати шрифти з мінімальним розміром файлів.Гнучкість – підтримка різних форматів і стилів (наприклад, звичайний, жирний, курсив). CSS-властивості для шрифтів:font-family – визначає сімейство шрифтів.font-size – розмір шрифту.font-weight – товщина шрифту.font-style – стиль (звичайний, курсив).line-height – висота рядка.text-transform – перетворення тексту (наприклад, верхній регістр).letter-spacing – відстань між символами. Як підключити шрифт з колекції Google Fonts:href="https://fonts.googleapis.com/css2?family=Roboto&display=swap" rel="stylesheet"> Що таке іконковий шрифт: Іконковий шрифт – це шрифт, де замість символів використовуються іконки. Наприклад, Font Awesome. Використовується для додавання векторних іконок на сайти. Порівняння іконкових шрифтів:Font Awesome – один із найвідоміших і найбільш використовуваних іконкових шрифтів, містить велику колекцію іконок.Material Icons – набір іконок від Google, використовуються в матеріальному дизайні.Ionicons – популярний серед мобільних додатків, надає прості та елегантні іконки.Bootstrap Icons – створений для використання з фреймворком Bootstrap, легкий і гнучкий. Як можна відредагувати SVG-іконку:Текстовий редактор – SVG є XML-файлом, тому можна редагувати його код напряму (зміна кольорів, розмірів, трансформацій).Графічні редактори – наприклад, Adobe Illustrator, Figma або Inkscape дозволяють редагувати SVG візуально.Онлайн-редактори – наприклад, SVGOMG для оптимізації SVG файлі
Антиботан аватар за замовчуванням

26.11.2024 18:11-

Коментарі

Ви не можете залишити коментар. Для цього, будь ласка, увійдіть або зареєструйтесь.

Ділись своїми роботами та отримуй миттєві бонуси!

Маєш корисні навчальні матеріали, які припадають пилом на твоєму комп'ютері? Розрахункові, лабораторні, практичні чи контрольні роботи — завантажуй їх прямо зараз і одразу отримуй бали на свій рахунок! Заархівуй всі файли в один .zip (до 100 МБ) або завантажуй кожен файл окремо. Внесок у спільноту – це легкий спосіб допомогти іншим та отримати додаткові можливості на сайті. Твої старі роботи можуть приносити тобі нові нагороди!
Нічого не вибрано
0%

Оголошення від адміністратора

Антиботан аватар за замовчуванням

Подякувати Студентському архіву довільною сумою

Admin

26.02.2023 12:38

Дякуємо, що користуєтесь нашим архівом!