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

HTML 3.0

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

HTML 3.2

Был опубликован и начал широко использоваться с мая 1996 г., получил официальное утвержден в 1997 г. Получил популярность из-за совместимости с HTML 2.0. 

HTML 4.0

В нем реализованы многие распространенные концепции Web -дизайна и приняты некоторые средства HTML 3.2. Самым значительным отличием HTML 4.0 от предыдущих версий является кодировка Unicode , тег “ Object”, позволяющий работать с мультимедиа ( в т.ч. с видеоклипами и звуком) и др. 

DHTML

DHTML (Dynamic Hyper Text Markup Language, динамический язык разметки гипертекста) является расширением стандарта HTML и позволяет создавать web-страницы, включающие такие интерактивные элементы, как движущийся фон, расположенный под статичным содержимым документа, движущиеся объекты, выпадающие меню, кнопки, подсвечивающиеся при наведении курсора мыши, анимацию, бегущие титры и многое другое. По большому счету DHTML представляет собой "среднее арифметическое" между технологиями HTML и JavaScript. Этот стандарт использует простые сценарии, подготовленные с помощью интерпретируемого макроязыка, обрабатываемого браузером совместно с кодом HTML. Такие сценарии именуются "скриплетами".

Для создания скриплетов используются стандартные расширения DHTML и любой макроязык, поддерживающий директивы интерфейса ActiveX. DHTML распознается браузерами Microsoft Internet Explorer, начиная с версии 4.0 и выше.

 

4. HTML5 

 

HTML5 (англ. HyperText Markup Language, version 5) — язык для структурирования и представления содержимого для всемирной паутины, а также основная технология, используемая в Интернете. Это пятая версия HTML-стандарта (изначально созданного в 1990 году и последней версией которого являлся HTML4, стандартизированный в 1997 году) и находится в стадии разработки по состоянию на август 2013 года. Основной её целью является улучшить язык, поддерживающий работу с новейшими мультимедийными приложениями, при этом сохраняется лёгкость чтения кода для человека и ясность исполнения для компьютеров и приспособлений (веб-браузеры, синтаксические анализаторы и т. д.).

В HTML5 появляется множество синтаксических особенностей. Например, элементы <video>, <audio> и <canvas>, а также возможность использования SVG. Эти новшества разработаны для упрощения внедрения и управления графическими и мультимедийными объектами в сети без необходимости обращения к собственным плагинам. Другие новые элементы, такие как <section>, <article>, <header> и <nav> разработаны для того, чтобы обогащать семантическое содержимое документа (страницы). 

Преимущества HTML 5.

Использование языка программирования нового поколения позволяет создавать веб-документы с более простой структурой и чистым кодом. В отличие от предыдущей версии, пятое поколение языка программирования использует вместо контейнеров div семантические элементы nav, article, header, footer, aside и section. Ко всему прочему, HTML5 существенно облегчает работу с файлами мультимедиа: так, пользователи могут слушать музыку и смотреть видео прямо в браузере без использования Adobe Flash и прочих приложений. Дополнительные программы не потребуются и при размещении фотографий и прочей графики. Метаморфозы затронули также процесс ввода данных, который в пятом поколении языка программирования стал намного проще и безопаснее. Если в предыдущей версии система сообщала об ошибке ввода данных постфактум, то теперь пользователь будет оповещён незамедлительно, что снимет массу проблем, связанных с отправкой неверно составленных документов. Что касается внешнего вида, то новый язык программирования существенно расширяет возможности оформления сайтов и приложений, за счёт чего html 5 игры и сайты станут ещё более оригинальными и интересными. Благодаря новой функции Canvas, которая реализована в пятой версии веб-языка, можно будет размещать на сайтах небольшие html 5 игры, анимацию и динамическую графику без использования дополнительных программ. К тому же данная функция позволяет создавать качественно новые html 5 игры и пользовательские интерфейсы.

Недостатки HTML 5.

Одним из тонких мест нового поколения веб-языка является защита данных. При использовании HTML 5 на винчестере пользователя долгое время хранится большой объём данных, что позволяет злоумышленникам осуществлять несанкционированный доступ к ресурсам компьютера с целью сбора конфиденциальной информации. Некоторая уязвимость HTML 5 имеет место быть и в сфере игр. Так, контент не может похвастаться высокой производительностью, платформы весьма ограничены в своём применении, а на создание контента с использованием HTML 5 требует больших затрат ресурсов и времени. Ко всему прочему, до недавнего времени поддержкой HTML 5 могли похвастаться далеко не все браузеры. Несмотря на то, что сегодня ситуация в корне изменилась, и теперь абсолютное большинство программ распознают пятое поколения языка программирования, всё же остаются единичные экземпляры, которые с ним до сих пор не знакомы. Самым совместимым с HTML 5 считается браузера Chrom, а именно его 18-я версия. Программа, создателем которой является Google, имеет модуль Canvas 2D, который существенно облегчает работу в ресурсами, разработанными с помощью HTML 5. Впрочем, недостатки новой версии языка программирования не снижают его популярности даже среди таких гигантов, как YouTube, Google и т.д., которые активно осваивают данную веб-технологию.

 

