Верстка макета

Serlutin · April 9, 2011

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

Ну я тоже с практической стороны.

В данном случае, если подключать стиль для всех IE, то нужно мучиться с хаками.

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

Однако, конечно, лучше использовать один css файл для всех IE, чем 3 или 4 разных. Хотя в этом варианте тоже есть свои преймущества.

Да, ты ошибаешься. Если «9 апреля» - идёт как заголовок статьи, то его можно и нужно выделять в заголовок, а если «9 апреля» идёт в качестве даты статьи и т.д, то для этих целей существует элемент <time> со своим атрибутом datetime и pubdate

Точно не уверен, но там дата обозначает не время добавления, а что произошло в этот день в компании.

Доктайп не важен. Вся инфа об авторе, сведения об авторских правах, ссылки на похожие документы и т.д., должны находится в Футере.

Да не, я не спорю. Я бы сам всё в одни блок бы вставил, однако и вариант, как у ТС тоже имеет право на жизнь. Ведь можно даже сейчас взять и эти два блока обернуть в <div id="footer">, но от этого ведь ничего не изменится. Совсем ничего.

novicheG · April 9, 2011

Ну как я говорил - в одном из своих постов про критику, - двусмысленное высказывание с очень тонким намеком

1.Что исправлено.

2. Логотип обычно - это ссылка, в которой есть ещё и титл.

- Да, упустил про него, сделал.

3. Серый фон у шапки можно было повесить на body смело, а правую картинку как фон на шапку. Лишние необоснованные элементы, это очень хреново.

- Согласен, сделал.

7. Сама новость
<h5>31.12.2002</h5>
<p class="news_bottom_line">To use flash and navi gate, fully customizab i syst add discussing andby topic oro alliscussing andy.</p>
Что за бред? Почему каждая новость не в своём блоке? Почему всё замешано в одной кастрюле? Каждая новость - это отдельный самодостаточный раздел.

- В принципе так и хотел делать. Переделал.

По остальным не отвеченным пунктам есть свое мнение.

2.Вопросы:

Бредкрамб на списках хорошо, но войны небудет если сделать так как сделал ТС.
скажи ка мне чем плохо "/" в бредкрамбе? Хотя это лучше спросить.. например у Veseloff.

- Чем плохо "/"? Картинками нужно или что?

С твоими замечаниями соглашусь только по поводу блока новостей и заголовков.
Да, <h1> там явно не к месту. Всё-таки в HTML 4 структуру выстраивать можно только с помощью заголовков. Сейчас же её выстроить нельзя.

- Если можно, скажите насчет заголовков, собственно не совсем понял этот момент?

class="menu"

- Чем class="menu" плохо?

<form class="search" action=""> - Всё же наверное нужно было её прибить абсолютом, а не зафлоачивать.

- Почему?

по остальным все ясно.

Это ничтожно мало для начала.

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

Edited April 9, 2011 by novicheG

cssview · April 9, 2011

2. Логотип обычно - это ссылка, в которой есть ещё и титл.

Ну и я свои пять копеек вставлю. ИМХО логотип на первой странице должен быть не ссылкой(что бы он не ссылался на самого себя), а уже на последующих ссылкой.

psywalker · April 9, 2011

Ну я тоже с практической стороны.
В данном случае, если подключать стиль для всех IE, то нужно мучиться с хаками.
Дальше больше. Возможно я опять ошибаюсь, но IE7-8 будут пытаться выполнить экспрешн даже если он с помощью хаков отгорожен от них.
Однако, конечно, лучше использовать один css файл для всех IE, чем 3 или 4 разных. Хотя в этом варианте тоже есть свои преймущества.

Если ты хороший специалист в своём амплуа, то никаких мучений ты испытывать не будешь, запомни. Один стиль для ИЕ нужен в любом случае, и префиксы для нужных версий. Даже если писать стили отдельно для ИЕ в общем файле.

