Разметка облака тегов

[tenshi]

и яваскриптом никак не узнать какой тэг «весомее»…

[Gunger]

Могу написать проверку, если хотите убедиться, что это вполне реально. Чуть сложнее, чем с w1, w2, w3 и т.д., но очень даже реально.

[tenshi]

а оно того стоит? чем циферки не угодили?

[Gunger]

Я разве сказал, что они мне чем-то не угодили. Не спорю, мне не нравится использование цифр в названиях классов и id. В крайних случаях я использую префиксы first, second и т.п. или постфиксы one, two… Все от личных предпочтений зависит, как и предложенный мной вариант.

[tenshi]

а мне не нравится твоя аватарка… накатаю-ка я об этом статью на хабр…

[Bakti9rov]

не лучше ли через inline-css (font-size)?
разброс (spread) «веса» тегов возрастает не всегда линейно.

[l2k]

weight={«s»:1,«m»:2,«l»:3,«xl»:4,«xxl»:5};

[l2k]

alert(weight[need]);

[tenshi]

а при добавлении xs — строить хэш заново?

[apla]

weight={«s»:-1,«m»:0,«l»:1,«xl»:2}

[tenshi]

замечательно. и получилась у нас унарная система счисления, где в качестве единицы используется «X», в качестве плюcа — «L», а в качестве минуса — «S».
это, конечно, куда семантичней, чем десятичная система с арабскими цифрами…
почему бы не пойти дальше и не воспользоваться римскими цифрами?

[y0ga]

всё-таки мне кажется указывать вес числом нагляднее.

[Gunger]

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

[kizu]

Числом не только нагляднее, но и может быть-таки семантичнее, т.к. «размер» — визуальная сторона отображения меток, вес можно выразить и иначе — оттенком, прозрачностью, или чем-то ещё.

[Gunger]

В топике рассматривается блок «без излишеств и дизайнерских наворотов», то есть о различных оттенках, прозрачности, бекграундах и прочем речи нет. В случае с изменением перечисленных параметров, в зависимости от веса, будет крайне нелогично использовать как вариант с цифрами, так и предложенный мной, с размерами одежды. В случае изменения оттенка можно использовать light, dark и прочее, относящееся к цвету. А, вообще, никто ведь не запрещает использования нескольких классов. Например, «w1 s light». И вес указали, и изменение размера и, даже, осветление оттенка.

[kizu]

Использование в названии класса визуального отображения блока противоречит идеям семантики. Если нужно тексту в определённом блоке сообразно дизайну придать зелёный цвет, мы пропишем класс green? А если потом дизайн изменится, или же в соответствии с какими-то условиями текст должен стать красным? Малиновым? Цвета бедра испуганной нимфы?
Так же и с метками: единственное что мы знаем — их вес. И классы для тех или иных меток необходимо прописывать сообразно весу, в таком случае если в будущем придётся изменить их отображение — нам не придётся менять классы. И т.д. и т.п.
Это же основы основ семантики :)

[Gunger]

Ну так смысл в том, что обозначения размеров — это соотношения весов тегов. То есть small (s) — это не значит, что текст должен быть размером в 10 пикселей. Это значит, что его вес меньше, чем у остальных (medium, large и пр.). Насчет цветов переборщил, соглашусь.

[kizu]

Ну разве что так. Правда, слово large мне в этом контексте всё-равно не нравится, для веса больше бы подошло big, хотя понятно, что large тут очень хорошо вписывается в XXL :)
Но цифровое обозначение для веса немногим хуже, единственный относительный недостаток, который вы и указали — в меньшую сторону сложнее добавлять классы. Однако, если начинать не с 1, а со 128…

[markshevchenko]

Поскольку в CSS можно использовать дефис, никаких сложностей нет:

..., w-2, w-1, w0, w1, w2,…

:)

[Gunger]

У большинства дефис служит разделителем в названиях классов, поэтому у них изначально классы именовались бы как w-1, w-2 и т.д.

[kizu]

Ну, с одной стороны — нет, но с другой — дефис часто используется как разделитель слов/сущностей в менах классов, если будет и w1 и w-1 всё-таки могут возникнуть проблемы с читаемостью. Хотя, если в остальном дефисы не использовать в именах классов, то можно и так, да :)

[optio]

Прикольно придумано, почти лайфхак :)

[Agatov]

Отличная идея. Применю в своём проекте. Спасибо.

[theKitich]

о семантичности ещё надо подумать. Но оригинально и красиво — однозначно :)

[DOKA]

Ну это каждый сам выбирает как удобнее. Какой смысл вообще на таких мелочах акцентировать внимание?

[pepelsbey]

Вопрос из разряда «Какой смысл жить, если мы всё равно умрём?» — если можем что-то обсудить, то не стоит упускать этой возможности. Самообразование, попытка найти лучшее решение, чтоугодно…

[Psixozzz]

Я все-таки так и не понял, чем цифровое обозначение не устроило? Ну или какие такие преимущества у новой методики?

[Psixozzz]

Кроме того, а когда над проектом будут работать другие люди, вы уверены, что они разделят ваши предпочтения?

[Gunger]

То есть, по-вашему, люди будут в восторге увидеть обозначения, вроде w12, а то и вовсе s12?

[y0ga]

а по ваше при таких размерах надо будет писать «xxxxxxxxxxl»? :)

[y0ga]

* по-вашему

