Рубрика «формы» - 2

в 1:37, , рубрики: autocomplete, chrome, автозаполнение, Блог компании Google, веб-дизайн, Веб-разработка, веб-формы, данные, данные пользователей, Поисковые машины и технологии, сведения, формы

Привет! Сегодня для работы в Интернете все чаще используются мобильные устройства, а не компьютеры. При этом, на многих сайтах есть формы для ввода данных, позволяющие совершить покупку или подписаться на рассылку. Как результат, пользователям приходится много раз вводить на разных сайтах такие сведения о себе, как имя, номер телефона и адрес. Удобство веб-форм имеет огромное значение, потому что при работе с ними всегда вероятны ошибки, в результате чего многие пользователи вовсе отказываются от заполнения. Три года назад мы представили функцию автозаполнения в браузере Chrome, которая упрощает ввод данных в формы. Теперь Chrome полностью поддерживает в формах атрибут autocomplete в соответствии с современным стандартом WHATWG HTML. Благодаря этому веб-мастера и разработчики могут помечать поля атрибутами, например name и street-address (имя и адрес), не изменяя интерфейс или другой код сайта. Те, кто реализовал эти возможности, отмечают, что их формы стали заполняться чаще.
автозаполнение форм на смартфоне
Например, если пометить поле для ввода электронного адреса, то код будет выглядеть так:

<input type="text" name="customerEmail" autocomplete="email"/>

Читать полностью »

в 8:42, , рубрики: html, php, бэкенд, Веб-разработка, формы, фронтенд

При подготовке материала по Symfony Form я решил уделить некоторое внимание теоретической части по работе с формами со стороны клиента – что они из себя представляют, как ведут себя браузеры при отправке, в каком формате путешествуют, в каком виде поступают на сервер.

Вводная часть несколько растянулась и в итоге вылилась в отдельную небольшую статью, которая, по моему мнению, может быть интересна и другим бэкенд-разработчикам (не только PHP или Symfony).
Читать полностью »

в 10:53, , рубрики: coffee script, html, javascript, валидация, формы

В процессе разработки очередного проекта с довольно большим количеством форм, в который раз возникла проблема валидации, притом как на стороне клиента, так и на сервере. На поиск готовой библиотеки для фронтенда я убил половину рабочего дня, и в общем-то все безрезультатно. На сервере с этим спокойно справляется symfony 2, а вот подходящей JS библиотеки, на удивление, найти не удалось. Либо не было простой возможности для локализации, либо были строгие требования к html разметке, либо ад из кучи data атрибутов…

В общем, решил попробовать быстренько написать свой простенький велосипед… Разумеется, «быстро» затянулось почти на две недели, а «простая» библиотека каким-то образом стала весить почти 30 кб…

Но результат, на удивление, оказался не очень плохим. И даже, как мне кажется, его не стыдно показать общественности.

RsValidator — простой и удобный в использовании валидатор. Достаточно мощный, но при этом не перегруженный лишней функциональностью.

Если заинтересовало, добро пожаловать под кат!Читать полностью »

в 11:42, , рубрики: 1c:предприятие, интерфейсы, Программирование, разработка, формы, элементы управления, метки: , , ,

Наверное, одной из самых непростых и скучных задач при проектировании обычной формы в «1С: Предприятии» является управление доступностью элементов в зависимости от того или иного набора данных. Мне встречалось очень много решений: от процедуры вроде УстановитьВидимостьДоступность() с включением в нее всех правил для элементов управления, до совершенно хаотично разбросанных по всему коду обращений к указанным свойствам.

Признаюсь честно, я тоже перепробовал различные способы, но в один прекрасный момент дошел до очень удобного и логичного (как мне кажется), который и будет описан в этом посте.
Читать полностью »

в 13:23, , рубрики: css3, Блог компании Издательский дом «Питер», книга, формы, метки: , ,

Всем привет! Сегодня в продаже появилась "Большая книга CSS3", которую многие из Вас ждали. Чем она может вас заинтересовать?

  1. информация подается интересно
  2. подкрепляется практическими занятиями
  3. приводится много ссылок на сторонние статьи и ресурсы по изучаемой теме
  4. автор постоянно делится своими советами и наработками
  5. уделяется много внимания именно дизайну
  6. Современный взгляд на дизайн и верстку
  7. Верстальщиков научит дизайну, дизайнеров научит верстке.

Это третье издание книги, до этого у Макфарланда были изданы книги по CSS достаточно крупными тиражами, но в этой книге, которая вышла со значительными изменениями, некоторые из которых я и сам применил на сайте books.piter.com

imageC помощью технологии CSS3 (каскадные таблицы стилей) можно создавать уникальные, современные оформления веб-сайтов. Но даже самый опытный веб-разработчик может не знать всех приемов применения CSS3. Прочитав в этой книге множество практических примеров, а также советов, вы перейдете на новый уровень создания сайтов с помощью HTML и CSS. Вы узнаете, как разрабатывать веб-страницы, которые одинаково быстро работают и одинаково выглядят, как на ПК, так и на смартфонах и планшетах.

В книге рассмотрены следующие темы:

  • написание HTML5-, CSS3-тегов, которые распознаются во всех браузерах;
  • форматирование текста, добавление на страницы навигации;
  • создание таблиц и форм;
  • приемы веб-дизайна для создания уникального оформления сайтов;
  • создание сайтов для любых устройств с помощью адаптивного дизайна.

