Почти все сайты использующие тег SUP никак не инструктируют браузер как его отображать. А ведь отображение по-умолчанию откровенно хромает — тег этот рвёт тексты, высота строки где присутствует SUP увеличивается и в результате нам предстают хаотично разбросанные строки, а не параграф. Сложно даже быстро понять, является ли такое экстра-пространство разбивкой между строками, или между параграфами.


Два варианта superscript'а: «мой» и стандартный.

Самое интересное, что такое поведение можно легко исправить, достаточно добавить глобальный стиль навроде этого:

Большинство веб-сайтов нашпиговано мелким текстом, читать который — сплошное мучение. Для чего? Нет никаких причин для того, чтобы ужимать так много информации на один экран. Это — просто дурацкое коллективное заблуждение, восходящее к временам, когда экраны были очень, очень маленькими. Поэтому…

Не заставляйте нас изменять размер шрифта

Мы не хотим постоянно менять настройки размера шрифта в браузере при посещении каждого нового сайта.

Не доказывайте нам, что переполненные страницы лучше выглядят

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

Не втирайте нам, что прокрутка страниц — это плохо

Потому что в таком случае все сайты плохие. В прокручивании веб-страницы нет ровным счётом ничего страшного. Ни-че-го. Так же, как нет ничего страшного в перелистывании страниц книги.

Не говорите нам, что текст не важен

95 % того, что обычно называют веб-дизайном, — это типографика.

Не требуйте, чтобы мы начали носить очки

Лучше вместо этого перестаньте тереться носом об экран, откиньтесь в кресле назад (!) и продолжайте чтение этой статьи в расслабленной позе.

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

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

Раз в сутки скрипт пробегает по списку и отправляет каждому по 1 письму со всеми сообщениями за день (получатели могут отключить посылку писем и активировать публикацию в rss фид, но это для «продвинутых», у меня много друзей про rss даже не слышали :).

Почему?
Была проблема — у меня три десятка друзей, с которыми я хочу делиться интересными ссылками. Они используют разные IM (ICQ, Jabber), они состоят в разных социальных сетях.

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

Пост скорее для себя, чем для других.
Код и подробности под катом.

Muzicons.com



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

Мы решили попробовать собрать средства на содержание Muzicons. Моментально отреагировали 3 блоггера, за это им огромное спасибо!

http://gipsylilya.livejournal.com/
http://pinkzebra.ru/blog/
http://funnymilk.livejournal.com/

Если все продолжится такими темпами, то музикон не только не закроется, но и обрастет новыми возможностями, которые вы так просите (сотни писем тому доказательство). Средства пойдут в первую очередь на оплату серверов на ближайшие 2 года, а остальные средства на новые фичи, дизайн форм плееров и тд. Музикон останется бесплатным и без рекламы.

П.С. надеюсь не ошибся разделом

Вы наверное уже слышали о технологии масштабирования Liquid Resize, которая учитывает содержимое изображения. Если вам интересно как оно все работает и как можно реализовать все это самому, то читайте далее (осторожно, много рисунков).


(НЛО прилетело и растянуло этот рисунок здесь)

Свойство clear со значениями left, right, both действительно очищает поток в отличие от overflow со значеним hidden, которое создаёт отдельный контекст форматирования для выбранного элемента, тем самым локализуя действие свойства float внутри элемента к которому применён.

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

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

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

Если честно, мне лень описывать синтаксис и особенности пролога, кому интересно, без труда найдут достаточное количество материала в интернете, благо язык довольно академичный. Скажу лишь, чем меня он заинтересовал. Дело в том, что пролог, по сути единственный язык, предлагающий качественно другой подход к программированию, чем хорошо известные императивный, ООП (который, по сути, тоже императивный, но нацелен на структурирование и модульность), функциональный. Можно назвать этот подход декларативно-логическим.
Не претендуя на точность терминологии, этот подход можно определить как такой, при котором программа представляет собой описанние теми или иными конструкциями языка программирования самого условия задачи. Роль ЯП при этом понять это описание, и сделать из него некоторый вывод, который окажется ни чем иным как правильным решением задачи.
Проиллюстрируем, что под этим подразумевается. Возьмем следующую задачу.