[Gunger]

Видимо, моей идеи Вы так и не поняли. Уменьшение/увеличение происходит пропорционально как со стороны small, так и со стороны large. То есть, w12 = xxxxxl (список начинается с xxxxs). Правда, такие конструкции — редкость. Облака тегов, в которых больше 5-6 разных весов тегов неэффективна.

[y0ga]

я прекрасно вас понял. я к тому, что легче воспринимается конкретное число в «w12», чем считать количество иксов в «xxxxxl».

[gigigi]

чесно говоря не понимаю зачем это нужно. я по формуле высчитываю размеры и подставляю в style размер шрифта, к чему эти классы? А если тегов очень много и все они абсолютно разные по весомости?

[lautsevich]

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

[pepelsbey]

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

— Инвалиды // прописать title на каждую ссылку, etc…
— Версия для печати // просто скрыть облако тегов

А делать только потому, что «круто без стилей»… ну, это как делать потому, что «отлично отображается в Lynx».

Поэтому аргумент «семантически верно — значит хорошо отображается без стилей» нельзя развернуть как «хорошо отображается без стилей — значит семантически верно».

[lautsevich]

хм. есть что-то и в твоих словах верное. не знаю, что же выбрать для себя? о_0

[talisman]

А что если отказаться от списка и использовать заголовки внутри блока? h2, h3, h4, h5, h6, strong, em, p.

[aratak]

шесть уровней тегов вполне достаточно. h1..h6

опять же внутри тега h1..h6 можно либо помещать strong либо не помещать. таким образом весов тегов может быть двенадцать. и при просмотре с мобильных, на печати будет хотя бы понятно что это облако тегов.

[aratak]

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

[talisman]

Тоже излишне, как мне кажется. Надо упрощать, а не усложнять.

[talisman]

Ну, как бы, h1 не рекомендуется повторять внутри страницы несколько раз, а тут это возможно. Да и излишняя вложенность не нужна.

[aratak]

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

можно исключить h1 и оставить десять тегов.

хочу добавить, что я понимаю, что не очень хороший вариант. но не могу придумать вариант лучше, для семантичности облака тегов. Какие у нас есть теги, для различия «веса» ссылок?

[talisman]

Сейчас таких нет :)
Давайте писать в w3c письмо, с просьбой создать теги a1, a2, a3, a4, a5, a6 :)

[aratak]

можно кстати использовать теги BIG и SMALL. Сделать семантически три уровня тегов (ссылка, ссылка + big, ссылка + small). поместить все это блок, и при выключенном CSS, на мобильном, на принтере (уж если облако тегов придется печатать :) будет отлично смотреться.

Калибровку делать с помощью CSS классов.

[Sannis]

Это только три размера. А если делать дополнительную калибровку с помощью CSS, то нет смысла и small/big привлекать.

[tenshi]

гм… а что ты подразумеваешь под семантикой?

[aratak]

использовать теги там, где они нужны и не использовать иначе.

[tenshi]

то есть, если нужно сделать текст моноширинным, то надо юзать тэг pre, красным — font, крупным — big и тп?

[aratak]

ну… не нужно утрировать ситуацию.

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

сдесь теги big и small предлагаются, как альтернатива h1..h6. Плюс еще и инлайновая.

[pepelsbey]

Заголовки — это структурные элементы. Структурные по отношению ко всему документу. Так что странное предложение…

[talisman]

Я соглашусь :)
Это было всего лишь предложение.

Сам я делаю куда более просто — выношу размер в style.

[pepelsbey]

А почему сразу не <font size="3">? ;)
Мне кажется, что инлайн-стили говорят нам… а вот ни о чём не говорят. А классы вводят определённую логику.

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

[talisman]

Все верно, все верно :)
Я в теории, к сожалению, не силен, к всему приходил сам. Читал лишь спецификацию два дня в самом начале. Надо исправляться :)

[talisman]

Хотя вы знаете. На уровень продаж это никак не влияет :)

[lautsevich]

Вадим, а что ты думаешь по этому поводу? habrahabr.ru/blogs/webdev/50212/#comment_1326521

[andryukhin]

Изюминки внутри кода — чтоб приятнее работалось. Очень хорошо :)

[Silverstorm]

tag_1, tag_2, tag_3… и собственно у самих ссылок. Вы ведь их размер меняете а не размер контейнеров ;)

[kirbak]

Неужели все наизусть знают какой размер из этих эсок и эмок больше? Или я один такой…

[Sannis]

Конечно, думаю большинство. Расшифровывается же очень просто.

[shiko_1st]

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

<ul class="tags">
<li weight="-1">tag 1</li>
<li weight="0">tag 2</li>
<li weight="1"> tag 3</li>
</ul>

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

[Gunger]

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

[garex]

По моему семантичность пострадала.

w1, w2, w3 лучше

[petergreen]

+1 мнение о «несемантичности» вашего подхода, т.к. М в одежде = самый распостраненный. А в случае тегов такой статистики нет, и может получится байда типа xxxxxxxxxxxxxl……… xl — l — m — s — xs, лучше уж писать тогда 5xl

[WoR]

Засуньте облако тегов в жопу, оно не удобно. Сейчас облако тегов похоже, как давно на всех сайтах была бегущая строка. Аналогичный бред.

[lautsevich]

не нужно так категорично

[n1k1c4]

Автор, картинки в посте не видно.