Как стать автором
Обновить

Комментарии 178

Я уже несколько раз ловил себя на том, что Tahoma без сглаживания выглядит некрасиво. А со сглаживанием у нее меняются размеры. Что посоветуете? Делать в эскизе без сглаживания — клиент ругается что кубиками. А сделать сглаживание — и Tahoma сильно начинает отличаться от того, как она будет смотреться в Explorer. Я обычно сглаживаю когда шрифт больше 12px — но всё равно разница с браузером существенна. Есть ли эффективный способ?
Могу посоветовать следующие советы:
1. Включите сглаживание в своей системе и убедите клиента тоже включить его. Читайте об этом в моих предыдущих статьях, ссылки приведены здесь в конце статьи.
2. Не используйте Tahoma. 10 лет назад этот шрифт был востребован, но сейчас есть другие альтернативы, о которых также подробно написано в указанных статьях.
3. Не используйте Explorer. Почему и зачем — вряд ли стоит обсуждать. Этот броузер — не лучший выбор для веб-дизайнера, хотя, конечно, это дело вкуса.
брОзер для дизайна? *задумался
> Не используйте Tahoma
Какие порекомендуете?
Есть простое правило.
1. все шрифты в Майкрософт ОС не сглаживаются до размера 18px, а потом сглаживаются.
2. Иссключение составляет 2-3 шрифта и Arial в режиме Bold — они сглаживаются практически при любом размере.

В МАК ОС сглаживание практически всегда.
>Включите сглаживание в своей системе и убедите клиента тоже включить его.
Сначала объясните ему почему он должен перейти с любимого ie6 на какой-то непонятный Safari или ie7
Если человек застрял в 2001 году и это ему нравится — я ничем помочь не могу. Поскольку сам предпочитаю искользовать современные броузеры, современные технологии, и всех своих клиентов к этому приучаю. Упёртые и непокобелимые — пустая трата времени, зачем их убеждать?
>Если человек застрял в 2001 году и это ему нравится — я ничем помочь не могу.
А если именно от этого человека зависит заказ на несколько десятков килобаксов? Это именно тот вариант с которым только что столкнулся. Вы будете убеждать его что он лох, плюнете на заказ или сделаете так как положено — отработаете дизайн под все актувальные броузеры?

Если плюнете на заказ — киньте мне координаты вашего клиента через хабрапочту. Карму вам не увеличу, но процент с заказа дам.

