Главная страница
Навигация по странице:

  • Виды сайтов. Информационный

  • Игровой

  • Визитка

  • 1. Запуск своего сайта от конструктора веб-сайтов

  • 2. Использование системы управления контентом

  • 3. Создайте свой сайт с нуля

  • 2. Основная область сайта (область основного контента)

  • 4. Футер сайта (или подвал)

  • 5. Фон сайта (фоновая область)

  • 20 Технологии разработки WEB-сайтов. Занятие 20 Технологии разработки webсайтов. Коллекции элементов современных сайтов. Теоретическая часть


    Скачать 20.24 Kb.
    НазваниеЗанятие 20 Технологии разработки webсайтов. Коллекции элементов современных сайтов. Теоретическая часть
    Анкор20 Технологии разработки WEB-сайтов
    Дата12.09.2022
    Размер20.24 Kb.
    Формат файлаdocx
    Имя файла20 Технологии разработки WEB-сайтов.docx
    ТипЗанятие
    #672711

    Практическое занятие №20

    Технологии разработки WEB-сайтов. Коллекции элементов современных сайтов.

    Теоретическая часть.

    Сайт (site, веб-сайт, web site) — одна или несколько объединенных между собой веб-страниц, представляющих собой один ресурс. Располагаются во всемирной паутине и доступны для просмотра с браузера по определенному URL адресу. В переводе с английского — Web Site означает — место в паутине. Работают сайты по протоколу HTTP стека TCP/IP.

    Виды сайтов.

    Информационный — ресурсы различной тематики, к примеру, о науке или образовательные порталы, по типу того, на котором вы сейчас находитесь.

    Новостной — ресурсы, посвященные новостям, на данный момент практически полностью вытеснили новостные печатные издания.

    Блог — ресурсы, где автор высказывает свое личное мнение по различным темам.

    Сервис — по сути те же утилиты, только расположенные во всемирной паутине, но также решающие задачи, только уже через браузер. Например, онлайн калькулятора и т.д.

    Игровой — порталы, посвященные играм

    Журналы — онлайн дневники, похожи на блоги.

    Landing Page — одностраничный сайт, чаще всего простая визитка или реклама определенного товара/ов/.

    Визитка — рекламная страничка об организации или одном человеке. В большинстве своем не более 10 страниц.

    Интернет-магазин — ресурсы по продаже, какой-либо продукции. Бывают большими площадками, так и с небольшим ассортиментом

    И многие другие — их очень много, все чем бы вы не захотели заниматься — обо всем можно сделать вебсайт и занять свою нишу.

    Методы создания сайтов.

    1. Запуск своего сайта от конструктора веб-сайтов

    Конструктор веб-сайтов – это тип онлайн-программного обеспечения, предлагаемого хостинговыми компаниями, которые позволяют создавать и публиковать веб-сайт без ручного кодирования. К ним относятся такие компании, как Wix, Weebly, SiteBuilder, SquareSpace.

    2. Использование системы управления контентом

    Система управления контентом (CMS) – это тип программного обеспечения, такого как WordPress, Joomla или Drupal, которые позволяют создавать и управлять цифровым контентом. Они более универсальны, чем конструкторы веб-сайтов.

    3. Создайте свой сайт с нуля

    Последний вариант создания веб-сайта, разработка сайта с “чистого листа”. Вы можете создать свой сайт через HTML, который является всемирно признанным языком программирования, который контролирует форму и содержание Вашего сайта.

    Основными структурными элементами сайта можно назвать:

    1. Шапка для сайта

    Самый верхний блок часто называют шапкой сайта, либо заголовок сайта, либо хедер от англ. header. Место, в котором обычно располагается хедер – верхняя часть страницы. Ориентация хедера – альбомная.

    2. Основная область сайта (область основного контента)

    Зачастую это самая большая по площади и наиболее важная для посетителей сайта часть страницы.

    По названию не трудно догадаться, что в данном блоке размещается

    • весь текстовый,

    • графический,

    • аудио и

    • видеоконтент сайта.

    То есть, контент сайта – это его информационное наполнение, а именно, статьи и обзоры, новости, картинки, галереи, аудио и видеоролики и т.д.

    Также довольно часто в этой области размещают рекламу.

    3. Сайдбар

    Понятие «сайдбар» происходит от английского термина “sidebar”, где “side” — сторона, “bar” — полоса. Обычно сайдбаром называют боковую колонку сайта, которая размещается справа или слева от области основного контента. В некоторых случаях на сайте могут располагаться сразу два сайдбара (первый – слева от основной области, а второй – справа).

    Как правило, содержимое сайдбара не меняется от одной страницы сайта к другой, в отличие от содержимого области основного контента. Поэтому в сайдбаре обычно размешают блоки со ссылками, а также важную служебную информацию. Если говорить более конкретно, то в сайдбар часто вставляют

    • меню (главное и второстепенное),

    • разнообразные виджеты (рубрики сайта, популярные и последние посты, последние комментарии, погода),

    • рекламные ссылки и баннеры,

    • ссылки на сайты друзей,

    • счетчики посещаемости,

    • формы авторизации и регистрации.

    Ширина сайдбара, как правило, четко фиксирована и не зависит от типа макета сайта.

    4. Футер сайта (или подвал)

    Слово «Футер» (или подвал) произошло от англ. «Footer». Обычно футером называют область сайта, которая расположена в самом низу (под всеми остальными блоками). По аналогии с хедером (шапкой сайта), футер также имеет альбомную ориентацию, то есть, он продольно вытянут. Ширина футера также может меняться в зависимости от разрешения монитора пользователя (конечно, если макет является резиновым).

    В подвале сайта могут быть размещены рекламные ссылки, копирайты (свидетельство авторства), ссылки на разработчиков движка или создателей шаблона сайта. Кроме того, довольно часто в футере сайта дублируют главное или второстепенное меню. Это делается для улучшения навигации (после прокрутки вниз пользователю не нужно будет возвращаться к верхней части страницы для того, чтобы воспользоваться меню). Правда, выше, на рис. 1 главное меню (в виде красной полосы) НЕ продублировано в подвале сайта.

    5. Фон сайта (фоновая область)

    Как правило, фоновая область сайта не занята никакими элементами (является полностью свободной). Размер фоновой области зависит от типа макета сайта. При использовании резинового макета фона может и не быть, ведь все доступное пространство страницы будет заполнено другими блоками (они будут растягиваться до самых границ). Если макет жесткий, то размеры фоновой области будут напрямую зависеть от разрешения монитора, с которого пользователь просматривает сайт.

    Практическая часть.

    Задание 1.

    Изучите методы создания сайтов и напишите для каждого плюсы и минусы. А также сделайте свои выводы.

    Задание 2.

    Изучите структурные элементы сайтов. Какие элементы можно добавить к основным, приведенным в теоретической части?

    Задание 3.

    Изучите указанные в теории системы управления контентом. Для чего они нужны? Какие плюсы и минусы у указанных CMS? Попытайтесь описать шаги необходимые для создания сайта с использованием CMS.


    написать администратору сайта