Создание и оптимизация сайтов: Курсы

Блок «Веб-дизайн»

Раздел 1. Что нужно знать web-дизайнеру

• Обзор программ, используемых при создании WEB-сайта. Обзор ресурсов, полезных для web-дизайнера.
• Этапы разработки WEB-сайта.
• Написание технического задания на разработку сайта.
• Создание прототипов сайта.
• Принципы построения системы навигации на сайте.
• Знакомство с DreamWeaver. Настройка программы, общие принципы работы. Работа с текстовым наполнением.
• Практическая работа: Перенос текста в программу DreamWeaver и его логическое форматирование

Раздел 2. Информационная архитектура сайта. Цветовые схемы.

• Элементы информационной архитектуры.
• Распределение информации по разделам сайта с учетом информационной, логической и визуальной взаимосвязи между разделами.
• Основные компоненты WEB-страницы и способы их визуального представления на страницах сайта.
• Цвет. Цветовые схемы, применяемые на сайте. Использование "безопасных" цветов
• Современные стили дизайна
• Практическая работа: Структурирование информации и разработка системы навигации на конкретном примере

Раздел 3. Макетирование web-страницы. Эргономика WEB-сайта

• Принципы построения макета. Роль размеров в дизайне
• Оформление web-страницы с использование CSS. Работа с CSS в DreamWeaver
• Эргономика сайта (web-usability). Факторы, которые затрудняют и факторы, которые облегчают восприятие пользователем информации на сайте.
• Версии сайта, адаптированные для печати и для мобильных устройств
• Оформление текстового материала. Выбор шрифтов и размеров. Практические советы и рекомендации
• Практическая работа: Анализ эргономики сайтов на примерах. Оформление макета страницы с использование CSS.

Раздел 4. Подготовка иллюстраций и графических элементов

• Требования к иллюстрациям в Internet. Обзор форматов иллюстраций JPEG, GIF, PNG, SWF, SVG.
• Подготовка графики в программе Adobe PhotoShop. Способы уменьшения объема файла
• Особенности использования векторных программ
• Создание стандартных графических элементов - иконок, пиктограмм, favicon и пр.
• Подготовка изображений с учётом стиля дизайна.
• Особенности подготовки изображений на прозрачном фоне
• Применение карт изображений ImageMap в WEB-дизайне
• Использование CSS для создания эффектного дизайна
• Практическая работа: Создание различных элементов дизайна

Раздел 5. Макетирование web-страниц с помощью таблиц

• Нарезка и сохранение типового макета в программе Adobe PhotoShop.
• Сборка макета в программе DreamWeaver
• "Резиновый" и фиксированный дизайн: анализ и критерии выбора
• Практические советы и рекомендации
• Практическая работа:
• Разметка области для нарезки макета.
• Создание таблицы и сборка макета.
• Способы создания резиновой «шапки» страницы
• Способы оформления меню, левой и правой колонок.

Раздел 6. Макетирование web-страниц с помощью блоков

• Нарезка и сохранение типового макета в программе Adobe PhotoShop.
• Способы сборки макета с использованием свойств CSS float и свободного позиционирования.
• Приёмы блочной вёрстки web-страницы
• Практическая работа: Разметка области для нарезки макета. Сборка макета с использованием float. Применение свободного позиционирования на странице. Способы создания резиновой «шапки» страницы. Способы оформления меню, левой и правой колонок.

Раздел 7. Gif-анимация и баннеры. Создание динамических элементов в DreamWeaver

• Что такое GIF-анимация
• Создание анимированных баннеров, аватаров и смайликов
• Способы подключения роликов FLASH на страницу
• Вставка видео на страницу
• Использование динамических элементов на web-странице (на примере выпадающих меню и пр.), приёмы работы с элементами SPRY в Dreamweaver
• Практическая работа:
• Создание баннера и установка на страницу сайта.
• Установка FLASH на страницу сайта.
• Добавление динамических элементов

Раздел 8. Тестирование сайта. Использование системы управления сайтом

