И снова колонки одинаковой высоты

Необычное, даже, наверное, странное решение извечной проблемы нескольких div'ов  одинаковой высоты без таблиц. Не особо кроссбраузерное (к сожалению, только IE8+), тем не менее, во многих случаях очень полезное.

Колонки на самом деле получаются разной высоты, но при помощи отрицательного margin-bottom и блока-обертки с overflow: hidden; это искусно скрывается и создается впечатление, что они одинаковой высоты.

scrollTwo — jQuery-плагин для плавной прокрутки

На основе решения для плавной прокрутки соорудился маленький jquery-плагинчик, код которого вот:

// Непосредственно сам плагин
(function($){
      $.fn.scrollTwo = function(speed) {
        return $(this).on("click",function(){
         var top_offset = $($(this).attr("href")).offset().top;
         $('html,body').animate({scrollTop: top_offset}, speed || 500);  
         return false;       
        });
      };
})(jQuery);

// Применение
$(".scrolltwo").scrollTwo(200);

Может принимать параметр speed — это скорость прокрутки в миллисекундах. Значение параметра по умолчанию: 500 мс. Умеет прокручивать только по нажатию на якорь, то есть отрабатывает только, если внутристраничная ссылка указывает на id какого-либо элемента на странице.

А вот  плагинчик в работе:

Решение для плавной прокрутки при нажатии на ссылке

Небольшой jquery-снипет, реализующий плавную прокрутку при нажатии на якорь  <a href="#id">якорь</a> к элементу указанному в атрибуте якоря. В общем уплавнение стандартного внутристраничного якоря.

Интересные CSS решения

Собралось тут немного интересных решений различных ситуаций на css и не только.

Размещение нескольких блоков по ширине контейнера. Может пригодиться, например, для горизонтального меню или еще чего-то подобного

Стандартное прибивание футера к низу страницы.

Простенький jquery-плагинчик для табов с примером разметки и стилей:

Плавающие блоки разной высоты, например, для списка товаров в интернет-магазине:

Вертикальное выравнивание блока или блок по центру страницы (ie6+):

Очень классное решение стилизации флажков (checkbox) и радиокнопок (radio) без javascript.

Но к сожалению основан на использовании псевдоклассов из css3-спецификации, поэтому не работает в старых браузерах.

И замечательный пример использования псевдокласса :checked для изменения содержимого тега label на лету без javascript

Angrybirds в браузере (без android)

Только что обнаружил, что в приложениях для Google Chrome появилась нашумевшая и популярная игра AngryBirds

Ссылка на Angrybirds в Chrome https://chrome.google.com/webstore/detail/aknpkdffaafgjchaibgeefbgmgeghloj?hl=ru#

Прямая ссылка на AngryBirds http://chrome.angrybirds.com/

Играем в AngryBirds прямо в браузере на компьютере, товарищи.

#3 Одновременно вы можете запомнить только 3-4 вещи (из серии "100 вещей, которые следует знать о людях")

“What makes them click” на русском или “Что заставляет их кликать”

Перевод цикла статей Сюзан Вайншенк (Susan Weinschenk)
100 вещей, которые следует знать о людях (100 Things You Should Know about People)

#3 Одновременно вы можете запомнить только 3-4 вещи (оригинал статьи на английском)

Статья переведена ранее Виктором Малым в блоге usemenot.com.ua. Для полноты серии переводов привожу здесь ссылку на его перевод.

#2 Вы быстрее читаете длинные строки, но больше любите короткие (из серии "100 вещей, которые следует знать о людях")

“What makes them click” на русском или “Что заставляет их кликать”

Перевод цикла статей Сюзан Вайншенк (Susan Weinschenk)
100 вещей, которые следует знать о людях (100 Things You Should Know about People)

#2 Вы быстрее читаете длинные строки, но больше любите 

короткие (оригинал статьи на английском)

"Вам когда нибудь приходилось решать, какой ширины сделать колонку текста на экране? Следует ли сделать широкую колонку в 100 символов, или может быть лучше узкую в 50?

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

Исследования показывают, что оптимальной длиной строки для быстрого чтения с экрана является длина в 100 символов, но такая длина строки не устраивает большинство людей. Пользователи быстрее читают длинные строки (100 символов), но предпочитают - короткие или средние (45 - 72 символа). В качестве примера выше приведена страница из New York Times Reader, длина строки в колонке которого 39 символов.
Исследования так же показывают, что люди могут читать одну широкую колонку текста быстрее чем несколько узких, но предпочитают они именно несколько узких колонок.


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


Так вот в чем, собственно вопрос: предоставлять пользователям то, что их больше устраивает или идти против их предпочтений и интуиции, зная, что они смогут прочитать быстрее более длинные строки текста в одной широкой колонке?


Что бы сделали вы?


(оригинал статьи на английском)