Средства для создания интернет-страниц

Размещено на http://www.allbest.ru/

10

Размещено на http://www.allbest.ru/

Введение

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

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

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

Средства для создания интернет-страницы

Интернет-страница (сайт) - это «кирпичик», из которого строится здание Интернета. Но создать даже самую простую из них совсем непросто, так как процесс создания web-страницы (web-сайта) требует набора определенных знаний и представлений. Слово «сайт» (от англ. «site») переводится как «местообитание».

Разработчик персонального сайта сам решает, что он разместит на нем. Возможны следующие варианты:

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

· Любительский сайт. Рассказ о себе, возможно, о каком-то своём хобби. Близок по наполнению к «домашней странице», но содержит более развёрнутую информацию.

· Персональный сайт - это красивая презентация профессиональных достижений творческих людей.

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

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

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

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

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

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

Для создания сайта используются визуальные редакторы. Они делятся на два вида: онлайновые редакторы и офлайновые редакторы.

Онлайновые редакторы являются частью системы для создания и наполнения сайтов. Они используются на сервисах, предоставляющих хостинг - это услуга по размещению чужого веб-сайта на своем веб-сервере или чужого веб-сервера на своей «площадке», т.е. сдача в аренду пользователю части своего серверного пространства; поддержание работоспособности пользовательского сайта на своих веб-серверах), для создания web-страниц. Могут быть также отдельным сервисом. Наиболее известные онлайновые визуальные редакторы - это Narod.ru и Boom.ru.

Самый известный офлайновый редактор - это Microsoft FrontPage. Программа обладает широким спектром возможностей, в частности, может автоматически отправлять изменения, внесенные разработчиком сайта в исходные тексты в режиме реального времени.

Microsoft FrontPage уступает по качеству создания сайтов известному редактору Micromedia Dreamweaver Dreamweaver обеспечивает пользователя полезными инструментальными средствами, увеличивающими опыт создания веб-страниц и сайтов.

Визуальные возможности редактирования в Dreamweaver позволяют быстро создавать страницы без написания кодов вручную. Предоставляет возможность быстрого просмотра элементов сайта и активов, вставлять их из панели непосредственно в документ. Полностью настраиваемый редактор, но зато для начинающих web-дизайнеров он гораздо проще в применении. Microsoft FrontPage благодаря использованию серверных расширений FrontPage была решена проблема создания сложных программных функций (формы, поисковые системы сайта, гостевая книга, счетчик посещений и т.п.). Эти функции устанавливаются при помощи выполнения определенных шагов мастера и следованию инструкции. С помощью Microsoft FrontPage можно создавать таблицы, кнопки и анимацию. Можно также создавать фреймы на страницах, выставлять границы, добавлять гиперссылки.

Правильно подобранное графическое оформление сайта является важнейшей компонентой его дизайна.

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

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

Графическое разрешение - это разрешение изображения, сохраненное в виде файла. Оно измеряется в ppi, и определяет из какого количества пикселей на единицу измерения состоит изображение) изображения определяется плотностью пикселей на дюйм (ppi - pixels per inch). Чем выше разрешение, тем большее количество точек содержится в изображении и тем меньше их размер. Большее число пикселей позволяет получить более качественное изображение, которое будет включать более мелкие детали и более тонкие цветовые переходы. Если мы говорим, что изображение содержит 4096 пикселя, это значит, что в изображении размером 1х1 дюйм имеется 64 пикселя в ширину и 64 пикселя в высоту. Говорят также, что разрешение изображения составляет 64 пикселя (ppi).

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

Большинство цветов видимого спектра получаются в результате смешения трех основных компонентов цвета: красного, зеленого и синего цвета. Сочетание этих цветов образуют цветовую модель RGB (Red - красный, Green - зеленый, Blue - синий). При смешении основных цветов получаются цвета вторичной цветовой гаммы: голубой, пурпурный, желтый. Чем больше интенсивность цвета, тем ближе он к чистому тону, а чем меньше - тем он ближе к черному цвету. Максимальная интенсивность цвета равна 255. Если сложить все три основных цвета с максимальной интенсивностью, получим чисто белый цвет. Если же сложить те же цвета с нулевой интенсивностью, получим чисто черный цвет. Таким образом, нужная нам цветовая гамма получается в диапазоне трех основных цветов при использовании их с разной интенсивностью.

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

