Warning: [Trying to access array offset on value of type null] в файле /var/www/school-php.com/public_html/modules/courses/lesson.php на линии 295
Показать $GLOBALS | Показать Debug Backtrace | Показать подсказки

Урок 0.1: Вступительный урок: веб-разработчик изнутри

План:

  • Кто занимается созданием сайта, какие профессии и какова их роль
  • Какие сайты по типу технического и графического решений можно выделить
  • Основная терминология при создании сайта
Предыдущий урок Следующий урок 

Скачать HD качество

скачать /videos/html1-lesson01-mina4inaem.rar

Дополнение к уроку:

Изучая структуру и другие термины важно знать не только русские слова, но так и английские (их перевод). Русские позволяют нам ориентироваться в незнакомой теме, а английские помогут при написании кода и общении с другими программистами. Хоть все веб-разработчики одинаково знают как русские, так и английские названия, мы же когда приступим к написанию кода будем использовать классический формат именования, а именно английский. Пример:
<head>
<title>Текст пишем на любом языке, а код - на английском</title>
</head>
<nav>Сокращённо от слова Navigation, навигация сайта</nav>
<main>Центральная часть сайта</main>
<footer>Копирайты сайта: 2010-2020 года.</footer>

Вверху я разместил вполне рабочий код верстки, содержание мы пишем на нужном нам языке, в данном случае сайт для русских посетителей. А вот код мы всё равно обязаны писать на английском.

Структура сайта


- Шапка (header)
- Центральная часть (main)
- Контент, содержание страницы (content)
- Боковая панель (sidebar), второстепенная панель (aside)
- Подвал (footer)
- Навигация, меню (navigation, nav, menu)

Вспомогательные элементы


- Логотип (logo)
- Заголовок (title)
- Иконка сайта (favicon, favicon.ico)
- Всплывающее окно, модальное окно (modal window, modal box, popup)
- Форма (form)
- Задний фон под текстом или картинкой (background, в виде картинки - background image)
- Прокрутка экрана, скроллинг (scroll)
- Пагинатор, постраничная навигация (pagination)
- Шрифт, текст (Font), и его вариации: жирный, курсив, цвет и т.д.

Терминология веб-мастера


Сайт - структурированный набор страниц.
Front-end - клиентская сторона разработки (верстка и программирование для браузера: html, css, javascript).
Back-end - серверная сторона разработки (php, mysql, настройка сервера админом).
Дизайн, UI дизайн (пользовательский интерфейс, User Interface design) – понятие, включающее в себя определённый набор графически оформленных элементов. По сути UI отвечает за то, как выглядит сайт (приложение).
Usability (юзабилити) – это то, насколько просто пользователям использовать ваш сайт (приложение) для достижения определённых целей.
UX дизайн (пользовательский опыт) – понятие включающее в себя то, как продукт функционирует, и, какие эмоции вызывает и пользователей.
Оптимизация (optimization) - работа над улучшением. Поисковая оптимизация - SEO (search engine optimization). Не путайте с СЕО, кто является "главным исполнительным директором" и не относится к разработке сайтов. Не смотря на то, что "сео" писать неграмотно и многие хотят видеть именно написание на английском, всё равно используют слово сеошник по отношению к SEO специалисту.
URI (URL) - путь к странице. Пример: https://school-php.com/courses
Валидный (Valid) - правильный, валидная верстка - верстка без ошибок. Validator - проверяет наличие ошибок.

Карьерная лестница: Junior (юнион), Middle (так же называют engineer, обычный программист), Senior (сеньор - крутой программист, чуть ли не хакер), Team-leader (управляющий проектов, лидер).

И другие очевидные слова не требующие пояснений: Разработка (development), разработчик (developer), программист (Programmer), Веб-мастер (web-master), Дизайнер (Designer), Сервер (server), Хостинг (hosting), Домен (domain), поддомен (subdomain), Сайт (site), Страница сайта (page).

Под каждым уроком есть 10 тестов, которые помогут Вам закрепить пройденный материал.
Один из тестов будет развивать Вашу логику и интеллект!
Чтобы получить доступ к тестам - авторизируйтесь!


0%
Главная БАЗОВЫЙ КУРС ПЕРВЫЙ УРОВЕНЬ программирования ВТОРОЙ УРОВЕНЬ верстки ВТОРОЙ УРОВЕНЬ программирования Начать обучение Запуск проекта Мелкие трюки Делимся практикой трудоустройства Проверь свои знания Задачи по PHP MySQL Блог Отзывы