Чернев.ру

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

При виде иконки возле ссылки пользователь легко поймет что его ожидает, ибо формат иконок понятен для каждого пользователя любой операционной системы

Как это реализовать?
Реализовать это очень просто — с помощью всемогущего css.

Ответ на опережение.

—Да, способ не работает в IE6, но мне все равно :-)

Вот так это делается с помощью css.

Иконизируем по расширению файла

a[href $='.расширение_вашего_файла'] {
   padding-right: 18px;
   background: transparent url(имя_иконки.gif) no-repeat center right;
}

Очень просто! Вот вам еще пример, что бы Вы наверняка поняли :-)

a[href$='.txt'] {
     padding: 5px 20px 5px 0;
     background: transparent url(icons/icon_txt.gif) no-repeat center right;
}

Иконизируем по действию

Сразу перейду к примеру, например отправка письма(mailto):

a[href ^="mailto:"] {
     padding: 5px 20px 5px 0;
    background: transparent url(icons/icon_mailto.gif) no-repeat center right;
}

Вот и все.

Иконизируем по сайту

К примеру ссылка ведет на Википедию, так добавим ее иконку!

a[href *="ru.wikipedia.org"] {
     padding: 5px 20px 5px 0;
     background: transparent url(icons/wikipedia.gif) no-repeat center right;
}

Вроде все разобрали. Так же выложу ссылку уже на готовый пак с иконками.

Underworld buy Спасибо за внимание! ;-)

Скачать пак для иконизации