Про верстку чисел с разрядами

Павел Сушков, 02.07.2009

В своей работе я часто сталкиваюсь с числами — любой интерфейс, который правит деньгами, содержит их великое множество. Как известно, есть два принципиальных способа написать одно и то же длинное число:

1) Удачный — с разбиением по разрядам: 40817 84054 00000 12345

2) Не слишком удачный — без разбиения: 40817840540000012345

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

— А я беру отсюда табличку, вставляю ее в Эксель и считаю в нем.

Суть в том, что числовые данные наиболее часто (по сравнению со всеми другими видами данных) переносятся из интерфейса в интерфейс. В случае с Excel никаких проблем нет — он вполне корректно оперирует числами, написанными с пробелом. Однако бывают неприятные исключения:

Заполнение формы перевода в одном из интернет-банков. Реакция на номер счета с пробелами, который был скопирован из другого интернет-банка.

«Это дело программистов» — скажет кто-то и окажется неправ. Дизайнер интерфейсов может повлиять на эту проблему, особо упомянув (при передаче прототипа заказчику) о способе верстки, используя который можно избавить пользователя от радости удаления лишних символов после копировании чисел в сторонние интерфейсы.

Технологически это может выглядеть как угодно, но основная идея в том, что число заключается в некую конструкцию, которая изменяет его визуально, но не физически, например:

<style type=”text/css”> .sample {padding-left:0.3em;} </style> … 40817<span class=”sample”>84054</span><span class=”sample”>00000</span><span class=”sample”>12345</span>

Число, сверстанное таким образом, копируется из браузера без пробелов.

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


Show your support

Clapping shows how much you appreciated Влад Головач’s story.