• Тестирование сайта. Система управления сайтом.
• Этапы стандартного тестирования сайта.
• Добавление системы поиска на сайте.
• Вставка географической информации (схема проезда и пр.) Использование системы управления сайтом (CMS). Виды CMS и решаемые ими задачи.
• Демонстрация системы, наполнение системы информацией.
• Демонстрация подключения дизайна к системе.

Блок «Программирование веб-сайтов»

Раздел 1. Введение. Понятие WWW (Web)

• Понятие гипертекстовых документов и веб-сайтов. Классификации веб-сайтов. Различные типы веб- сайтов, их назначение и использование.
• Понятие веб-сервера и его взаимодействие с пользователем. Обзор протоколов (HTTP, FTP и т.д.) передачи данных, их различия и практическое применение.
• Понятие индексных файлов, их названия, типы и использование.
• Распределение обязанностей специалистов, работающих в области WWW (Web).
• Обзор программ (браузеров) для просмотра веб-страниц и веб-сайтов, их различия и особенности интерпретации кода.
• Необходимый минимум аппаратных и программных средств для работы веб- программиста. Обзор программного обеспечения и методов разработки ПО для сайтов.
• Понятие скрипта. Классификация скриптов, их различия и области применения.
• Клиентские скрипты. Обзор технологий для создания клиентских скриптов (JavaScript, VBScript, JScript, ActionScript), их особенности и поддержка в различных браузерах.
• Вызов простых встроенных функций и проверка работоспособности скрипта в браузере.
• Типы переменных, способы их объявления, создания и присвоения значений. Работа с простыми типами переменных и вывод информации в браузер. Понятие конкатенации.
• Массивы, способы их создания и области применения. Примеры создания сложных массивов и работа с ними.

Раздел 2. Условные операторы, их типы и применение их на практике

• Понятие функций и их применение на практике. Функции интерактивного общения с пользователем и запрос информации. Примеры создания сложных условий и программ аутентификации на странице.
• Циклы, их назначение, виды, создание и применение в программах. Примеры использования различных видов циклов. Бесконечные циклы и их применение в компьютерных вирусах. Примеры написания простых вирусов и варианты защиты от них.
• Понятие события. Виды и обработка событий в браузере. Примеры использования событий для запуска различных функций.
• Создание собственных (пользовательских) функций. Примеры передачи данных и обработки возвращённого значения функции.
• Понятие объекта. Типы, назначение, создание и использование объектов в программах. Объектная модель браузера. Примеры доступа к различным объектам и манипуляции с ними. Создание интерактивных элементов на веб-странице (изображений, кнопок, всплывающих меню, скрытых информационных блоков и т.д.). Работа с HTML-формами.
• Способы передачи данных скриптам (методы GET и POST) и случаи их применения.
• Способы генерации кода веб-страниц. Создание всплывающих окон и управление ими.
• Создание строковых объектов и работа с ними. Обзор функций для обработки строк. Примеры поиска информации в строках и создание текстовых фильтров.

Раздел 3. Язык JavaScript и VBScript

• Язык JavaScript. Создание и способы подключения Java-скриптов к веб- страницам. Синтаксис JavaScript.
• Язык VBScript. Обзор синтаксических различий между JavaScript и VBScript. Сравнение похожих функций. Объявление переменных и присвоение им значений. Использование событий и работа с объектами.
• Понятие процедур, их создание и применение на практике. Примеры создания скриптов с использованием VBScript.
• Веб-сервера. Обзор популярных веб-серверов, их различия, особенности и использование.
• Веб-сервер Apache. Выбор версии, установка и проверка работоспособности Apache. Установка и подключение дополнительных модулей. Использование пакетов разработчика для тестов и ознакомления с работой и устройством сервера.
• Обзор переменных окружения сервера и их практическое использование.
• Каталоги и файлы конфигурации Apache. Настройка сервера и разрешение доступа к нему с других компьютеров. Создание виртуальных хостов и размещение сайтов.

Раздел 4. Серверные скрипты. Обзор технологий для создания серверных скриптов (SSI, PHP, Perl, Python и т.д.)

