< The Webmakers Lounge />

display:none vs screen readers 8/11/2007 | Curly Brace

Все мы знаем и любим свойство display:none, которое “отключает” вывод блока, для которого оно задано в HTML-документе. Вроде бы свойство безотказное и работает всегда.

Но оказывается, что некоторые screen reader’ы запросто читают контент из блоков, скрытых с помощью display: none. Поэтому, если вам не наплевать на ваших посетителей, у которых плохое зрение или оно вобще отсутствует, то вместо того, чтобы создать класс

.hidden{
display:none;
}

надо создавать

.hidden{
display: none;
visibility: hidden;
}

Свойство visibility: hidden решает проблему и скрывает нужный блок от непослушных “читалок экрана” :) .

min-width и max-width для IE6 одновременно 15/10/2007 | Curly Brace

Используя выражения в CSS-файле для Internet Explorer 6, можно добиться поведения, которое все нормальные браузеры уже давно умеют, а именно min-width и max-width свойства для блока:

#someblock{
width:expression(((document.documentElement.clientWidth ||?
document.body.clientWidth) < 990) ? '990px' : ?
((document.body.clientWidth > 1280) ? '1280px' : '100%'));
} 

Данная заметка является скорее чем-то вроде self-note, но вдруг будет полезна и вам.

P.S. Не забывайте выносить стили для IE в отдельные файлы с помощью Conditional Comments и будет вам счастье :)

Upd.:

После общения с uggallery в коментариях, было решено оптимизировать скрипт так, чтобы не использовать expressions, из-за которых частенько подвисает браузер. Вот что из этого получилось:

Так как скрипт нужен нам только для IE6, выделяем его с помощью Conditional Comments. Скрипт срабатывает на двух событиях - onload и onresize, что не обязательно:

 <!--[if lte IE 6]>
<script type="text/javascript">
window.attachEvent(‘onload’, mmwidth);
window.attachEvent(‘onresize’, mmwidth);
function mmwidth(){
document.getElementById(‘wrap’).style.width = ?
((document.documentElement.clientWidth || ?
document.body.clientWidth) < 990) ? ‘190px’ :?
((document.body.clientWidth > 1280) ? ‘1000px’ : ‘1000px’);
};
</script>
<![endif]--> 

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

Скрипт на оригинальность не претендует, да по большому счету от expression и не отличается, просто вынесен из CSS. Знаете как сделать лучше? Нашли ошибку? Коментируйте.

За идею спасибо uggallery, за консультацию copyhold‘у.

Рабочий пример.

Internet Explorer 7 завоевывает рынок 5/10/2007 | Curly Brace

Интернет Эксплорер 7Вышло обновление для Интернет Эксплорера 7. В своем стремлении завоевать рынок Майкрософт отменил проверку Windows Genuine Advantage validation при установке браузера, что само по себе хорошо и указывает на желание мелкомягких охватить как можно большую часть рынка.

Теперь не нужно никаких ухищрений для установки IE7, только скачать и установить. Изменений в движке почти нет, и на сколько я понял, локализованые версии еще не проапдейтились.

Из минорных изменений:
- Меню теперь видно по дефолту
- Обновлен онлайн-тур для новичков и любопытствующих
- Изменен инсталятор .msi, изменение касается администраторов сетей.

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

Качаем

Не изменяет ли вам оперативная память? 17/09/2007 | Curly Brace

Сколько HTML элементов (по спецификации HTML 4) ты можешь назвать за 5 минут? (всего 91 элемент)

Сколько свойств CSS (Level 2) ты можешь назвать за 7 минут? (всего 122 свойства)

Вот такие две интересные задачки на время, позволяющие проверить свою память. После прохождения теста можно получить симпатичную кнопочку с результатами. Баловство конечно, но интересное.

Забыть о target 6/09/2007 | Curly Brace

Гениальный в своей простоте способ заставить ссылку открыться в новом табе/окне, не используя deprecated атрибут target:

< а onclick="return !window.open(this.href)" hrеf="http://www.google.com">

Преимущества этого способа перед обычным open.window(url) в том, что если javascript отключен, то ссылка все равно сработает. Кроме того, ссылка будет проиндексирована поисковиками.

Проверено в FF2, IE6/7, Opera 9.20, Safari/Win.

Поведение браузеров при нажатии Ctrl+Click / Shift+Click:
В IE6 - в обоих случаях новое окно.
В IE7 - в обоих случаях новый таб (подозреваю что зависит от настроек браузера)
В FF2 - неадекват. ctrl+click открывает две вкладки, shift+click вкладку и окно
Opera - в обоих случаях новый таб
Safari/Win - в обоих случаях новое окно

При нажатии колесиком мышки ссылка срабатывает как обычно везде, кроме IE6, естественно.

In general, не стоит принуждать посетителей к чему-либо, предпочтительнее дать посетителю знать какого рода сама ссылка (файл [включая тип], внешняя/окно) с помощью иконок, которые можно легко прикрутить с помощью CSS, на пример вот так, тем самым давая ему возможность выбрать самому, где ее открыть.

Варианты подписки