Вставка фото в код

[termoplus]

Какой вариант семантичней?

1) <img src="" width="" height="" alt="">

1) <span><img src="" width="" height="" alt=""></span>

если учитывать что перед и после картинки идут DIVы

[Dimitry Wolotko]

<img src="" width="" height="" alt="">

Вполне себе семантично, а что?

[termoplus]

просто часто замечаю буржуи тег img помещают в span, если конечно до и после картинки идет ДИВ

[Dimitry Wolotko]

Смысла особого в этом нет.

[SelenIT]

Вообще обычно чем меньше лишнего, тем семантичнее, любые обертки с точки зрения семантики — как правило, оформительский мусор (всякие фигурные рамочки с тенюшечками и т.п.).

Но если

перед и после картинки идут DIVы

пожалуй, есть смысл обернуть ее во что-то блочное (не span, а p или тоже div) для большей логичности структуры, на мой взгляд.

[Fu-tai]

Интересная у вас логика, хотя замыленная. Оборачивают в span потому что это резервный тег у которого любые свойства определяются правильно при любой погоде и он не привязан к семантической составляющей. это просто аморфный тег, он может быть и блочным и линейным, ему пофигу, у него задача быть выделителем, обёртышем и т.д. а уж во что вы его превратите и какими свойствами наделите, это ваше дело. По умолчанию он если не ошибаюсь никакой и больше никаких свойств не имеет. Так картинки оборачивают span-ном дабы как-раз не нарушить семантику и не приклеить к ней ненужных свойств, а придать лёгкую стилизацию картинке надо. В тексте бывают моменты когда надо выделить скажем другим цветом часть строки. Семантичного тега для этого дела не придумали, а использование других тегов будет не семантично, вот и приходит на помощь безлиуий span. Хороший тег одним словом и очень часто выручает!

вот читайте

Так что это очень даже семантично и практично, чем плодить кучу блоков!

[termoplus]

так в моем случае как я понял, смысла нет его использовать, просто можно задать класс тегу img чем создавать span и задаовть стиль ему, верно? или...

[Dimitry Wolotko]

А через стили картинку саму блоком можно сделать - и рулить ей как душе угодно.

[SelenIT]

Fu-tai, "безликие", не имеющие собственной семантики теги — блочный div и инлайновый span (рисоваться они могут и по-другому, но сути своей, которая content-model, от этого не меняют) — это крайняя вынужденная мера, когда необходимо реализовать хитронавороченную структуру (напр., сложный микроформат) или оформительское извращение (резиновый по всем направлениям полупрозрачный блок с фигурными уголками, рамкой и тенью и для этого нет стандартных средств (списка, цитаты, адреса, смыслового выделения и т.п.). В текущем черновике HTML5 даже есть специальная ремарка про опасность злоупотребления div-ами ради самой разметки, а не как средством расширения логики. Имхо, к span-ам это тоже применимо.

Img сам по себе — полноценный инлайновый блок (причем надежно работающий даже в браузерах, не поддерживающих inline-block!), к нему можно применять padding-и, border-ы и даже фоновые картинки, поэтому для простых оформительских задач типа одинаковой рамки у ряда картинок одного фиксированного размера обертка не нужна (замечу, что речь идет именно об оформлении картинки, а не блока с картинкой, поэтому эти свойства для нее никак не лишние, и перенос этих свойств на искусственный, только ради этого введенный элемент как раз ломает семантику!). В фотогалереях и т.п. вещах картинка, как правило, уже обернута в другой строчный тег — ссылку, которая там оправдана по смыслу и вполне может взять на себя и оформительские задачи. Ну а если и этим не удовлетворить неуемную фантазию дизайнера — тогда, да, без "бессмыссленного" абстрактного span-а никак...

termoplus,

в моем случае как я понял, смысла нет его использовать, просто можно задать класс тегу img чем создавать span и задаовть стиль ему, верно?

Я стараюсь придерживаться общего правила: если без обертки можно обойтись с разумными трудозатратами — лучше обходиться без нее.

Edited June 8, 2009 by SelenIT