• Технология SSI. Обзор инструкций SSI и их включение в веб-страницы.
• Примеры генерации кода и сборки веб-страниц «на лету» с помощью SSI.
• Язык PHP. Создание и способы подключения PHP-скриптов к веб-страницам.
• Синтаксис PHP. Различие версий интерпретаторов и их современное использование.
• Вызов простых встроенных функций и проверка работоспособности скрипта.
• Типы переменных, способы их объявления, создания и присвоения значений. Работа с простыми типами переменных и передача информации браузеру. Понятие конкатенации.
• Массивы, их типы и способы создания. Добавление данных в простой массив и работа с его элементами. Примеры создания ассоциативных, многомерных и древовидных массивов и работа с ними.
• Примеры передачи скриптам значений переменных и массивов посредством HTML-форм и гиперссылок методами GET и POST (отправка информации на сервер).

Раздел 5. Обзор функций для работы с переменными и массивами

• Условия и циклы, их типы и применение на практике. Примеры создания условий и генерации кода в циклах (создание выпадающих списков, таблиц по запросу и т.д.).
• Работа со строками. Обзор функций для работы со строками. Примеры написания текстовых фильтров и поиск информации в строках.
• Работа с различными кодировками. Функции шифрования данных. Примеры обратимого и необратимого шифрования и их применение на практике. Создание скриптов аутентификации на сайте.
• Отправка данных по e-mail. Примеры скриптов для форм обратной связи на сайтах.
• Понятие регулярных выражений, их создание и использование. Обзор функций и примеры скриптов для работы с регулярными выражениями.
• Работа с файлами. Обзор функций для создания, чтения, записи и манипуляций с файлами. Примеры генерации скриптов, а также текстовых и других типов файлов.
• Функции для работы с каталогами. Автоматическое создание новых каталогов, установка разрешений и другие манипуляции с ними. Копирование и удаление файлов и каталогов.
• Создание гостевых книг, чатов и форумов на базе текстовых файлов. Функции включения содержимого других файлов и генерации кода «на лету».

Раздел 6. Работа с базами данных. СУБД MySQL

• Обзор типов и систем управления базами данных (СУБД), их различия, специфика и области применения.
• Введение в реляционные системы управления базами данных. Принципы построения и работы реляционных СУБД. Обзор популярных СУБД для работы с веб-серверами. Выбор, установка и настройка СУБД.
• Язык SQL. Использование SQL в современных СУБД, его версии и особенности.
• Создание SQL-запросов к базам данных на примере СУБД MySQL. Вставка, изменение и удаление данных, а также их извлечение и сортировка по заданным условиям.
• Создание связки PHP-MySQL. Обзор функций PHP для работы с системами управления базами данных. Создание новых баз данных и обращение к ним через PHP-скрипты.
• Примеры создания интерфейса управления базами данных, а также гостевых книг, форумов и чатов с использованием СУБД.

Раздел 7. Понятие шлюзовых интерфейсов. Язык PERL. Веб-сервер IIS

• Преимущества и недостатки использования шлюзовых интерфейсов.
• Актуальность, установка и работа CGI. Создание, принципы построения и размещение CGI-скриптов на сервере. Примеры использования CGI- скриптов в работе сайта.
• Язык PERL. Актуальность использования PERL в веб-программировании. Его преимущества и недостатки по сравнению с PHP. Основные отличия PERL от других языков веб-программирования. Объявление переменных и создание массивов в PERL. Использование встроенных переменных и работа с ними. Создание условий и циклов.
• Примеры создания программ на языке PERL и их сравнение с программами на PHP.
• Веб-сервер IIS (Internet Information Server). Популярность, особенности и условия работы данного сервера. Выбор версии, установка и проверка работоспособности IIS. Установка и подключение дополнительных модулей и систем управления базами данных.
• Размещение каталогов сервера и сайтов в системе. Настройка сервера и разрешение доступа к нему с других компьютеров. Создание виртуальных хостов и размещение сайтов.

Раздел 8. Шлюзовой интерфейс ASP

• Актуальность данного интерфейса, его преимущества и недостатки по сравнению с CGI.
• Установка и использование ASP на различных платформах. Принципы построения, размещение и создание ASP-скриптов. Выбор языка по умолчанию. Обзор особенностей и специфических инструкций технологии ASP.
• Примеры создания различных программ с использованием ASP.
• Дополнительные технологии, используемые в веб-программировании.
• Понятие ActiveX. Краткий обзор технологии ActiveX и её актуальность в современном веб- программировании. Преимущества и недостатки использования ActiveX-компонентов на веб-страницах.
• Апплеты и сервлеты. Актуальность и рациональность использования технологий Java (Java, JSP, J2EE, EJB и т.д.) и их поддержка современными веб-серверами.