ЗЫ. Последнее относится ко всем «любителям прогресса».
У меня никогда не было таких заказчиков. Все, кто способен заплатить несколько десятков килобаксов — люди вменяемые и готовые идти в ногу со временем. Они уже давно забыли про IE6. Один раз попался клиент — тётенька 48-го года рождения, раз пять в жизни державшая мышку. Ей доверили курировать изготовление сайта. Она мне там понаговорила всякой чуши, я понял, что случай клинический и, поскольку фрилансер — человек свободный, я помахал ручкой и занялся другим заказом, более адекватным. Чего и вам советую.
>Все, кто способен заплатить несколько десятков килобаксов
> — люди вменяемые и готовые идти в ногу со временем.
Предложение отправлять ко мне клиентов с десятками килобаксов и ie6 на комп. остается в силе. Для психиатрической экспертизы у нас в компании есть дипломированные психиатры.
А наши дизайнеры умеют делать сайты под все броузеры, включая ie6
однажды один дазайнер в своей книге написал, что пользоваться px нежелательно, что предпочтительнее пользоваться pt
Он это как то обосновал, или просто так и написал, что «пользоваться нежелательно»?
там было написано, что желательно использовать именно pt, так как у клиента может быть разное разрешение на экране монитора, а Вам (как дизайнеру) необходимо показать так свой текст, чтобы он не рвал таблицы и на всех разрешениях одинаково выглядел. я к сожалению не помню автора, это одна из самых первых книг по web-дизайну, которую написал наш. сам я не дизайнер, но книгу прочёл с удовольствием.
pxtoem.com/ — мне больше понравился, проще.
Для одной конкретной цели — согласен. Я указал более общие сервисы, удобные при подборе, предпросмотру и вообще работе со шрифтом для веб.
21. Не следуйте глупо всем этим правилам, думайте своей головой
От части вы правы :)
Нет, вы чертовски правы.
Вы правы чертовски от части.
Вы частично чертовски правы!
вы от части чертовски
Правило №19 (НЕ делайте того, чего не смог бы потом реализовать верстальщик) должно стать первым. Таким дизайнерам (привет, Миша!) надо отрывать все, что оторвать можно.
Убивал бы за стилизованные select'ы…
как я вас понимаю
+1
Ребята я с вами
Я своему дизайнеру перешлю эту статью.
А то он блин каждый раз питается чето такое сделать с селектами и
Я одному дизайнеру из нашей компании тоже линк направлю, он очень любит использовать связку Corel Draw + 9pt шрифт + п. 1 :-!
у меня там не получилось еще написать.
Но наш дизайнер любит инпут type=«file»
тоже рисовать свой
Не, наш особенно любит подкладывать картинку-фон под меню, шапки и основной текст (как в журналах). Полиграфист он и в веб-дизайне полиграфист =)))
согласен
но «не смог»…
есть пример?
Верстальщик должен уметь реализовывать любой дизайн!
Для начала дизайнер должен уметь верстать, чтобы делать такой дизайн, который должен уметь реализовывать верстальщик.
Дизайнер, который умеет хорошо верстать — это супер! А вот хороший дизайнер, который плохо умеет верстать — это ужасно, потому что многие идеи, приходящие в голову замечательного дизайнера он не реализовывает, т.к. боится, что не сможет их сверстать! Так что не надо утверждать, что каждый дизайнер должен верстать!
Ага, давайте положим на фон градиент, контент запихнем в бокс со сглаженными углами и outer glow в качестве тени. Куда деваться верстальщику, если ПМ требует от него чтобы в ИЕ6 верстка выглядела как на макете.
если это про картинку внизу, то это легко реализовать, если все так, как вы написали :)
если интересно, верстану
Интересно, был бы очень признаетелен.
У меня верстальщица и не такое реализует.
Принципиально реализуемо практически все.
Но, как правило, на такие мелочи тратится слишком много времени, и появляются проблемы.
Имхо, дешевле объяснить дизайнеру, с какими вещами следуют поаккуратнее быть. Тем более, что если в проекте не предусмотрен бюджетом флешер\ява-скриптер, а дизайн уже согласован с клиентом, то могут возникнуть затруднения.
Я умею верстать, причем неплохо. Это мне нисколько не мешает делать дизайн макетов и отдавать их верстальщику, который без труда справляется с версткой таких дизайнов. Уверяю вас, меня ни капельки не страшит то, что я бы не смог сверстать или еще что либо. Просто я держу в голове и учитываю определенные нюансы, когда делаю блоки. Пока никто не пострадал. И все мои коллеги-дизайнеры в той или иной степени знакомы с основами верстки. Как стоматологу не мешают знания из общей медицины.
НЛО прилетело и опубликовало эту надпись здесь
Некоторые дизайнерские изыски сверстать невозможно технически.
Какие?


И, да — ФФ, ИЕ6-7, Опера, Сафари. Валидно.
что конкретно тут нельзя реализовать?
и что это?
Вы, видно даже не пробовали. Под ИЕ6 придется как минимум делать отдельные изображения и подсовывать другой код. С тенями под ИЕ6 придется распрощаться.

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

Или у нас, в двадцать первый век не дизайн для контента, а контент для дизайна?
какие изображения придется делать отдельно?
тени… :) мухахаха, вы про фильтр не слышали?

не важно что в 20м веке, важен принцип, вы говорите, что невозможно, я говорю, что возможно

PS спасибо за карму (возможно, не вам)
Ах, да… Все это должно тянутся по контенту. Скажем, от от одного слова, до нескольких абзацев.
div background(left-side) left no-repeat
div background(right-side) right no-repeat

div background(fon) repeat-x
Удачи вам. ИЕ6 не применяет фильтр на альфа-канал на повторяющийся, или спозиционированный бакграунд.
1. 33 способа как включить альфа-канал для png в том числе на повторяющийся и позицированный бэкграунд уже придумали.

2. если по вертикали двигаться не будет, то фон можно слепить с тенью в гифе.
1. пруфлинк?
2. будет.
С постоянной шириной: пруфлинк
Не составит труда таким-же способом тянуть по горизонтали, просто больше оберток будет.
оп, а я только шоп открыл, нарисовать заново :)
даже уголки уже повырезал…

1ney, вам еще нужны доказательства или я найду чем заняться? :)
Решение в комментарии ниже. Пофиксили, как оказывается проблему повторяющимся бакграундом.
:)
как уже было сказано, не обязательно скриптом повторять фон,
sizingMethod='scale'
если уж использовать в этом конкретном случае альфа лоадер, лучше вручную задать sizing-method, в этом фиксе повторение обеспечивается созданием множества элементов с фоном, при узкой картинке на фоне, их становится очень много и начинаются тормоза.
Ваша правда, в конце августа вышел пак с поддержкой повторяющегося бакграунда.
в этом наборе да. но с 2006 года уже известны сами способы.
это там билд пака видимо августовский, до этого скорее всего были еще билды с этими фичами.
в принципе, конечно, компромисы должны быть: если сложная картинка, то скорее всего будет или кирпич, или не будет тени, или не будет градиента на фоне, или что-то еще.
Видал я макеты от художников, которые бедные верстальщики в конце концов плевали и делали тупо img width=«100%» height=«100%» :)
Не все ПМ\клиенты идут на компромиссы :(
Вот очень хороший и быстрый фикс: DD_belatedPNG
Плюс ко всему, имеется градиент внутри, этим ограничивается высота контента, а градиенты на фоне не позволяют использовать изображения-маски.
да понял :)
поем, сделаю
Какие фильтры? Я не слышала про фильтры! Просветите, пожалуйста.
Это сверстать как два пальца…
А по поводу правила №1 хочу сказать:

