Украшаем свой блог к Новому Году!

Happy New YearДавно я не писал новых статей. Все как-то времени не было... Но обойти такие события, как Рождество и Новый Год я просто не в силах! Оставить моих читателей без подарка я не могу :-)

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

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

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

Новогоднее настроение

Что ж, вводную закончил, теперь можно поговорить и о конкретных украшениях. На мой взгляд, чтобы обозначить новогоднее настроение на сайте, достаточно таких ненавязчивых элементов, как снег, ёлка и шарики, ленточки или колокольчики. На своем сайте я ограничился парой еловых веточек с колокольчиками и ленточками, что, как мне кажется, достаточно полно отражает и рождественское и новогоднее настроение, и запустил легкий снежок.

Начнем с еловых веточек. У меня они располагаются в верхних углах сайта и даже при минимизации окна ничего особо не перекроют. К тому же, они статичные, то есть даже при прокрутке окна, они все равно останутся на месте и будут радовать глаз. Чтобы реализовать подобное, откройте редактор шаблона (Дизайн->Изменить 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'/>
У скрипта имеется ряд настроек, как то количество снежинок, их размер, реакция на "ветер" и пр. Если вам хочется во всем этом покопаться, то воспользуйтесь исходным скриптом с сайта разработчика. Мой личный экземпляр скрипта преднастроен и зашифрован, чтобы уменьшить размер файла скрипта, что ускоряет загрузку страниц.

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

Комментариев: 4

  1. Тимофей, ну вы что, решили забросить свой блог? Такой красивый, такой удобный, такой нужный... Возвращайтесь! Мы вас ждем!

    ОтветитьУдалить
    Ответы
    1. Не волнуйтесь, тута я. Сейчас займусь переделкой двух своих блогов всвязи с переработкой разработчиками механизма комментариев. По результатам, думаю, напишу статью. Есть планы на интересный скрипт, расширяющий возможности того, что доработали разработчики платформы. Насколько они осуществимы, узнаю, когда возьмусь за дело :-)

      Удалить
  2. Как понять добавьте перед закрывающим тэгом?

    ОтветитьУдалить
    Ответы
    1. Вы, конечно, извините, но азы HTML все-таки стоит осваивать самостоятельно!

      <body> - открывающий тэг
      </body> - закрывающий тэг

      Удалить

Хотите подписать свой комментарий, но у вас нет аккаунта? Выберите в выпадающем списке Имя/URL.
Вы сможете вписать свои имя или ник. Поле для указания URL можно оставить пустым.

Тэги, допустимые в комментариях