Это раз, а во-вторых я ж говорю, что надо смотреть на вёрстку не как на статичную картинку.

Точно не уверен, но там дата обозначает не время добавления, а что произошло в этот день в компании.

Нет, в <time> заносится именно дата публикации.

Да не, я не спорю. Я бы сам всё в одни блок бы вставил, однако и вариант, как у ТС тоже имеет право на жизнь. Ведь можно даже сейчас взять и эти два блока обернуть в <div id="footer">, но от этого ведь ничего не изменится. Совсем ничего.

Измениться, ещё как измениться. Появиться лишний узел в документе, который ещё к тому же будет оторван от принадлежащего ему родителя. Это если говорить о семантике, а ещё есть такое понятие, как Логические блоки, так вот тут всё как раз с этим делом плохо.

cssview · April 9, 2011

Удалил

Edited April 9, 2011 by cssview

psywalker · April 9, 2011

Ну и я свои пять копеек вставлю. ИМХО логотип на первой странице должен быть не ссылкой(что бы он не ссылался на самого себя), а уже на последующих ссылкой.

Согласен, это мнение тоже имеет место быть.

Serlutin · April 9, 2011

Если можно, скажите насчет заголовков, собственно не совсем понял этот момент?

Да всё просто. Смотришь на заголовки и делишь их по степени важности. <h1> лучше всего использовать для названия всего сайта, либо для названия какой-либо важной статьи, если она одна на странице. (имхо)

psywalker · April 9, 2011

novicheG

Бредкрамб на списках хорошо, но войны небудет если сделать так как сделал ТС.
скажи ка мне чем плохо "/" в бредкрамбе? Хотя это лучше спросить.. например у Veseloff.
- Чем плохо "/"? Картинками нужно или что?

Нет, картинки не нужно. Сделай список, а чёрточки помести в LI

- Чем class="menu" плохо?

Неинформативно.

<form class="search" action=""> - Всё же наверное нужно было её прибить абсолютом, а не зафлоачивать.
- Почему?

Просто так вот может ругаться валидатор, да и вообще это признак хорошего тона.

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

А тебе никто ничего и не предъявлял) Я это к слову сказал, чтобы ты возможно вынес урок.

SelenIT · April 9, 2011

...
6. <h5>31.12.2002</h5> - что за ужас? Зачем тут заголовок. Сделай <span class="date">31.12.2002</span>, и будет намного лучше и понятнее.
7. Сама новость
<h5>31.12.2002</h5>
<p class="news_bottom_line">To use flash and navi gate, fully customizab i syst add discussing andby topic oro alliscussing andy.</p>
Что за бред? Почему каждая новость не в своём блоке? Почему всё замешано в одной кастрюле? Каждая новость - это отдельный самодостаточный раздел.
...
10. <form class="search" action=""> - Почему атрибут action пустой? Ставь хотя бы решётку.
...
13.
<div class="nav">
						<a href="#">Main page</a>/<a href="#">Products</a>/<span>Downloads</span>

					</div>
Это ужасно. Во-первых это навигация (хлебные крошки), а значит нужно делать списком, а во-вторых вот за такое между ссылками / обычно канделябром бьют по голове.
...
20.<div class="article_wrap_top"> - Вот этот блок сделан совершенно неправильно. Картинка <img alt="friends" src="img/article_img_friends.png" class="img_friends">, которая засоряет структуру, должна была быть фоном какого нибудь пустого span-a, а текст внутри блока <div class="article article1"> должен просто обтекать картинку слева, а не иметь левый отступ.
Убираем картинку и ппц, текст остаётся на месте. Грубая ошибка.
...
22. Много лишних элементов, заголовков и прочего. Необдуманно свёрстаны элементы, понатыкано ненужных обёрток и т.д.
...

