Comments 58
Хорошее начало. Но мало как-то :(
+35
UFO just landed and posted this here
А мне кажется в случае с таблицами все вполне логично.
Word в первую очередь текстовый редактор и таблицы используются для вставки структурированных данных и последующей печати (просмотра), и сетка таблицы явно не будет лишней (для читаемости можно легко настроить стиль оформления таблицы).
Excel же часто используется не для вывода информации, а просто для расчетов, поэтому тут сложно предугадать понадобится сетка (выводимая на печать, а не условная серая) или нет, поэтому по умолчанию ее нет — удобнее восприятие информации.
Word в первую очередь текстовый редактор и таблицы используются для вставки структурированных данных и последующей печати (просмотра), и сетка таблицы явно не будет лишней (для читаемости можно легко настроить стиль оформления таблицы).
Excel же часто используется не для вывода информации, а просто для расчетов, поэтому тут сложно предугадать понадобится сетка (выводимая на печать, а не условная серая) или нет, поэтому по умолчанию ее нет — удобнее восприятие информации.
+16
согласен, но думается мне стоит на это смотреть, как например, а не как на то что в ворде накосячили… хотя может быть автор считает иначе.
+4
С точки зрения логики в этом есть смысл, т.к. линии таблицы в Word показывается таким образом, потому что таблица в таком же виде будет и напечатана. В Excel же таблица в печать не попадет, т.к. линии — это просто разметка ячеек, и для того чтобы напечатать таблицу нужно явно задать бордюры для линий.
Цель данного сравнения на самом деле заключается в том, чтобы показать как контраст визуальных элементов влияет на восприятие информации.
Цель данного сравнения на самом деле заключается в том, чтобы показать как контраст визуальных элементов влияет на восприятие информации.
+10
интуитивно делал таблицы именно такими, но все-равно довольно таки интересно :)
ждем продолжения ;)
ждем продолжения ;)
+4
Вы все правильно написали, но остановились на компромиссном варианте: сетка есть, но бледная.
Сетки вообще быть не должно.
Эту мысль можно усвоить как из книг Тафти (убрав сетку совсем можно получить наилучший коэффициент полезных чернил), так и из ТРИЗа — самая лучшая сетка та, которой нет, а её функция выполняется. Выполнять функцию сетки должна пустота.
Сетки вообще быть не должно.
Эту мысль можно усвоить как из книг Тафти (убрав сетку совсем можно получить наилучший коэффициент полезных чернил), так и из ТРИЗа — самая лучшая сетка та, которой нет, а её функция выполняется. Выполнять функцию сетки должна пустота.
+4
Ну, вопрос немного спорный, на мой взгляд. Если заменить сетку на пустоту, то значит отступы между колонками и строками таблицы должны быть больше — чтобы было понятно, что это пробел не между словами, а между столбцами… Во-первых размер текста/интерфейса возрастает — что не есть хорошо, потому что бОльший размер затрудняет навигацию, а во-вторых, глазу гораздо труднее выделять фрагменты текста. А если так рассуж
+7
дать, то нужно вообще все линии всегда убирать…
+3
Сетка и правда позволяет сделать таблицу компактнее, её можно применять, когда надо показать действительно много данных, как например тут: www.ksoftware.ru/wiki/_media/images/information_design/some_cognetics/cognitics9.jpg
Для небольших же сеток, вроде той, что в посте, экономия будет мизерной.
Для небольших же сеток, вроде той, что в посте, экономия будет мизерной.
+3
Есть еще таблицы, где чередующиеся строки выделяются разными цветами, насколько удобен такой подход с точки зрения восприятия информации. Получается, что мы выделяем строку цветом не зависимо от тех данных, которые в ней содержатся.
+5
Зебра ничем не отличается от сетки по смыслу, это тоже бесполезные чернила, от которых надо избавляться.
Очень хорошее тризовое решение — делать таблицу без сетки, зебры и прочего, но выделать текущую строку при наведении курсора.
Кстати, таблица без сетки называется выводом. Хорошие примеры дизайна таблиц есть в книге Коломина и справочнике Мильчина (в издании Студии).
Очень хорошее тризовое решение — делать таблицу без сетки, зебры и прочего, но выделать текущую строку при наведении курсора.
Кстати, таблица без сетки называется выводом. Хорошие примеры дизайна таблиц есть в книге Коломина и справочнике Мильчина (в издании Студии).
+1
При использовании данного способа различия между строками должны быть минимальными и лишь помогать выделять информацию в отдельно взятой строке. Тогда не будет смыслового акцента.
+2
Простите, не очень понял вас. В таблице, обычно, данные и так весьма однородны. Или вы про что?
+2
Таблицы бывают разные. В некоторых например можно встретить вперемешку как числа, так и текстовую информацию, да еще и с переносами на несколько строк.
Как Вы отметили выше «зебра ничем отличается от сетки по смыслу». Конечно можно заменить дополнительными пустотами между строками и совсем отказаться от вспомогательной разметки, но все же не всегда есть возможность жертвовать компактностью.
Как Вы отметили выше «зебра ничем отличается от сетки по смыслу». Конечно можно заменить дополнительными пустотами между строками и совсем отказаться от вспомогательной разметки, но все же не всегда есть возможность жертвовать компактностью.
+2
>но все же не всегда есть возможность жертвовать компактностью.
Согласен, таблица Джона Граунта тому подтверждение.
Согласен, таблица Джона Граунта тому подтверждение.
+2
Хороший пример, но в нем идет борьба с нагромождением данных, связанное с большим числом колонок. Я же про те случаи, когда высота строк неравномерна или в строке не так много данных (слишком большое расстояние между данными).
Кстати в примере попробуйте сходу найти значение для «Cramp» / «1629». Уверен, что с дополнительной разметкой мне было бы проще.
Кстати в примере попробуйте сходу найти значение для «Cramp» / «1629». Уверен, что с дополнительной разметкой мне было бы проще.
+2
Да, этот шаблон пользовательского интерфейса называется Alternating Row Colors
+4
Ужасная таблица. Хороший пример, объясняющий почему зебр и сеток нужно стараться избегать.
+2
Ну, это как нарисовать… Вы считаете, что в нашем примере без использования альтернативного цвета список станет более читабелен?
+2
Конечно, если вы исправите ширину колонок.
Сейчас ширина столбцов обусловлена только шириной колонки в сетке страницы, куда вам надо было вместить таблицу. На то, какие в таблице данные вы просто наплевали.
Если придвинуть столбцы, то данные будут отлично читаться без сетки и без зебры, а если вы еще сделаете выделение под курсором, будет вообще великолепно.
Кстати, числовые данные надо ровнять по запятой, чтобы можно было сравнивать порядки. В диапазонах, в английском, надо использовать среднее тире, а не дефис. Тире это отбивать пробелами не нужно.
Сейчас ширина столбцов обусловлена только шириной колонки в сетке страницы, куда вам надо было вместить таблицу. На то, какие в таблице данные вы просто наплевали.
Если придвинуть столбцы, то данные будут отлично читаться без сетки и без зебры, а если вы еще сделаете выделение под курсором, будет вообще великолепно.
Кстати, числовые данные надо ровнять по запятой, чтобы можно было сравнивать порядки. В диапазонах, в английском, надо использовать среднее тире, а не дефис. Тире это отбивать пробелами не нужно.
+1
Не спора ради. Насчет дефиса — это строковые данные из NWind, мы тут не властны. Насчет выравнивания числовых данных — соглашусь. Про выделение курсором — это же все же печатный документ будет в итоге…
А насчет шаблона в целом — не зря же он появился и используется, возьмите хоть тот же Thunderbird.
А насчет шаблона в целом — не зря же он появился и используется, возьмите хоть тот же Thunderbird.
0
У зебры и сетки есть один плюс — простота. можно достаточно плохо сверстать таблицу, как у вас, например, но с сеткой она всё равно будет правильно читаться. Не очень удобно, не очень быстро, но правильно.
А чтобы сделать таблицу без сетки часто нужен дизайнер, который сможет вникнуть в данные, реорганизовать их и правильно представить.
Поэтому сетки и зебры вокруг нас.
— У вас такая простая таблица, что сделать её так, чтобы она и для экрана подошла и для бумаги будет не трудно. И без курсора.
Посмотрите таблицы в Советах Артёма Горбунова, там много примеров сложнее вашего.
А чтобы сделать таблицу без сетки часто нужен дизайнер, который сможет вникнуть в данные, реорганизовать их и правильно представить.
Поэтому сетки и зебры вокруг нас.
— У вас такая простая таблица, что сделать её так, чтобы она и для экрана подошла и для бумаги будет не трудно. И без курсора.
Посмотрите таблицы в Советах Артёма Горбунова, там много примеров сложнее вашего.
+1
Я бы даже сказал, хороший пример, показывающий, почему ТАБЛИЦЫ не нужны для представления СПИСКОВ
0
Есть пример где нет сетки. Но лично для меня, по каким-то причинам, все-таки удобней воспринимается вариант, где есть бледная сетка. А какой вариант лучше читается вам?
+3
В Советах (http://www.artgorbunov.ru/bb/soviet/) полно, например www.artgorbunov.ru/bb/soviet/20070712/
+2
На скриншоте из Adobe Lightroom можно спокойно отрезать левую часть:
Слово Options просто лишнее.
Слово Include нужно добавить в лейблы чекбоксов, так лучше читается.
Text — это вообще глупо. И так понятно, что текст туда.
Rating нужно оставить. Но так как это единственная надпись, то для него явно не нужна левая колонка.
Ну и пресеты не обязательно назвать пресетами, если у них понятные имена, типа All photos, как на скриншоте.
Слово Options просто лишнее.
Слово Include нужно добавить в лейблы чекбоксов, так лучше читается.
Text — это вообще глупо. И так понятно, что текст туда.
Rating нужно оставить. Но так как это единственная надпись, то для него явно не нужна левая колонка.
Ну и пресеты не обязательно назвать пресетами, если у них понятные имена, типа All photos, как на скриншоте.
+1
есть отличная книжка по этому поводу, правда она больше по веб-дизайну: Save The Pixel by Ben Hunt
главное помнить:
Design isn't Art.
It's not about creating beautiful or thought-provoking things for the sake of it.
Design is a discipline – creating communication with a purpose.
главное помнить:
Design isn't Art.
It's not about creating beautiful or thought-provoking things for the sake of it.
Design is a discipline – creating communication with a purpose.
+2
Уверен, если открыть новый документ в любом редакторе, там будет чего-то не хватать. Сделанной работы.
Мне показалось странным сравнение таблиц в word и excel, особенно если учесть, что в word таблицы редко имеют строки одинарной высоты. Кстати, в word'е разделительные символы между единицами информации (буквами, словами) вообще не видны, а в excel так ярко выражены (те же границы) ;)
Мне показалось странным сравнение таблиц в word и excel, особенно если учесть, что в word таблицы редко имеют строки одинарной высоты. Кстати, в word'е разделительные символы между единицами информации (буквами, словами) вообще не видны, а в excel так ярко выражены (те же границы) ;)
0
+3
попробуйте вывести на печать обе таблицы… в ворде границы будут напечатаны, а в экселе — нет…
на это и указывает контрастность границы — будет ли он выведен наравне с текстом, или он просто служит для облегчения редактирования.
а всё остальное — несколько притянуто за уши)
на это и указывает контрастность границы — будет ли он выведен наравне с текстом, или он просто служит для облегчения редактирования.
а всё остальное — несколько притянуто за уши)
+1
Таки автор прав
+2
Это визуальный пример, никто не утверждает что Word делает таблицы не правильно.
+2
зачем брать пример, где всё правильно, чтобы на нём объяснить, что так делать неправильно?
-1
Правильно и не правильно завситит от того чего вы хотите достичь. Здесь указывается на способ, который можно использовать для того, чтобы облегчить восприятие некоторых данных. К примеру скриншот из Adobe Lightroom показывает как при помощи контраста можно выделить данные и уменьшить визуальный весь менее значимых лейблов.
+1
нет, я понял главную идею и согласен с ней полностью, контраст — интресная вещь, с её помощью можно добиться интересных результатов.
но с конкретно приведённым примером я не согласен, и считаю, что и в ворде, и в экселе разная контрастность границ и вообще из наличие тоже несёт собою полезную информацию, хотя автор намекает, что в ворде границы показаны зря:
>Давайте остановимся и зададим себе вопрос: «Что здесь не так?»
вот, собственно, и всё
но с конкретно приведённым примером я не согласен, и считаю, что и в ворде, и в экселе разная контрастность границ и вообще из наличие тоже несёт собою полезную информацию, хотя автор намекает, что в ворде границы показаны зря:
>Давайте остановимся и зададим себе вопрос: «Что здесь не так?»
вот, собственно, и всё
0
Когда-то для своего местячкового форума я просто начал убирать из стандартного шаблона элементы, которые не используются или мало используются. Результат был потрясающим, а пользователи говорили, что форум более удобен, чем другие, которыми они пользуются, но не могли объяснить, почему.
+3
Можно было сразу начать со скриншота из Adobe Lightroom. Или же просто привести три таблички с разной выразительностью.
У ворда есть своя специфика — выглядеть набранный текст должен точно также, как он будет выведен на печать. В Excel да, важно подчеркнуть нужное и поменьше отсвечивать.
Но раз уж это перевод, адресую лучи диссонанса автору :)
У ворда есть своя специфика — выглядеть набранный текст должен точно также, как он будет выведен на печать. В Excel да, важно подчеркнуть нужное и поменьше отсвечивать.
Но раз уж это перевод, адресую лучи диссонанса автору :)
0
А не лучше ли делать примеры на C#? И потом «Теперь стало намного легче увидеть необходимые данные.», а где картинка как стало? :)
0
В C# нет полос разделяющих методы. Неужели, программисты, которые пишут на Visual Basic действительно нуждаются в этих разделителях? Честно сказать никогда этого не понимал…
+3
Картинки, вроде, все на месте — их две, первая — «как было», вторая «как стало» (см. над указанным вами текстом).
В VisualStudio в С#-проектах разделительных линий вообще нет. Что касается VB-проектов, то там они есть, потому и пример такой.
Кстати в VS2005 эти линии были довольно четкими, а в VS2010 стали гораздо бледнее, что лишний раз доказывает идею поста.
В VisualStudio в С#-проектах разделительных линий вообще нет. Что касается VB-проектов, то там они есть, потому и пример такой.
Кстати в VS2005 эти линии были довольно четкими, а в VS2010 стали гораздо бледнее, что лишний раз доказывает идею поста.
+1
<hr />
<hr />
Линии оказываются менее контрастными, чем сами данные.Простите, но вы просто не выделили контура вашей таблице, само собой, что общий грид в Exele менее контрастен, чем данные
<hr />
позволяя вашим глазам быстро найти необходимую информацию.крайне неудачный пример на мой взгляд, нужная мне информация находится справа…
0
Sign up to leave a comment.
Хороший пользовательский интерфейс, ясность и релевантность информации