Дизайнер и верстальщик должны
быть уровня понимания золотой середины
между решением графической задачи
в рамках возможностей веба
Сверстать это, чтобы оно тянулось во все стороны и везде нормально отображалось можно спокойно.
Вам 20 лет, вы бородаты и вы тролль.
Буээ… Лол. Скинь исходник psd, посмотрим.
slil.ru/26646642
Специально для вас
fml131-11e.ucoz.ru/omg/
фуу, ну и способ придумал я. со скриптом + нижние уголки в ие6 что-то шалят. Если бы мне пришлось сделать такую формочку в проекте, сделал бы в таблице (там всё ровно и просто). А т.к. вопрос состоит о споре, возможно ли это реализовать технически, ответ — возможно. Так что я спокоен =)
P.S. текст там не мой)
По горизонтали тянется?
кстати, таблицами это решается проще простого, я попробую полностью слоями
ну? где?
так там не правильно, не как задумывалось. там фон основной не повторяется, тени не полупрозрачные, тупо с фоном вырезано. под другой фон такой блок уже не поставишь. и блок в ширину не тянется. в общем, совсем не то. надо чтобы было, что-то типо как у меня. ладно, не хочешь делать, как хочешь. просто интересно было посмотреть на другие решения.
честно, не хочу :)
но я посмотрел то, что ты сделал, только вот cleft и cright м.б. чуть по-другому сделал, а так, твой способ практически типовой :)

вот, как вариант реализации боковых теней
хех, ну и ссылочка. при 1680 на верхнем блоке косячок, а в ие6 вообще теней нету )
оффтоп, но про ие6…
я начал компанию по неподдержке его сайтами, которые периодически делаю, заказчику прямо так и говорю :)

на одном из сайтов повесил NoIE скрипт, который не дает кликать никуда и предлагает FF скачать (можно и ie7 на худой конец), и, вы не поверите, но количество пользователей с ie6 уменьшилось

можно подумать, что они просто перестали заходить на сайт, но нет, количество пользователей ff увеличилось :)

еще заметил, что с ie6 приходят в основном по будням, не трудно предположить, что ходят с работы и что админят на этих работах не очень хорошие люди :)
про ие6… я начал компанию по неподдержке его сайтами, которые периодически делаю
В этом плане интересна идея с выдачей сайта под IE6 полностью без стилей.

админят на этих работах не очень хорошие люди
Скорее, не оч. умные сведущие. ;-)
Меня в этом отношении порадовал такой подход: www.kotelnikov.net/
Он как бы говорит нам: могу, но не буду.
в моем тоже ие поддерживался, просто взбесило, что приходят в основном в ие6, вот и поменял курс
Спасибо за отзыв. Старался. :)
> я начал компанию по неподдержке его сайтами, которые периодически делаю,
> заказчику прямо так и говорю :)

Вы не могли бы продемонстрировать коммерческие ресурсы вашего изготовления?
Я думаю мне будет нетрудно объяснить их владельцам, что я могу _легко_ увеличить аудиторию (и прибыль) на 20-25% процентов.

Предложение остается в силе для все «поборников прогресса»
у меня другие цели :)
я хочу сделать мир лучше :)
Мир будет лучше, если никто и никогда не будет диктовать другим свои представления о «лучшем».
Нет, если вы готовы к недополучениею 25% прибыли и готовы кушать на четверть меньше, чтобы мир стал лучше — ваше дело. Но при чем здесь другие?
Если Вы такой чрезвычайно умный и расчётливый, то где же Ваши статьи или хотя бы положительная карма? Очевидно, слишком много этого ума накопилось, раз за него так активно минусуют.
Открою Вам Большой Секрет Колхейгена: IT-специалисты крайне ревностно относятся к своим достижениям и профессиональным навыкам, чтобы кто-то голословно утверждал, что кто-то сделает это лучше. Даже если речь всего о 25%.
Не стоит видеть лишь в одном себе знатока, тут достаточно образованных и умеющих людей.
>Если Вы такой чрезвычайно умный и расчётливый,
>то где же Ваши статьи или хотя бы положительная карма?
Выше вы посчитали признаком невменяемости пользование ie6, теперь признаком ума — наличие высокой «кармы». У вас какие-то, мягко говоря, странные представления о внешнем мире.