При создании графики web-сайта пользуются правилом WISIWIG - What You See What You Get (Что видишь, то и получаешь). Устройством вывода графики для сайта является экран монитора. В данном случае рекомендуется использовать 8-битную графику и применять цвета модели RGB.

Для создания web-графики стандартными считаются форматы JPEG, GIF и PNG.

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

· Преобразование изображения в оптимальное цветовое пространство;

· Субдискретизация компонентов цветности усреднением групп пикселей;

· Применение дискретных косинусных преобразований для уменьшения избыточности данных изображения;

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

· Кодирование результирующих коэффициентов (данных изображения) с применением алгоритма группового кодирования и алгоритма Хаффмана для удаления избыточности информации.

JPEG является Интернет - стандартом. Предназначен для сохранения растровых или точечных изображений. Наиболее часто растровые изображения получают в результате сканирования оригиналов изображения (рисунков, фотографий, слайдов и т.п.). Достоинством растровой графики является реалистичность и легкость ввода изобразительной информации. К недостаткам относится большой объем файлов и невозможность увеличить размер изображения без потери его качества, сжатых во много раз за счет отбрасывания информации, не влияющей на отображение документа.

GIF - формат для обмена изображениями. Формат для определения растровых цветных изображений и их хранения. Способен хранить сжатые без потерь изображения в формате до 256 цветов, предназначен в основном, для хранения чертежей, графиков и т.п. Также поддерживает анимационные изображения. Фрагменты анимации представляют собой чередование статичных кадров, а также информацию о том, сколько каждый кадр будет показан на экран. Анимацию можно закольцевать. В этом случае, после последнего кадра вновь будет показан первый. Обеспечивает точный перевод цветов для всех дисплеев.

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

PNG в отличие от GIF:

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

· Позволяет хранить полноцветные изображения с 24 и даже 48 битами на пиксел;

· Реализует лучший алгоритм чересстрочности;

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

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

К некоторым недостаткам относится невозможность создавать анимацию.

При размещении графических объектов на сайте необходимо подкорректировать цвета. Для этого пользуются программой Photoshop. Для коррекции цвета пользуйтесь кнопками Image > Adjust > Hue > Saturation. Фотографии, размещаемы на сайте, не должны сильно отличаться друг от друга по контрастности и яркости. Photoshop Предоставляет возможность сделать все фотографии черно-белыми (Image > Adjust > Desaturate). Иногда прибегают к размещению на главной странице фотоальбома уменьшенных копий-значков, каждую из которых потом можно увеличить, щелкнув мышью по изображению. Аналогично можно поступать со всеми большими иллюстрациями, размещенными на сайте.

сайт интернет разработка информация

Заключение

Интернет-страница (сайт) - это «кирпичик», из которого строится здание Интернета. Но создать даже самую простую из них совсем непросто, так как процесс создания web-страницы (web-сайта) требует набора определенных знаний и представлений. Слово «сайт» (от англ. «site») переводится как «местообитание».

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

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

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

Графические и анимационные изображения очень важны как фактор создания наглядности при разработке учебного курса. Графика web-сайта имеет свои законы создания. Для создания web-графики стандартными считаются форматы JPEG, GIF и PNG.

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

Список использованной литературы

1. Левин А.Ш. Основы компьютерной графики и звука / А. Левин. - 2-е изд. - СПб.: Питер, 2006. - 639 с.

2. Лепская Н.А. основы компьютерной графики и дизайна: Учеб. пособие /Н.А. Ленская. - М.: КопирЦентр, 2004. - 11 с.

3. Луций С.А. Основы компьютерной графики: Учеб. пособие / С.А. Луций. - Великий Новгород, 2006. - 80 с.

4. Михайлюк М.В. Основы компьютерной графики: Учеб. пособие / М.В. Михайлюк. - М., 2002. - 79 с.

5. Надеждин О.А. Основы компьютерной анимации / О. Надеждин. - М, 2004. - 232 с.

6. Рейнбоу В. Компьютерная графика: Наиболее полное и подробное руководство/ В. Рейнбоу. - СПб.: Питер, 2003. - 766 с.

7. Седова Н.В. Основы компьютерной графики: Учебное пособие/ Н.В. Седова, Т.Ю. Забавникова. - Тамбов, 2007. - 572 с.

8. Трусов М.А. Visual Basic NET: создание графических объектов и основы программирования/ М.А. Трусов. - М.: NT Press, 2006. - 152 с.

Размещено на Allbest.ru