Читать полностью »

в 10:34, , рубрики: css, адаптивный дизайн, веб-дизайн, Веб-разработка, дизайн, паттерны, поиск, фильтры, формы

Перевод статьи Криса Койера (Chris Coyier) с CSS-Tricks.com "Search with Filters Responsive Design Pattern".

Паттерны дизайна — очень полезная штука, особенно в адаптивном дизайне. Рассмотрим пример: на большом экране в блоке со вкладками по ширине помещается много табов, однако на мобильном устройстве верстка съедет. Решение — использование специального паттерна дизайна, который сжимает все табы в выпадающие пункты.

Brad Frost даже собрал очень хорошую коллекцию адаптивных паттернов, очень полезно. Еще один пример, форма поиска с фильтром результатов. На десктопе места много:

Адаптивный поиск с фильтромЧитать полностью »

в 5:15, , рубрики: cms, forms, mediawiki, semantic web, Wiki-технология, вики, руководство, Семантическая Сеть, схемы, формы, шаблоны, метки: , , , , , , ,

В прошлый раз я описал функционал плагина Semantic MediaWiki, позволяющего управлять структурированными данными в вашей системе и создавать на их основе различные представления. Ложкой дёгтя здесь является то, что пользователям приходится учить дополнительные элементы разметки.
Сегодня мы поговорим про расширение Semantic Forms, позволяющее сделать вики совсем не похожей на вики и привлечь к работе более широкий круг пользователей.

Semantic Forms для MediaWiki

Напомню, что сердцем Semantic MediaWiki является механизм семантических свойств. Назначение семантического свойства странице хоть и похоже на простое создание вики-ссылки [[имя свойства::значение свойства | что выводить на экран]], но, всё-таки, это новый синтаксис. Вдобавок даже если наши пользователи будут настолько дисциплинированы, что прочитают и вникнут в руководство по созданию свойств, они вряд ли будут называть все термины единообразно.
На моей вики, посвященной историческим личностям половина людей будет описана свойством время рождения, другие участники опишут людей свойством год рождения, а третьи дата рождения. Теперь для того, чтобы получить список исторических личностей и вывести их даты рождения, мне нужно написать три запроса вместо одного: 

{{#ask:[[Категория Историческая личность]] | ?Время рождения }}
{{#ask:[[Категория Историческая личность]] | ?Год рождения }}
{{#ask:[[Категория Историческая личность]] | ?Дата рождения }}

Для решения этих проблем применяют шаблоны и формы.
Читать полностью »

в 8:34, , рубрики: usability, проектирование интерфейсов, формы, юзабилити, метки: , ,

Рекомендации по интерфейсу форм
Проектирование форм может оказаться настоящей проблемой. Чтобы получилось что-то стоящее и удобное для пользователей необходимо принять во внимание кучу разных рекомендаций и правил. В данной статье я постарался составить полезный список таких рекомендаций. Для его составления я использовал свой опыт и статьи экспертов.

Основные рекомендации и ввод данных

  • Стремитесь к краткости.
  • Убедитесь, что в форме используется один язык (обороты, термины).
  • Если на странице находится только форма и ничего кроме нее, то при загрузке страницы стоит ставить фокус на первое поле формы, это позволит сэкономить немного времени (страница поиска, входа, регистрации).
  • Поддерживайте ясный путь заполнения формы.
  • Избегайте вторичных действий, если это возможно.
  • В противном случае четко разделяйте основное и дополнительные действия.
  • Выравнивайте основное действие так же как и поля формы, это упрощает восприятие формы.
  • Цветная подложка у главной кнопки сделает её более видимой.
  • Отключайте кнопку «Отправить» после того как пользователь на нее нажал, это позволит избежать двойной отправки данных.
  • Еще лучше — показывайте индикатор отправки.

Читать полностью »

в 11:15, , рубрики: ajax, eviterra, авиабилеты, Блог компании Eviterra, бронирование, интерфейсы, формы, электронная коммерция, метки: , , , , ,

Привет!

Новости конечно не прямо вот чтоб breaking, как например наша карта цен или новый интерфейс, но тоже интересно.

Недавно мы переделали форму бронирования на Эвитерре — теперь количество пассажиров можно определить не на этапе поиска (как у всех), а еще и на этапе бронирования и оплаты (такого нет почти ни у кого).

Eviterra.com – умная форма бронирования и приятные мелочи
Читать полностью »

в 18:34, , рубрики: Веб-разработка, информационная безопасность, каптча, капча, форма, форма регистрации, формы, метки: , , , ,

К сожалению, на многих сайтах без особой необходимости используют капчи. Хотя можно побороть спам и незаметными для пользователя способами. Особенно, капчу больно видеть на небольших коммерческих сайтах в форме обратной связи, поскольку, капча заметно снижает конверсию таких сайтов. Для больших сайтов, которые могут специально спамить, такие метода не применимы. Однако, в большинстве случаев, без капчи можно обойтись
Как обойтись без капчи?
Читать полностью »

123
Главная   |  Архив новостей  |   Android  |   Google  |   Apple  |   Microsoft  |   Информационная безопасность  |   Веб – разработка
Публикации RSS  |  Комментарии RSS
https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js