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

Сделал за последнее время:

Добавил в портфель около 48-и новых работ:
Сделал очень много всяких штук при работе над поддержкой сайтов.
Как бы это теперь в портфель запихнуть?

Заказать мне работу

24.05

5 советов верстальщику

Комментарии (17) CSS, HTML

Поддержу хорошую игрушку организованную Никитой Селецким и получившую поддержку от всех именитых css-разработчиков.

Перед началом работы смоделируйте каркас работ в голове. Настоящая работа верстальщика происходит ДО того как открывается редактор. Все остальное лишь инструмент.
Не злоупотребляйте <div>. Чем меньше вы сможете использовать тегов тем лучше. Впрочем всегда есть исключения (Статья на эту тему).
Не зацикливайтесь на одних и тех же методах. Возможно именно сейчас появился более совершенный способ реализации png, закругленных уголков или чего еще. Не нашли в рунете — придумайте сами.
Каждый дизайнер обладает своим собственным стилем. Верстальщик тоже, просто это не так заметно. Поэтому не старайтесь копировать стиль верстки подчистую. Я например не разделяю блоки кода комментариями, потому что использую структурированный стиль написания и интуитивные id. Мне так удобно, не не факт, что это будет удобно вам. Используйте, то что вам подходит, а не то что СЧИТАЕТСЯ удобным.
Не забывайте про то что браузеров много. Отмазка, “у меня нет этого браузера” — смешна.

Эстафету передам Евгению, Дмитрию и Владимиру

Метки:CSS, HTML

Также интересно будет почитать про:
Семантика или как же лучше: Допустим мы имеем такую картинку Распишем идеальную семантическую раскладку: Вы зашли как admin ...
Структурируем HTML. Версия Покровского.: Про чистый код я уже рассказывал. Теперь о красоте будем говорить. — Первое правило - это соблюдение иерархии отступов. Для этого, диво как хорош notepad++ Вот, например, как выглядит хорошо структированный...
Курсор, редактор и удобство.: У большинства текстовых редакторов при прокрутке страницы клавиатурой, курсор достигает нижней границы окна. Это не удобно. Во-первых, я пролистываю страницу очень быстро, и не имея возможности видеть нижние строки, часто их...
О как!: Шаблон отверстан дивами, необходимо переделать на таблици, с целью получения возможности для редактирования в dreamweaver...© А Павел говорит Microsoft виноват... ...
Некоторые моменты эмуляции min-width и max-width для IE 6: Момент один Это самый распространенный и рабочий вариант: #block{ width:expression((document.documentElement.clientWidth< =1000)?'1000px':'auto'); } Аналогично эмулируется и max-width. Если же вы используете метод document.body вместо documentElement, то следите за тем чтобы у этого самого...

1
Dimox (25.05.2008) #
К сожалению, мой мозг не может осилить (придумать) одновременно 5 советов, поэтому я пока что в пролете

Не забывайте про то что браузеров много. Отмазка, “у меня нет этого браузера” — смешна.

Прикольно, если услышишь такое от верстальщика =)
2
Юра (27.05.2008) #
Спасибо за дельные советы!
p.s. добавляю Ваш блог в гуглридер и в последних 10 постах что то с кодировками…
сплошные вопросительные знаки
3
Волотко Дмитрий (27.05.2008) #
По поводу не совсем заметного стиля для верстальщика, я не совсем согласен. Например, я часто первым делом лезу в стили - там порою совершенно разные стили, направления и движения
PS - пятый пункт улыбнул.
Правда у меня Lynx’a всё-таки нет. Решил его позабыть года два назад.
4
Vladimir (27.05.2008) #
Прикольно, если услышишь такое от верстальщика =)

Разве это редкость? Тем более, что есть сервисы типа browsershots.org, с помощью которых можно протестировать дизайн в самых различных браузерах… Потом есть VMware, VirtualBox и прочие виртуальные машины…

Максим, эстафету принимаю К вечеру что-нибудь придумаю. Со всем, что ты сказал, полностью согласен.
5
Максим Покровский (27.05.2008) #
Тем более, что есть сервисы типа browsershots.org, с помощью которых можно протестировать дизайн в самых различных браузерах

Ох, я пробовал пользоваться. Там ждать не меньше часа. И это еще если повезет.

К сожалению, мой мозг не может осилить (придумать) одновременно 5 советов, поэтому я пока что в пролете

Я тоже не сразу написал этот пост. Специально умные мысли на стикеры записывал.
6
Vladimir (27.05.2008) #
Ох, я пробовал пользоваться. Там ждать не меньше часа. И это еще если повезет.

Я вижу два пути: развести заказчика на 15 евро (или сколько оно там стоит) на рользу дела или выбирать только те браузеры, которые действительно нужны.
Например, FireFox 2.0, Netscape 9, SeaMonkey 1.1, Flock 1.0, K-Meleon 1.1, Camino 1.5.5, Epiphany 2.16 и Skipstone 1.0.0 - суть один и тот же браузер, ибо используется один и тот же движок (Gecko 1.8.1). FireFox одинаковой версии отображает страницу одинаково что в Выне, что в Лине, что на Маке. Аналогично со ФриБСДшными браузерами… и с Сафари. Тем более, что те, кто в Винде, могут без проблем поставить связку IE6/7, FF, Opera и Safari. А в browsershots смотреть всякую экзотику (Konqueror, IE8, старые Геко).
7
Максим Покровский (27.05.2008) #
Я три или пять браузеров выбирал. Ждать час. (правда все половина была под другой Осью)
8
Пять советов верстальщику | Ars Longa, Vita Brevis (28.05.2008) #
[...] эстафету, организованную Никитой Селецким, от Максима Покровского, добавляю свои пять копеек в копилку советов по [...]
9
Артемий (03.06.2008) #
[...] эстафету, организованную Никитой Селецким, от Максима Покровского, добавляю свои пять копеек в копилку советов по [...]
10
jeny79 (29.06.2008) #
Отличный пост – слов нет. Спасибо.
11
Kulikov (28.08.2008) #
Отлично написано! Буду много думать…
12
Kfid (10.09.2008) #
Отлично!!! Вместо книги на ночь.
13
BetonUS (14.02.2009) #
Информативно, четко написал. Пожалуй подпишусь на канал.
14
X-pert (15.02.2009) #
Позновательно, но вроде уже находил подобное в нете. Как подписаться на Вашу rss ленту?
15
Stroitel (16.02.2009) #
Хм, довольно интересно. Еще зайду на ресурс когда новая инфа появится.
16
Opty (02.03.2009) #
Интуитивные ID кататя, если они действительно из серии “leftBlueCloud23″, а не “left”. В противном случае, елси код скажем потом идет в серьезный портал, то программисты могут все попортить (хотя это еще вопрос кто в данном случае портит). Тоже относится и к названиям классов в CSS
17
Zidgicatoclat (18.03.2009) #
Спасибо, не ожидал такого ну просто никак

Оставить комментарий

Имя (обязательно)

E-mail (не публикуется) (обязательно)

Сайт

Вы можете использовать простые теги форматирования HTML (вроде <a>, <ul> and others). Чтобы вставить пример код, используйте
<code lang="php">$a = "hello";</code> (поддерживаемые языки: ruby, php, yaml, html, css, csharp, javascript). Также Вы можете использовать <code>$a = "hello";</code>, синтаксис не будет подсвечен. Если вы не хотите использовать тег <code>, замените символ < на <