Pull to refresh

Comments 134

Всякие Adobe и Corel в инсталляторах этого не делают, а вы тут о какой-то вёрстке.

Кстати, вариант без for=«inputId», насколько я знаю, в IE6 не работает ни при каких обстоятельствах.
добавить for=«inputId», что мешает?
Ничто не мешает. Но вот в вашем примере он почему отсутствует. А соответственно хорошо и красиво не получится.

И br — тоже некрасивый тег.
<br>
<br />

<input type=«checkbox» ...>
<input type=«checkbox»… />

;)
Вовсе не обязательно. Если документ собран по спецификации HTML 4.1, то валидатор будет ругаться на закрывающий слеш.

Я же имел в виду тот факт, что разделение на строки нужно делать вставкой элементов формы внутрь блочного элемента, а не при помощи разрыва строки.
UFO just landed and posted this here
UFO just landed and posted this here
UFO just landed and posted this here
Не будет.

Ругаться на закрывающий тег будет только в том случе, если такой тег вставлен в <head>.
UFO just landed and posted this here
Это вы и с видите разницу. А заказчику как правило пофиг, эрой там или варнинг.
Простите. Error или warning, конечно. Автокомплит — зло))
Работает, если не полениться и написать элементарный expression.
Комментарии к топику разочаровали, честно говоря.
Но экспрешн — это очень нехорошо, вы же согласны?
Нет, не согласен. С чего бы?
Экспрешн создаёт дополнительную нагрузку на браузер, который и без того болен. Нет, конечно всё зависит от того, как именно записан экспрешн, но всё-таки добавление for к label не имеет побочных эффектов.
UFO just landed and posted this here
Вообще, расстановкой идентификаторов и for к ним обычно занимаются программисты, а не верстальщики. При этом делается это в полуавтоматическом режиме.

Хот я на самом-то деле это разговор о личных пристрастиях. Моё мнение — если можно не использовать expression, я его использовать не буду. Потому что не хочу даже задумываться о том, где и как оно может выйти боком.
UFO just landed and posted this here
UFO just landed and posted this here
UFO just landed and posted this here
А если посетитель использует IE6 и вырубает JS, то пусть целиться в чекбоксы мышкой
не логично, по-моему.
Хочется что бы работало в IE, пишу экспрешн; ой, у него нет JS, ну и хрен тогда с ним, пусть что хочет делает.

Если хочется, то я бы сделал так что бы максимально не было в зависимости от случая.
Не «пусть что хочет делает», а пусть целится в чекбокс/радиобаттон/текстовый инпут мышкой. Graceful degradation в действии.
в данном случае её можно избежать вполне легитимным способом.
>всё зависит от того, как именно записан экспрешн
Это ключевые слова в вашем комментарии.
UFO just landed and posted this here
Ну, мне удобнее положить контрол в лейбл (и чаще всего макет позволяет так сделать). Мне нужен.
На самом деле, сильно удивляет такое отношение к экспрешшенам, будто это шайтан-машина и непременно все сломает рано или поздно.
UFO just landed and posted this here
Присоединяюсь. К тому-же, у автора верстка семантически неверная.
UFO just landed and posted this here
Я нигде не писал что она невалидна :-)

С другой стороны, я могу неправильно понимать значения слова «семантика» и могу ошибаться.
Но объясните, какой здравый смысл в том, чтоб пихать объект внутрь ярлыка к этому объекту?
Конечно, может я дурак, но я не понимаю.
UFO just landed and posted this here
В принципе, согласен. Вы правы. Только я, все-равно, не считаю такое поведение очевидным.
UFO just landed and posted this here
И где тут очевидность? Почему, если я оборачиваю checkbox в SPAN, то клик по нему ни к чему не приводит, а если LABEL, то работает… Логики — ноль. Поэтому это просто распространённый трюк и не более того.

И только атрибут for задаёт очевидную связь между ярлыком и полем.
1) откуда такая зацикленность на чекбоксах и радиобаттонах? если обернуть в лейбл текстовый input, то он — surprise! — тоже получит фокус при клике на тексте