>крайне ревностно относятся к своим достижениям и профессиональным навыкам
Пристрастие к игнорированию 25% пользователей — это не признак ума, образованности и уж тем более профессионализма. Это признак зашоренности и ограниченности и нездорового апломба.

Статьи вы можете почитать на моих ресурсах. Вы их можнте найти по профилю.
Речь не о пристрастиях. А о том, что не следует утверждать, что Вы сделаете лучше, чем сделал кто-то другой. Быть может, Вы и правда сделаете лучше, и привлечете 25%, а то и 125% пользователей больше, да только вот говорить автору ресурса об этом не следует. Это выглядит не более, чем дешёвые понты. Смиритесь с тем, что кто-то в этом мире хуже Вас понимает принципы работы веба, но его творения, тем не менее, живут и процветают и без Ваших советов. И если уж так хочется дать дельные советы — напишите здесь статью и посмотрите на реакцию пользователей. Если в таких советах будет реальная польза — Ваши старания оценят по заслугам.

зы. Об ie6 я лично ничего не говорил.
зызы. Статьи о программировании мне не понятны. А стихи на ямало-ненецком диалекте я не понимаю, увы.
>Речь не о пристрастиях. А о том, что не следует утверждать,
>что Вы сделаете лучше, чем сделал кто-то другой.
ЛЮБОЙ профессиональный дизайнер/верстальщик/программист сделает лучше. Потому что плевать на кроссброузерность может позволить себе только дилетант.

>зы. Об ie6 я лично ничего не говорил.
Кроме странных представлений о психиатрии у вас еще и амнезия. Цитирую вас:
«Могу посоветовать следующие советы:
3. Не используйте Explorer. Почему и зачем — вряд ли стоит обсуждать. Этот броузер — не лучший выбор для веб-дизайнера, хотя, конечно, это дело вкуса.»

>И если уж так хочется дать дельные советы
Вы не поняли. Я не дельных советов просил, а клиентов, которые совсем-совсем не нужны тем для кого непостильный труд сделать нормальный кроссброузерный сайт под все распространенные броузеры.
Совет только один — продолжайте гнуть свою линию. Одобряю. Чем больше людей будет следовать вашим советам — тем больше у меня заработки.

>Статьи о программировании мне не понятны. А стихи на ямало-ненецком диалекте я не понимаю…
И азы веб-дизайна вы тоже не понимаете :)

Я много чего не понимаю. Во многом не разбираюсь. Мои заработки, слава Богу, не зависят от всякого рода хамов и самовлюбленных идиотов, потому да, я прождолжу гнуть свою линию. Я буду делать сайты, хорошие сайты, и делиться своим многолетним опытом с дизайнерами, которые готовы и хотят чему-то учиться, а не только тролльствовать и наивно полагать, что у них все лучше, чем у других.
:)
Я не плюю на кроссбраузерность и сверстать смогу и под ие6, не хочу. Думаю, имею право. И диктовать мне не надо.

У вас нет понятия о необходимом и достаточном.
>Я не плюю на кроссбраузерность и сверстать смогу и под ие6, не хочу.
Да вы не горячитесь, я понимаю, что вы никогда не сделаете _коммерческий_ сайт с идиотской компанией игнора ie6. И вышеотметившийся товарищ тоже. Только на своем хомяке вы можете выразить свою позицию.
Все остальное — бла-бла для хабракармы. Здесь таких как вы любят.
Мне, к примеру, плевать на рейтинг и карму, она если у меня есть, то я надеюсь, по заслугам. А потому скажу прямо и открыто — вы, любезный, напыщенный и глупый сноб, здесь таких не любят.
У вас все время путаница в дефинициях. «Снобизм» означает пренебрежение к вкусам и привычкам «низшего сословия». Отношение к пользователям ie6, которое демонстрируете вы лично и большинство хабрапиплов это и есть снобизм:

>«люди вменяемые и готовые идти в ногу со временем. Они уже давно >забыли про IE6. Один раз попался клиент — тётенька 48-го года
>рождения, раз пять в жизни державшая мышку»

К пользователям ie6 и других древних и устаревших программ я отношусь с искреннем и неподдельным сожалением, а при случае, используя всю свою природную харизму и убедительность, наставляю людей на путь истинный, за что многие мне благодарны за открытие глаз. А вот снобизм — это общаться в том духе, как общаетесь Вы. Все вокруг дураки, а я один тут умный, пишу статьи в своём блоге, и вообще весь такой из себя правильный. Вот как это выглядит. А отнюдь не желанием помочь кому-то в чём-то. Или за желание помочь выдаются фразы вроде:
Я думаю мне будет нетрудно объяснить их владельцам, что я могу _легко_ увеличить аудиторию (и прибыль) на 20-25% процентов.
Это ли не снобизм? Я — такой сякой, я вам щас тут покажу как бизнес делать, лохи педальные. Подобные посты всегда сквозят юношеским снобизмом, но выглядит зачастую всё это забавно и уныло одновременно.
Нет. Это статистика. Она не зависит ни от нашей с вами хабракармы ни от дешевых понтов.