Макс, по п.6-7 — это я посоветовал в другой теме. Блок новостей на этой странице вообще второстепенная вещь, одной кастрюли для него, имхо, вполне достаточно. Для HTML5-парсера на секции, заносящиеся в outline, он делится как раз заголовками (именно за этим они там). А в рамках HTML4 (по ТЗ предполагалось ограничиться им) лично я не вижу, как оборачивание каждой новости в отдельный пакетик добавит ей какой-либо семантики (особенно в отсутствие заголовка), только увеличит кол-во п. 22 . Разве что для оформительских целей, но по макету я и в этом не видел необходимости (тут каюсь, моя невнимательность — недоучел нижнюю черту под последней новостью).

Насчет обертки уже вижу, что я ошибался. Насчет прочего — буду благодарен за расширение кругозора и избавление от заблуждений.

П. 10 — по-моему, вполне легитимный вариант для отправки формы "самой себе". Ясно, что в боевом проекте там будет конкретный адрес скрипта, на мой взгляд, для верстки это не недостаток.

П. 13 — имхо, список к бредкрамбсам притянут за уши. Да, иерархия вроде как предлагает последовательность, но само название "строка навигации" говорит о его строковой природе. В HTML5, имхо, он вполне может быть <nav>-ом с обычной строкой ссылок внутри.

Вообще, имхо, хороший тест на семантику разметки — обычное отключение стилей в браузере. Если юзер читает, к примеру, на маленьком мобильнике:

Вы здесь:
1) Главная
2) Важный раздел
3) Интересный подраздел
4) Какая-то страница

имхо, вместо ожидаемой ясности первой реакцией будет растерянность "ну и где же именно я нахожусь среди этой кучи ссылок?". Тогда как с традиционной строкой, похожей на привычный файловый путь что со стилями, что без, своё местонахождение на конце цепочки будет очевидно в любом случае.

А уж вносить разделитель в <li>... Если выпендриваться, для него в тему было бы припахать :before/:after. Но, опять же, не вижу необходимости.

П. 20 — тоже прошу пояснить, чем пустой несемантичный спан засоряет структуру меньше, чем непустая слабосемантичная картинка?

Serlutin · April 9, 2011

Если ты хороший специалист в своём амплуа, то никаких мучений ты испытывать не будешь, запомни. Один стиль для ИЕ нужен в любом случае, и префиксы для нужных версий.

Да я же не спорю. Просто в данном конкретном примере отдельные стили для ie7-9 не нужны. Если они не нужны, то зачем заставлять их грузить лишний файлик.

П. 20 — тоже прошу пояснить, чем пустой несемантичный спан засоряет структуру меньше, чем непустая слабосемантичная картинка?

Просто там картинка относится чисто к дизайну. Поэтому если отключить стили в браузере, то картинка не будет сбивать с толку.

Посмотрел, как сейчас сделан блок новостей.

Я бы отказался от блока .news_body вообще, а фоновую картинку с линейкой повесил бы на .news_block.

psywalker · April 9, 2011

SelenIT

Макс, по п.6-7 — это я посоветовал в другой теме. Блок новостей на этой странице вообще второстепенная вещь, одной кастрюли для него, имхо, вполне достаточно. Для HTML5-парсера на секции, заносящиеся в outline, он делится как раз заголовками (именно за этим они там). А в рамках HTML4 (по ТЗ предполагалось ограничиться им) лично я не вижу, как оборачивание каждой новости в отдельный пакетик добавит ей какой-либо семантики (особенно в отсутствие заголовка), только увеличит кол-во п. 22 . Разве что для оформительских целей, но по макету я и в этом не видел необходимости (тут каюсь, моя невнимательность — недоучел нижнюю черту под последней новостью).
Насчет обертки уже вижу, что я ошибался. Насчет прочего — буду благодарен за расширение кругозора и избавление от заблуждений.

Да, тут она явно нужна. И даже дело не дело в самой общей кастрюле, а в том, что в последствии вот таким вот блоком будет легче управлять. Да и вообще на него его и фон привязан и т.д.

