Отправляет email-рассылки с помощью сервиса Sendsay

Рецепты HTML

  Все выпуски  

Рецепты HTML


Информационный Канал Subscribe.Ru

www.htmlbook.ru
   Новости сайта www.htmlbook.ru

Компания Horse21 поздравляет всех со cтарым Новым годом!

В наступившем году партнерская программа системы бронирования отелей Horse21 приготовила будущим партнерам подарок: только до 31 января действует специальное предложение +1EUR. Теперь все новые партнеры, первый переход с сайта которых будет зафиксирован до 31 января 2003 года, будут получать на 1 EUR больше за любое реализованное бронирование в будущем! Таким образом, сумма стандартного комиссионного вознаграждения увеличина с 4 до 5 EUR.

Спешите зарегистрироваться до 31 января и установить партнерскую программу Horse21.

Добрый день.

1. На сайте пополнился раздел Справочная информация, добавилось краткое описание параметров CSS. Чтобы было представление о чем идет речь, ниже я привел кусочек таблицы.

Краткий справочник по CSS

Краткий справочник содержит описание стилей CSS1. IE - Microsoft Internet Explorer, NC - Netscape Communicator. Число означает, с какой версии браузер поддерживает данный параметр.

Стиль IE NC Описание
background 4 - Сокращенный атрибут, который позволяет устанавливать пять отдельных параметров для установки стиля фона.
background-attachment 4 - Устанавливает, будет ли фоновый рисунок прокручиваться вместе с содержимым веб-страницы.
background-color 4 4 Цвет фона элемента.
background-image 4 4 Задает фоновый рисунок элемента.
background-position 4 - Позиция левого верхнего угла фонового рисунка.
background-repeat 4 - Повторяемость фонового рисунка по горизонтальной и вертикальной оси.
border 4 - Устанавливает толщину, цвет и стиль рамки вокруг элемента.


2. Новая статья в раздел по Дизайну написанная Сергеем Степановым (www.finest.ru) - размышления о психологии в дизайне. Ниже приводится отрывок.

Психология в дизайне

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

Стоп! А разве графика, цвет, текст, заголовки и вся композиция не составляет информационное содержание страницы? Основной процент получаемой человеком информации приходится на зрение. По статистике 83% информации воспринимается зрительно. И 40% из неё запоминается человеком (против 20% от услышанного!). А изображение может нести в себе ничуть не меньше (а иногда и больше) информации, чем текст. Но как связать воедино изображение и текст? Как заставить дизайн нести тему страницы? Вот это уже вопрос психологии.

Оставим в покое Юнга и Фрейда с их фундаментальными теориями и обратимся к прикладной психологии. Любое изображение вызывает у человека ассоциации. Но проблема в том, что одни предметы, сюжеты или графические элементы вызывают у всех людей (вернее, у многих) одинаковые ассоциации, а другие - совершенно различные. И если вы ошибочно построите ассоциативный ряд, то можете завести пользователя совсем не туда, куда вам хотелось. Поэтому, для построения устойчивых ассоциаций, настроения или образа, часто нужно дополнять композицию элементами, укрепляя тематическую линию. Такими элементами может быть что угодно: изображение, слово (первичный источник информации) или целая фраза, линия, фон, коллаж. Главное, стремиться не к слепому усложнению, а к созданию устойчивого ассоциативного ряда по конкретной теме.

Вы, наверное, уже заметили, что на сложных, детализированных, иногда не понятных с первого взгляда изображениях, хочется задержать взгляд. Зрителю интересно "разгадать загадку" и разгадка смысла приносит удовлетворение и положительные эмоции. Такие "шарады" надолго остаются в памяти. Но не многие из них действительно несут тему или настроение. Большинство похоже на простую мозаику, сборище несвязанной между собой графической информации. Творчество дизайнера в индивидуальных работах может быть любым - это его личное дело. Здесь работает понятие "дизайн ради дизайна", часто превращаясь в стремление эпатировать зрителя. Но в оформлении конкретного заказа, рассчитанного на большую и различную аудиторию, важно не перестараться. Пользователь, просматривая оформление, всегда стремится сделать вывод, ищет законченность в понимании представленной информации. И сделав его, испытывает эстетическое удовлетворение. Задача дизайнера помочь ему в этом. Построить твёрдый, конкретный ассоциативный ряд, раскрывая тему. Простой пример - когда используется перевёрнутый текст. Это простая преграда для его восприятия и пользователь способен прочитать этот текст, но решение этой загадки приносит подсознательное удовольствие и заостряет внимание на этом слове или фразе. Другое дело - уместно ли такое действие в конкретной ситуации.

Теперь о способах и инструментах. Первое, на чём хочется остановить внимание - это способы проведения пользователя по композиции, построение ассоциативного ряда в нужном направлении. Восприятие текстовой информации (в большинстве языков) происходит слева направо и сверху вниз. Это правило хорошо помогает в карикатурах (достаточно простой пример), когда есть сюжетный текст (например, вопрос - ответ). Чтобы зритель правильно понял сюжет, нужно заставить его прочесть сначала вопрос, а потом ответ. Текст вопроса выносится наверх изображения, поближе к левому углу, а текст ответа внизу изображения или справа от вопроса. Это первый принцип, но есть и другие способы заострить внимание на конкретных деталях. Есть ещё пространственное понятие восприятия информации. То, что находится ближе (на переднем плане) воспринимается раньше, чем на заднем. Эффект заднего плана можно получить достаточно сильной размывкой. Объект, с нормальной резкостью, будет выглядеть расположенным на переднем плане, и восприниматься первым. Крупные и достаточно яркие (контрастирующие) элементы так же воспринимаются раньше мелких, детализированных. Любой "выделенный" объект в композиции становится тематическим или смысловым центром. Специалисты советуют использовать не более 3 тематических центров при 5-7 управляющих элементах (в рекламных материалах ещё меньше). Я оставлю это без комментариев, но в некоторых ситуациях позволю себе не согласиться.