Если некий верстальщик действительно умудряется сдавать сайты которые недоступны 20-25% пользователям («сверстать смогу и под ие6, но не хочу» (с) romanoza), и этим гордится то я то здесь абсолютно непричем. Но зато не только я но и любой профессиональный верстальщик может легко исправить последствия снобизма и лени romanoza. Легко.
romanoza прав, и я его всецело поддерживаю. Незачем верстать для IE6 только лишь по той причине, что еще есть 25% пользователей. тогда, по логике вещей, надо верстать и для пользователей IE5, NN6 и так до Mosaic дойти недолго. Да только смысла нет. А есть пустая трата времени и отказ от ряда преимуществ в угоду сомнительной совместимости. Верстая для IE6, мы отказываемся от современных решений и потакаем тем пользователям, которые в силу нежелания или, скорее, в силу незнания об альтернативах (спасибо Microsoft!) не сменили броузер 7-летней давности. Если же отказаться от такой совместимости, пользователь IE6 рано или поздно столкнется с не обходимостью обновить свое ПО, потому что сайты, на него не рассчитанные, будут «выглядеть как-то не так». Разработчики сайтов невольно стимулируют посетителей сайтов на те или иные действия. Отказ от IE6 — неизбежен, дело времени. Полгода, год, два, три — сколько бы ни прошло, но рано или поздно его будет меньше 1 процента, и тогда все ваши потуги пропадут втуне. Абсолютная кроссбраузерность — скорее девиация, нежели реальная необходимость. Современные броузеры быстро и легко адаптируются к новым технологиям, потому проблема кроссброузерности в будущем стоит уже не так остро, как с этими древними и отмирающими подвидами, к которым и относится горячо Вами любимый IE6. Бравада по поводу того, что «я любой сайт смогу заверстать под IE6, потрахавшись, правда, недельку-другую» — выглядит нелепо и ни разу не впечатляет.
>Незачем верстать для IE6 только лишь по той причине,
>что еще есть 25% пользователей
А теперь давайте еще раз назовите меня снобом, проффффессионал вы наш :)
Сноб.
Удовлетворил?
Вполне :)
Когда вы начали рассуждать о вменяемости представителей внешнего мира, я сразу понял что здесь что-то не так.
Ну на том и закруглим. Полагаю, дальше бессмысленно дискутировать. Вы удовлетворены, я — тем более.
Идиотская или не идиотская — она работает.
А ваша манера давать характеристики чужой работы, когда вас об этом не просят выглядит не совсем умно.

Не вижу смысла продолжать с вами разговор.
Удачи.
Ну вот и нечего было вступать в полемику. Выходит — не знаниями блеснул, а попыхтел впустую и гордо удалился.
Это я про aps. Суровый чювак :)
Не учите других жить, и мир точно станет лучше. У вас совершенно не получается учить. Попробуйте тогда поучиться.
Ну что вы. Я поддерживаю инициативу «Неподдержки IE». Хорошо когда идиоты вешают на себя лэйблы. Их издалека видно.
Судя по вашим постам, ближе к идиотам вы сами, чем кто бы то ни было иной.
Вы правы. Я среди них :)
Весьма забавно, товарищ Колпиков, комментировать свою же статью и комментарии, но под другим аккаунтом, ага?
Можно сделать все, неважно как: хаками, невообразимыми структурами, яваскриптом в конце-концов. Но рано или поздно встанет вопрос целесообразности всех этих извращений, т.к. они вносят свою лепту в увеличение стоимость разработки, уменьшают ее «стабильность» и т.д.
Привет моему любимиму дизайнеру Андрею :)))))))
Ну, и, естественно ширина блоков типа 357 пикселов, отступы 17 — это классика…
Сверстать возможно все! Поверьте! Это зависит лишь от опыта и желания!
«А гвозди можно лопатой забивать»
Дело не в возможности верстки макета в принципе, а о его соответствии общепринятым правилам верстки и расположения элементов
Это правильно!
Но иногда могут быть моменты, когда не выходит ни как, тогда нужно верстальщику не самому делать, как он хочет, а посоветоваться с дизайнером и вместе пойти на компромисс.
Говорю, вам это как дизайнер, который умеет верстать, и которого не любят верстальщики :)
Пункты 16 и 17 по сути одно и тоже.
В общем, полностью согласен со всеми пунктами кроме 1-го. Он очень спорный и сильно зависит от конкретной ситуации. Я бы не стал ставить его первым, а поместил бы после 3-го, а первым поставил бы 19, как предложено выше :)
Очень согласен с первым пунктом. Я понимаю, что воображение может играть всячески, но иногда такое нарисуют, что голову ломать приходится.
НЛО прилетело и опубликовало эту надпись здесь
22. Не называйте статью для html-верстальщиков статьей о дизайне :)
Не понятно почему пункт 14 не применен к самой статье.
Ключевую мысль каждого пункта стоит сделать подзаголовком или выделить жирным:

