Готовые шаблоны верстки котики, я вот подумал, что нужно сделать командам простейший образец верстки с кодом и объяснить, что с ним делать, чтобы, если кто-то не найдет верстальщика, не страдал.
итак, как это выглядит в готовом виде (зелененькое на скринах - фон соо, в котором проверял верстку): смотреть
картинки: читать дальшеадрес, который идет после «img src="» - адрес картинки. первый адрес - (внутри первого моря) - заглушка второй - картинка с надписью "фандом бла-бла", третий - (внутри моря, скрывающего текст) - картинка "читать дальше". четвертый (перед закрывающим морем) - разделитель-полосочка между текстами. если она вам не нужна, уберите вот эту всю строчку -
- или, если нужна, не забудьте поставить ее с нового абзаца перед каждым морем, закрывающим текст.
и пятый адрес - это картинка внизу.
Все картинки нужно заменить на свои, само собой, хотя бы простейшего вида, как я сейчас за полминуты набросал.
Можно заменить цвета. читать дальшеЦвета идут после # в верстке. То, что есть в готовом коде: #f1f1f1 - основной фон (светлее) #e7e7e7 - внутренний фон (темнее). Выбрать себе цвета можно, например, здесь.
само собой, в комментариях к этой записи будет много помарок, исправлений и тому подобного, может - кто-то предложит свои варианты или объяснит непонятное, так что вэлком!)
читать дальшеНекоторые любят хедер не во всю ширину. Если задать те же параметры, что у блока-родителя, хедер развезёт на всю ширину. А если 500px заменить на 550px, например, то поля станут меньше. Подтянуть наверх можно простым удалением переносов строк. Нижнее поле уже принадлежит не хедеру, а блоку с записью и составляет 30px (по 15px марджина и паддинга).
всякие мелочи будущим верстальщикам по шаблону нужны? Ну там, например, чтобы сделать перекрёстные ссылки между постами до того, как их выкладываешь, достаточно открыть посты в черновиках на "Предпросмотр" — отбрасыванием ?draft получаются будущие ссылки на ещё неопубликованные посты. Или это уже лишнее
По поводу самой вёрстки, учитывая сужение центральной полосы в дневниках с неоплаченым сss/ отключением рекламы, всем картинкам бы неплохо прописывать резиновость, наверное, включая большие по ширине кнопки, разделители и артвыкладку / фото в челлендже. На время ФБ, понятно, орги оплачивают, но что там дальше будет — бабушка надвое сказала.
где ХХХ — ширина картинки в пикселах (здесь это число задаёт максимальную ширину, на которую картинка может быть растянута, чтобы её не развезло по всему экрану с потерей качества изображения, если вдруг у пользователя монитор с большим разрешением, а у самого поста максимальная ширина задана больше, чем у картинки)