ЮРІЙ ЧЕРНІЄВСЬКИЙ

ПЕРСОНАЛЬНИЙ САЙТ

HTML та CSS нероздільні компоненти сучасної WEB розробки.

Публікація призначена для початківців. Основною метою даної публікації є створення в початківців образного уявлення про HTML та CSS технології простою, зрозумілою мовою.

HTML та CSS є основою всіх сайтів Інтернету тому логічно припустити, що вивчати веб-технології необхідно розпочинати саме з них! Звичайно Ви можете зауважити, що ще існує мова програмування JavaScript, яка використовується на стороні клієнта (браузером). Але це все буде потім, коли Ви вже будете добре знати і вміти використовувати HTML / CSS. Отже ми всього нараховуємо три веб-технології, які нам потрібно буде поступово опанувати під час навчання!

Навіщо володіти цими трьома веб-технологіями?

Сьогодні дуже модними, особливо в оголошеннях про прийом на роботу веб-розробників, стали такі терміни, як фронтенд (front end) та Бекенд (back end).

Чим відрізняються спеціалісти цих двох частин веб-розробки?

Фронтенд (front end)

Знання і володіння трьома веб-технологіями - HTML , CSS, JavaScript складають частину веб-розробки під назвою - фронтенд (front end) , яка служить для взаємодії між користувачем і серверною частиною.

Бекенд (back end)

Серверна частина, в свою чергу, обслуговується веб-розробниками з більш розширеним знанням технологій. Бекенд (back end) - частина веб-розробки , яка об’єднує в собі такі мови програмування і технології, як PHP, SQL, Node.js, Python, Ruby та інші, в залежності від проектів.

З якого віку і з яким базовим рівнем знань можна вивчати веб-технології?

Починати вчитися створювати сайти ніколи не пізно і не буває рано. Можна розпочати як в молодшому шкільному віці, так і в досить зрілому віці.
Для того, щоб почати вивчати основи веб-верстки, зокрема, технологію HTML5 , не потрібно мати вищу освіту або якісь спеціальні знання з програмування або знати вищу математику
Якщо уважно вивчати матеріали уроків, які викладаються за принципом від простого до складного, то можна вивчити HTML та CSS навіть новачкам без початкових знань веб-технологій або веб-програмування.
Подані на сайті матеріали, якщо їх вивчати поступово і відповідно до викладеного порядку, є доступними для розуміння будь-якому новачкові, навіть дітям молодшого шкільного віку, яким достатньо лише більш-менш нормально читати, користуватися комп'ютером та Інтернетом і при цьому мають величезне бажання вчитися будувати сайти.

Чому ми розглядаємо одночасно HTML та CSS?

Практика показує, що необхідне комплексне сприйняття цих двох інструментів для створення сайтів. Відповідно і подача інформації до даної теми має бути комплексною. Такий підхід можна вважати цілком логічним і природнім, адже уявімо собі, коли школяр отримає в подарунок пенал, то він відразу подивиться, а що там в середині. Якщо він побачить в пеналі не знайомий предмет, скажімо циркуль, він обов'язково зацікавиться його призначенням! Ви звичайно поясните, що циркуль використовується з олівцем,  або малюючим стержнем. І якщо циркуль використовувати без олівця не має сенсу, то так і предмети нашого вивчення вивчати окремо на мою думку не доцільно!  Від того, наскільки легко вчитель подаватиме навчальний матеріал, буде залежати і простота сприйняття учнями необхідної інформації.

Що таке HTML та CSS?

Визначень достатньо в інтернеті, але я спробую пояснити простою мовою, яка має бути зрозумілою початківцю навіть самого маленького віку.

HTML та CSS - це найбільш підходящі інструменти для розробки веб-сайтів.
Візуально ці два інструменти можна уявити наступним чином. Є блоки - трансформери, які можуть змінювати розмір, колір, форму, де роль самих блоків виконуює HTML, а інструментом для зміни їх властивостей виступає CSS. Іншими словами, якщо порівняти з  шоколадним батончиком TWIX, то у цій солодкій парочці HTML задає форму і начинку, а CSS надає смакові якості, колір, запах!

HTML (Hypertext Markup Language)

Мова розмітки HyperText, яка використовується для створення веб-сайтів та додатків.
HTML (мова розмітки гіпертексту) не є мовою програмування; це мова розмітки, яка  використовується для того, щоб повідомити вашому браузеру, як структурувати веб-сторінки, які ви потім відвідуєте. Ця структура може бути настільки складною або простою, наскільки побажає сам веб-розробник.
HTML надає можливість створювати змістовну структуру сайту та наповнити її певним значенням.
Елементи HTML є будівельними блоками сайтів.

CSS (Cascading Style Sheets)

Каскадні таблиці стилів - це спеціальна мова презентації, створена для стилістики зовнішнього вигляду вмісту сторінок, написаних мовами розмітки даних, що використовується для опису зовнішнього вигляду.
Найчастіше CSS використовують для візуальної презентації сторінок, написаних HTML та XHTML, але формат CSS може застосовуватися також до інших видів XML-документів.

З огляду на розуміння основних ідей HTML та CSS, давайте звернемо увагу на HTML5.

HTML5

HTML5 є найновішим стандартом HTML.
Цей термін представляє дві різні концепції:

З огляду на актуальність HTML5 рекомендую відразу починати знайомити учнів саме з HTML5.

Дана публікація має загальний оглядовий характер. Більш детально з базовими компонентами сучасної WEB розробки ми познайомимося в процесі навчання.

ОБГОВОРЕННЯ ПУБЛІКАЦІЇ НА ФОРУМІ