3. НЕ мельчите текст
Кегли меньше 9 pt использовать крайне не рекомендуется. Кегли 9 и 10 pt используйте только для незначительных блоков, сносок и подписей. Основной текст публикуйте кеглем не менее 11 pt.
1 «НЕ» для автора топика
НЕ меняйте местами пункты, уже сейчас не понятно про что люди пишут.
НЛО прилетело и опубликовало эту надпись здесь
Частица «не» не воспринимается мозгом в процессе усваивания информации. Гораздее будут «20 правд» веб-дизайнера с переформулированием содержания.
мне нравится делать все отступы (как между блоками, так и внутри их) кратными половине кегля основого текста

например, для текста 12/18 (наиболее распостранённый вариант) — все они кратны 9 (0, 9, 18, 27 и т.д.).
Практика показывает, что никаких других величин не требуется, а на выходе получаем отличную композицию.
пункт номер 14. по сути дизайнер — это прикладная профессия. т.е. дизайн должен строиться от того, какой текст есть у заказчика (можно обсуждать, предлагать улучшения), но все таки нужно отталкиваться от него и делать дизайн в соответсвии с ним. из-за того, что дизайнер это не учитывал (и вставлял тот текст, который красивее выглядит) очень часто на макете получается красота, а реальности полная лажа. поэтому считаю, что 14 пункт надо изменить на «используйте реальный текст (делайте, чтобы он хорошо выглядел), а не отсебятину, которая красиво выглядит».

и еще самое важное — думайте головой, т.к. всегда есть исключения из правил. ну или смотрим 99 параграф в ководстве — кому что ближе. сори за повторение
Половина пунктов — бессмыслица, остатки либо не для дизайнеров, либо очевидны.
Ну конечно, советы же для дизайнеров. Что в этом неестественного?
Ну и я дизайнер! А если ты не дизайнер то че здесь и что умничаеш?

Хотя пункты считаю втемными, только уже не на мой уровень, а новичкам.
Спасибо, в памятки и на стену =)
Мне кажется или автор на столько суеверен что пункт под номером 13 решил просто пропустить, и выполнив правило №7 округлить до 20!?
Сорри. Потерялся по пути 13-й пункт. Мистика! :)
можно сделать сайт, в котором будут нарушены все правила. =) нагляднее будет. (или немного подправить страницы одноклассников. последний раз когда там был было все ужасно криво.)
Дизайнер в вебе должен если не верстать сайт, то как минимум понимать как это делается, как будет происходить нарезка, что будет картинкой, а что надписью.
Обычно дизайн и верстка неразделимы в процессе. Ну эт ИМХО.

С рыбой вообще бывает туго. От заказчика зависит. Приходится по 100 раз обьяснять что там написано и зачем. Но вот мне в последнее время попадаются люди которые заказывая сайт даже толком не могут обьяснить чем они занимаются, но при этом хотят сайт «шоб все кипятком писяли» со слоганами логотипами и проч.

ЗЫ пора на хабре заводить отдельную тематику «клиент-менеджмент» )
С удовольствием почитал бы такие статьи. Ибо общение с клиентом зачастую выходит невыносимой нервотрёпкой… Есть, конечно, уже какие-то наработанные способы воздействия и уговоров, но у всех эти способы разные, и было бы любопытно обменяться опытом.
Плох тот верстальщик, который скажет — технически невозможно.
плох тот дизайнер, который не понимает, чем чревата реализация невозможного.

Кстати, как реализовать вывод текстов эксклюзивной гарнитурой TrueType исключительно средствами верстки? Такой заказ встречался и выполнялся дважды. И оба раза был выполнен несмотря на.
SIFR?
Именно про это я и говорил. Дизайнер должен понимать к чему приведет реализация нереализуемого.
Если вы закладываете технологии подобные SIFR, будьте готовы к проблемам с оптимизацией сайта, как минимум.
В моем случае решалось с генерированием заголовков графикой. В принципе — это вообще универсальный способ для оправдания тезиса «Реализуемо все».
3.
Если задавать размер шрифта пунктами, то бишь абсолютными величинами, то на мониторах с разными размерами и разными разрешениями можно порой получить абсолютно нечитабельные тексты. ИМХО, наилучший способ использовать em или (в перспективе) ex, но самый первый, базовый размер лучше задать в пикселях и отталкиваться в дальнейшем от него. Вообще же многие величины почти наверняка придётся задавать в пикселях (бордеры, размеры картинок), поэтому использование пикселей для нетекстовых блоков и em для строчных элементов видится мне наиболее гибким решением. Хотя и там бывают сложные случаи.

