Создание сайта

Содержание

Введение……………………………………………………………….2

1.Теоретические основы разработки Сайта…………………………4

1.1.Требования к Web-приложениям………………………………..4

1.2.Основные правила и этапы создания сайта……………………..8

1.3 Выбор структуры  Web-страницы………………………………..9

2.Описание скрипта сайта……………………………………………14

2.1.Описание тегов……………………………………………………14

3.Размещение сайта в сети Интернет………………………………..17

Заключение……………………………………………………………19

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

Введение 

     Влияние глобальной компьютерной сети Internet на современный мир не имеет исторических аналогов. Его сегодняшний день – это начало эпохи электронного проникновения во все сферы человеческой жизни, это нечто большее, чем просто маркетинговая кампания, это основа новой философии и новой деловой стратегии.

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

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

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

     Объектом  исследования курсовой работы является: разработка и размещение сайта в сети Интернет, на примере компании «Очер МЕТАЛЛСЕРВИС». 

     Цель  курсового исследования: научиться  разрабатывать и размещать сайты  в сети Интернет. 

     Для этого необходимо решить следующие  частные задачи: 

– изучить  программный инструментарий, применяемый  для разработки и создания Web-сайтов;

– выявить  и учесть методы и способы представления  на Web-страницах различных видов информации, не препятствующие их доступности;

– ознакомиться с основными правилами и рекомендациями по разработке и созданию Web-сайтов и неукоснительно следовать им в своей практике;

– определиться со структурой Web-страниц;

– выбрать  стратегию разработки и создания Web-сайта. 

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

  1. Теоретические основы разработки Сайта.
 
    1. Требования  к Web-приложениям
 

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

     Вторым  этапом будет построение информационной архитектуры сайта.

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

     Карта сайта

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

     Главная страница

     Главная страница сайта компании – это  лицо сайта, обращённое ко всей сети. На главной странице чётко прописываются цели компании, при этом каждый элемент дизайна должен позволять пользователю ещё лучше разобраться в сайте и определиться с последовательностью действий для решения своих задач.

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

     • название компании или логотип в левом верхнем левом углу

     • прямую ссылку на главную страницу

     • индивидуальный слоган для сайта, состоящий из одного предложения

     Нельзя  предполагать, что пользователь попал  на данную страницу, преодолев весь путь от начала до конца. Вполне возможно, что он не видел той информации, которую мы указали на страницах  верхнего уровня иерархии. При глубоких ссылках мы должны сориентировать пользователя по месту, сообщить ему, где он сейчас находится на сайте, указав на странице цепочечную ссылку. Если есть необходимость, чтобы какая-то страница не индексировалась  в поисковиках, необходимо в элементе "HEAD" ввести <META NAME="robots" CONTENT="noindex">.

     "О  нас"

     В разделе "О нас" необходимо представить  основные сведения о компании:

     • состав верхнего управляющего звена (с библиографическим списком и фотографиями);

     • контактная информация;

     • философия организации (видение бизнеса, связи с обществом, стремления);

     • основные исторические вехи;

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

     Контент

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

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

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

     Для того, что бы страницы было удобно просматривать, мы будем использовать:

     • выделение ключевых слов;

     • грамотно составленные заголовки;

     • списки с маркерами;

     • один абзац на одну идею (пользователи пропустят все остальные идеи, если их не привлекут основные слова абзаца);

     • стиль перевёрнутой пирамиды (где статья начинается с заключения);

     • меньшее количество слов, чем в обычной статье;

     • минимум мало понятных терминов;

     • указание даты создания сообщения (что бы знать на сколько, оно актуально на данный момент);

     • контекстную информацию атрибута " ALT".

     • электронные заголовки часто выводятся вне контекста:

     • в списке статей на сайте;

     • в заголовках сообщений электронной почты;

     • в результатах поиска;

     • в закладках браузера.

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

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

     Почта

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

     Что бы поднять доверие к сайту  необходимо использовать качественные графические изображения. При этом не стоит использовать большие изображения, по умолчанию. Желательно использовать эскизы, а при необходимости увеличивать  их на столько, на сколько пожелает пользователь. Эскизы должны содержать всю основную информацию об изображении. На сайте правильнее будет использовать фотографии реальных работников и клиентов, а не фотомоделей с ослепительной голливудской улыбкой. Так же необходимо использовать хороший стиль письма и исходящие гипертекстовые ссылки на другие сайты. Не нужно использовать "рекламную воду", так как она несёт дополнительную эмоциональную нагрузку, и пользователям приходится тратить время на отсеивание гипербол от реальных фактов.

     Привязанность

     Классический  путь увеличения привязанности к  сайту – это публикация свежих материалов с определённой регулярностью (от ежедневных до ежемесячных). Для желающих необходимо организовать рассылки свежего материала. Почти 100% из тех, кто подписался, будут периодически заходить и на сам сайт, пока автор будет напоминать им о себе.

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

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

     Ссылки

     Ссылки  должны быть предсказуемы, пользователь должен знать, что произойдёт, если он нажмет на ссылку. Ясно указывать, что  является ссылкой: если это текст  пусть он будет цветным или  подчёркнутым. Не скрывать различия между  посещёнными и не посещёнными  ссылками. Создавать ссылки с расчётом того что поисковые системы являются самыми важными посетителями, а они  глухи и слепы по отношению  к высоким технологиям. Оформить теги "title" так, чтобы они хорошо смотрелись в поисковых системах и закладках, поэтому начинать ссылки необходимо с ключевого слова.

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

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

     Реклама

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

     Когда пользователь набирает слова запроса  на поисковом сервере, рекламные  объявления которые выйдут в списке результатов запроса, будут непосредственно  связаны с тем, что нужно человеку. И поэтому он читает эти объявления и щёлкает по ссылкам. Такая реклама  стоит гораздо дешевле, чем распространение  рекламных листовок.

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

     В рекламе пользователей больше всего  раздражает:

     • реклама во всплывающих окнах;

     • её медленная загрузка;

     • отсутствие кнопки "Закрыть";

     • уловки заставляющие кликнуть;

     • реклама закрывает читаемый материал;

     • мигающая реклама;

     • двигающаяся реклама;

     • реклама произвольно начинающая играть музыку или проигрывать видео.

     Наличие такой рекламы на сайте неизбежно  приведёт к падению доверия посетителей. Необходимо использовать в минимальных  количествах FLASH анимацию.

     Если  хочется разместить, рекламу она  должна соответствовать следующим  правилам:

     • четко указывать, что произойдёт по щелчку по ней;

     • четко идентифицировать себя как реклама;

     • описывать, что именно рекламируется;

     • даёт дополнительную информацию о себе без надобности покидать текущую страницу. 
 
 