Многие программисты оптимизируют JavaScript и CSS-код, чтобы страница грузилась быстрее.
Но не все они делают прелоадеры, которые дают пользователю эффект субъективно более быстрой загрузки.

Решил поделиться файликом, который я использую каждый раз, когда рисую макет или проектирую интерфейс.
Экономит мне кучу времени.



Скачать архив с пээсдэшником (49 kb)

UPD:
Ссылка от saltommeister
Контролы для Эксплорера, Файрфокса, Оперы и Сафари

Ссылка от niker
designerstoolbox.com/designresources/elements/

Ссылка от fatal
456bereastreet.com/archive/200409/styling_form_controls/

Ссылка от AlmeZ
Free Photoshop browser templates for webdesigners and screendesigners

Ссылка от 3fonov
Yahoo Design Stencil Kit

5й выпуск медленно, но двигающегося вперед видеопроекта Computer Science Student. На этот раз — небольшая «лекция» о такой структуре данных, как деревья.
Видео доступно в HD-качестве, но, как всегда, придется идти на vimeo.com.

Существуют моменты когда необходимо предоставить пользователям выбор цвета какой либо вещи. Есть несколько способов выхода из этой ситуации.

Здесь я покажу очень простой и незамысловатый способ быстрой перекраски, на примере iPod Shuffle.

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

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

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

1. Использование дефисов вместо тире em-dash.



Если вам нужно прервать мысль, то делайте это с помощью символа (alt+0151), а не парой знаков «минус». Это, пожалуй, главный источник раздражения для всех редакторов.

1. Что такое PNG?
2. PNG vs GIF.
3. PNG vs JPEG.
4. Жизнь после Photoshop'а или сжимаем дальше.
5. Adobe Fireworks или PNG-8 с альфа-каналом.
6. Вердикт.

Осторожно, много картинок! Все кликабельны.

Итак, расписание российского университетского тура компании Opera Software, организованного в рамках Opera Education Program, почти завершено — остаются считанные дни до его начала. Это на сегодняшний день самое масштабное мероприятие, которое проводит норвежская компания в России: представители Opera посетят семь городов и проведут семинары в десяти университетах. Маршрут следования такой: Владивосток — Томск — Новосибирск — Екатеринбург — Пермь — Москва — Санкт-Петербург. Вот таблица со списком всех университетов с указанием даты, времени и места проведения:

jQuery — это замечательный JavaScript Framework, который подкупает своей простотой в понимании и удобством в использовании. Но изучение надо с чего-то начинать, и лично моё мнение — лучше всего начинать с наглядных примеров, и они далее…

jTruncate — это плагин для jQuery, который позволяет легко прятать лишний текст на вашей веб-странице.
Этот плагин будет полезен для страниц перегруженных различной информацией.

jTruncate вызывается точно также как и большинство плагинов для jQuery.

$().ready(function() {
$('#example1').jTruncate();
});

Полным ходом идут университетские туры, организованные в рамках новой образовательной программы Opera Software. Одновременно публикуются новые статьи, в которых специалисты высшего класса делятся своим опытом веб-разработки с использованием HTML, CSS, JavaSvript и DOM. Между тем, образовательная программа продолжает развиваться и в довольно интересном направлении. Пару дней назад на сайте проекта открылся новый раздел — «Opera Campus Crew». Говоря человеческим языком, теперь любой студент (или преподаватель — почему нет?) может стать официальным представителем компании Opera Software в своём учебном заведении. Естественно, как у любого официального представителя, у вас есть как обязанности, так и более приятные заботы. К первым относятся: