Преподаватель который помогает студентам и школьникам в учёбе.

Разработка информационного сайта

Содержание:

Введение

Тема курсовой работы «Разработка сайта информационного характера», который направлен будет только на ознакомление и изучение некоторых тайн, которые всячески скрывались правительством, но в конечном итоге были рассекречены.

Целью является разработка вики-сайта, где будет размещена информация, не являющаяся приоритетной, а только ознакомительной.

Web-сайт будет разрабатываться с применением последней версии php версии 7.x , html5, css3, javascript.

Существует множество вики-подобныйх сайтов, несущие как суммарную библиотеку информации, так и направленых строго на определенные темы. Сайт, что будет разрабатываться будет направлен только на определенную тему. Сайт не будет занимать высокие позиции в поисковиках, так как эт не первоначальная цель попасть в топ.

Сайт не будет чем то особенен, посколку подобных сайтов множество, даже возможно с такой же информацией, но изложенной не полностью, возможно вся представленая информация на разрабатывемом сайте будет объеденена в единую, и собрана из разных источников, дабы не было кусков из разных сторон.

Требования к приложению

Сайт – должен быть связан единой темой, общим оформлением, взаимными гипертекстовыми ссылками и, как правило, близким по интернетовским меркам размещением (в пределах одного домена), хотя части сайта вполне могут располагаться на нескольких узловых компьютерах, обслуживаться несколькими серверами и даже принадлежать к разным доменам). Это значит, в частности, что иногда, в зависимости от контекста, один и тот же набор страниц может рассматриваться либо как самостоятельный сайт, либо как часть какого-то другого сайта.

Навигация является тем инструментом на сайте, с которым по-существу и работает посетитель. При проектировании сайта очень важно, исходя из структуры расположения материалов на сайте, разработать максимально удобную для данной структуры навигацию. При этом есть простые базовые принципы, пренебрежение которыми сильно усложняет ориентирование посетителя на сайте: посетитель должен всегда видеть, где он находится (документ и уровень его вложенности), как он сюда попал, и как ему вернуться туда, откуда он пришел. Можно с уверенностью сказать, что самой удобной навигацией является та, которая позволяет минимальным числом переходов попасть с одной страницы на другую, при этом, естественно, навигация должна быть лекговоспринимаемой и не перегруженной. Последнее достигается расставлением акцентов путем логического форматирования. Часто говорят, что количество элементов в меню с навигацией не должно превышать семи.

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

Очень важным является правильное графическое решение типовой страницы сайта. Разработка дизайна должна соответствовать типу ресурса. Наиболее распространенными являются информационные ресурсы, развлекательные ресурсы, ресурсы, связанные с Интернет-торговлей и т.д.

Реализация мультиплатформенности, сайт могут посещать не только с помощью настольного компьютера или ноутбука. Сейчас уже есть немало устройств, с помощью которых можно выходить в интернет. Возможно, в будущем их количество будет расти.

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

Пользовательская часть сайта должна соответсвовать:

Должны быть использованы последние технологии разработки сайтов.
Коректное отображение во всех браузерах, на всех существующих платформах
Оформление должно быть светлым на главной странице.
Минимализ на главной странице приветсвуется.
Меню сайта доступно.

Сайт не должен нарушать перечень законов:

Номер статьи	Возможные нарушения	Размер штрафа
ч.1 ст.13.11 КоАП	Запрос сканов документов у посетителей сайта. SMS- и e-mail рассылка без согласия клиента. Любая дезинформация пользователей относительно цели ввода данных в форму на сайте.	Для физ. лиц – до 3 т.р. Для юр. лиц – до 50 т.р.
ч.2 ст.13.11 КоАП	Обработка, сбор и хранение любых ПДн, в том числе IP-адресов и cookie, без электронной подписи пользователей. Отсутствие на сайте документов «Политика конфиденциальности» и «Пользовательское соглашение». Несоответствие документов требованиям закона, которое может возникнуть из-за ошибок при составлении. Отсутствие дисклеймера при первом посещении сайта пользователем.	Для физ. лиц – до 5 т.р. Для юр. лиц – до 75 т.р.
ч. 3 ст.13.11 КоАП	Отсутствие свободного доступа к Политике конфиденциальности для каждого посетителя сайта.	Для физ. лиц – до 1.5 т.р. Для ИП – до 10 т.р. Для юр. лиц – до 30 т.р.
ч. 4 ст.13.11 КоАП	Отказ, игнорирование или ложь в ответ на требование пользователя предоставить полную информацию о том, как хранят и обрабатывают его персональные данные.	Для физ. лиц – до 2 т.р. Для ИП – до 15 т.р. Для юр. лиц – до 40 т.р.
ч. 5 ст.13.11 КоАП	Отказ удалить ПДн из публичного доступа по желанию пользователя. Другие действия, нарушающие право субъекта отозвать согласие на обработку ПДн.	Для физ. лиц – до 2 т.р. Для ИП – до 20 т.р. Для юр. лиц – до 45 т.р.
ч. 6 ст.13.11 КоАП	Хакерская атака, взлом базы данных третьими лицами, распространение ПДн пользователей.	Для физ. лиц – до 2 т.р. Для ИП – до 20 т.р. Для юр. лиц – до 50 т.р.

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