5. Использование Flash технологий при создании WEB продуктов

 

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

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

Одной из них являлась отображение изображений при помощи векторной графики.

Общеизвестно что векторная графика занимает меньше места чем раннее использовавшейся растровая графика. Большое значение было предано совместного использования векторной графики и анимации. Это намного расширило круг интересов пользователей и разработчиков. Также имелась возможность вставки звукового сопровождения в Web страничку, придавая вместе с анимацией большую привлекательность. Внутренний язык программирования Action Script позволял сопровождать какие либо действия или события, какими либо звуковыми или видео эффектами. Возможности Action Script сравнимы с возможностями JavaScript и VBScript. Изначально Flash разработки были мало известны пока корпорация Macromedia не предложила переделать один из разделов сервера Walt Disney используя Flash. Это дало большую рекламу  Flash технологии. Многие дизайнерские студии начали покупать пакеты программных продуктов для разработки Web страничек при помощи Flash технологии.

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

• Красота

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

• Удобно и универсально

Разработчику очень трудно добиться того, что можно сделать с помощью технологии Flash без использования этой технологии. Допустим дизайнеру нужно сделать анимированную заставку. Решить задачу можно и без Flash, но для это понадобиться писать код (например, JavaScript), отдельно делать графику в Photoshop, потом все это еще каким-то образом интегрировать в веб-страницу (опять же писать код, на сей раз HTML).

Технология Flash позволяет все сделать в одном приложении — Adobe Flash Professional. Конечный файл будет чем-то вроде контейнера для любого вида контента — текстового, аудио/видео, векторной и 3-D графики. При этом размещать такой «контейнер» тоже очень просто.

• Высокое качество графики

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

• Интерактивность

Flash — один из самых простых способов сделать интерактивное приложение практически любой сложности, вплоть до навороченной игры. Сейчас уже практически никого не удивишь сайтами, где все  само “летает, двигается и красочно преображается”, взаимодействие с пользователем, причем на достаточно высоком уровне – вот это достижение. Собственно в последнее время многие занялись разработкой онлайновых Flash игр для продвижения сайта, вирусного маркетинга или просто развлечения пользователей.

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

Недостатки Adobe Flash

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

• Тяжеловесность.

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

• Для просмотра Flash -контента необходимы специальные плагины.

Скажите это не проблема, потому что такие плагины уже чуть ли во всех современных браузерах присутствуют по умолчанию? К сожалению это не всегда так. Существуют целые классы устройств (особенно среди мобильных) которые не поддерживают технологию. В том числе айфоны (и другая продукция Apple) или мобильные устройства на новой платформе Windows Mobile 7. Там постоянно идет какая-то разработка, “война технологий”, вызванная «сложностями Flash». Также многие пользователи просто отключают отображение Flash -контента в браузере и если ваш сайт полностью построен на Flash, он будет для такого пользователя просто не видим.

• Безопасность.

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

• Ограниченные возможности поисковой оптимизации.

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

• Отсутствие контекстного меню.

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

 

6. Конкуренция web-технологий

 

• Сравнение HTML5 и Adobe Flash.

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

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

Основным достоинством Flash называют широкие возможности визуализации, включая работу с векторными изображениями, видеопотоками, плавную анимацию движения и тд и тп. И это же ставят в ряд недостатков сегодняшнего HTML5.

Действительно, HTML5 сейчас не обладает и десятой долей тех возможностей, которыми владеет Adobe Flash. Но HTML5 – это не новый язык программирования, это привычный слуху каждого пользователя HTML, в котором появились скриптовые возможности обработки изображений. Стандарт работы с кодом, который ранее нуждался в визуальной надстройке в виде технологии Flash, получил собственный инструментарий и теперь не нуждается в «субподряде». Сторонние разработчики уже активно включились к адаптации кода под свои нужды – так, Mozilla создает Canvas 3D с поддержкой ускорителя. Всё говорит за то, что HTML5 в ближайшие годы ожидает бурное развитие, и все те недостатки, которые есть сейчас, в обозримом будущем будут устранены.