Skip to content

Serhii-Filatov/goit-markup-hw-08

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

16 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

goit-markup-hw-08

Завдання виконано згідно з ТЗ Основним джерелом необхідної інформації для виконання ДЗ – конспект, відеоуроки А. Репети та живі вебінари з викладачем. Адаптивна верстка – це сучасний стандарт. Верста сайт, лендинг або обкладинку розробник знає, що адаптивність буде за замовчуванням. Це дуже важлива тема, якій слід приділити час. Поняття роботи медіазапитів важливий момент -- це набір правил, які дозволяють створювати чуйні веб-сайти, використовуючи різні стилі для різних пристроїв або типів носіїв. Поруч по важливості з адаптивністю самого сайту стоять і адаптивні картинки - зображення, які добре відображаються на пристроях з різними розмірами та роздільною здатністю екрану.

Прикладіть максимум зусиль, щоб вона вийшла просто супер. Подивіться по-іншому на макет. У нас принцип mobile first, але розмітку ми робимо вже фінальну, тобто розмітка відразу буде така, як на десктопі. Це стилями ми всі правимо і “підганяємо“. Імена класів. Перегляньте це. Обов’язково. Це справді важливо. Читаючи ваш html/css той ревьювер повинен розуміти ваш код прямо з девтулзів. Імена класів пишіть грамотними англійськими словами. Є купа плагінів для підсвічування синтаксичних помилок. Неймінг має бути ясним, зрозумілим та конкретним. Придивіться та привчайтесь до компонентного підходу. У вас є на макеті елементи, що повторюються - робіть загальний клас-компонент і юзайте такий підхід скрізь. Він вам знадобиться. CSS властивості повинні писатися осмислено -- для блокових елементів за замовчуванням немає необхідності повторно писати display: block -- не треба зі старту розкривати карти та показувати що ви новачок. Правильне та технічно грамотне позиціонування – це запорука успіху. У тому числі й співбесіди. Дотримуйтесь структури. Розкладайте по поличках. Це зручно та зрозуміло. Просто закріпіть пройдений матеріал. Даю гарантію, що швидше за все у вас буде відрізнятися та верстка та підхід, який ви вивчили під фінал. У вас зміниться погляд на макет і процес у цілому. Також прошу звернути увагу на моб меню. Не забуваймо, що меню у нас є до планшета і має займати весь простір екрану як по висоті, так і по ширині. Також звертаю вашу увагу, що жорстко фіксувати відступи між блоками не потрібно, тому що ми не знаємо висоту дисплея користувача. Дуже важливо, якщо користувачі з шириною екрана 320, то ваші сторінки та елементи (модалка теж) мають бути симетричні та на ширині 320.