HTML СSS
HTML — мова гіпертекстової розмітки, що складається з тегів, котрі описують, як потрібно відображати вміст сторінки в браузері. Це каркас, який використовується для всіх сайтів і вебдодатків, незалежно від використаних технологій і їх складності. Його завдання пояснити браузеру, що потрібно показати користувачеві — де повинен розташовуватися кожен елемент.
CSS — теж мова розмітки, але її завдання пояснити, як кожен HTML-елемент повинен виглядати.
Простіше кажучи, HTML — це про форматування: списки, таблиці, абзаци і форми. CSS — про кольори, фони, шрифти та іконки.
- Користувач переходить на сторінку в браузері;
- Браузер посилає запит на адресу сторінки і отримує у відповідь html-файл з посиланнями на файли стилів;
- Браузер обробляє код з розміткою і відображає візуальний вміст сайту.
В найзагальнішому вигляді HTML визначає де на сторінці буде розташований елемент, а CSS як він буде виглядати. Але є ряд нюансів.
Головна складова HTML — елемент. Наприклад, текстовий контент, між тегами відкриття і закриття. Елементи можуть бути вкладеними один в одного, наприклад, якщо потрібно зробити текст одночасно підкресленим і винесеним в окремий абзац. У елементів також можуть бути атрибути — додаткова інформація, яку не потрібно відображати, але можна використовувати для звернення. Наприклад, щоб задати один стиль всього контенту з таким атрибутом на сайті. Порожні елементи, без контенту і тегу, що закриває використовуються для завантаження, наприклад, картинок. HTML описує наступні елементи:
заголовки, абзаци, списки, посилання, а також шрифти, їх розміри і накреслення;
посилання на зображення з атрибутом alt, що описує те, що на них зображено текстом;
таблиці, блоки та форми.
CSS додається в HTML-файл, як посилання на елемент <head>. Там зберігається все, що повинно бути на сторінці, але не входить в категорію контент. Крім каскадних таблиць стилів це будуть, наприклад, seo-тег Description з описом сторінки для пошукових систем.
Сама таблиця складається з правил оформлення, вони ж стилі — селектор і оголошення для нього. Перша частина визначає ті частини файлу HTML, на які буде діяти правило, а друга описує стиль. CSS — це незвичайні шрифти, кольори фонів для блоків, значки для списків, кнопки, іконки, додаткові дизайнерські елементи на сайті, але не тільки. У таблицях стилів можна вказувати різні правила для відображення елементів при виконанні умов. Наприклад, зміна виду кнопки при наведенні на неї курсором і так далі.
Верстанням сторінок для браузера по макетах займаються вебдизайнери. Вони обов'язкові члени команд фронтенду, які працюють над створенням користувальницького інтерфейсу вашого вебдодатку.
Без HTML жодна зі сторінок сайту не відобразиться в браузері, а без CSS вміст буде виглядати як голий каркас з контентом. Зараз актуальними версіями вважаються HTML5 та CSS3, не всі функції яких підтримуються всіма браузерами. У мов розмітки з'являється все більше можливостей для проєктування оригінальних користувальницьких інтерфейсів і створення хорошого користувальницького досвіду для ваших клієнтів.
Розробка вебсайтів Розробка вебсайтів
Бізнес знає свої потреби, а ми — як їх реалізувати.
Створюємо і розробляємо стійкі корпоративні сайти та жваві промо-лендинги. Розробляємо web сервіси. Наші продукти витримують величезне навантаження та надійно слугують клієнтам.