Забыл дописать, что иллюстрациюна главной пока не делали, так как еще нет рендера домов.
Через месяц тольо, а мнения хотел сейчас услышать.
Так что в какой-то мере это эскиз, но с другой стороны и нет :)
"Дом повышенного класса" звучит как-то странно.
не нравится затайленый рваный край (на последнем скрине, например), паттерн "порваности" очень явно прослеживается.
Нравится. Единственное но - уже Mysorshik сказал про "огрызок" в конце меню, ну и мне кажется чуток меньше кегль у меню должен быть, либо по высоте меню больше чуток должно быть, имхо конечно же =)
Со шрифтами полная Ж очень стрёмно смотрятся, особенно в меню
Шрифт кстати тут один =)
❞
Нравится. Единственное но - уже Mysorshik сказал про "огрызок" в конце меню, ну и мне кажется чуток меньше кегль у меню должен быть, либо по высоте меню больше чуток должно быть, имхо конечно же =)
В макете без огрызка получилось, но в последний момент нужно было текстом заверстать всё,
а тут в этом дизайне это не закладывал, пришлось так :(
а тут в этом дизайне это не закладывал, пришлось так :(
Дайте по жопе верстальщику - это легко исправить
.класс_элемента_меню:last-child { border-right: none !important; }
и увеличить padding всех элементов меню на 1-2 пикселя и огрызка заметно не будет
В таком случае сложнее: на аналогичном проекте делали высчитывание ширины с помощью JS и padding в зависимости от этого, заморочки зато смотрится до сих пор идеально в трёх языковых версиях сайта вне зависимости от текста меню.
Ну вот и решили не заморачиваться с этим, так как очень сложный яваскрипт на подсветку домов, куча всего подгружается.
Ради пендика одного - не стоит усилий, заметно это только дизайнерам.
Я доработаю проект, выложу посмотреть потом.
Про вёрстку доставили комменты. Ну можно не только JS-ом, можно и средствами PHP посчитать кол-во символов, умножить на условную ширину одного, высчитать среднюю ширину пункта меню, последнему пункту назначить сумму всех за минусом остатка и прописать инлайновским стилем. Извращаться, так по-полной.
Но если серьёзно, резиновое меню делается двумя хорошими способами: display:inline-block или display:table. Бордер у пунктов делается левый, а для первого .класс_элемента_меню:first-child {border-left: none;}. Псевдокласс first-child поддерживается с IE7+. !important используют тогда, когда не знают про существование css-специфичности, в своей практике верстака не использую.
Про вёрстку доставили комменты. Ну можно не только JS-ом, можно и средствами PHP посчитать кол-во символов, умножить на условную ширину одного, высчитать среднюю ширину пункта меню, последнему пункту назначить сумму всех за минусом остатка и прописать инлайновским стилем. Извращаться, так по-полной.
Но если серьёзно, резиновое меню делается двумя хорошими способами: display:inline-block или display:table. Бордер у пунктов делается левый, а для первого .класс_элемента_меню:first-child {border-left: none;}. Псевдокласс first-child поддерживается с IE7+. !important используют тогда, когда не знают про существование css-специфичности, в своей практике верстака не использую.
Повторюсь это невозможно.
Этот шрифт по разному отображается в ие и хроме, я не говорю уже про эпл-устройства. Что даст кол-во символов?
А если вместо символа I будет Ы ?
Если сложное выделение и подсветка, сделать резину невозможно, только с костящкой слева или гемором с явой
(но у нас будет и так 2 метра дизайн весить + ява на подсветку ген-плана + подгрузка планировок + в разработке иллюстрация моя еще будет весить кучу).
Короче нереально это, мне кажется
Алексей, про подсчёт символов я специально сперва написал как про изврат. А ниже обычное решение плоским списком с двумя вариантами: эмуляция таблицы или инлайн-блоков с выравниванием по-ширине. Оба решения рабочие.
А с подсчётом символов хоть и нерациональное решение (задача то тривиально CSS решается), но, кстати, сработало бы. Подробнее: тут важно пропорциональное соотношение длин пунктов меню. Оно зависит от количества символов. Неважно каким шрифтом написано и в каком браузере отрендерено. Имеем грубо говоря три пункта меню с длинами 25, 60 и 15% и фиксированную ширину всего меню в пикселях. Перевели ширину в пиксели, округлили до целых, для последнего пункта прибавили/отняли разницу длин всех пунктов кроме последнего и общей ширины. Вписали инлайновскими стилями. Всё на стадии генерации меню средствами php делается. :) Просто на JS как-то не поджедайски будет.
Про разную ширину символов тоже можно заморочиться, раз уж извращаемся: написать функцию сопоставления групп символов к условным коэфициентам «длинн». А если ещё и кёрниг отдельных пар учитывать… в общем нет предела глупостям.
Вот резиновые меню без js:
http://www.xiper.net/examples/html-and-css-tricks/navigation/rubber-block-menu3.html
Добавлю: в конкретном вашем примере со скрина самый быстрый фикс :увеличить меню в ширину на размер этого огрызка, поместить в контейнер правильной ширины и назначить ему overflow:hidden
Да просто могли бы уменьшить один пункт или увеличить один пункт. В итоге даже при резине всё растянулось очень сильно.
Короче такие варианты всегда спорные, мне кажется.
А таблицей не совсем выходило, пробовали. У меня в зависимости от выбранного пункта, из-за вдавливания меняется и левый и правый блок 6)
Ну хз. Я сам дизайнер посредственный, верстальщик/программист. Сложностей не вижу. Обидно, что из-за такой мелочи портицо впечатление о хорошем проекте. :(
Комментарии пользователей
красиво очень) но тень от меню надо по мягче,мне кажется, ибо ее на главной нет ;)
Забыл дописать, что иллюстрациюна главной пока не делали, так как еще нет рендера домов. Через месяц тольо, а мнения хотел сейчас услышать. Так что в какой-то мере это эскиз, но с другой стороны и нет :)
а что говорит верстальщик ?? :)
Копилка прикольная )
Огрызок после контактов зачем же оставил : (
Приятно местами, но как-то зажато немного и фотка уж очень избитая на главной. Графическая часть отлична, но вот как сайт в целом не цепляет почему-то
Со шрифтами полная Ж очень стрёмно смотрятся, особенно в меню
"Дом повышенного класса" звучит как-то странно. не нравится затайленый рваный край (на последнем скрине, например), паттерн "порваности" очень явно прослеживается.
Классно, качественного, 5. Но того крутого стиля который был раньше уже давно не видно
Нравится. Единственное но - уже Mysorshik сказал про "огрызок" в конце меню, ну и мне кажется чуток меньше кегль у меню должен быть, либо по высоте меню больше чуток должно быть, имхо конечно же =)
А если заменится одно слово?
Ну вот и решили не заморачиваться с этим, так как очень сложный яваскрипт на подсветку домов, куча всего подгружается. Ради пендика одного - не стоит усилий, заметно это только дизайнерам. Я доработаю проект, выложу посмотреть потом.
+5 генплан строительства порадовал
Про вёрстку доставили комменты. Ну можно не только JS-ом, можно и средствами PHP посчитать кол-во символов, умножить на условную ширину одного, высчитать среднюю ширину пункта меню, последнему пункту назначить сумму всех за минусом остатка и прописать инлайновским стилем. Извращаться, так по-полной. Но если серьёзно, резиновое меню делается двумя хорошими способами: display:inline-block или display:table. Бордер у пунктов делается левый, а для первого .класс_элемента_меню:first-child {border-left: none;}. Псевдокласс first-child поддерживается с IE7+. !important используют тогда, когда не знают про существование css-специфичности, в своей практике верстака не использую.
Алексей, про подсчёт символов я специально сперва написал как про изврат. А ниже обычное решение плоским списком с двумя вариантами: эмуляция таблицы или инлайн-блоков с выравниванием по-ширине. Оба решения рабочие. А с подсчётом символов хоть и нерациональное решение (задача то тривиально CSS решается), но, кстати, сработало бы. Подробнее: тут важно пропорциональное соотношение длин пунктов меню. Оно зависит от количества символов. Неважно каким шрифтом написано и в каком браузере отрендерено. Имеем грубо говоря три пункта меню с длинами 25, 60 и 15% и фиксированную ширину всего меню в пикселях. Перевели ширину в пиксели, округлили до целых, для последнего пункта прибавили/отняли разницу длин всех пунктов кроме последнего и общей ширины. Вписали инлайновскими стилями. Всё на стадии генерации меню средствами php делается. :) Просто на JS как-то не поджедайски будет. Про разную ширину символов тоже можно заморочиться, раз уж извращаемся: написать функцию сопоставления групп символов к условным коэфициентам «длинн». А если ещё и кёрниг отдельных пар учитывать… в общем нет предела глупостям. Вот резиновые меню без js: http://www.xiper.net/examples/html-and-css-tricks/navigation/rubber-block-menu3.html Добавлю: в конкретном вашем примере со скрина самый быстрый фикс :увеличить меню в ширину на размер этого огрызка, поместить в контейнер правильной ширины и назначить ему overflow:hidden
Да просто могли бы уменьшить один пункт или увеличить один пункт. В итоге даже при резине всё растянулось очень сильно. Короче такие варианты всегда спорные, мне кажется. А таблицей не совсем выходило, пробовали. У меня в зависимости от выбранного пункта, из-за вдавливания меняется и левый и правый блок 6)
хотя это не проблема наверное, можно и в таблице менять
Ну хз. Я сам дизайнер посредственный, верстальщик/программист. Сложностей не вижу. Обидно, что из-за такой мелочи портицо впечатление о хорошем проекте. :(
Интерфейс нравится, удобный, а вот общее впечатление двоякое. Может и-за текстур, но восторга не вызвало.