Однако современные методы зашли далеко вперёд и такая иконка покажется скучной, а может даже унылой, фраза «ты, что это в Paint нарисовал?» звучит, как оскорбление и на место *.bmp пришли *.png . Так как добавить то картинку под иконку?
Для этого в конструкцию <head></head> добавляется следующий тег:
<link rel="icon" type="image/png" href="/favicon.png" />
Разрешение файлов с 32х32 так же изменилось, сегодня иконки делают 57х57 и более. Так же стоит отметить для владельцев сайтов, кто верстает сайты для посетителей, заходящих с айфонов и точей следующие строки:
<link rel="apple-touch-icon" href="/apple-touch-favicon.png" />
Нужно отметить, что в этом случае при просмотре будут закруглены углы и наложен блик, самим устройством. Если же Вам нужна иконка в оригинале без эффектов от девайсов, воспользуйтесь таким тегом:
<link rel="apple-touch-icon-precomposed" href="/apple-touch-favicon.png" />