П. 10 — по-моему, вполне легитимный вариант для отправки формы "самой себе". Ясно, что в боевом проекте там будет конкретный адрес скрипта, на мой взгляд, для верстки это не недостаток.

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

П. 13 — имхо, список к бредкрамбсам притянут за уши. Да, иерархия вроде как предлагает последовательность, но само название "строка навигации" говорит о его строковой природе. В HTML5, имхо, он вполне может быть <nav>-ом с обычной строкой ссылок внутри.

Нет, а никто и не говорит о бредкрамбасе, он вообще там будет неверным.

О <nav>-е тоже речи идти не может, мы рассматриваем вёрстку с другим доктайпом.

А уж вносить разделитель в <li>... Если выпендриваться, для него в тему было бы припахать :before/:after. Но, опять же, не вижу необходимости.

А дело не в выпедрёже, а в том, что черта должна во-первых отображаться в ИЕ6-7, что сразу исключает :before/:after , а во-вторых она тоже должна менять свой размер, в зависимости от размера шрифта.

П. 20 — тоже прошу пояснить, чем пустой несемантичный спан засоряет структуру меньше, чем непустая слабосемантичная картинка?

Пустой спан, а лучше даже <i class="img"></i> во-первых в структуре не будет ненужного замещающего элемента, во-вторых <i class="img"></i> пусть даже не несёт в себе никакой семантики, но он так же и не делает код особо грязным, это такая некая маленькая пустышечка, которая вполне может выполнить свою задачу.

Да я же не спорю. Просто в данном конкретном примере отдельные стили для ie7-9 не нужны. Если они не нужны, то зачем заставлять их грузить лишний файлик.

Ты не понимаешь, о чём я тебе говорю. Я говорю не про конкретную ситуацию. Я ж тебе говорю, что нужно смотреть в будущее. Завтра ты допустим захочешь вставить новый блок на страницу и тебе понадобится лезть в стиле, чтобы сделать ему классный отступ и полузелёным, и когда тебе понадобятся стили для ИЕ6-7, а у тебя их НЕ будет, то упс... и твой блок уже имеет весомые отличия и дёргается в ИЕ7

Надо думать не только о конкретной статической картинке, а ещё и о завтрашнем дне.

SelenIT · April 9, 2011

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

Я тоже сталкивался. Но, во-первых, ссылка и форма — разные вещи, во-вторых, понятно, что это "рыба", в рабочем сайте так не останется. Хотя согласен, в HTML5 невалидно (но в XHTML1/HTML4, про которые речь — нормально).

Нет, а никто и не говорит о бредкрамбасе, он вообще там будет неверным.
О <nav>-е тоже речи идти не может, мы рассматриваем вёрстку с другим доктайпом.

Про nav понятно, а про остальное — можно пояснить? Я приводил доводы против того, чтоб делать "хлебные крошки" списком. Если я в упор не вижу чего-то важного — прошу подсказки, чего именно.

черта должна во-первых отображаться в ИЕ6-7, что сразу исключает :before/:after , а во-вторых она тоже должна менять свой размер, в зависимости от размера шрифта.

В случае обычной строки со ссылками оба требования выполняются автоматом

. Но, если гнаться за абстрактным совершенством, :before/:after легко эмулируются экспрешнами. А что не так у них с масштабированием?

Просто там картинка относится чисто к дизайну. Поэтому если отключить стили в браузере, то картинка не будет сбивать с толку.

во-первых в структуре не будет ненужного замещающего элемента, во-вторых <i class="img"></i> пусть даже не несёт в себе никакой семантики, но он так же и не делает код особо грязным, это такая некая маленькая пустышечка

Меня несколько сбило с толку следующее:

текст внутри блока <div class="article article1"> должен просто обтекать картинку слева, а не иметь левый отступ.
Убираем картинку и ппц, текст остаётся на месте. Грубая ошибка.

