Після того, як ми визначили структуру нашого веб-сайту та розробили DOM Точно, важливо визначити його стилі, це також найкреативніша область, в якій ви можете з максимальною точністю налаштувати останній кут свого веб-сайту. Каскадні таблиці стилів є найбільш підходящим рішенням, але для всіх, хто робить свій перший набіг у світі веб-розробки, є кілька порад, які необхідно врахувати для досягнення найкращих результатів.
Для отримання професійного результату, типового для освяченого фронту, необхідно враховувати певні аспекти, такі як порядок, читабельність та виправлення найпоширеніших помилок у рамках цього типу практики. Ділюсь нижче п’ять порад дуже базовий, але в той же час дуже важливий для обробки та оптимальної конфігурації наших таблиць стилів CSS.
Обов’язково встановіть ефективний порядок та структуру у ваших таблицях стилів CSS3
Я завжди розділяю свої таблиці стилів в ієрархічному порядку. По-перше, я зазвичай застосовую загальні селектори, а потім продовжую додавати оголошення селекторів html і, нарешті, продовжую працювати всередині ідентифікаторів контейнерів та другорядних елементів. В основному мелений слідуйте логіці DOM і починаючи від батьків, закінчуючи дітьми. Однак ми також можемо дотримуватися іншої формули або порядку, наприклад, ми можемо групувати наші селектори та декларації з урахуванням їх функції. Все буде залежати від наших уподобань та того, як нам буде комфортніше працювати.
Виберіть чіткі та стислі імена для кожного з ваших селекторів
Ви повинні взяти до уваги щось дуже важливе, і це те, що CSS3 відрізняється використанням великих та малих літер, тому написання слова з великої літери може означати щось інше і може спричинити помилки. Найпростіше завжди використовувати маленькі літери, щоб уникнути такого типу проблем. Також спробуйте виберіть імена для своїх класів та посвідчення особи, які можна чітко впізнати і що вони не виводять нас на сумніви чи помилки.
Не забудьте додати уточнюючі коментарі
Звичайно, вам потрібно поділитися своїми файлами з іншими людьми, можливо, вашим клієнтом або колегами з вашої робочої групи, такими як дизайнери верст, інші дизайнери або розробники. З цієї причини дуже важливо звернути увагу на конструкцію та забезпечити чисте та впорядковане покриття. Уточнюючі коментарі допоможуть кожному, хто отримує доступ до нашої таблиці стилів, швидко орієнтуватися з першого погляду. Будь-який тип спостереження, який необхідно враховувати він повинен відображатися як вміст. Пам'ятайте, що ви можете включати вміст як у свій файл Html, так і у файл CSS, і що в обох випадках це коментарі, які логічно не відображатимуться в кінцевому результаті і будуть видимими лише при доступі до вихідного коду, тому вони можуть бути дуже корисно.
Завжди застосовуйте скидання у таблицях стилів
Кожен браузер має свою таблицю стилів за замовчуванням, тому, щоб уникнути помилок або змін залежно від браузера, в якому переглядається наша сторінка, дуже корисно та рекомендується скинути таблиці стилів. Є кілька альтернатив. Скидання таблиці стилів Еріка Мейєра може бути дуже хорошим варіантом.
Виберіть найбільш ефективний засіб
Є багато інструментів, якими ви можете максимально ефективно працювати під час оформлення веб-сайту. Від створення Wireframes до розробки структури вашого сайту, як і всіляких додатків, включаючи Adobe Photoshop, Illustrator або Fireworks. У вас також є багато професійних редакторів, які є одними з найбільш рекомендованих (принаймні той, який я використовую) Піднесений текст або, якщо це не вдалося, Adobe Dreamweaver оскільки вони забезпечують дуже прості інтерфейси з високим ступенем особистості, а також можливість роботи з нашими кодами через систему ярликів та систему автозаповнення, яка допоможе нам заощадити більше 70% часу, який ми використали б з редактором традиційний звичайний текст.
Дякую за пораду, я захоплююсь дизайном, і всі поради отримали добре. Продовжуй.
Спасибо!