2) нет ли заодно удивления от того, что если написать
<span for="inputid">я лейбл!</span><input type="checkbox" id="inputid" />,
то клик по спану тоже ни к чему не приводит? не оттого ли, что это SPAN, а не LABEL?
Мне очень жаль, но у SPAN'а нет атрибута for, видимо, поэтому и не работает. Так ведь?

И если написать DIV'у action, он не станет формой, а через H1 нельзя загрузить файл.

Элемент LABEL создан для того, чтобы быть ярлыком форм, для чего у него есть специальный атрибут. И если за стандартное поведение почти во всех браузерах принят не описанный нигде трюк, то это не делает его логичным.
UFO just landed and posted this here
Это не трюк, а вполне правильное решение.
Не стоит захламлять страницу лишними id, если они не будут использоваться кем-то, кроме одной лейбы.

А обертка инпутов в лейблы упрощает верстку. Например если необходимо вертикально расположить поля, достаточно будет будет сделать лейбу блочной :)
UFO just landed and posted this here
UFO just landed and posted this here
UFO just landed and posted this here
Меня плюсы/минусы не сильно волнуют. Это всего лишь показатель — понимают меня или нет.

А «не рано» будет тогда, когда об этом будут больше говорить.
UFO just landed and posted this here
Ок. Аргумент «нигде не описанный трюк» отменяется, посыпаю голову пеплом в знак позора.
Однако я по-прежнему не понимаю, почему ярлык к полю должен содержать само поле. Ну странно это.
UFO just landed and posted this here
В качестве аварийной необходимости я и сам бывало так делал, но атрибут for на радостях никуда не девался, ибо ослик № 6.
UFO just landed and posted this here
Гм. Т.е. как только IE6 канет в лету, то ты с полной уверенностью забьёшь на связь id-for?
UFO just landed and posted this here
UFO just landed and posted this here
Ну, автор и поддержавшие его активисты предлагают делать так. Понимаю, что личные предпочтения, но мы же тут не просто флудим, а вроде как истину ищем, нет? ;)
UFO just landed and posted this here
UFO just landed and posted this here
Автор слышал, что надо лейбл ставить, но ещё не понял как. Дело даже не в том, что его вариант где-то не будет работать, он просто неправильный.
UFO just landed and posted this here
Всё хоккей. www.w3.org/TR/html401/interact/forms.html#h-17.9.1

To associate a label with another control implicitly, the control element must be within the contents of the LABEL element. In this case, the LABEL may only contain one control element. The label itself may be positioned before or after the associated control.

In this example, we implicitly associate two labels with two text input controls:
First Name

Last Name

чёрт, невнимательность не рулит
UFO just landed and posted this here
UFO just landed and posted this here
сверху Пепелсбей написал гораздо лучше, чем смог бы я, хотя идея та же ;)
http://www.w3.org/TR/html401/interact/forms.html#h-17.9.1
To associate a label with another control implicitly, the control element must be within the contents of the LABEL element. In this case, the LABEL may only contain one control element. The label itself may be positioned before or after the associated control.