1.2. Основные правила и этапы создания сайта

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

     Все предугадать невозможно, но на начальном  этапе можно придерживаться следующих  правил:

     – если разрабатывается сайт научного или академического содержания, особое внимание следует обратить на то, как  сайт работает в Lynx (или в другом неграфическом браузере);

     – если сайт предназначен для потребителей – например, сайт, который предлагает обучающие игрушки для детей, – внимание обращается на скорость загрузки и внешний вид сайта  для AOL-браузеров;

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

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

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

     1.3 Выбор структуры Web-страницы 

     Создание  фиксированных и гибких Web-страниц

     Требования  к Web-странице

     Огромное  количество источников по web-дизайну предлагают большое количество правил и советов по созданию и оформлению web-страниц.

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

     Необходимо  помнить:

     - 5-7 пунктов меню - это предел для  хорошего восприятия содержащейся  в меню информации;

     - оптимальное использование не  более 30-40 кбайт графики на  страницу;

     - дизайн первой страницы хоть  малость, но должен отличатся  от всех остальных страниц;

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

     - в web-страницах используются только форматы JPG, JPEG и GIF;

     - пользователь, находящийся в середине  сервера – должен иметь возможность  попасть в любую точку вашего  сайта или странички;

     - необходимо разбивать большое  количество информации;

     - именовать, созданные странички  следует на английском языке;

     - необходимо избавляться от горизонтальных  прокруток экрана;

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

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

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

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

     - не используйте на сайте текст,  набранный заглавными буквами;

     - более всего нежелательно - это  использование при создании сайта  фреймов;

     - размер каждой страницы сайта  не должен превышать предел  в 80-100 килобайт вместе с графикой (оптимально - 40-50), за исключением  страниц с большим количеством  информации - электронных книг, например. В любом случае при большом  размере того или иного файла  об этом должно быть сказано  около ссылки на него.

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

     Web-страницы по умолчанию гибкие. Текст и элементы HTML-файла попадают в окно браузера, заполняя все доступное пространство, вне зависимости от размеров дисплея. Если размер окна браузера изменяется, элементы повторно выводятся, чтобы настроиться на новые размеры. В этом и проявляется сущность Web. Многие дизайнеры сознательно разрабатывают страницы таким образом, чтобы они выдерживали расширения и сжатия Web-окна. Этот подход имеет свои достоинства и недостатки.

     Достоинства:

     – Web-страницы будут отображаться на дисплеях с разным разрешением; гибкую страницу можно настроить для вывода на любом дисплее;

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

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

     Недостатки:

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

     – на больших дисплеях элементы будут  расположены на экране достаточно гармонично, на маленьких дисплеях они оказываются  скученными;

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

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

     Достоинства:

     – страница будет выглядеть одинаково  независимо от размеров дисплея. Это  особенно важно для компаний, стремящихся  представить свой имидж одинаково  для всех посетителей;

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

     Недостатки:

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

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

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