Разработка и создание сайта "Шаг в будущее"
Превращение Internet из большой игрушки для интеллектуалов в полноценный источник разнообразной полезной информации для любой категории пользователей. Современные Интерент-технологии. Основные правила и этапы создания сайта. Web-дизайн и браузеры.
| Рубрика | Программирование, компьютеры и кибернетика |
| Вид | реферат |
| Язык | русский |
| Дата добавления | 12.03.2010 |
| Размер файла | 149,4 K |
Отправить свою хорошую работу в базу знаний просто. Используйте форму, расположенную ниже
Студенты, аспиранты, молодые ученые, использующие базу знаний в своей учебе и работе, будут вам очень благодарны.
МИНИСТЕРСТВО ОБРАЗОВАНИЯ САРАТОВСКОЙ ОБЛАСТИ
САРАТОВСКИЙ ГОСУДАРСТВЕННЫЙ СОЦИАЛЬНО-ЭКОНОМИЧЕСКИЙ УНИВЕРСИТЕТ
ОБЛАСТНОЙ КОНКУРС МАТЕМАТИЧЕСКИХ И КОМПЬЮТЕРНЫХ РАБОТ ШКОЛЬНИКОВ
«ВЕКТОР БУДУЩЕГО - 2009»
Реферат работы на тему
РАЗРАБОТКА И СОЗДАНИЕ САЙТА «ШАГ В БУДУЩЕЕ»
(СЕКЦИЯ «ИНФОРМАЦИОННЫЕ ТЕХНОЛОГИИ»)
Выполнили ученицы 10 «а» класса
МОУ «СОШ с. Питерка
Питерского района Саратовской области»
Филатова Ольга Александровна
Авдошина Юлия Анатольевна
Руководитель работы:
Учитель Лебедева
Светлана Николаевна
Саратов
2009
Содержание
Введение
1. Современные Интерент-технологии
1.1 Web-дизайн и браузеры
1.2 Язык разметки гипертекстовых страниц HTML
1.3 Обеспечение доступности Web-страницы
1.4 Представление текста на Web-страницах
1.5 Представление графики на Web-страницах
2. Основные правила и этапы создания сайта
Заключение
Библиографический список
Введение
Internet развивается довольно стремительно. Быстро растет количество изданий, посвященных Сети, что предвещает широкое ее распространение даже в далеких от техники областях. Internet превращается из большой игрушки для интеллектуалов в полноценный источник разнообразной полезной информации для любой категории пользователей.
Через десять лет, по прогнозам специалистов, около 50 процентов семей (безусловно, пока лишь в развитых странах) будут использовать его ежедневно. Телевидение и радиоприемники не будут заменены компьютерами, но будут иметь мощный процессор, большую память и фактически сами станут в некотором отношении компьютерами.
Это будет время, когда любой человек, владеющий компьютером, сможет "скачать" с его помощью статьи, иллюстрации, видео- или аудиоинформацию по любой интересующей его теме. Он сможет получить эту информацию тогда, когда он этого пожелает. Через какое-то время системы искусственного интеллекта - параллельный машинный перевод, а также идентификация и распознавание голоса сломают последние национальные и языковые барьеры и сделают возможным свободный транснациональный обмен информацией.
Каждый из нас уже сейчас может сделать свой вклад в развитие Internet. Для этого достаточно создать свой веб-сайт и разместить его в Сети. Но как это сделать? Ответ на данный вопрос мы попробуем дать в этой работе.
В вопросе разработки и создания Web-страниц в сети Интернет накоплен огромный багаж различных методов, способов и технологий, многие из которых, к сожалению, сейчас уже являются условно применимыми. Дело в том, что обновление аппаратного оборудования год от года только прогрессирует, причем с нарастающими темпами. Поэтому представляется актуальным и практически важным рассмотреть проблему проектирования Web-сайта в современных условиях с использованием достижений, накопленных в данной области.
Целью работы является изучение методической и прикладной литературы по проблемам проектирования и создания Web-страниц, а также разработка и создание веб-сайта.
В процессе достижения поставленной цели необходимо решить ряд следующих задач:
- ознакомиться с современными Интернет-технологиями и, по возможности, использовать их в своей разработке;
- изучить программный инструментарий, применяемый для разработки и создания Web-сайтов;
- выявить и учесть методы и способы представления на Web-страницах различных видов информации, не препятствующие их доступности;
- ознакомиться с основными правилами и рекомендациями по разработке и созданию Web-сайтов и неукоснительно следовать им в своей практике;
- определиться со структурой Web-страниц;
Тему для Web-сайта мы выбрали не случайно. Нам до окончания школы осталось полтора года. И мы столкнулись с вопросами, касающиеся профориентации.
Большинство детей-подростков уже имеют какую-то сложившуюся систему ценностей, представления о своей будущей жизни. Они понимают, что для достижения своих целей необходимо иметь хорошую профессию и образование. Многие представляют, в каком вузе, лицее, колледже они продолжат образование. А кто-то еще колеблется и плохо представляет себе, какие профессии в будущем будут востребованы, какие личностные и профессиональные качества понадобятся им для достижения успеха. Впрочем, эти вопросы настолько сложны, что и немногие взрослые знают на них ответы. Именно это подтолкнуло нас на создание сайта под названием «Шаг в будущее» http://vipusknikam.my1.ru/. Создавая его, мы ставили перед собой следующую цель - помочь учащимся в выборе профессии, а также познакомить их с учебными заведениями города Саратова, где они смогут приобрести необходимые знания для их будущей профессии. Наши главные задачи - скорректировать профессиональные предпочтения, показать, какие профессии являются перспективными в современном российском обществе.
1. Современные Интерент-технологии
1.1 Web-дизайн и браузеры
Многие Web-дизайнеры сходятся во мнении, что одна из главных проблем Web-дизайна - многообразие браузеров и платформ, каждая из которых по-разному поддерживает HTML и сценарии. С выпуском каждого нового браузера улучшаются их характеристики и возможности, но это не означает, что более ранние версии при этом исчезают.
Как сделать дизайн Web-страницы эстетически и технически интересным, не игнорируя при этом владельцев предыдущих версий браузеров? Неужели Web-страница, рассчитанная на то, чтобы функционировать на любых браузерах, должна быть обязательно скучной? Можно ли угодить всем? И если нет, то где провести черту? Сколько старых версий будет работать с вашей страницей?
В Web-дизайне нет жестких правил. Поскольку главная наша задача - сделать содержимое страницы доступным для максимального количества пользователей, то для продвижения вперед одинаково важны и эксперимент, и использование новых технологий с учетом существующих реалий. Залог успеха дизайнерского решения лежит в понимании потребностей аудитории и в четком представлении, как сайт будет использован.
Сейчас существет множество браузеров и перед пользователем стоит нелёгкий выбор. Мы рассмотрели лучшие из вариантов, возможные на сегодняшний день и предоставляем их вам. Все представленные программы явлются бесплатными и обладают русскоязычным интерфейсом. Итак, начнём.
Internet Explorer 7
Internet Explorer является самым популярным мировым браузером. Но, к сожалению, такое большое количество пользователей использует его лишь по той причине, что просто не знают о существовании других более быстрых и удобных браузеров. Также существует необходимость держать на компьютере сей продукт, потому что многие программы используют компоненты IE и без него корректно работать не будут. Ввиду популярности этого браузера многие сайты заточены именно под него. Что всё-таки иногда заставляет возвращаться к Internet Explorer.
Плюс браузера в том, что он включает большинство современных достижений в области браузерных технологий, поддерживает большинство сайтов.
Mozilla FireFox
Самой заметной функцией браузера FireFox является расширяемость. Поэтому следует упомянуть об этой возможности более подробно.
FireFox можно дополнить какой угодно функцией при помощи различных примочек. Итак, вы нашли интересное дополнение, что же делать дальше? Если вы нашли его во всемирной сети - то вам достаточно будет всего лишь нажать на ссылку расширения. Браузер сам обнаружит и установит её.
Opera
Здесь мы опишем наиболее самые популярные возможности, которые отсутствуют в продуктах конкурентов.
Первое, о чём стоит упомянуть - это необычное управление Оперой. Вы можете управлять браузером как при помощи голоса (для этого необходимо установить необходимые библиотеки, размером около 10 мегабайт), а также при помощи специализированных мышиных жестов. Очень удобным нововведением в браузере стало отображение страниц-миниатюр. Когда пользователь открывает такое большое количество вкладок, когда прочтение адреса становится уже невозможным, пользователь просто наводит мышью на интересующую закладку и видит её изображение в миниатюре. Таким образом, не нужно прощелкивать все страницы в поисках нужной, а просто пару раз навести мышкой. Такой шаг очень хорошо экономит время.
Также в браузере Opera реализован удобный блокировщик содержимого сайтов, существует возможность индивидуально настроить правила отображения каждого портала в отдельности. Например, на одном сайте всплывающие окна носят рекламный характер, поэтому их лучше заблокировать. Зато многие форумы используют систему обмена личными сообщениями именно при помощи таких всплывающих окон.
Распространённые браузеры
|
Популярные |
Internet Explorer, Firefox, Safari, Opera, Flock, Google Chrome |
|
|
Менее распространённые |
SeaMonkey, Avant Browser, Netscape Navigator, Maxthon, Galeon, Epiphany, Kazehakase, Charon, Arachne, Konqueror, K-Meleon, slimbrowser, FastIE, MyBrowser, Dillo |
|
|
Текстовые |
Alynx, ELinks, Links, Lynx, Netrik, w3m, WebbIE, DosLynx |
|
|
Для портативных устройств |
Internet Explorer Mobile, Mozilla Fennec, Opera Mini, Safari для iPhone |
Наиболее популярные браузеры и процент их использования (статистика)
По данным Net Applications на 11 января 2009 года
Подведем итог. Учёт типа и версии браузера, на котором посетители сайта будут просматривать - важный составной момент как создания сайта, так и реконструкции сайта.
· Дизайн сайта зависит от браузера и его версии, с помощью которой посетители просматривают сайт.
· Дизайн сайта может выглядеть искаженным и отличаться от дизайна сайта, первоначально задуманного веб-дизайнером, в зависимости от браузера и его версии.
· В техническом задании на создание сайта или реконструкцию сайта желательно оговорить отдельным пунктом, основной браузер, которым будет просматриваться сайт и его версию.
· Чем сложнее программный код сайта, тем выше вероятность искажения дизайна сайта в зависимости от браузера и его версии.
1.2 Язык разметки гипертекстовых страниц HTML
Для создания любой интернет-странички используется язык гипертекстовой разметки HTML (Hypertext Markup Language -- ЯЗЫК разметки гипертекстовых страниц).
Прежде всего постараемся понять суть данного языка и принцип его использования.
В Интернете полно очень красочных и ярких страничек, которые загружаются очень быстро. Как? За счет чего?
За счет языка гипертекстовой разметки HTML. Именно он и позволяет создавать яркие и красивые интернетовские-странички, которые при этом занимают весьма маленький объем и довольно быстро скачиваются даже при медленном телефонном соединении.
В чем же кроется секрет? В том, что при использовании HTML интернет-страничка пересылает по Интернету не графический файл, на котором явно нарисовано все, что вы захотели изобразить, а инструкцию программе-браузеру, в которой говорится, что и как программа должна отображать на экране.
То есть, например, если вы хотите, чтобы в качестве фона странички был какой-нибудь яркий орнамент, то вместо того, чтобы изготавливать огромную картинку, заполненную повторяющимися элементами, можно просто создать файлик с этим орнаментом (как правило, такие файлы занимают менее 10 Кб), а дальше на страничке дать команду браузеру заполнить данным орнаментом весь фон. Команда будет выглядеть так:
<body background=ornament.gif» >
После применения этой команды фон странички расцветится файлом орнамента, который весит всего 4 Кб.
Кроме того, HTML обладает еще одним очень важным достоинством -- универсальностью и переносимостью под разные операционные системы и различные программы-просмотрщики интернетовских страниц. Потому что вашей странице будет совершенно все равно, под какой операционной системой работает ваш гость, -- под DOS, Windows, UNIX или еще под какой-нибудь. Да и название программы-просмотрщика (браузера) вас тоже не должно сильно волновать.
Язык HTML определяет синтаксис и размещение специальных инструкций (тегов), которые не выводятся на экран, но указывают браузеру, как отображать содержимое документа. Он также используется для создания ссылок на другие документы, локальные или сетевые, например, находящиеся в сети Интернет.
Документы HTML являются обычными текстовыми файлами. Это означает, что для их создания можно использовать любой текстовый редактор, даже с минимальными возможностями. Существуют средства редактирования, разработанные специально для написания HTML. Они позволяют экономить время, так как содержат клавиши быстрого доступа для выполнения повторяющихся операций, например, задания начальных установок документов, таблиц или просто применения стилей к тексту.
Документ HTML содержит текст (содержимое страницы) и встроенные теги - инструкциями о структуре, внешнем виде и функции содержимого. Документ HTML разделяется на две основные части: заголовок - head и тело - body. Заголовок содержит такие сведения о документе, как его название и методическая информация, описывающая содержимое. В теле находится само содержим документа (то, что выводится в окне браузера).
Каждый тег состоит из имени, за которым может следовать список необязательных атрибутов, все они находятся внутри угловых скобок < >. Содержимое скобок никогда не выводится в окне браузера. Имя тега, как правило, представляет собой аббревиатуру его функции, что облегчает его запоминание. Атрибуты являются свойствами, которые расширяют или уточняют функцию тега. Как правило, имя и атрибуты внутри тега не чувствительны к регистру. Тег <BODY BGCOLOR=white> будет работать так же, как <body bgcolor=white>. Однако значения определенных атрибутов могут быть чувствительны к регистру. Это относится, в частности, к именам файлов и URL.
Контейнеры. Большинство тегов являются контейнерами. Это означает, что у них имеется начальный (открывающий или стартовый) и конечный (закрывающий) теги. Текст, находящийся между тегами, будет выполнять содержащиеся в них инструкции. Например:
The weather is <I>gorgeous</I>today.
Результат: The weather is gorgeous today.
Конечный тег имеет то же имя, что и начальный, но перед ним стоит слэш (/). Его можно рассматривать как "выключатель" тега. Конечный тег никогда не содержит атрибутов.
В некоторых случаях конечный тег не обязателен, и браузер определяет конец тега из контекста. Чаще всего опускают конечный тег <р> (абзац). Браузеры раньше поддерживали этот тег без соответствующего завершения, поэтому многие авторы Web привыкли использовать краткую форму. Это разрешено не всем тегам, и не все браузеры прощают их отсутствие. Поэтому, если есть сомнения, включите в текст закрывающий тег. Это особенно важно, когда в документе вы используете каскадные таблицы стилей.
1.3 Обеспечение доступности Web-страницы
При разработке Web-страницы фиксированного размера, вероятно, придется выбирать для нее размер экрана. Здравый смысл подсказывает, что страница должна быть доступна (и правильно отображаться) для максимально возможного числа пользователей. Идея проста: необходимо определить наиболее часто используемое разрешение дисплея и разработать страницу таким образом, чтобы страница гарантированно заполняла все рабочее пространство.
Большинство дизайнеров рекомендуют разрабатывать страницы в формате 640x480, чтобы при просмотре пользователям не пришлось применять горизонтальную прокрутку. Горизонтальная прокрутка всегда затрудняет восприятие, поэтому дизайнеры традиционно ее отвергают.
Все большее число разработчиков считает стандартным разрешение 800x600. И совсем единицы разрабатывают страницы для еще более высоких разрешений. Конечно, ваше решение будет, в первую очередь, зависеть от аудитории. Например, если сайт ресурсов для дизайнеров графики, то считаем, что они имеют дисплеи, по крайней мере, с разрешением 800x600 или выше, в соответствии с чем и разрабатывается страница. Если сайт предназначен специально для WebTV или какого-то другого устройства отображения, следует ориентироваться на это конкретное устройство.
Достойный уважения Web-дизайн включает разработку страниц, доступных для пользователей с ограниченными возможностями, в частности по зрению и слуху. Консорциум World Wide Web объявил об инициативе Web Accessibility Initiative (WAI), которая ставит целью сделать Web более доступным для всех пользователей. Однако успех данной инициативы зависит от участия в ней рядовых разработчиков, которые могут (или не могут) создать Web-сайты в соответствии с поставленными задачами.
Пользователи с ограниченными возможностями зрения могут использовать специальные устройства для увеличения изображения, находящегося на экране. В этом случае к дизайну не предъявляется никаких специальных требований. Многие люди с проблемами зрения используют текстовые браузеры (такие как Lynx) вместе с программным обеспечением, которое громко читает содержимое страницы. В любом случае основное внимание уделяется структуре документа и его тексту. Графическое содержимое может быть просто утеряно.
1.4 Представление текста на Web-страницах
При разработке Web-страницы средствами базового HTML есть два комплекта шрифтов; пропорциональный и шрифт фиксированной ширины. Проблема заключается лишь в том, что неизвестно, какой из них и какого размера будет использован при отображении.
Пропорциональный шрифт - иначе "шрифт переменной ширины" для каждого символа выделяет разное количество места в зависимости от его начертания. Например, в пропорциональном шрифте заглавная "W" занимает больше места в строке по горизонтали, чем прописная "I". Такие гаринитуры, как: Times, Helvetica и Arial являются примерами пропорциональных шрифтов.
Web-браузеры для большинства текстов на Web-странице, включая основной текст, заголовки, списки, цитаты и т. д., используют пропорциональные шрифты. Как правило, большие отрывки основного текста удобнее читать, когда они напечатаны пропорциональными шрифтами. Поскольку большинство пользователей не имеют времени заменить шрифты, установленные по умолчанию, с большой вероятностью можно предположить, что текст на вашей странице будет отображен шрифтом Times размером 10 или 12 пунктов (по умолчанию в Netscape) или Helvetica (по умолчанию в Microsoft Internet Explorer). Но это всего лишь общее правило.
Шрифт с фиксированной шириной предоставляет одинаковое место для всех символов шрифта. Заглавная "W" занимает не больше места, чем прописная "I". Примерами шрифтов фиксированной ширины являются гарнитуры Courier и Monaco. В Web-браузерах шрифты фиксированной ширины используются для отображения любого текста внутри следующих HTML-тегов: <рге>, <tt>, <code>, <kbd>,<samp>, <хтр>.
Поскольку многие люди не меняют настройку шрифтов, установленную по умолчанию, текст, находящийся в указанных тегах, будет выведен одним из шрифтов типа Courier.
Текст в изображениях. Дизайнеры быстро поняли, что самый верный способ абсолютного контроля над шрифтами - поместить текст в изображение. Можно часто видеть заголовки, подзаголовки и объявления, выполненные в виде файлов GIF. Многие Web-страницы представлены исключительно в графике, которая содержит внутри себя весь текст страницы.
Преимущества использования графики вместо HTML-текста абсолютно очевидны:
- можно определять тип шрифта, размер, интерлиньяж, промежуток между буквами, цвет и выравнивание - все атрибуты, которые вызывают сложности только в HTML;
- ваша страница будет одинакова при выводе во всех графических браузерах.
Но у этого метода имеется ряд недостатков:
- изображение загружается дольше, чем текст, т.к. графические файлы обычно на несколько порядков больше, чем HTML-тексты, имеющие то же содержание;
- в неграфических браузерах содержание утрачивается. Пользователи, которые не могут (или не хотят) просматривать графику, не увидят и текста. Альтернативный текст (используется атрибут Alt) на месте графического изображения помогает, но его возможности ограничены и это не всегда надежный способ отождествления отсутствующей графической информации;
- информацию, находящуюся в изображении, нельзя индексировать или организовать ее поиск. В результате исключаются из документа важные части информации.
Размер шрифта. Обычно размер шрифта определяется в пунктах (72 пункта (пт) = 1 дюйм высоты шрифта) но, к сожалению, эти размеры не достаточно точно переводятся между платформами. Отчасти это происходит потому, что их операционные системы управляют дисплеями с различными разрешениями.
1.5 Представление графики на Web-страницах
На данный момент почти все изображения в Web, представлены в двух форматах: GIF и JPEG. Третий соперник, заслуживающий упоминания, формат PNG, борется за поддержку и внимание браузеров. Далее - краткий обзор "большой тройки" онлайновых графических форматов. Более подробная информация представлена в главах, посвященных каждому из форматов.
GIF. GIF - Grafic Interchange Format можно назвать традиционным форматом файлов Web. Он был первым форматом файлов, который поддерживался Web-браузерами, и по сей день продолжает оставаться основным графическим форматом Web.
Его свойства состоят в следующем:
- поддерживает не более 256 цветов (меньше можно и часто нужно);
- использует палитру цветов;
- использует сжатие без потери информации по методу LZW (который подобен применяемому в архиваторе PKZIP, и, следовательно, GIF-файлы в дальнейшем практически не сжимаются);
- поддерживает чересстрочную развертку;
- является поточным форматом, т.е. показ картинки начинается во время перекачки;
- позволяет назначить одному из цветов в палитре атрибут прозрачный, что применяется при создании так называемых прозрачных GIFов;
- имеет возможность сохранения в одном файле нескольких изображений, что находит свое применение при изготовлении анимированных GIFов;
- поддерживает возможность вставки в файл управляющих блоков, которые позволяют вставлять комментарии в файл (например, об авторских правах), осуществлять задержку между показами изображений и т.д.
JPEG. Вторым наиболее популярным графическим форматом в Web является JPEG - Joint Photographic Experts Group. Он содержит 24-разрядную информацию о цвете. Это 16,77 млн цветов в отличие от 256 цветов формата GIF. В JPEG используется так называемое сжатие с потерями. Это означает, что некоторая информация об изображениях в процессе сжатия отбрасывается, но в большинстве случаев ухудшение качества изображения не наносит вреда и часто даже не заметно.
Фотографии или любые изображения с плавными градациями цветов лучше всего сохранять в JPEG-формате, потому что он предлагает более высокое качество изображений, умещающихся в файл меньшего объема. Тем не менее, JPEG не является лучшим решением для графических изображений с одноцветными областями, поскольку этот формат имеет тенденцию испещрять цвета крапинками и конечный файл, как правило, будет несколько больше, чем GIF-файл для того же изображения.
Разрешение и размер файла изображений. Поскольку изображения Web существуют только на экране дисплея, будет технически правильно измерять их разрешение в пикселах на дюйм (ppi - pixels per inch). Другая единица измерения разрешения - количество точек на дюйм (dpi - dots per inch) относится к разрешению печатных изображений и зависит от разрешения печатающего устройства.
Размер файла. Без сомнения, именно графика сделала Web таким, каким мы его видим сегодня. Не стоит забывать, что графика увеличивает время, необходимое Web-странице для передачи по сети; большой объем графики означает существенное время загрузки, которое испытывает терпение читателя, особенно если он дозванивается с использованием стандартного модемного соединения.
В этом отношении для Web-дизайнера существует единственное наиболее важное правило: размер файла графического изображения должен быть минимально возможным! Создание изображений, предназначенных для передачи по сети, возлагает ответственность на разработчиков серьезно относиться к проблеме времени загрузки.
2. Основные правила и этапы создания сайта
В этой части мы расскажем о том, какие методы и средства были использованы нами для создания сайта.
Для того чтобы наша работа над сайтом была эффективной, необходимо провести небольшую предварительную работу.
Жизнь сайта можно условно разделить на следующие этапы:
1 - Идея
2 - Разработка структуры сайта
3 - Разработка оформления сайта
4 - Кодинг, Программирование
5 - Тестирование и доработка
6 - Продвижение, реклама
7 - Дальнейшая поддержка и обновление.
Давайте рассмотрим каждый из этапов создания сайта более или менее подробно.
Прежде, чем приступить к работе над сайтом, мы должны четко представлять, что в итоге хотим получить, подумать о перспективах развития сайта.
Итак, мы должны решить:
- Зачем создавать сайт (нужно ли вообще)
- О чем будет сайт (тематика)
- Что это будет (домашняя страница, портал, или что-то еще)
- Отличие от сайтов с такой же тематикой (если это не домашняя страница)
- Какова будет аудитория сайта (пол, возраст, интересы и т.д.)
- Какого рода сервисы будут на сайте (форум, каталог, почта и т.д.)
- Планы на ближайшее будущее
- Планы дальнейшего развития (перспективы)
... и много других подобных вопросов надо обязательно решить прежде, чем браться за реализацию. Продумывание: что, как зачем и почему - самый важный этап в создании сайта. Главное хорошая идея, а остальное приложится.
Только после того, как в вашей голове, а лучше и на бумаге, оформится четкий образ того, каким должен быть сайт, можно приступать к другим этапам. Некоторые этапы разработки сайта могут производиться параллельно друг другу (особенно, если над созданием сайта работает несколько человек).
Тема нашего сайта родилась сама собой. Не за горами и нам сдавать экзамены и поступать в ВУЗы, поэтому мы решили создать сайт по профориентации «Шаг в будущее». Мы считаем, что сайт необходим, так как наш поселок отдален от города и информацию об учебных заведениях г. Саратова наши выпускники могут получить в большей мере из Интернета (тем более за последние два года Интернет стал очень популярен и распространен). Отличие от сайтов с такой же тематикой, в том что сайт создан именно для выпускников Саратовской области. Аудитория сайта - выпускники школ и абитуриенты, родители. На сайте предполагается информация о ВУЗах города Саратов, о ЕГЭ, о наиболее востребованных профессиях, информация по профориентации.
Следующий этап - разработка структуры. Чтобы выиграть битву нужен план сражения. Чтобы не заблудиться в лабиринте и найти выход, нужен план лабиринта. При поиске сокровищ без плана местности не обойтись. Чтобы создать сайт также нужен план. Четко расписанный, что, где будет располагаться. План этот нужно нарисовать для себя на бумаге, и называется это разработка структуры сайта.
Структуру сайта можно условно разделить на внешнюю и внутреннюю.
Для начала поговорим о внутренней структуре сайта. Она зависит от того, какую информацию мы будем размещать, какие есть материалы. Нужно решить, какие будут на сайте разделы, подразделы - предстоит продумать древо сайта.
Когда перед глазами план внутренней структуры, можно смело продолжать работу над сайтом, не боясь чего-то забыть или упустить.
Теперь поговорим о внешней структуре, под ней имеется ввиду расположение основных значимых элементов на каждой странице. Надо решить, где и как будут располагаться баннеры, счетчик, меню, возможно, поиск, основное содержание, какие-то анонсы о новых разделах сайта, обновлениях, и т.д.
При разработке внешней и внутренней структуры главная задача сделать так, чтобы в будущем посетителю было легко ориентироваться на сайте, чтобы важная и нужная информация легко находилась.
Оформление или дизайн - это внешний вид сайта. Эта та оболочка, которую придется надевать на сайт, как этикетку на коробку с товаром. От этой самой этикетки зависит многое.
Первое впечатление от сайта очень важно, от него зависит останется ли посетитель, будет ли знакомиться с информацией, которую ему предлагают, или закроет окно и навсегда забудет.
Оформление сайта подсказывает посетителю, куда он попал: корпоративный ли это сайт какой-либо компании, или информационный портал, или литературный сайт, или что-то еще. Оформление помогает посетителю ориентироваться по сайту, а может, и наоборот, сбить посетителя с толку так, что даже при хорошо разработанной структуре посетителю будет трудно ориентироваться.
Дизайн - это целая наука. Чтобы овладеть ей, придется ознакомиться с такими понятиями, как колористка (теория цвета), композиция, шрифт, и многими другими. Многое в жизни подчинено давно выработанным законам и правилам, дизайн - не исключение.
Вот такая сложная наука это оформление сайтов на поверку оказывается: много чего уметь надо и много чего знать, чтобы создать хороший дизайн для сайта.
При создании нашего сайта мы пошли более легким путем. Мы использовали современную бесплатную систему управления сайтом uCoz, которая работает по принципам Web 2.0 и позволяет создавать сложнейшие проекты с необычайной простотой и легкостью. Систему uCoz не нужно скачивать и устанавливать, достаточно просто зарегистрироваться. При регистрации мы получили доменное имя. В системе все подробно, пошагово расписано каждое действие, можно выбрать любой из представленных дизайнов (после дизайн можно редактировать).
Вот мы придумали зачем нам сайт, решили, что и где будет располагаться на нем. Это хорошо, но впереди нас ждет еще много работы. Мы имеем на руках оболочку (макет внешнего вида сайта) и план действий (структуру). Но что стоит за оболочкой? А за оболочкой стоит каркас, на котором эта оболочка держится. Если кликниуть правой кнопкой мыши по странице, в выпавшем меню выберите пункт - view source (или "просмотр HTML кода") - появится текстовой редактор с непонятными, возможно, символами и значками - это и есть код страницы, ее каркас.
Этот код, как говорилось ранее, отвечает за то, что мы видим в определенной последовательности на странице текст и картинки. Как правило, код этот пишется на языке разметки текстовых документов HTML.
Подведем итоги: кодинг и программирование оказывается тоже достаточно сложный этап в создании сайта. От того, кто разрабатывает программную начинку сайта, и пишет код сайта, также как от дизайнера, требуются хорошие, твердые знания и опыт, чтобы создать хороший коммерческий и серьезный проект.
Для освоения HTML мы использовали простой и понятный учебник по HTML с сайта Постройка.ру. HTML мы использовали для введения информации, изображений, анимации на сайт.
Создание сайта с помощью системы uCoz было не очень сложным, но в некоторых ситуациях мы испытывали трудности.
Когда мы сайт был выложен, то прежде, чем раскручивать и рекламировать его, мы проверили его на работоспособность.
После того, команда протестировала и выверила сайт на работоспособность, мы попросили не участвовавших в разработке людей еще раз протестировать и осмотреть наш сайт. Возможно, мы не заметили каких-то недочетов, которые увидят свежим взглядом, люд, не участвовавшие в разработке. Также мы создали тему в форуме: что нравится или не нравится посетителям на вашем сайте, удобна ли навигация и т.д.
Данный пункт в жизни сайта достаточно важен: казалось бы, подумаешь - мелочи. Однако когда таких мелочей накапливается слишком много - это очень плохо.
На этом мы не заканчиваем нашу работу, мы планируем и дальше пополнять сайт информацией и заниматься его процветанием.
Заключение
Итак, подведем итог. В начале работы мы поставили цель: изучить литературы по проблемам проектирования и создания Web-страниц, а также разработать и создать сайт. Поставленной цели достигли - http://vipusknikam.my1.ru/.
В процессе достижения поставленной цели мы решили ряд следующих задач:
- ознакомились с современными Интернет-технологиями и, по возможности, использовали их в своей разработке;
- изучили программный инструментарий, применяемый для разработки и создания Web-сайтов;
- выявили и учли методы и способы представления на Web-страницах различных видов информации, не препятствующие их доступности;
- ознакомились с основными правилами и рекомендациями по разработке и созданию Web-сайтов и неукоснительно следовали им в своей практике;
При создании сайта мы использовали соврменную бесплатную систему управления сайтом uCoz, которая работает по принципам Web 2.0 и позволяет создавать сложнейшие проекты с необычайной простотой и легкостью.
Модули uCoz могут использоваться как в единой связке для создания полнофункционального сайта, так и по отдельности, например в качестве блог-платформы, веб-форума и др. На данный момент в системе создано более 700 тысяч сайтов.
Возможности системы
· На выбор предоставляется 227 дизайнов (шаблонов) для создания сайта.
· Возможно создать собственный дизайн (шаблон), либо переделать любой стандартный.
· При регистрации выделяется 300 мегабайт дискового пространства.
· Предоставление домена третьего уровня в 16 различных зонах.
· Возможность привязать к сайту собственный домен.
· Неограниченное создание/редактирование MX записей, и создание субдоменов, после прикрепления домена.
· Доступ по FTP.
· Бесплатная техподдержка.
Библиографический список
1. http://www.ucoz.ru/
2. http://www.postroika.ru/
3. http://www.antula.ru/page-code.htm
4. http://ru.wikipedia.org/wiki/
5. http://www.datainlife.ru/
6. http://www.bistrosite.com/
Подобные документы
Современные Интернет-технологии, Web-дизайн и браузеры. Язык разметки гипертекстовых страниц HTML. Представление текста и графики на Web-страницах. Правила и этапы создания сайта. Влияние дисплеев на Web-дизайн. Сравнительный анализ HTML-редакторов.
дипломная работа [3,3 M], добавлен 21.06.2013Понятие Internet как глобальной мировой системы передачи информации. Анализ системы World Wide Web, ее особенности. Рассмотрение главных целей сайта, создание сайта для магазина продуктов питания. Этапы разработки дизайна сайта и создание базы данных.
курсовая работа [2,1 M], добавлен 13.07.2012Выбор инструментальных и программных средств для создания сайта. Структура программного продукта. Создание сайта при помощи программы WordPress. Тестирование разработанной программы. Разработка структуры и дизайна сайта. Наполнение сайта контентом.
курсовая работа [1,0 M], добавлен 09.01.2014Разработка сайта в приложении FrontPage. Программные средства и технологии, используемые при разработке сайта. Основная структура сайта и размещение исходных файлов. Создание графических страниц, элементов и рисунков. Размещение сайта в сети Internet.
курсовая работа [1,6 M], добавлен 13.06.2013Проектирование сайта учителя в системе Ucoz с учетом особенностей педагогической деятельности. Обновление и пополнение содержимого сайта. Регистрация пользователей. Настройка дизайна и выбор модулей для сайта. Создание меню и наполнение сайта контентом.
курсовая работа [2,1 M], добавлен 14.06.2014История веб-дизайна и сайтов. Пример раннего сайта Angelfire. Популярные браузеры, цветовая модель RGB. Структура корпоративного сайта. Предпроектный анализ разрабатываемого веб-сайта. Основные блоки макета. Пример адаптивной верстки. Макет в Photoshop.
дипломная работа [8,0 M], добавлен 10.10.2015Ознакомление с современными Интернет-технологиями и использование их в своей разработке. Изучение основных программ, применяемых для разработки и создания Web-сайта. Инструментальные средства. Информационная структура, дизайн и шаблон web-сайта.
контрольная работа [1,0 M], добавлен 15.02.2017Создание официального сайта КРОО ПСЗЗ "Красштаб Здоровья". Основные требования к дизайну, интерфейсу и функциональности сайта. Состав технических средств, защита информации. Описание входной и выходной информации. Расчет себестоимости разработки.
дипломная работа [1,4 M], добавлен 11.05.2017Основные принципы создания сайта: написание HTML-кода страниц в блокноте, сохранение текстовой информации с расширением .htm. Размещение сайта на ресурсах хостинг-провайдеров с помощью Total Commander. Поиск информации в сети Интернет. Работа с Google.
отчет по практике [6,8 M], добавлен 08.09.2013Создание локальной версии Web-сайта компании, оказывающей услуги в сфере "Дизайн помещений". Логическая структура сайта – набор тематических рубрик с распределенными по разделам документами. HTML–коды Web-страниц. Теоретические аспекты создания сайта.
курсовая работа [94,0 K], добавлен 10.05.2011
