Доброго дня любі друзі. Ласкаво просимо на сайт gabdrahimov.ru. присвячений сучасному сайто будовою. Даний підручник, призначений для початківців і вебмайстрів. Тут ви знайдете необхідні матеріали по веб-будівництва, веб-дизайну і веб-програмування, які допоможуть вам у вивченні предмета - створення сайтів.
На даний момент, написано вже чотири підручники для вебмастера, які постійно доповнюються та оновлюються:
За ідеєю, знаючи всього лише дві мови: HTML, CSS і адаптивну верстку сайту, можна вже відразу влаштуватися на роботу в веб-студію, на посаду HTML-верстальника або помічника HTML-верстальника.
Далі даний невеликий огляд того, через який шлях проходить сучасний початківець і продовжує вебмастер.
Мова розмітки HTML і мова форматування CSS
Для того, щоб вміти створювати сайти, потрібно вивчити два web-мови:
1. HTML - мова розмітки,
2. CSS - мова форматування.
Мови HTML і CSS, бажано вивчати разом, а не окремо.
HTML - мова розмітки, за допомогою якого створюється структура сторінки сайту, визначається яка частина сторінки буде заголовком, абзацом (параграфом), фотографією, посиланням, кнопкою і т.д.
HTML - це мова розмітки.
CSS - мова форматування, за допомогою якого частинам сторінки призначають різні властивості впливають на: колір, фон, висоту, ширину, вирівнювання, відступ, кордон, прозорість, позиціонування і багато іншого.
CSS - це мова форматування.
Форматування - це зміна зовнішнього вигляду.
Верстка сайтів: блочна, гумова, адаптивна
Вивчивши HTML і CSS, можна вже приступати до створення сайтів. прочитавши перед цим про верстці. Сучасна верстка сайтів включає в себе використання блокових елементів DIV і їх «гумову» ширину (у відсотках). 2-3 роки тому, завдяки вдосконаленню браузерів, з'явилася можливість використовувати адаптивну верстку.
Адапівная верстка включає в себе такі поняття:
Наприклад сайт Gabdrahimov.ru. створений за допомогою адаптивної верстки і якщо ви спробуєте зменшити ширину браузера, то побачите як поступово зникатимуть елементи дизайну, верхнє меню перетвориться з горизонтального в вертикальне, а ліве меню «з'їде» вниз. Це зроблено для того, щоб вам було зручніше переглядати сайт на мобільних пристроях.
Сайт створений за допомогою HTML і CSS може бути дуже красивим і пізнавальним, єдине що в ньому буде не вистачати, так це інтерактивності - взаємодії з користувачем.
BOM (браузерна модель документа), структура об'єктів та ж сама що і у DOM, тільки замість об'єктів HTML-документа (HTML-тегів), виступають об'єкти браузера: вікно браузера, URL сторінки, історія відвідувань, розміри екрану монітора і т.д.
PHP, Yii, Symfony - сервер
PHP - серверний мова програмування. Yii - фреймворк мови PHP.
База даних MySQL - сервер
MySQL - це реляційна база даних, що містить різну інформацію. Реляційна база даних - це база даних, що складається з таблиць. Таблиці в свою чергу складаються з стовпців і рядків. Рядки складаються з осередків. Кожна осередок має свій тип даних.
Як вже говорилося вище, мова PHP маніпулює файлами на сервері і зберігається в них інформацією. Для спрощення процесу маніпулювання інформацією, зазвичай використовують не файли, а базу даних. Найпопулярніша на сьогоднішній день, це база даних MySQL. Інформація зберігається в базі даних більш структурована, ніж інформація зберігається в звичайних текстових файлах, тому нею легше керувати.
Також існують команди сортування та фільтрації даних.
MySQL - реляційна база даних.
Open Server - локальний (домашній) веб-сервер
Встановивши веб-сервер, можна також вивчити парочку нескладних, серверних технологій:
1. .htaccess - спеціальний файл, за допомогою якого можна давати команди веб-сервера і керувати деякими параметрами сайту.
2. SSI - серверна технологія, що дозволяє створювати файли, за допомогою яких можна вносити зміни в дизайн сайту, відразу для всіх сторінок одночасно (рідко де використовується, але корисний на безкоштовних хостингах, де немає можливості працювати з PHP).
На цьому поки все, приступимо до вивчення мови HTML.