Презентация WEB-страница и ее дизайн онлайн

Содержание слайда: WEB-страница и ее дизайн

Содержание слайда: Для того, что бы говорить о web- дизайне, надо сначала узнать что есть web- страница.

Содержание слайда: Что есть “Web- дизайн” Об этом много говорилось, но однозначного ответа на вопрос «Что есть web-дизайн» я так и не нашел. Ну что ж, придется доходить до этого самому (в этом есть своя прелесть, не так ли?)Думаю, все согласятся, что прежде всего web-дизайн это создание привлекательного внешнего вида сайта. Когда все элементы дизайна составляют устойчивую композицию и находятся на своем логичном месте. Цветовая гамма не раздражает глаз, а плавно втекает в общий дух сайта. Нужное подчеркивается, второстепенное отодвигается на второй план. Все самое необходимое на странице всегда доступно и легко идентифицируемо.

Содержание слайда: Но и это еще не все. Большинство сайтов сейчас стали интерактивными. Они реагируют на действия пользователя, расширяют функциональные возможности сайта, предлагая посетителям интересные сервисы. Встает проблема, как не испугать кажущейся сложностью предлагаемых функций, не запутать, а наоборот помочь посетителю выполнить необходимые действия. Превратить сложную машину с помощью легкого и логичного интерфейса в удобный инструмент. Здесь появляется еще одна составляющая дизайна — дизайн функциональной части сайта. Но и это еще не все. Большинство сайтов сейчас стали интерактивными. Они реагируют на действия пользователя, расширяют функциональные возможности сайта, предлагая посетителям интересные сервисы. Встает проблема, как не испугать кажущейся сложностью предлагаемых функций, не запутать, а наоборот помочь посетителю выполнить необходимые действия. Превратить сложную машину с помощью легкого и логичного интерфейса в удобный инструмент. Здесь появляется еще одна составляющая дизайна — дизайн функциональной части сайта. Итак, для себя как web-дизайнера я вывел следующую формулу создания дизайна сайта: дизайн структуры + дизайн оформления + дизайн функциональности.

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

Содержание слайда: Это не исключает возможности использования других методов, например, метод расширенных возможностей, который предоставляется Netscape Navigator, Internet Explorer или некоторыми другими программами. Это не исключает возможности использования других методов, например, метод расширенных возможностей, который предоставляется Netscape Navigator, Internet Explorer или некоторыми другими программами. Работа по HTML - это способ усвоить особенности создания документов в стандартизированном языке, используя расширения, только если это действительно необходимо. HTML был ратифицирован World Wide Web Consortium. Он поддерживается несколькими широко распространенными браузерами, и, возможно, станет основанием почти всего программного обеспечения, которое имеет отношение к Web.

Содержание слайда: HTML-редакторы Каждый выбирает свой инструмент для создания Web-страниц. Это может быть MS FrontPage или Macromedia DreamWeaver, Allaire HomeSite или 1st Page 2000. А кто-то пользуется простым текстовым редактором, например Блокнотом (Notepad). Текстовые редакторы возможно использовать только для создания небольших страниц, так как у них есть много минусов: не поддерживаются проекты, отсутствует "подсветка" текста..., в общем, работать крайне неудобно.

Содержание слайда: DreamWeaver 3.0 DreamWeaver на несколько шагов опережает другие редакторы, использующие технологию WYSIWYG, в первую очередь тем, что генерирует очень чистый HTML-код. DreamWeaver позволяет вам избавиться от однотипной работы при создании страниц (например, верстка текста) при помощи использования опции "запись последовательности команд" вы записываете последовательность производимых вами команд, потом нажимаете, например, CTRL+P, и DreamWeaver воспроизводит все в той же последовательности. Следующий редактор - HomeSite 4 - для создания страниц вручную, т. е. для знатоков HTML. Вы получаете полный контроль над HTML-кодом, причем существует возможность оптимизировать свою страничку под один из  трех популярных браузеров (MSIE, NN, Opera).

Содержание слайда: HomeSite 4.0 Еще одна отличительная особенность HomeSite - это его «склейка» с Dreamweaver. HomeSite обладает кнопкой «Dreamweaver», а также входит в его стандартный пакет поставки. Впрочем, и DreamWeaver имеет возможность подключения HomeSite, как редактора для корректировки HTML-кода. Одним из  последних HTML-редакторов является EVR Soft 1st Page 2000 v2. Его лозунг - "Create 1st class websites!" ("Создавайте первоклассные веб-сайты!"). Редактор содержит несколько режимов - Normal, Easy, Advanced/Expert и Hardcore, то есть вы можете выбрать свой уровень, а со временем перейти на более высокий. Еще одна особенность - довольно большая коллекция скриптов на JavaScript и DHTML. Все это довольно удобно разбито по категориям.

Содержание слайда: Как правильно писать в формате HTML. Поскольку HTML-документы записываются в ASCII-формате, то для ее создания может использован любой текстовый редактор. Обычно HTML-документ - это файл с расширением .html или .htm, в котором текст размечен HTML-тегами (англ. tag -  специальные встроенные указания). Средствами HTML задаются синтаксис и размещение тегов, в соответствии с которыми браузер отображает содержимое Веб-документа. Текст самих тегов Веб-браузером не отображается.

Содержание слайда: Объявление HTML <HTML> и </HTML>. Пара этих тегов сообщает программе просмотра (браузеру) что между ними заключен документ в формате HTML, причем первым тегом в документе должен быть тег <HTML> (в самом начале документа), а последним - </HTML> (в самом конце документа). <HTML> . . . </HTML>

Содержание слайда: Заголовочная часть. <HEAD> и </HEAD>. Между этими тегами располагается информация о документе (название, ключевые слова для поиска, описание и т.д.). Однако наиболее важным является название документа, которое мы видим в верхней строке окна браузера и в списках "Избранное (BookMark)". Специальные программы-спайдеры поисковых систем используют название документа для построения своих баз данных. Для того чтобы дать название своему HTML-документу текст помещается между тегами <TITLE> и </TITLE>.

Содержание слайда: Тело документа. Третьей главной частью документа является его тело. Оно следует сразу за заголовком и находится между тегами <BODY> и </BODY>. Первый из них должен стоять сразу после тега </HEAD>, а второй - перед тегом </HTML>. Тело HTML-документа - это место, куда автор помещает информацию, отформатированную средствами HTML. <HTML> <HEAD> <TITLE> Моя первая страница</TITLE> </HEAD> <BODY>