Как рассуждаю я: если картинка не является частью содержания, чисто декоративная, то зачем тексту ее обтекать — пусть себе занимает место под отступом в качестве фона самого контейнера текста, и не надо вообще дополнительных блоков. Если же ее наличие/отсутствие как-то сказывается на тексте — волей-неволей приходится признать ее частью контента. И, поскольку отсутствовать картинка может по разным причинам (банально недогрузилась, выключены в браузере и т.п.), то самое простое средство обеспечить сжатие/растяжение текста в зависимости от этого — именно <img> с float и без указания размеров (с искусственной пустышкой возможна ситуация, когда картинки нет, а отступ есть — так за что боролись?). Кроме того, фоновые картинки не печатаются, а это как бы сплеш-страница, на которой графика — часть фирменного стиля. В общем, с моей точки зрения под каким углом не посмотреть, отдельная пустышка с картинкой оказывается ни к селу (правильному поведению контента в зависимости от нее), ни к городу (чистоте разметки)... хотя, возможно, это проблема моей точки зрения

psywalker · April 9, 2011

SelenIT

Я тоже сталкивался. Но, во-первых, ссылка и форма — разные вещи, во-вторых, понятно, что это "рыба", в рабочем сайте так не останется. Хотя согласен, в HTML5 невалидно (но в XHTML1/HTML4, про которые речь — нормально).

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

Про nav понятно, а про остальное — можно пояснить? Я приводил доводы против того, чтоб делать "хлебные крошки" списком. Если я в упор не вижу чего-то важного — прошу подсказки, чего именно.

Да, доводы вполне весомые и идея имеет место быть явно. Но каков % юзеров отключающих CSS?

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

В случае обычной строки со ссылками оба требования выполняются автоматом . Но, если гнаться за абстрактным совершенством, :before/:after легко эмулируются экспрешнами. А что не так у них с масштабированием?

А вот тут уже дело не в масштабировании, а в самих экспрешаннах, это лишняя, и не малая нагрузка для ИЕ6-7, так как перерасчёт в них идёт при каждом шевелении экрана.

текст внутри блока <div class="article article1"> должен просто обтекать картинку слева, а не иметь левый отступ.
Убираем картинку и ппц, текст остаётся на месте. Грубая ошибка.

Тут дело в том, что статьи или какой то блок инфы о Компании вполне может обойтись одной статьёй (текстом), без картинки, т.е. я учитываю этот вариант в будущем, при смене или заполнении контента новыми материалами.

Если картинка уберётся, то текст в таком случае должен заполнить её свободное место, но у ТС этого не происходит, в связи с чем я посчитал этот трюк БЕЗ оглядки на будущее.

Я бы сделал так: Картинку бы я бы зафлоатил, как щас, а текст поместил бы в блок с overflow: hidden;

SelenIT · April 9, 2011

psywalker, спасибо за развернутый ответ!

единственный аргумент, из-за которого можно отказаться от списка в данной ситуации

Честно говоря, я пока не увидел достаточных аргументов за список в данной ситуации (кроме неких отвлеченных абстракций). С точки зрения т.н. "утиной типизации" (aka здравого смысла), списком должно быть нечто, что выглядит как список и ведет себя как список — но строка навигации с разделителями явно под этот критерий не подходит...

дело ... в самих экспрешаннах, это лишняя, и не малая нагрузка для ИЕ6-7, так как перерасчёт в них идёт при каждом шевелении экрана.

В принципе, для добавления палочек достаточно "одноразовых" экспрешнов, напрягающих браузер лишь при загрузке. Но я согласен, что экспрешны в этой задаче не нужны — как и, имхо, списки, порождающие новую семантическую дилемму ("куда девать палки") и необходимость либо нетривиальных финтов, либо досадных компромиссов для ее решения. Так что экспрешны я упомянул скорее, чтоб довести пример до абсурда, прошу прощения за такой троллинговый прием