Блок «Оптимизация веб-сайтов»

Раздел 1. Что такое «продвижение сайта» и зачем мне нужно «продвигаться»

• Цели и задачи сайта
• Целевая аудитория сайта
• Классификация сайтов
• Соответствие сайта ожиданиям целевой аудитории
• Способы продвижения сайтов

Раздел 2. Поисковая оптимизация (SEO) - введение

• Поисковые машины
  • Обзор и характеристика поисковых машин
  • Принципы работы поисковых машин
  • Оценка страниц поисковиком: индекс цитирования, тИЦ, PR
  • Индексация страниц
  • Ранжирование результата поиска
• Важность и понимание принципов работы сервера
  • Управление индексацией страниц
  • Скорость переиндексации сайта
  • Проверка заголовков HTTP
• Запрет индексации части страниц
• Распространенные ошибки и заблуждения оптимизаторов

Раздел 3. Поисковая оптимизация - оптимизация контента сайта

• Изучение запросов пользователей
  • Прогнозирование списка запросов
  • Частотность запросов
  • Исключение нецелевых запросов
  • Формирование семантическое ядра
• Анализ и построение эффективной структуры сайта
  • Карта сайта
  • Навигация и внутренние ссылки
• Оптимизация страниц сайта
  • Выделение ключевых страниц
  • Контент страниц сайта
  • Разметка страниц

Раздел 4. Поисковая оптимизация - внешние факторы

• Авторитетность сайта
• Работа со ссылками
  • Анализ входящих ссылок
  • Сайты-сателлиты
  • Портальные схемы размещения контента
  • Внешние ссылки с других ресурсов
  • «Линковка» сайтов
• Работа с каталогами
  • Виды каталогов и их эффективность
  • Регистрация в каталогах

Раздел 5. Реклама проекта и рассылки

• Виды рекламы проекта
  • Контекстная реклама
  • Банеры и реклама на площадках
    • Банерообменные сети
    • Банеры на рекламных площадках
    • Собственные (внутренние) баннеры
• Push-технологии доставки контента
  • E-mail рассылки
    • Тематические рассылки
    • Собственные рассылки
    • Несанкционированные рассылки (спам)
  • RSS каналы
    • Механизмы и сценарии использования RSS
    • Агрегаторы RSS каналов

Раздел 6. Эффективное взаимодействие с пользователем

• Что нужно пользователям на сайте?
• Функциональность vs. потребности
• Эргономика сайта. Юзабилити
  • Определение эргономики (юзабилити)
  • Основные принципы юзабилити (обзорно)
  • Распространенные ошибки и их последствия
• Доступность ресурса
  • Понятие доступности ресурса
  • Проблемы большинства современных сайтов
  • Требования к доступности ресурса (обзорно)
  • Распространенные ошибки и их последствия
• Проблемы поиска информации
  • Необходимость поиска на сайте
  • Типичные ошибки реализации поиска
  • Реализация эффективного поиска

Раздел 7. Эффективное управление ресурсом и анализ работы

• CMS системы
• Эволюция систем управления контентом
• Обзор CMS систем
• Битрикс
• sBuilder
• Анализ работы сайта
  • Системы аналитики на сервере - лог-аналайзеры
  • Системы аналитики на сервере на клиенте - трекеры (счетчики)
    • Механизм сбора информации системой Интернет статистики
    • Механизмы идентификации пользователя
    • Виды отчетов и погрешность измерений
• Критерии оценки работы сайта
  • Способы оценки результативности привлечения
  • Анализ рекламной компании
  • Использование меток
  • Openstat - универсальная метка

Раздел 8. Основы электронной коммерции (обзорно)

• Текст как форма представления информации
• Требования к B2C ресурсам
• Пять основных функциональных блоков электронного магазина
• Платежные системы в Интернете
• Эффективное взаимодействие с пользователем
• Выводы