Сначала не дочитал до конца… подумал, что автор привел два варианта как не надо делать)
UFO just landed and posted this here
Вместо дописывания FOR и ID, можно, как я упомянул выше, набросать простенький expression. Это кажется мне более элегантным :)
А вообще, приятно, черт побери, видеть адекватного человека в этом топике!
UFO just landed and posted this here
UFO just landed and posted this here
UFO just landed and posted this here
id="..." затрудняет автоматическую генерацию форм. Приходится придумывать левые уникальные id-шники.
UFO just landed and posted this here
Ум, а я-то уже обрадовался, что какой-то фичи не знаю. Типа использование лабел без атрибута фор и ид на контроле… А её и знать не надо, все равно ИЕ не умеет )8
Тут дело не только в ИЕ, а и в том что лейбл и инпут в целях выравнивания могут оказаться внутри разных блоков. Тут без «фор» никак.
гы=)
А я просто не знал — но, правда, нечасто верстая, не задумывался и вешал хендлер=)
Переделал только что последний шаблон с учётом такой штуки, спасибо=)
Не знаю, по каким сайтам ходит автор, я считаю, сайты, в которых галочки без лэйбла — еще поискать надо.
К сожалению, таких еще великое множество. И все из-за разделения труда, когда макет верстает один человек, а натягивает его программист, который зачастую некторые вещи и мелочи, не имеющие для него никакого значения, упускает.
а бывает и так, что верстальщик тег Label не использует, и программист вставляет его сам
а бывает и так, что потом за свое самовольство программист получает по шапке от менеджера
Всё справедливо. Программист должен программировать. Поставишь ты лишний label, вёрстка поедет, верстальщик получит по шапке.
Каждый должен заниматься своим делом. Есть предложения по улучшению вёрстки — извещаешь верстальщика.
Скажи это моему начальству!: о)
А я и не говорю, что несправедливо. Я говорю — как бывает.
А я и не спорю, я комментирую :)
«Общие положения и условия» на Google(!) AdSense. Два радиобаттона без
Упс! Что-то пошло не так…
Я хотел сказать «без тэга label».
Я использую лэйбл. И фор тоже. А плохие верстальщики — нет. Потому что им лень)
поздравляю, после этого комментария в вас невооруженным глазом заметен хороший верстальщик!
Все неправильно, labelы нельзя использовать. Пользователь должен избавляться от лени и счелкать на чекбоксе а не на тексте.
Скоро будете им курсоры двигать на кнопки… :)
поддерживаю…
есть примеры когда проводиться, скажем, голосование за сайты — и текстовое описание — это фактически ссылка на сайт в соревновании…
при этом использую данную конструкцию что мы получим?
в таком случае использовать лейбл не надо ;)
Но это, скорее всего, просто частный случай общей ситуации.
Таких случаев нужно просто избегать, продумывая лучше архитектуру кода. Например — делать линку на сайт рядом, например — иконкой.
Слова плохого верстальщика.

