Алгоритм вёрстки

[YaTvojBog]

Прочитал всю тему, внесу свои 5 копеек.
Верстаю на div-ах в xhtml strict.
Последовательность такая:
1. Втыкаю над psd как его лучше всего разделить на блоки (header sidebar navigation content)
2. Открываю dw и там пишу html код. Основные блоки у меня идут с id всем остальным даю класс.
3. В том же dw создаю css который поделен на несколько частей: RESET SCELET BLOCK OTHERS. Reset нужен для сброса стилей к нужным мне значениям. Scelet нужен для описания как раз основных блоков которым дан id. Block описывает стили конкретных блоков. Others нужен для свойств типа .fl {float:left}. Попутно из psd вырезаю картинки, и использую их в стилях.
Я использую конкретные правила, то есть такого: h1 { лалала } вы не найдете...
Я прикладываю пример своей работы. index.zip и style.zip
==============================================================
Как раз сейчас мне нужно сверстать дизайн, но мне нужно будет отойти от конкретных стилей, и обратиться к общим. В принципе я понимаю плюсы, и теорию, но вот практики нет. Сейчас буду наращивать практику. Как раз за этим и пошел в интернет посмотреть как люди делают, ну и нашел эту тему, хотя нужного в ней совсем мало
==============================================================
Приложу сюда еще ссылки которые мне помогли встать на путь истинный, перечитывал их несколько раз, чего и Вам советую:

Для просмотра скрытого содержимого вы должны войти или зарегистрироваться.

 

[RegEditor]

1. Смотрю макет, желательно PSD, в голове примерно разрезаю на таблицы
2. Сверху вниз и слева направо нарезаю таблички и сразу верстаю, т.е. сайт сначала появляется сверху слева, а лишь в конце - справа внизу. Забиваю тексты заглушками.
3. Добавляю зону администрирования, базу данных, движок сайта
Добавлю, что верстаю я как правило с нуля, без WYSIWYG-редакторов, на основе своих же ранее написанных скриптов. HTML исключительно чистый.

 

[KyaH]

Вот довольно неплохой урок по верстке из psd-макета:
Для просмотра ссылки Войди или Зарегистрируйся

А это первая часть урока, в котором описывается как делать макет страницы в Photoshop'е, может, тоже кому понадобится:
Для просмотра ссылки Войди или Зарегистрируйся

 

[Hitchsd]

Вот довольно неплохой урок по верстке из psd-макета:
Для просмотра ссылки Войди или Зарегистрируйся
А это первая часть урока, в котором описывается как делать макет страницы в Photoshop'е, может, тоже кому понадобится:
Для просмотра ссылки Войди или Зарегистрируйся

И снова попов )

 

[Kub]

Не устраивает Попов, вот есть книга по вёрстке хорошая.
Мастерская CSS Профессиональное применение

Название: Мастерская CSS Профессиональное применение
Автор: Энди Бадд
Год: 2007
Страниц: 257
Формат: PDF
Язык: русски
Книга посвящена современным технологиям Web-дизайна на основе каскадных таблиц стилей (CSS). Рассматриваются такие темы, как верстка на основе изменяемой и фиксированной ширины контейнеров; типы селекторов; абсолютное и относительное позиционирование; использование плавающих элементов; стилизация гиперссылок, форм, списков и панелей навигации; позиционирование фоновых изображений. Кроме того, обсуждаются вопросы применения фильтров и трюков для нивелирования на Web-страницах ошибок браузеров. Много внимания уделяется концепциям чистоты разметки и надежности кода. Авторы показывают, что эстетически привлекательным должен быть не только внешний вид Web-страницы, но и ее код, что значительно облегчает поддержку и модификацию страницы как самим разработчиком, так и другими дизайнерами.

Для просмотра скрытого содержимого вы должны войти или зарегистрироваться.

 

[PavelDest]

Автор: Энди Бадд
Год: 2007
Книга посвящена современным технологиям Web-дизайна на основе каскадных таблиц стилей (CSS).

ну не могу я не как понять как так может быть... это как в магазине продают булочки недельной давность.. .

 

[Phrack]

тоже почитал, узнал несколько интересных моментов.
Тоже верстаю как и бог в стрикте на дивах.
В качестве ide aptana (бесплатная)
по верстке вот есть интересное и полезное (сам этого придерживаюсь)

Для просмотра скрытого содержимого вы должны войти или зарегистрироваться.

очень помогает в последующей доработке

 

[asur]

верстка в убунте?

Господа здравствуйте! Перешел на убунту - не подскажете какой прогой удобней верстать сайты, в часности -Bluefish кто пользовался?

 

[Phrack]

Господа здравствуйте! Перешел на убунту - не подскажете какой прогой удобней верстать сайты, в часности -Bluefish кто пользовался?

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

 

[hongkildong]

Notepad++ с приблудой Zen Coding - вообще песня!
Для просмотра ссылки Войди или Зарегистрируйся