Добрый день.

События в Москве связанные с электричеством невольно отозвались на многих хостерах. Некоторые сайты не работали или работали неустойчиво. Увы, не избежал этой участи и htmlbook.ru. Но все уже восстановлено и работает как прежде. Так что это было всего лишь временное явление.

На сайте для скачивания появилась электронная книга «Справочник по тегам HTML». Если кто еще не скопировал к себе, делать это нужно в обязательном порядке.

Скачать справочник по тегам HTML

Также добавлена небольшая книжка «Создание коллажа в Adobe Photoshop». Подобные материалы уже публиковались в рассылке, но в книге они даны более подробно, вдобавок, приводится создание двух различных коллажей и техник их создания. Если вы увлекаетесь графикой, иметь книгу обязательно, в остальных случаях решайте сами. Формат PDF, 33 страницы, объем файла 1,24 Мб

Скачать Создание коллажа в Adobe Photoshop

Для всех, кто занимается программированием, в частности, на PHP, рекомендую технологию шаблонов Smarty (smarty.php.net).

Вот что пишут профессиональные разработчики.

В чем плюсы (огромные) у смарти.

1. Технология поддерживает компиляцию шаблонов, что снижает нагрузку на сервер.
2. Синтаксис языка прост, в нем нет сложных конструкций, легко выучить.
3. Можно расширять функциональность смарти путем дописывания собственных функций, модификаторов и блоковых операторов.
4. При работе над большими проектами работу кодера и программиста можно успешно распараллеливать, достигая ускорения работы в 1.5-2 раза (реально подтверждено).
5. Очень динамичное развитие технологии от создателей PHP.

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

Если у вас возникли вопросы по Smarty, в форуме htmlbook.ru есть кому на них ответить.

Адрес статьи — htmlbook.ru/content/258.html

Группирование элементов веб-страницы

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

Пустое пространство

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

Рассмотрим два варианта написания текста. В первом случае блок текста идет сплошным потоком без отбивки, а во втором — применяется отбивка абзацев.

Текст в данном примере распадается на три группы. Первая группа содержит два параграфа, пронумерованных как 1 и 2, а вторая группа — параграфы 3 и 4. Такое разделение получается за счет вертикального расстояния между группами. Вместе с тем, параграфы 3 и 4 тоже образуют подгруппы за счет применения отбивки. Поскольку расстояние между ними меньше, чем между параграфами 2 и 3, то они образуют устойчивую группу, которая будет тем сильнее выражена, чем больше расстояние между группами.

Как вариант, допустимо использовать отступы по горизонтали, чтобы показать принадлежность текста к разным группам.

Отступы по горизонтали лучше делать именно по левому краю текста, т.к. люди читают тексты слева направо (речь не идет об арабской или другой письменности, где чтение происходит справа налево).

Линии и границы

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

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

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

Фон

Аналогично использованию рамки, фон под текстом создает область, которая указывает на принадлежность к определенной группе. Если для фона применяется один и тот же цвет, то группы следует разделить между собой пустым пространством, чтобы они не сливались. Также можно использовать разные цвета, как показано в примере ниже.

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

Резюме

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

Интересные темы форума

Требуется верстальщик
Предлагают разовую работу HTML-верстальщику.

Отдам форум
Предлагают отдать форум www.rusforum.com.ru в хорошие руки. Если есть желающие, пишите его автору.

Загрузка картинок
Как обеспечить загрузку картинок в первую очередь.

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