3. В продолжении темы о создании рамок средствами CSS, пополнился раздел посвященный ошибкам браузеров.

Ошибки браузеров при использовании CSS


Обозначения
NC4 Netscape Communicator 4.x
IE4 Microsoft Internet Explorer 4.x
MacIE4.5 Microsoft Internet Explorer 4.5 для Macintosh
MacNav4 Netscape 4 для Macintosh

Основные понятия
Импорт таблицы стилей
@import

IE4/5 импортирует файл даже, когда инструкция @import размещается в конце таблицы стилей документа. Это является техническим нарушением CSS1 спецификации.

Наследование NC4 плохо работает с наследованием вообще, в особенности это касается при работе с таблицами и списками.
Селекторы Class IE4/5 позволяет именам классов начинаться с цифр, однако это не разрешено CSS1.
Селекторы ID IE4/5 позволяет именам ID начинаться с цифр, что не разрешено CSS1. Если одинаковое значение параметра ID имеют несколько элементов, все браузеры применяют стиль не к одному элементу, а ко всем. Из-за этого возникают трудности с обнаружением ошибок.
Контекстные селекторы

MacNav4 имеет проблемы с контекстными селекторами содержащие таблицы. Пример HTML BODY TABLE P должным образом не работает.


Рамки и границы
margin-top
margin-bottom
Для встроенных элементов отступы имеют проблемы, либо полностью не поддерживаются; см. margin для подробностей.
margin-right
margin-left
Opera 4 иногда применяет отступ от правого (левого) края браузера ко всем полям встроенного элемента. Это явление происходит случайно, но достаточно часто, чтобы быть замеченным.
margin

Все отступы имеют проблемы или не поддерживаются полностью для встроенных элементов. В случае параметра margin, то он хорошо поддерживается для блочных элементов в IE4/5, но в то же время для встроенных элементов игнорируется полностью. MacIE5 правильно работает с отступами со всеми элементами. NC4 работает корректно, пока параметр margin не применяется к плавающим или встроенным элементам. Opera 4 имеет проблемы с правыми и левыми отступами для встроенных элементов.

padding-top
padding-right
padding-bottom
padding-left

Для встроенных элементов отступы содержат проблемы либо полностью не поддерживаются; см. padding для подробностей.
padding

Все отступы имеют проблемы или не поддерживаются полностью для встроенных элементов. Opera 3.6 игнорирует отрицательные значения параметра padding, но изменит высоту строки встроенного элемента, основываясь на некорректных значениях отступа. IE4/5 правильно работает для блочных элементов, но встроенные элементы игнорирует полностью. NC4 работает корректно, пока параметр padding не применяется к плавающим или встроенным элементам.

border-top-width
border-left-width
border-bottom-width
border-right-width
border-width

Если стиль границы не установлен с помощью параметра border-style, NC4 все равно создает видимые границы. При установке стиля границы, они отрисовываются не на всех сторонах. IE4/5 правильно работает для блочных элементов, но встроенные элементы игнорирует полностью.

border-color NC4 и Opera 3.6 не могут устанавливать разные цвета границ для индивидуальных сторон элемента, как например border-color: red green blue orange. IE не может применять цвета границ к встроенным элементам.
border-style

Если параметр border-style принимает значение none, NC4 не обнуляет ширину рамки, которая установлена параметром border-width.

border-top
border-right
border-bottom
border-left
Opera 3 не применяет стили границы к элементам таблицы. IE4/5 не применяют границы к встроенным элементам.
border Opera 3 не применяет стили границы к элементам таблицы. IE4/5 не применяют границы к встроенным элементам. Opera 5 имеет странную случайную ошибку, которая выражается в том, что для первого встроенного элемента граница отрисовывается слишком высоко, в то время, как содержимое остается где должно.
width NC4 устанавливает ширину границы очень противоречивым образом, но корректно работает для текстовых элементов и изображений. IE4/5 применяет этот параметр для изображений и таблиц, но игнорирует его для текстовых элементов, например, таких как параграф и заголовки. Opera 3.6 удивительным образом делает изображения шириной 100%, но если окно браузера свернуть и развернуть, то все станет в норме.

  Разделы сайта
 
Создание сайта
  HTML
  CSS
  Графика
  Дизайн
  Инструментарий
  Справочная информация
  Форум

  Подписка на новости
  Введите ваш e-mail:


  Помощь
  Не знаете с чего начать или что можно найти на сайте www.htmlbook.ru - воспользуйтесь Помощником по сайту
Copyright 2002 Влад Мержевич, e-mail: vlad@htmlbook.ru
Материалы сайта охраняются законом об авторском праве.
Вы можете свободно использовать и распространять любые статьи с указанием автора и ссылки на сайт www.htmlbook.ru.


http://subscribe.ru/
E-mail: ask@subscribe.ru
Отписаться
Убрать рекламу

В избранное