Современные технологии Web-дизайна

Современные технологии Web-дизайна.

Оглавление

Введение1

1. Web-дизайн 2
2. Выбор структуры Web-страницы4
3. Язык HTML6
4. HTML5 9
5. Использование Flash технологий при создании WEB продуктов11
6. Конкуренция web-технологий14

ЗАКЛЮЧЕНИЕ 16

 

 

 

 

 

Введение. 

 

World Wide Web (WWW)- это большая компьютерная сеть, которая содержит огромное количество сайтов, на которых размещена всевозможная информация. Доступ к этой информации люди получают за счет технологии Internet. В наше время Интернет стал неотъемлемой частью жизни всего человечества. Доступ к нему имеют миллионы людей по всей планете. Каждый день создается большое количество Web-сайтов, которые с огромной скоростью расширяют просторы «мировой паутины». Для путешествия в среде WWW используются специальные программы - Web-браузеры. Вся информация в Web-браузере отображается в виде Web-страниц, которые являются основным элементом сайтов WWW.

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

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

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

Мной были поставлены следующие задачи:

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

 

1. Web-дизайн

 

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

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

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

В настоящее время под термином веб-дизайн понимают именно проектирование структуры веб-ресурса, обеспечение удобства пользования ресурсом для пользователей. Немаловажной частью проектирования ресурса в последнее время стало приведение ресурса в соответствие стандартам W3C, что обеспечивает доступность содержания для людей с ограниченными физическими возможностями и пользователей портативных устройств (см. юзабилити — «удобство использования»), а также кроссплатформенность (в данном случае — т. н. кросс-браузерность) вёрстки ресурса. Также непосредственно с дизайном сайтов смежны маркетинг в Интернете (интернет-маркетинг), то есть, продвижение и реклама созданного ресурса, поисковая оптимизация.

 

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

 

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

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

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

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

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

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

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

Недостатки:

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

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

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

• Разработка страниц фиксированного размера.

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

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

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

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

Недостатки:

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

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

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

• Разработка комбинированных Web-страниц

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

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

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

Таким образом, пользователь сам должен сделать выбор при создании того или иного типа веб-страниц.

 

3. Язык HTML

 

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

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

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

Работа по HTML - это способ усвоить особенности создания документов в стандартизированном языке, используя расширения, только если это действительно необходимо.

HTML был ратифицирован World Wide Web Consortium. Он поддерживается несколькими широко распространенными браузерами, и, возможно, станет основанием почти всего программного обеспечения, которое имеет отношение к Web.

Язык HTML был разработан британским учёным Тимом Бернерсом-Ли приблизительно в 1986—1991 годах в стенах Европейского Центра ядерных исследований в Женеве (Швейцария). HTML создавался как язык для обмена научной и технической документацией, пригодный для использования людьми, не являющимися специалистами в области вёрстки. HTML успешно справлялся с проблемой сложности SGML путём определения небольшого набора структурных и семантическихэлементов — дескрипторов. Дескрипторы также часто называют «тегами». С помощью HTML можно легко создать относительно простой, но красиво оформленный документ. Помимо упрощения структуры документа, в HTML внесена поддержка гипертекста. Мультимедийные возможности были добавлены позже.

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

Первая версия HTML была разработана в начале 90х годов Тимом БенерсЛи для популярного в прошлом броузера Mosaic. Но в те времена ни для браузера, ни для самого языка еще не нашлось достойного применения. В 1993 году появился HTML+, и эта версия также осталась практически незамеченной.

HTML 2.0 

Стандарт был утвержден в ноябре 1944 г. организацией IETF (Internet Engineering Task Force ). В нем были расширены возможности предыдущей версии языка и он получил широкое распространение как у профессионалов, так и любителей.