Портабельность сайта.
Безусловно, самым важным является совместимость HTML-кода страниц сайта с основными браузерами. На сегодняшний день основными являются: Internet Explorer, Netscape Navigator, Opera, Coogle также рекомендую просматривать ваши страницы в-третьих версиях браузеров.
В них, скорее всего, сайт будет отображаться не совсем корректно, т.к. третьи версии не поддерживают многих элементов, например, каскадных таблиц стилей. Иногда, для сайта очень важно, чтобы он приемлемо отображался не только в-четвертых, но и в-третьих версиях браузеров. Если сайт не просматривается или отображается некорректно в-четвертых версиях браузеров, то теряется значительная часть посетителей.
Объем HTML-кода должен стремиться к минимуму по двум причинам. Первая, и самая главная, вызвана скоростью загрузки вашего HTML-документа пользователем. Пользователь не будет долго ждать. Если страница не появилась в течение одной минуты, то скорее всего, пользователь уйдет на другой веб-сайт.
Вторая причина связана с совместимостью с основными версиями браузеров и дальнейшим сопровождением сайта.
Практика показывает, что чем больше объем HTML-кода, тем сложнее добиться, чтобы он одинаково отображался в различных браузерах. Здесь имеется в виду не абсолютный размер HTML-кода.
Дело в том, что одного и того же результата можно добиться разными способами. Например, при форматирование содержимого HTML-документа, одного и того же результата можно добиться разным исходным HTML-кодом.
В дальнейшем, после завершения работ над сайтом, его придется поддерживать, т.е. дополнять и изменять. Для быстрой и успешной модификации сайта необходимо, чтобы:
Сайт имел структуру, пример предлагаемой структуры сайта см. выше.
Исходный HTML-код должен быть читабельным.
Верхние и нижние колонтитулы были вынесены в отдельный файл. (таблицы каскадных стилей), используемые в нескольких документах находились в отдельном файле.
Функции JavaScript, используемые в нескольких документах находились в отдельном файле.
В именах файлов и адресах гиперссылок использовались только цифры и буквы английского алфавита нижнего регистра, также допускается
использование символа подчеркивания. Все остальные символы русского алфавита, английские символы верхнего регистра значительно могут осложнить поддержку веб-сайта.
При соблюдении вышеуказанных требований модификация сайта и портабельность сайта будут осуществляться с минимальными затратами.
.5 Разработка структуры сайта
Разработка структуры web-сайта является одним из ключевых моментов его создания, который в большой степени определяет эффективность его функционирования в будущем. С технической точки зрения структура сайта - это не что иное, как все его страницы, расположенные в порядке их значимости для пользователей, то есть иерархии.
Разрабатывая структуру для будущего сайта, очень важно учитывать то, что сегодня выигрывают, прежде всего, те интернет-ресурсы, которые могут обеспечить своим пользователям быстрый доступ к любой информации, находящейся на их страницах.
Достойный уважения Web-дизайн включает разработку страниц, доступных для пользователей с ограниченными возможностями, в частности по зрению и слуху. Консорциум World Wide Web объявил об инициативе Web Accessibility Initiative (WAI), которая ставит целью сделать Web более доступным для всех пользователей. Однако успех данной инициативы зависит от участия в ней рядовых разработчиков, которые могут (или не могут) создать Web-сайты в соответствии с поставленными задачами.
Пользователи с ограниченными возможностями зрения могут использовать специальные устройства для увеличения изображения, находящегося на экране. В этом случае к дизайну не предъявляется никаких специальных требований.
Многие люди с проблемами зрения используют текстовые браузеры (такие как Lynx) вместе с программным обеспечением, которое громко читает содержимое страницы. В любом случае основное внимание уделяется структуре документа и его тексту. Графическое содержимое может быть просто утеряно.
Исходя из данных выше правил, дизайн сайта будет следующим.
Рис.1 Шаблон дизайна сайта
На основании созданного шаблона разрабатывается дизайн сайта
Структура сайта «Book One»:
Главная страница.
Рис.2 Дизайн сайта
2. Проектная часть
Постановка задачи - это важнейший этап создания сайта, который позволяет разработчику сайта минимизировать трудозатраты, сократить время, и уменьшить количество возможных ошибок и недоработок при создании сайта.
Тщательная проработка данного этапа необходима для лучшего понимания истинных задач, которые поставлены перед разработчиком заказчиком сайта. Правильно и четко поставленная задача позволяет превратить будущий сайт в эффективный инструмент достижения целей заказчика.
Данный этап можно так же назвать "А зачем и для чего нужен сайт?". Обычно для того чтобы постановка задачи была наиболее полной, заказчику необходимо понять и ответить на следующие вопросы:
Цель создания сайта:
Сайт создается для того, чтобы читателям облегчить выбор книг по жанру и описанию. Наслаждаться онлайн-чтением книг, сохраняя свои денежные средства, а также обмениваться комментариями о прочитанной книге. В дополнение на сайте будет размещаться информация о пополнении коллекции того или иного жанра в блоге, где читатели могут оставлять свои предпочтения.
Целевая аудитория:
В основном, аудиторией будет являться пользователи интернета.
Необходимые ресурсы:
Такими ресурсами могут быть тексты, фотографии, аудио-видео материалы, прайс-листы, логотип, базы данных и т.д.
Определение сроков:
Сайт создается в течении 30 рабочих дней.
2.1 Техническое задание
.Основание для разработки
.1 Основанием для данной работы служит договор № 105 от 10 октября 2016 г.
.2 Наименование работы:
Новостной-блог для читателей книг.
.3 Исполнители: Юмтарова Т.А.
.Назначение работ
Создание web-сайта для прочтения книг в любое время и месте где есть подключение к интернету.
. Техническое требование
.1 Требования к функциональным характеристикам.
Программа должна обеспечивать возможность выполнения перечисленных ниже функций:
.1.1. Выдавать новости и комментарии по выбранной книге.
.1.2. Осуществлять поиск книги архивов.
.1.3 Простое добавление новых записей.
.1.4 Интересный и удобный дизайн.
.1.5 Поддержка web-сайта и его функционала на большинстве браузеров.
.2 Требования к надежности
Надежное (устойчивое) функционирование программы должно быть обеспечено выполнением Заказчиком совокупности организационно-технических мероприятий, перечень которых приведен ниже:
а) организацией бесперебойного питания технических средств;
б) использованием лицензионного программного обеспечения;
2.3 Грамотность и содержимое сайта
Грамотно и имеющие смысл издания и записи.
Отсутствие нецензурных слов и изображений.
Соответствие новости с реальными фактами.
.4 Бриф
Таблица 1
1Название компании:Wordpress.com2Название сайта:BookOne3URL для размещения сайта:https://tuianablog.wordpress.com/4Задачи разработчика:Разработка фирменного стиля. Разработка дизайна главной и второстепенной страниц сайта. Верстка главной и второстепенной страницы. Интеграция дизайна главной и второстепенной страниц сайта в CMS5Цель создания сайта:проект6Сфера деятельности компании:7Целевая аудитория:Пользователи интернета8На какие географические регионы должен быть ориентирован сайт:Россия9Языковые версии сайта:Русский10Сайты конкурентов:-11Материалы, предоставленные заказчиком:-12Структура сайта:1.Главная страница2. О нас3. Жанры 4. Контакты 5. Блог13Компоненты сайта (новости, анкетирование, интернет-магазин, баннерная реклама, счетчики посещений, др.):-14Цветовая гамма сайта:Зеленый, белый.15Что в результате посещения сайта пользователь долженувидеть:Обложки книг с описанием.сделать:Прочесть информацию в блоге, заполнить контактную форму и выбрать книгу на свой вкус.почувствовать:Радость от новых ощущений.16Вид верстки (фиксированный/резиновый):Резиновая верстка17Ширина веб-страницы:-18Браузеры, в которых будет просматриваться сайт, и их минимальная версия:Google.19График работ:Фирменный стиль: 10.10.2016 Лейаут страниц: 18.10.2016 Эскизы web-страниц: 25.11.2016 Верстка страниц: 8.12.2016 Интеграция в CMS: 21.12.2016 Передача готового проекта: 28.12.201620Бюджет заказа:-21Передача разработки:Эскизы web-страниц в формате DESIGN и JPG. HTML-файлы, CSS-файлы.
Заказчик:
Гороховская Н.А. преподаватель кафедры «Системное программирование»
Исполнитель проекта:
Юмтарова Т.А студент гр. ПОВТ-241
.5 Описание разработки сайта
Рис.3 Главная страница
Фрагмент кода:
<!DOCTYPE html>
<html lang="ru-RU">
<head>
<metacharset="UTF-8">
<metaname="viewport" content="width=device-width, initial-scale=1">
<link rel="profile" href="#"justify"><link rel="pingback" href="https://tuianablog.wordpress.com/xmlrpc.php">
<title>Book one:) — Здесь вы найдете все,что искали…</title>
<script type="text/javascript">
Рис. 4. Вторая страница
<!DOCTYPE html>
<html lang="ru-RU">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="profile" href="#"justify"><link rel="pingback" href="https://tuianablog.wordpress.com/xmlrpc.php">
<title>Онас— Book one:)</title>
<script type="text/javascript">
Рис. 5. Третья страница
Фрагмент кода:
<!DOCTYPEhtml>
<html lang="ru-RU">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="profile" href="#"justify"><link rel="pingback" href="https://tuianablog.wordpress.com/xmlrpc.php">
<title>Жанры— Book one:)</title>
<script type="text/javascript">
Рис. 6. Четвертая страница
Фрагмент кода:
<!DOCTYPE html>
<html lang="ru-RU">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="profile" href="#"justify"><link rel="pingback" href="https://tuianablog.wordpress.com/xmlrpc.php">
<title>Контакты— Book one:)</title>
<script type="text/javascript">
Рис. 7. Пятая страница
Фрагмент кода:
<!DOCTYPE html>
<html lang="ru-RU">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="profile" href="#"justify"><link rel="pingback" href="https://tuianablog.wordpress.com/xmlrpc.php">
<title>Блог— Book one:)</title>
<script type="text/javascript">
Перейдя по ссылке:
·«О нас» можно увидеть информацию кто создал его и для чего.
·«Жанры» можно увидеть поисковую систему, обложки книг с описанием и жанры.
·«Контакты» можно увидеть основную контактную информацию и контактную форму для заполнения.
·«Блог» можно увидеть недавние записи, архивы и комментарии.
Заключение
интернет программа сайт дизайн
В данной работе рассмотрены актуальные вопросы разработки и создания современного Web-сайта.
При этом мною были решены следующие частные задачи:
ознакомление с современными Интернет-технологиями и использование их в своей разработке;
изучение основных программы применяемых для разработки и создания Web-сайта;
ознакомление с методами и способами представления на Web-страницах различных видов информации (текстов и изображений);
ознакомление с основными правилами и рекомендациями по разработке и созданию Web-сайтов и неукоснительное следование им в своей практике;
определение структуры Web-страниц;
предоставление пошаговой стратегии разработки web-сайта;
предоставление инструкции для пользователей web-сайта.
В результате проведенных работ на базе выбранных технологий был создан современный Web-сайта.
Список использованной литературы
1.Дронов В.А. Программирование. - СПб.: БХВ-Петербург, 2006
.Алексеев А.П. Введение в Web-дизайн: учебное пособие. - М.: СОЛОН-ПРЕСС, 2008
.Барысов Р. Постройте профессиональный сайт сами. - СПб., 2009
.Печников В.Н. Сомоучитель Web-страниц и Wrb-сайтов. - М.: Триумф, 2006
.Печников В.Н. Создание Web-сайтов без посторонней помощи. - М.: Триумф, 2006
.Панфилов К. По ту сторону веб-страницы. - СПб.: ДМК Пресс, 2008
.Кроудер Д. Создание web-сайта для чайников: 3-е издание. - М.: Диалектика, 2009
.Вильямсон Х. Универсальная библиотека программиста - СПб.: ПИТЕР, 2001
.Дуванов А. А. Web-конструирование. - Петербург: 2009. - 384 с.
.Едомский Ю. Е. Техника Web-дизайна для студента. - Петербург: 2010. - 491 с.
.Крамер Э. HTML: наглядный курс Web-дизайна. - Киев: 2009. - 304 с.
.Леонтьев Б. Web-дизайн. Руководство пользователя. - Киев: 2011. - 384 с.
.Печников В. Н. Создание Web-страниц и Web-сайтов. - М.: Триумф: 2010. - 370 с.
.Роббинс Д. Web-дизайн. Справочник. - "КУДИЦ-ПРЕСС": 2009. - 816 с.