Если картинка уберётся, то текст в таком случае должен заполнить её свободное место

Можно посмотреть и так, что текст сделан коротким для удобства чтения (слишком длинные строки ломают глаза), а как раз картинка затыкает собой получившуюся дырку, заодно визуально уравновешивая композицию . Я не вижу нужды тексту расширяться. И картинку я бы всё-таки поставил фоном на контейнер. Но если требование расширения текста критично, можно описать фоновую картинку и правый отступ в одном классе .decorated-with-friends-picture, и в зависимости от нужды в картинке или ее отсутствия добавлять/убирать контейнеру этот класс. А если владелец сайта захочет поставить другую картинку, другой ширины — сделать для нее другой аналогичный класс с соотв. параметрами. И никакой добавочной разметки вообще!

Но это в идеальном мире, с идеальной CMS, заточенной спецом под этот сайт. В реальном мире, где странички правятся WYSIWYGами, твой вариант, пожалуй, лучший. Хотя секретарша, которую заставят менять картинку, скорее всего, всё равно сделает просто и железно — таблицей...

swetlana · April 9, 2011

Хотя секретарша, которую заставят менять картинку, скорее всего, всё равно сделает просто и железно — таблицей...

ага, а потом придёт к нам на форум спрашивать, почему эта таблица выехала куда ей не положено

В лучшем случае.

novicheG · April 10, 2011

а фоновую картинку с линейкой повесил бы на .news_block.

На .news_block ее вешать нельзя - их высота динамически меняется от контента и на границах будут несостыковки.

Edited April 10, 2011 by novicheG

psywalker · April 10, 2011

SelenIT Спс дружище за интересный диалог! Чувствую скоро родится истина.

Честно говоря, я пока не увидел достаточных аргументов за список в данной ситуации (кроме неких отвлеченных абстракций). С точки зрения т.н. "утиной типизации" (aka здравого смысла), списком должно быть нечто, что выглядит как список и ведет себя как список — но строка навигации с разделителями явно под этот критерий не подходит...

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

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

В принципе, для добавления палочек достаточно "одноразовых" экспрешнов, напрягающих браузер лишь при загрузке. Но я согласен, что экспрешны в этой задаче не нужны — как и, имхо, списки, порождающие новую семантическую дилемму ("куда девать палки") и необходимость либо нетривиальных финтов, либо досадных компромиссов для ее решения. Так что экспрешны я упомянул скорее, чтоб довести пример до абсурда, прошу прощения за такой троллинговый прием

Да, я тоже считаю, что экспрешанны тут ни к чему, потому что палки действительно должны быть в структуре, там им и место). Плюс к этому сами экспрешаны ведь по сути должны сильно напрягать браузер, я думал так до этого момента, пока не услышал от тебя про "одноразовые" экспрешаны. Дружище, а ты не мог бы объяснить поподробнее (и показать два разных экпрешана), чем отличаются "НЕ одноразовый" экспрешан от "одноразового"?

Но это в идеальном мире, с идеальной CMS, заточенной спецом под этот сайт. В реальном мире, где странички правятся WYSIWYGами, твой вариант, пожалуй, лучший.

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

Хотя секретарша, которую заставят менять картинку, скорее всего, всё равно сделает просто и железно — таблицей.

Пусть делает хоть огромными китайскими плитами, overflow: hidden-у пофиг, что резать

SelenIT · April 10, 2011

Дружище, а ты не мог бы объяснить поподробнее (и показать два разных экпрешана), чем отличаются "НЕ одноразовый" экспрешан от "одноразового"?

Вот статья, куда я каждый раз сам подглядываю за этими примерами: http://cssing.org.ua/2007/12/06/expression-optimization/

Еще красивый (хоть и уже неактуальный) пример эмуляции :before/:after был здесь.

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