Анализ исходных данных

Создать качественную Web-страницу непросто, для этого потребуются не только навыки дизайнера для красивого и стильного оформления, но и опыт программирования. Сложность и объем программ, требуемых для создания того или иного сайта, зависит от множества факторов: структура, цель, требуемая функциональность, обеспечение надежности и т.п.

Для создания современных сайтов обычно используются: HTML, CSS, JavaScript , FLASH, PHP, XML и другие средства и программы.

Средства создания сайтов

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

Для формирования файла HTML нет необходимости в использовании мощного текстового процессора, более удобно использование, например, редактора Notepad++. Содержимое HTML-страниц представлено в гипертекстовом виде, что предполагает наличие в документе, отображаемом на экране, выделенных определенным образом мест, щелкнув мышью по которым, можно переместиться в другую часть этой же страницы или на другую страницу.

CSS (Cascading Style Sheets) - каскадные таблицы стилей. Команды CSS позволяют назначить всем объектам стиль, описание которого может храниться вообще в отдельном файле. Используя декодер CSS, можно изменить размер шрифта во всех страницах сайта, исправив только один файл с описанием стилей.

Чем больше разных стилей применено, тем интересней менять дизайн. Самое главное, что не придется менять уже готовые HTML документы, лежащие на сервере. Браузер пользователя сам обратится к файлу (по ссылке) со стилями и придаст страничке нужный облик. Таблица стилей является отдельным файлом, содержащим только правила CSS. Использовать такой файл может неограниченное число Web-страниц, что позволяет обеспечить цельный и одинаковый облик всех страниц сайта.

Frames (Фреймы) - элемент языка HTML, позволяющий жестко разделить страницу на несколько независимых окон и в каждом из них размещать свою собственную web-страничку. Применяется в основном для организации постоянно находящихся на экране меню, в то время как в другом окне располагается непосредственно сама информация.

Flash - технология, которую разработала Macromedia Inc. для того, чтобы разнообразить обычные текстовые страницы web-сайта красочной и интерактивной векторной графикой. Технология Flash позволяет создавать как презентационные ролики, так и интерактивные интерфейсы, создающие новое качество комфорта на сайте.

JavaScript - является замечательный инструмент, позволяющий HTML-странице, загруженной в браузер, динамически управлять своим содержимым и самим браузером. Реализация JavaScript, называемая "динамический HTML" позволяет реализовать на web-странице почти полноценный пользовательский интерфейс с выпадающими многоуровневыми меню, перетаскиванием объектов мышью, анимацией и т.п. Текст программы встроен непосредственно в HTML-документ и интерпретируется самим браузером.

XML(eXtensible Markup Language) - это расширяемый язык разметки, предназначенный для описания в текстовой форме структурированных данных. Этот текстовый формат, во многом схожий с HTML, разработан специально для хранения и передачи данных.

XML позволяет описывать и передавать такие структурированные данные, как:

- отдельные документы;

- метаданные, описывающие содержимое какого-либо узла Internet;

- объекты, содержащие данные и методы работы с ними;

- отдельные;

- всевозможные web-ссылки на информационные и людские ресурсы в Интернете.

JavaScript -- скриптовый язык программирования. Обычно используется как встраиваемый язык для программного доступа к объектам приложений. Наиболее широкое применение находит в браузерах, как язык сценариев, для придания интерактивности web-страницам. Для написания приложения можно использовать NotePad++ -- свободный текстовый редактор с открытым исходным кодом для Windows, с подсветкой синтаксиса большого количества языков программирования и разметки. Базовая функциональность программы может быть расширена как за счёт плагинов, так и сторонних модулей, таких как компиляторы и препроцессоры [23].

Почти все браузеры в настоящее время поддерживают CSS и много других приложений. Чтобы создать CSS, не нужно ничего, кроме текстового редактора, но доступно много инструментов, которые еще больше упрощают этот процесс. В настоящее время большинство web-инструментов для разработки обеспечивают некоторую поддержку таблиц стилей CSS.