Хороший верстальщик знает, как использовать label так, чтобы его нельзя было использовать для изменения значения input`а.
я считаю label необходимо использовать, хотя бы по той причине, что на текст проще ткнуть мышью, чем например на checkbox.
Кроме того, если в тестовом задании при приеме ко мне на работу, соискатель не использует label, считаю большим минусом…
Даааа, хабр уже не тооот, авторы мельчают… )))
UFO just landed and posted this here
Автор кидает палки в чужой огород, а сам даже правильно HTML-теги написать не может
Автор и впрямь мельчает. Кроме того, первое желание все-таки — ткнуть в квадратик с галкой, а не на текст.
+1
На работе ERP система от крупной компании (не буду озвучивать имя), работа ведётся через web-мордочку. Все checkbox'ы и radiobutton'ы без label… Дико неудобно, чёрт подери. Особенно с учётом того, что с этим приходится работать иногда дни напролёт…

Даёшь акцию «За label!» (:
Вы где нибудь видели, чтобы, к примеру, на всяких акциях/презентациях использовались некрасивые девушки-модели?
Вот и здесь тот же случай: если уж «даёшь акцию» — стоит хотя бы написать хороший код того, к чему призываешь «горе-верстальщиков».
А так, конечно, не спорю, лейбл к чекбоксу цеплять нужно. Хоть и сам привык клацать именно по самим чекбоксами :)
хотел сказать «непрезентабельных». не отличающихся красотой, имхо, хватает :)
Дело привычки… когда в системе, к примеру, много checkbox удобнее нажать на текст, который находиться в label(промах в принципе исключен)
Мысль здравая, подача и ошибки в коде какие-то детские.
А ещё, label — это не только текст рядом с чекбоксом, а любое логическое указание на поле ввода, будь то заголовок или картинка (не img, конечно, важно чтобы в коде было адекватное имя поля)
UFO just landed and posted this here
UFO just landed and posted this here
UFO just landed and posted this here
Пока авторитеты не криминальные, переть против них не опасно )

Мне кажется, что если у нас есть возможность логически связывать ярлык и поле, то отказываться от неё только потому, что и так работает я бы не стал. Получается, что если label+input — for вы указываете, а если label+checkbox — нет. Ну и где тут последовательность и принципиальность? Ага.

Кстати, элемент <font> тоже прекрасно отображается во всех браузерах… так зачем же нам CSS? ;)
UFO just landed and posted this here
Тогда задам вопрос ещё раз:

почему SPAN не срабатывает как LABEL, если внутри него положить INPUT? Наверное потому, что он не создан для этого.

А что такое ярлык для поля? Правильно — описание поля. И с какой радости описание поля содержит само поле?!

Логику в студию! А? Нет логики.
UFO just landed and posted this here
Для равнозначного примера с CAPTION, таблица должна быть вложена в него, а это все безоговорочно признают бредом…
UFO just landed and posted this here
Ну, есть и другие варианты:

— вложим DD в DT
— вложим TD в TH
— вложим FIELDSET в LEGEND
— …ну и т.д.

А вот мне кажется, что тут дело не формулировки.
Дело в том, что это просто удобно. Ну вот удобно верстальщикам вкладывать INPUT в LABEL, а тут ещё и фича — можно не писать for. Пускай — мне не жалко. Но пока это рождает в моей голове конфликт «почему объект вложен в его описание?», я такими делами заниматься не буду.

Одного аргумента, что подобное не сработает в IE6, на сегодняшний день достаточно.
UFO just landed and posted this here
Мне не надо думать какой бы ID прописать сороковому элементу формы

Я привык, что это забота программиста — всё равно у элементов формы уникальные имена, так что мешает трансформировать их в id…

Ну а для COL'а я бы тоже рад увидеть подобную привязку.
UFO just landed and posted this here
для radiobutton'ов — не уникальные, да )
UFO just landed and posted this here
UFO just landed and posted this here
UFO just landed and posted this here
Автор добавьте, пожалуйста, в текст статьи корректное написание

Блин, отправилось ранее задуманного :(

корректно, как было написано выше, так:

/>Поставьте галочку

Просто люди которые не читают комментарии будут думать что Ваш вариант единственно правильный, а это не так.
Блин, парсер уж совсем оборзел.

<input type="checkbox" id="test" /><label for="test">Поставьте галочку</label>
UFO just landed and posted this here
UFO just landed and posted this here
автор статьи — нуб :))

наверное накопал в учебнике новый «гениальный» тег и решил по этому случаю поделиться с нами радостью :))
Вот черт, всю жизнь использовал:
<input type=checkbox id=ch1><label for=ch1>куку</label>

и понял как я обламывался…
такой вариант самый лучший по той причине, что работает во всех браузерах. вариант автора правильный, но IE6 по крайней мере его не поддерживает.
Фуу, вы меня успокоили. А то действительно подумал, что многое потерял, используя эту форму. Хотя, с другой стороны — IE не запускаю уже который год, и думаю с таким бы багом не столкнулся :)
А в каком это проекте было выкопано?
Я на заре начала своей деятельности верстальщиком тоже так писал, но это был первый месяц. Хорошие верстальщики так писать не будут. И надо юзать for="" для label
Ну, пипл думает, мол вау, можно for не писать! И нет им дела, что в остальных случаях (когда нужно как-то оформить label или использовать другие контролы) всё равно придётся использовать for. И вот для двух случаев с radiobutton и checkbox нужно держать в голове какой-то нелепый трюк.
типа писать «for» так напрягает… :)
использование for — это еще и семантически грамотно, код читабельнее и понятнее
Хм… а я всегда думал, что нужно код писать вот так:

<form ...>
<input type="checkbox"  id="lbl" ..> <label for="lbl"> Поставьте галочку, чтобы стало зае...сь</label>
 ...
</form>


Ну т.е. input не внутри label, как более правильно?
Почитайте комменты повыше и решите для себя как правильнее.

Но, имхо, у вас и так всё в порядке с логикой.
Спасибо! По спешил с комментарием. Выше уже нашел подобный коммент.
Как веб-программист, считаю такой метод не правильным (если не было оговорено точно такое поведение с заказчиком). Чекбокс он на то и чекбокс, чтобы щёлкаться только когда по нему кликают! А не по каким то надписям с краю.
Sign up to leave a comment.

Articles