Просто тут я рассуждал не как верстальщик, отдающий работу "в пространство", а как кодер, прикручивающий верстку к собственному движку. И тут мне проще добавить в админку поле "картинка для украшения главной страницы", а в код страницы — что-нибудь типа


<?php
$image = $page->decorativeImage;
$size = getImageSize($image);
if ($size) echo ' style="background-image:url(/images/'.$image.');padding-right:'.$size[0].'px"';
?>

а визивига секретарше вообще не давать . Но это уже глубоко уходящая в оффтоп философия...

psywalker · April 10, 2011

Вот статья, куда я каждый раз сам подглядываю за этими примерами: http://cssing.org.ua/2007/12/06/expression-optimization/
Еще красивый (хоть и уже неактуальный) пример эмуляции :before/:after был здесь.

Спасибо за интересные материалы, будет время, обязательно постараюсь разобраться.

Просто тут я рассуждал не как верстальщик, отдающий работу "в пространство", а как кодер, прикручивающий верстку к собственному движку. И тут мне проще добавить в админку поле "картинка для украшения главной страницы", а в код страницы — что-нибудь типа
<?php
$image = $page->decorativeImage;
$size = getImageSize($image);
if ($size) echo ' style="background-image:url(/images/'.$image.');padding-right:'.$size[0].'px"';
?>
а визивига секретарше вообще не давать . Но это уже глубоко уходящая в оффтоп философия...

Temiks · April 11, 2011

4. <div class="left"> - что за left, я не знаю, кто это. Классы нужно задавать осмысленные.

ну а что если назвать к примеру leftcol? так же и rightcol? это осмысленно?

Edited April 11, 2011 by Temiks

psywalker · April 11, 2011

ну а что если назвать к примеру leftcol? так же и rightcol? это осмысленно?

Тоже не ахти, но по крайней мере лучше. А вообще в правильном мире левый и правые боковые колонки называют aside1, aside2, т.е это общеизвестные название, благодаря которым сразу становиться понятно, о чём речь.

Temiks · April 11, 2011

psywalker ясно, спасибо

psywalker · April 11, 2011

psywalker ясно, спасибо

Не за что.

novicheG · April 12, 2011

колонки называют aside1, aside2,

Все это и так ясно, почему и зачем. По настоящему целесообразно и оправдано, если делается, к примеру, универсальный и гибкий шаблон на продажу, в котором расположение сайдбара меняется в админке в два клика (как в некоторых платных шаблонах), но для этого и дизайн должен быть правильно продуман. В остальном - как хочу, как удобно так делаю, согласился если бы это был какой-нибудь "cmsitelft13", переименовать "left" в "right" или "left" в "aside" каких-то неимоверных усилий вроде бы не состовляет, даже если уж на то пошло, если присмотреться внимательнее к макету изменить расположение колонок нужно не только верстку менять но и диз некоторых частей в данном случае.

Edited April 12, 2011 by novicheG

psywalker · April 12, 2011

Все это и так ясно, почему и зачем. По настоящему целесообразно и оправдано, если делается, к примеру, универсальный и гибкий шаблон на продажу, в котором расположение сайдбара меняется в админке в два клика (как в некоторых платных шаблонах), но для этого и дизайн должен быть правильно продуман. В остальном - как хочу, как удобно так делаю, согласился если бы это был какой-нибудь "cmsitelft13", переименовать "left" в "right" или "left" в "aside" каких-то неимоверных усилий вроде бы не состовляет, даже если уж на то пошло, если присмотреться внимательнее к макету изменить расположение колонок нужно не только верстку менять но и диз некоторых частей в данном случае.

А дело не в обмене колонок или ещё чего то, а дело в самих неинформативных названиях и так делать неправильно в любых, даже самых статических макетах.

left - это свободно может быть левая картинка в футере, левое меню в шапке, левый рисунок на главном фоне, чуешь суть?

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

Sign In

Верстка макета

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Обсуждения

Important Information