Использовать XML в своих программах очень просто, потому что он позволяет практически безо всяких трудозатрат реализовать удобный формат для обмена данными. Именно поэтому XML и становится таким популярным из-за простоты использования и наличия большого количества средств обработки.

Для css и xml можно использовать HTML-Kit - редактор HTML, XHTML и XML с плагинами, которые обеспечивают, помимо прочего CSS руководства.

Разработка приложения

Для проектирования был выбран ресурс gomockingbird (https://gomockingbird.com/). Примеры, которые будут приведены ниже, не будут окончательным вариантом сайта, в ходе написания сайта возможно бдет полностью пересмотрена структура страницы.

Главная страница небудет иметь последовательность страниц. Будет полностью динамическая и боовое меню, что будет сопроводать напротяжении всего скролинга страницы. А так же будет на странице присутствовать краткое описание той или иной информации, с переходом на полную статью.

5 пунктов меню на боковой панели будут автоматически переключаться, в ходе скролинга страницы, так же по пунктам можно будет быстро перейти в нужный раздел дабы не скролить страницу. Нас странице будет так же распологаться галереея с фотографиями. Оформление страницы будет в светлых тонах. Так же в низу главной странцы будет расположена обрастная связь.

Ниже будет приведен макет главной страницы.

Самое начало страницы

$C:\Users\stalk\AppData\Local\Microsoft\Windows\INetCache\Content.Word\1.png$

Следующий пункт меню

Следующий пункт меню с галереей

Следующий пункт меню

Следующий пункт меню с обратной связью

Следующие страницы будут несколько статичными.

Вот макеты некоторых из них.

А так же будут присутствовать самые простейшие страницы, где не требудется много информации.

Заключение

В ходе написания курсовой работы и разработки серверного web приложения на тему «Разработка информационного сайта», были применены уже имеющиеся навыки, а так же получены новые из некоторых источников. В ходе создания сайта, была достигнута требуемая цель, а так же обновлен код некоторых моих заготовок. Во время поиска информации на интренет ресурсах по теме сайта, была обнаружена новая информация, касаемая темы сайта, и представлена на моем ресурсе. Разработанный сайт удовлетворяет всем требованиям, поставленным на этапе постановки задачи.

Список литературы

http://php.net – информация по всем функциям php
http://htmlbook.ru – информация по html

Приложение

Приложение 1 – структура фс сайта

Приложение 2 – код главной стпницы (без текста)

</head>

<body>

<h1 class="tm-site-name">XAARP</h1>

</div>

<a href="#welcome" class="tm-nav-item-link">Климатическое оружие</a>

</li>

<a href="#about" class="tm-nav-item-link">Структура</a>

</li>

<a href="#galleryone" class="tm-nav-item-link">Галерея</a>

</li>

<a href="#secondgallery" class="tm-nav-item-link">Задачи</a>

</li>

<a href="#contact" class="tm-nav-item-link">Обратная связь</a>

</li>

</ul>

</nav>

</div>

</figure>

<h2 class="tm-blue-text tm-welcome-title tm-margin-b-45">Климатическое оружие</h2>

</header>

<p>текст</p>

<a href="oldarchitecture/index.html" class="tm-button tm-button-wide">читать далее</a>

</section>

<h2 class="tm-blue-text tm-section-title tm-margin-b-45">Структура</h2>

</header>

<p>текст

</p>

</div>

</div>

</section>

<header><h2 class="tm-blue-text tm-section-title tm-margin-b-30">галерея</h2></header>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</section>

<header><h2 class="tm-blue-text tm-section-title tm-margin-b-30">Задачи</h2></header>

<p>

текст

</p>

</section>

<header><h2 class="tm-blue-text tm-section-title tm-margin-b-30">Обратная связь</h2></header>

</div>

</div>

</div>

<button type="submit" class="float-right tm-button">Отправить</button>

</form>

</div>

<p>

Вы можете связаться по любым вопроса и предложениям через форму обратной связи. Спасибо.

</p>

</div>

$(document).ready(function(){

// Single page nav

$('.tm-main-nav').singlePageNav({

'currentClass' : "active",

offset : 20

});

// Magnific pop up

$('.tm-gallery-1').magnificPopup({

delegate: 'a', // child items selector, by clicking on it popup will open

type: 'image',

gallery: {enabled:true}

// other options

});

$('.tm-gallery-2').magnificPopup({

delegate: 'a', // child items selector, by clicking on it popup will open

type: 'image',

gallery: {enabled:true}

// other options

});

$('.tm-gallery-3').magnificPopup({

delegate: 'a', // child items selector, by clicking on it popup will open

type: 'image',

gallery: {enabled:true}

// other options

});

$('.tm-current-year').text(new Date().getFullYear());

});

</script>

Приложение 3 – скриншоты главной страницы