
Сегодня мы поговорим об украшении нашего блога к празднику. Я расскажу о том, как быстро и легко придать вашему ресурсу праздничный вид не испортив при этом его функциональную составляющую.
Итак, как вы думаете, что является главным при украшении интернет-ресурса к празднику? Гирлянды, свечи, ленточки, шарики и прочие мигающие и переливающиеся финтифлюшки? Нет! Главное, это создать на ресурсе праздничное настроение, при этом не помешав блогу выполнять его основную работу - доносить ваши статьи до читателей.
Чтобы не переборщить, нужно придерживаться нескольких правил. Во-первых, праздничные элементы оформления не должны перекрывать функциональные элементы сайта. То есть они не должны закрывать текст статей, кнопки, ссылки и прочие элементы предоставления информации и навигации. Во-вторых, не следует злоупотреблять светящимися и мигающими картинками. Когда подобных элементов много и они часто мигают (порой, с различной частотой), то это мало того, что отвлекает читателя от статьи, но, порой, и головную боль вызывает. В третьих, украшений не должно быть много. Ваша задача не переделать интерфейс до неузнаваемости, а донести до читателей, что вы помните о них и готовы немного потрудиться, чтобы создать для них праздничную атмосферу на своем ресурсе.

Что ж, вводную закончил, теперь можно поговорить и о конкретных украшениях. На мой взгляд, чтобы обозначить новогоднее настроение на сайте, достаточно таких ненавязчивых элементов, как снег, ёлка и шарики, ленточки или колокольчики. На своем сайте я ограничился парой еловых веточек с колокольчиками и ленточками, что, как мне кажется, достаточно полно отражает и рождественское и новогоднее настроение, и запустил легкий снежок.
Начнем с еловых веточек. У меня они располагаются в верхних углах сайта и даже при минимизации окна ничего особо не перекроют. К тому же, они статичные, то есть даже при прокрутке окна, они все равно останутся на месте и будут радовать глаз. Чтобы реализовать подобное, откройте редактор шаблона (Дизайн->Изменить HTML) и добавьте перед закрывающим тэгом </body> следующие строки:
<div style='position:fixed; top:0; left:0; z-index:100;'> <img src='http://www.ru/cristmas-l.png' title='С РОЖДЕСТВОМ И НОВЫМ ГОДОМ!' border='0' heigh='200' width='150'/> </div> <div style='position:fixed; top:0; right:0; z-index:100;'> <img src='http://www.ru/cristmas-r.png' title='С РОЖДЕСТВОМ И НОВЫМ ГОДОМ!' border='0' heigh='200' width='150'/> </div>Если вы захотите, к примеру, не веточки разместить наверху, а ёлочки поставить внизу, то параметр top просто замените на bottom. Соответственно, вы, также, можете задавать отступы от края окна, какие вам нравятся. Ну и учтите, что ссылки на картинки в вышеприведенном примере даны "от балды" - думаю, каждый из вас захочет использовать что-то свое.
Теперь перейдем к снегу... Думаю, для вас не будет секретом, что в сети полно "снежных" скриптов. Почему я остановил свой выбор именно на том, что сейчас вам предлагаю? Во-первых, он не тормозит работу сайта, не содержит лишних картинок, что увеличивает время загрузки (используется символ "*"), имеет ряд интересных фишек, типа случайно выбранного размера, яркости и скорости падения снежинок (дает некое ощущение объема), смены скорости и направления ветра в зависимости от движения мышки, застревания снежинок на нижней кромке страницы, таяния снежинок, как долетевших "до земли", так и прямо в полете. Инициируется скрипт еще проще, нежели это было с еловыми веточками - добавьте перед закрывающим тэгом </head> всего одну строчку:
<script src='http://sunctorus.ucoz.net/snow.js'/>У скрипта имеется ряд настроек, как то количество снежинок, их размер, реакция на "ветер" и пр. Если вам хочется во всем этом покопаться, то воспользуйтесь исходным скриптом с сайта разработчика. Мой личный экземпляр скрипта преднастроен и зашифрован, чтобы уменьшить размер файла скрипта, что ускоряет загрузку страниц.
Ну что ж, думаю, на этом можно было бы и закончить статью. Но осталась незавершенной еще одна миссия ;-)

ВАШИ ЗАВЕТНЫЕ МЕЧТЫ И ЖЕЛАНИЯ. И ПУСТЬ ВАС НЕ ОБОЙДЕТ ТАКОЕ
ПРЕКРАСНОЕ ЧУВСТВО, КАК ЛЮБОВЬ. С ПРАЗДНИКОМ!!!
Тимофей, ну вы что, решили забросить свой блог? Такой красивый, такой удобный, такой нужный... Возвращайтесь! Мы вас ждем!
ОтветитьУдалитьНе волнуйтесь, тута я. Сейчас займусь переделкой двух своих блогов всвязи с переработкой разработчиками механизма комментариев. По результатам, думаю, напишу статью. Есть планы на интересный скрипт, расширяющий возможности того, что доработали разработчики платформы. Насколько они осуществимы, узнаю, когда возьмусь за дело :-)
УдалитьКак понять добавьте перед закрывающим тэгом?
ОтветитьУдалитьВы, конечно, извините, но азы HTML все-таки стоит осваивать самостоятельно!
Удалить<body> - открывающий тэг
</body> - закрывающий тэг