6.
Что опасного в задании размеров в px? Раньше были проблемы в 5-м осле с невозможностью увеличить размер шрифта, заданного в пикселях. Сейчас это в прошлом. Какие конкретно проблемы вы имеете в виду?

«НЕ используйте абсолютных единиц при указании кегля шрифта»
А в трёх пунктах до этого вы сами это правило нарушаете, рекомендуя размеры шрифтов именно в пунктах.


8.
Ширина колонки текста вытекает из количества умещающихся в ней слов. А это число из используемого кегля и языка, на котором написан текст. 140-160 px — цифра, взятая абсолютно с потолка, сугубо из практики, абсолютом и правилом для теории она быть не может. На вскидку: а для мобильных телефонов (именно для телефонов, не смартфонов), вы это правило порекомендуете?

Для интерльяжа, опять же ИМХО, проще использовать множителями: не нужно будет лишний раз править абсолютные значения при изменении размера шрифта.

11.
В тех текстах, которые вбиты на сайт намертво лично я использую выключку по ширине и вставку ручками мягких переносов между слогами. Процесс нудный, но для исключительных случаев вполне можно и его применить. Во всех нормальных браузерах и IE 7+ работает без проблем. А вот нормальных скриптов для расстановки переносов, увы, так и не встретил: очень часто лажают.


12.
Совет хороший, но достаточно гиморный: даже в недешёвых книгах сегодня уже почти всегда не обращают внимания на висячие союзы и предлоги. Опять же, в случае HTML придётся расставлять ручками все неразрывные пробелы между предлогами и словами. Во многих случаях нужно видеть непосредственно текст, чтобы решить, возможен тут разрыв или нет

Совет N+1:
не забывайте про «версию для печати». И оформляйте её так же ответственно, как самостоятельный документ, второе Я вашего сайта.
Молодец. Все нашел, обо всем сказал. И переносы продолжайте дальше расставлять — это здорово просто!
Когда я был молод и глуп (т. е. полгодика тому назад, сейчас-то я, понятно, стар и мудр), я таким вот макаром разметил примерно 100 страниц текста a4. Из принципа хотел оформить. Делал это около недели. По много часов в день. Где-то после первой трети я решил, что я не идейный и натравил на текст скрипт. Потом посмотрел на весь этот ужас и решил, что я снова идейный. Больше такими глупастями заниматься не хочу, но смотреть на сам текст в целом всё-таки приятно. Есть что вспомнить. И посмеяться над собой )
И? В css вижу Arial Narrow, Arial, Helvetica. Шрифты все валидные, используются грамотно. И в чём прикол здесь?
нестандатные шрифты
Да, и что же это за «нестандартные» шрифты? А давайте посмотрим? Давайте!
Смотрим:
[h3]Содержание номера[/h3] (ну я скобочки поменял, чтоб Хабр не матюкался).
Открываем screen.css и ищем упоминание h3. Находим конструкцию:
h3 {margin:0 0 17px 0;font:21px/23px «Arial Narrow», Arial, Helvetica, sans-serif;color:#ffc924;}

И мы видим Arial Narrow. Не такой уж нестандартный шрифт. Не шибко, конечно, афишированный, но вполне распространенный. Я, к примеру, на маке вижу его не хуже, чем в Windows. Как видно из названия, это ужатая версия Arial. И использовать этот шрифт, кстати, следует с осторожностью. Ибо адекватных общеупотребимых замен ему нет, а вот шрифта такого может не оказаться на компьютере, и тогда вместо него будет использован обычный Arial, который раза в полтора шире. И тогда могут поползти заголовки, и дизайн вполне может перекосолапить. Стоит избегать таких вот ужатых версий, если в том нет сильной необходимости.
Он намекает на flash-replacement — конкрентее на sifr
конкретнее [т↔н] :)
так и есть, и шрифт («Содержание номера», «Новости и новинки») — Myriad Pro
Пардон, не заметил. Впрочем, сути это не меняет. Flash некоторые пользователи недолюбливают и нередко отключают. Я, к примеру, тоже. Потому вижу только настоящий HTML без этих нахлобучек. Оно-то, может, конечно и хорошо. Но лучше уж дождаться повсеместного распространения броузеров, поддерживающих внедрение шрифтов стандартными средствами HTML. Тогда подобные вопросы отпадут сами собой. Но появятся новые проблемы. Например, использование плохочитаемых витиеватых гарнитур, которые горе-дизайнеры лепят в своих дизайнах, не задумываясь.
двойка тебе холмс
6. Действительно интересующий вопрос. А чем указание размера шрифта в em лучше, чем указание того же размера в px/pt? В IE6 их нельзя было масштабировать. А теперь все браузеры молодцы. Почему em?

