2013610-03-2012
20136
10-03-2012
В этой подборке я собрала CSS3 мануалы по созданию динамического блока Related Posts, сложенной стопки листов бумаги, треугольников, кнопки с иконками, угловой ленты и эффекта боке. Также интересно будет узнать как стильно оформить галерею картинок, сделать эффект смены страницы, анимированное меню и контент-слайдер. Очень интересен динамический эффект разноцветного текста, поляроидного слайдера и анимированного чека с ценой, реагирующего на нажатие мышкой. Напоследок припасен вертикальный аккордеон и динамическое оформление цитаты.
Что нас ждет в этой подборке. Пожалуй, начну с себя, вернее с того интервью, которое я дала около месяца назад. Потом порадуемся креативным манипуляциям с фотографиями. Далее интересные материалы про вордпресс и макеты сайта. Затем интереснейшая беседа о художниках, а также примеры модных тенденций в дизайне. Не забудем про шпаргалки CSS и психологию шрифтов. Подборки про умную рекламу всегда присутствуют в качестве почетных гостей. Как всегда много фотографий с животными и креативных работ мастеров циифрового арта. И это только начало, дальше еще больше.
Наконец-то после длительного перерыва я снова занялась вордпресс шаблонами. В дальнейшем дела должны пойти повеселее, поскольку теперь я сотрудничаю со специалистом, который верстает шаблоны. Разделение труда, так сказать. Представляю вашему вниманию шаблон под названием Selenium, ориентированный исключительно на женскую аудиторию. Картинка в шапке шаблона говорит об этом однозначно. Тема двухколоночная со встроенным слайдером и блоком социальных иконок после каждого поста. На кастомную админ панель вынесены все главные управляющие элементы. К шаблону прилагается пошаговая инструкция по установке и настройке со скриншотами, которая поможет вам настроить тему.
Давайте посмотрим, какие новые приемы и способы изобрели волшебники CSS3 за последнее время и как это все выглядит на практике. Сначала вдохновимся интересным эффектом с текстом, слайдшоу со всплывающими предпросмотрами и фильтрами для картинок из галереи. Потом нас порадуют замечательный эффект для превьюшек картинок, полноразмерное слайдшоу для бэкграунда и всплывающий лайтбокс для галереи картинок. Далее следуют блюр-эффект, меню с эффектом прокрутки, объемные кнопки, эффектный таймер и виджет с текущими записями.
Я обратила внимание, что в первом месяце 2012 года была значительно меньше русскоязычных твитов, что несомненно связано с нашей любимой национальной забавой — продолжительными новогодними праздниками. Зато западные блоги выдавали интересные твиты в штатном режиме. А потому смотрим очередную подборку самых интересных дизайнерских, околодизайнерских и блоггерских твитов. Как всегда большое количество подборок типа best of the best в дизайне, фотографии, иллюстрации, интервью, замечательные аналитические статьи, полезные сервисы, практические уроки.
Как правило, контактная форма занимает на сайте отдельную соответствующую страничку или же скромно располагается в футере. В любом случае, контактная форма — это удобное средство коммуникации и взаимодействия на сайте. В представленных ниже уроках подробно рассказано как можно разнообразить этот важнейший элемент на веб-сайте с помощью технологий HTML5 и CSS3. Все контакт формы отличаются друг от друга количеством и содержанием функциональных полей, различным оформлением на любой вкус, ну и, конечно, степенью исполнительской сложности.
Урааа! Новый Год наступил! С Новым годом, с новым счастьем, с новыми надеждами! Поднимаю праздничный бокал за вас, мои дорогие читатели! Именно ваше внимание и поддержка дает мне силы и вдохновение вести блог и задумываться о новых горизонтах. Пусть сбудутся все ваши мечты и желания, а новый год подарит вам новые проекты, море краетива, адекватных заказчиков, финансовую стабильность и заряд бодрости и оптимизма! Еще раз с наступившим 2012! Ну а для того, чтобы разбавить кулинарное изобилие и просто для праздничного настроения вот вам очередная подборка из интереснейших декабрьских твитов. ))
В этой подборке я собрала наиболее популярные и востребованные шаблоны, которые достаточно массово распространены в интернете. По крайней мере, я очень часто встречаю блоги, оформленные на базе этих бесплатных шаблонов. Для того, чтобы скачать первые 11 шаблонов, жмем на картинку и переходим по ссылке. На открывшейся странице ищем интересующий нас шаблон и рядом с названием видим ссылку на превью, скачивание и описание. Чтобы скачать последние 9 шаблонов, также переходим по ссылке и на открывшейся странице ищем кнопку Download. Соответственно жмем на нее и скачиваем.
Первым среди представленных CSS мануалов в этой подборке идет очень необычный анимированный эффект с текстом. Даже не верится, что запросто можно сделать такую анимированную типографику. Далее идет вполне обычная карусель из картинок с предпросмотрами. Меню-аккордеон мне очень нравится как элемент дизайна. Здесь тоже можно посмотреть, как его сделать. Следующие на очереди два вида меню с различными эффектами и эффект навигации с кругом. Больше всего мне в этой подборке нравятся анимированные кнопки с призывам подписаться. Очень неплохо смотрятся оптический zoom для картинок и текста, а также меню с динамическим маркером-магнитом.
Последняя в этом году подборка самых интересных твитов порадует нас креативными портфолио веб-мастеров и различными смешными и просто красивыми фотографиями. Достаточно много аналитический статей и интервью, что меня всегда радует. Иногда очень полезно почитать умные фразы и согласиться с умными людьми между просмотрами всяческих вкусностей в виде картинок, постеров и скриншотов. Стараниями блоггеров не упущена и тематика обучающих статей, в частности касаемых премудростей css и вордпресса. Кстати, неожиданно много твитов, касающихся выдающихся примеров типографики.
Вплывающая подсказка (tooltip) на сайте это довольно симпатичный элемент оформления. Причем внешний вид такой всплывающей подсказки можно сделать очень даже привлекательным и нетривиальным. Во-первых, можно настроить форму всплывающего контейнера, его цвет и размер. Во-вторых, можно запросто управлять содержимым всплывающей подсказки, добавляя туда различные элементы и блоки по своему усмотрению. Ниже представлены подробные мануалы как это можно сделать с помощью технологии CSS3. Каждый урок имеет наглядное демо того, что в итоге получится.