11. Переносы. А если есть возможность расставить переносы, допустимо ли в таком случае использование justify?

19. Сглаживание. Скажите, пожалуйста, а как на картинке учитывать различия сглаживания. Оно ведь бывает RGB, а бывает BGR. Как я понимаю, оба варианта будут плохо выглядеть на не родных для них мониторах?
6. В пикселях страшного тоже ничего не вижу, в пунктах могут быть различия между старыми макосями и виндами. Вероятность то, го в em браузер правильнее смасштабирует шрифт выше: 13,6px разные браузеры могут «округлить» и до 13, и до 14 px. Да и считать относительными величинами нагляднее для человека.

11. Если возможность есть, то да. Даже рекомендовано. Но символы мягкого переноса правильно обрабатываются очень немногими текстовыми редакторами, а достойного кроссбраузерного расстановщика переносов лично я так и не нашёл. Так что в случае, если текст с сайта предполагается копипастить, то от переносов скорее всего придётся пока отказываться.
Спасибо за правила, добавил в избранное.
Вопрос ширины текста (на многих сайтах не заданы мин. и макс. ограничения) актуален: мне оказалось удобнее пользоваться браузером с шириной окна 1000 px вместо развертывания на 1280 px.

> НЕ делайте «полной выключки» (align=«justify»)

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

+1. Поставьте баннер и посмотрите, как убого все это начнет выглядеть.
«… Следует также воздержаться от употребления сразу нескольких веб-шрифтов, достаточно ограничиться двумя-тремя гарнитурами.» Не хочется придиратся, но не очень ясно что вы имели ввиду.
А, вообще, спасибо — пост что-то вроде памятки, пригодится.
Вообще, использовать «не» — это не есть хорошо. Вот вам пример "Не думайте о белой обезьяне".
Лучше советовать как нужно делать.
Психологическая заманушка, почти не работающая… коих мильон
П. 2. А что тогда использовать? Кнопки от Мака, следуя этой логике, не понравятся юзерам Win. И наоборот. Не использовать же везде графические кнопки и перерисованные элементы форм? В 98% случаев это является неоправданным.
Есть два пути решения: а) использовать элементы форм как они есть без дополнительных украшательств, тогда пользователи Windows увидят кнопки в стиле Windows, а пользователи MacOS — в стиле MacOS. б) использовать свои собственные оригинальные стили кнопок, не мимикрирующие под какую-нибудь распространенную ОС. Собственно, на всех серьезных ресурсах встречаются именно эти два типа кнопок. А вот непрофессионально сделанные сайты в том числе содержат кнопки, тупо заскриншоченные из Vista, Leopard или KDE.
Я-то думал, что речь идет о подготовке макета. В макете-то что ставить? Поставлю кнопку от винды, покажу пользователю мака — он расплюется. Хотя, общая логика ясна. Я так вообще против «нестандартных» кнопкой и элементов форм.
Спасибо, интересно!
2 совета веб-дизайнеру:

1. Кури теорию по серьезным книгам про сетку и типографику, а не по подобным статейкам.
2. Относись к контенту с не меньшей любовью, чем к визуальному дизайну. И тогда в твоих макетах не будет однотипных lorem-ipsum'ов и блоков вроде «здесь будут новости».

Потому что не надо слепо следовать категоричным «НЕ». Надо хорошо понимать что ты делаешь, как и почему именно так.
Лучше всего использовать величины, кратные 3, поскольку только они дают развернуться. 3 пикселя — это обычно достаточная величина для небольших отступов. 5 — это уже много.
Тут половину устроили холивар о теме дизайнер vs верстальщик! НАхрена?

Я как дизайнер не доконца понимаю программеров, и не лучше они понимают меня и так будет всегда. Аминь.

Но это не мешает реализовывать почти любые идеи моего больного разума… Ребята наверное надо учиться вам, либо я не понимаю что ваш дизигер такое нарисовал что вы не смогли сверстать?
НЛО прилетело и опубликовало эту надпись здесь
НЛО прилетело и опубликовало эту надпись здесь
22. НЕ используйте фоновую музыку. Если уж очень хочется, то пользователь должен это делать сам кнопкой вкл/выкл.

23. НЕ подкладывайте картинку под текст. Читать очень неудобно. Посмотрите на книги и хорошие журналы.

Скажете, что это всем известно?! А у меня каждый 3 заказчик просит или музыку на сайт повесить или логотип размножить по всему полю сайта.
Зарегистрируйтесь на Хабре, чтобы оставить комментарий

Публикации

Истории