89 Комментарии “Дизайн онлайн-каталога японских автозапчастей JAM24 от Михальченко Юрия

    1. Действительно, некоторые блоки информации своими частями налезают друг на друга («контакты», стрелка «автозапчасти в красноярске»)
      Повезет если нужно будет делать верстку НЕ резиновую. Потому что как подвал репитить? И как тянуть центральный баннер с автомобилем?
      Стрелки поверх картинок в «карусельке» ниже баннера — это сразу PNG24, а значит фикс в IE6. Эта же проблема с овалом верхним левым в «по частям».
      И как из фото товаров эти разрисованные овалы получать?
      А поиск с инпутом на половину под экраном это скриншот обрезанный или еще одна трабла верстальщику?

      Выводы: хороший дизайн для печатной продукции и для статического сайта визитки, для живого динамического резинового пополняемого заказчиком сайта — не подойдет.

      Одобрить 0 Байкотировать 0 (0)

        1. Написание телефонного номера под наклоном — значит это будет картинка, а не текст. Т.е. номер будет недоступен для копирования в буфер обмена и недоступен поисковым системам. А они еще и к региону сайт по тел.номеру привязывают.

          Одобрить 0 Байкотировать 0 (0)

          1. Написание цены таким шрифтом и с обводной в CSS невозможно получить — только все картинки рисовать.

            Одобрить 0 Байкотировать 0 (0)

  1. Это извечная проблема — борьба дизайнеров с верстальщиками 🙂
    Типа как борьба добра со злом.
    Я считаю, что веб-дизайнер должен на минимальном уровне знать верстку — иначе большая вероятность нарисовать то, что потом нельзя будет нормально сверстать…

    Одобрить 0 Байкотировать 0 (0)

          1. Нет, просто есть вещи (такие например как шрифт цен здесь) которые не сделать такими какими их задумал верстальщик.

            Одобрить 0 Байкотировать 0 (0)

      1. Еще стоит не забывать про труд контент-мастера и сложность дальнейшего сопровождения проекта.
        (я про круглые фото товаров и «наезжающие» стрелки на банера)

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

        Одобрить 0 Байкотировать 0 (0)

    1. большим джепегом размапить ссылки и все!
      причем так реально делают, как то один верстальщик принес мне тестовое задание подобное, хотел к нам на работу (:

      Одобрить 0 Байкотировать 0 (0)

      1. если тольок CSS то only CSS3

        если нет JS, две фразы друг на друга, подмена картинками.

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

        Одобрить 0 Байкотировать 0 (0)

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

    Одобрить 0 Байкотировать 0 (0)

  3. смело! Интересно что сказал заказчик?

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

    Одобрить 0 Байкотировать 0 (0)

  4. вообще проект задумывался верстаться под HTML5 и CSS3 (дада с введеными там тегами тоже) с упрощениями/хаками для IE («пользователи IE должны страдать(с)»).

    что получится покажем.

    Одобрить 0 Байкотировать 0 (0)

  5. Когнитивный диссонанс… КРуто (:
    Я лишь нарушил несколько правил классической вертки, которые по-тихоньку уходят в небытие, а такой шум поднялся! Cлава W3C!

    Одобрить 0 Байкотировать 0 (0)

        1. Я уже прекратил поддерживать ИЕ6, да и седьмой тоже не тестирую. Верстка такого дизайна — это, конечно, ад верстальщика, но если упростить немного шаблон, то было бы очень гуд.

          Одобрить 0 Байкотировать 0 (0)

    1. Некоторые комменты реально странные, я хоть и не верстальщик, но в курсе что наклоны, шрифты и закругления делаются и без CSS3 и HTML5. Хотя этот сайт рассчитывался именно на новые стандарты. А Миша молодец, не боится трудностей!

      Одобрить 0 Байкотировать 0 (0)

      1. Абсолютно все комменты касаемо вёрстки по делу. Ничего странного. Я тоже не верстальщик, но знаю, что «наклон» имелся ввиду не просто курсив текста, а написание именно под углом, как, например, номер телефона на розовой подложке. В HTML даже 5-й версии этого сделать нельзя. — Только картинка.
        Обводка шрифта тоже бОоольшущий гемор для верстателя, и гемор этот не стоит свеч (каламбур вышел :)) если честно. Проще, логичнее и быстрее тоже картинкой. Про закруглённые углы тут никто и не писал, что это нельзя сделать. Речь шла о том, что контент-менеджер должен будет в дальнейшем сам в фотошопе обрезать картинкам углы и сохранять в png. Маловероятно, что он будет грамотно это делать. Или вы собираетесь сами каждую конкретную картинку вырезать? Если так, то тут всё круто. Будет хоть и мелкий зато постоянный доход пока заказчик не освоит фотошоп. )

        Одобрить 0 Байкотировать 0 (0)

          1. Что бы посмотреть надо доунлоаднуть Сафари ) И все дружно пересели на Сафари. Уверен так и будет )

            Одобрить 0 Байкотировать 0 (0)

          1. Умыл, признаю. Молодец. Но по остальным пунктам я твёрд как камень )

            Одобрить 0 Байкотировать 0 (0)

  6. хтмл5 и цсс3 это конечно хорошо – но, что-то мне подсказывает, что целевая аудитория сайта будет страдать 😀 это же не сайт по дизайну и вёрстке, или там конкурсная работа на smashingmagazine по новым веяниям вёрстки – это, блять, магазин запчастей! На такие сайты люди ходят не на рюшки смотреть.

    запасся попкорном, хочу увидеть реализацию, а пока – это выглядит как макет для журнала, или постер 😀

    Одобрить 0 Байкотировать 0 (0)

    1. 1. Какие-то вещи этого дизайна решаемы с помощью Flash+XML (или подобной технологии).
      А что-то на новых HTML5 и CSS3. Но, на сколько я понимаю, большинство используемых сейчас браузеров:
      http://trends.openstat.ru/global-statistic-browsers/#level=2&attr=1%252C2%252C3
      не поддерживает эти новые стандарты:
      http://blog.petrusha.name/2010/03/24/html5-and-css3-checklist/

      2. 100% реализация будет деревянной: не резиновая верстка, не обновляемая заказчиком «каруселька» и др. контент, цены не будут браться из БД итд.
      А если сделать сайт живым, то тогда нужно будет использовать технологии из п.1 это будет сильно дорого, раз, сайт не смогут посмотреть большинство пользователей, два.

      Миша молодец — хорошо подставил верстальщика, программиста и заказчика 🙂

      Одобрить 0 Байкотировать 0 (0)

  7. Сверстать можно все что есть в дизайне, проблем особых не вижу.. некоторые моменты правда будуд через ж.. но все ж.. с меню только проблемка если в две строки будутссылки, хотя иэто тож можно предусмотреть.даже резиновый футер можно сделать в текущем исполнении. С Roman Z. said: 2010.07.21 09:42 несогласен. А Миша все сделал правильно, никого не подставил.. Дизайнеру я считаю слишком на верстальщика ориентироваться не нужно, а то получается квадратиш практиш гуд.. 🙂 Прогер справится. А заказчика подставил, как то не для магазина запчастей дизайн то 🙂

    Одобрить 0 Байкотировать 0 (0)

    1. >> Дизайнеру я считаю слишком на верстальщика ориентироваться не нужно

      Тем не менее надо уважать время и возможности коллег по цеху.

      Одобрить 0 Байкотировать 0 (0)

        1. Дима, договорились. Делайте, выкладывайте результат. Мне дайте доступ по фтп. Я принимаю работу, если всем условиям удовлетворяет выбирайте одну любую пиццу в Перцах:
          http://www.bar40.ru/menu/3/
          и скидывайте мне на мыло адрес и время доставки.

          В исходниках я должен иметь возможность в текстовом редакторе менять: цену и названия. Т.е. никаких картинок — вся инфа живая в БД.
          Технологии выбирайте сами.

          Одобрить 0 Байкотировать 0 (0)

          1. Да, кусок должен быть сверстан дивно, резиново, валлидно. Сверстан, а не целиком во Flash загнан.

            Одобрить 0 Байкотировать 0 (0)

          2. поздновато я прочитал ) но ничего, вызов принимаю! ))

            Одобрить 0 Байкотировать 0 (0)

          3. http://imagiro.ru/roman/ — он-лайн
            http://dl.dropbox.com/u/934785/roman.zip — архивом

            Шрифтов я таких же у себя не нашел, но в тексте использовал другой, тоже нестандартный, так что разницы, думаю, нет. Чтоб совсем было круто можно еще керниговые пары для цифр написать, но я уже спать хочу.

            Одобрить 0 Байкотировать 0 (0)

          4. Молотком! Кстати резина там не подразумевалась %) все fixed

            Одобрить 0 Байкотировать 0 (0)

  8. Можно очень долго делать говно, убеждая всех вокруг, что что-то более крутое не будет работать там-то и там-то. Ну не будет и ладно. Ребята прикольную штуку задумали, удачи им в реализации.

    Одобрить 0 Байкотировать 0 (0)

    1. имхо, но ребята работают на свой интерес, видать. Убивают двух зайцев — и бабло зарабатывают и что-то новое познают. Это все, конечно, хорошо, у нас так и бывает очень часто. Только это не должно быть в ущерб заказчику.

      Одобрить 0 Байкотировать 0 (0)

  9. @Дима: В ИЕ7 фишка сошрифтами не работает. Фикси быстрее, а то пиццы тебе не видать )) Хотя, конечно, в поставленных условиях кроссбраузерность явно прописана не была…

    Одобрить 0 Байкотировать 0 (0)

          1. Проверил. Всё включено. Ну хер с ним, надо подождать чё другие скажут. Может у меня одного единственного ИЕ такой косячный. Но если у кого-то тоже самое будет, то ИЕ уже не причём.

            Одобрить 0 Байкотировать 0 (0)

  10. С отключенными картинками в Опере 9 шедевров Малевича:
    http://habreffect.ru/files/7d6/d20502dad/scrshot_pizza_opera.png

    В Сафари чуть лучше:
    http://habreffect.ru/files/fbb/058e066cf/scrshot_pizza.png

    Я понимаю, что не увижу гениальных дизайнерских решений, когда пользуюсь браузерами с отключенными картинками и флэшем. Я прихожу за контентом и если вместо крутого шрифта увижу «Helvetica, Arial, sans-serif», то и черт с ним, я не обижусь.

    Траурные квадратики это крайне печально, ведь и Opera, и Safari, и Firefox, и Internet Explorer (начиная с версии 5) поддерживают font-face. 🙁
    http://cssing.org.ua/2009/10/24/font-face/

    Помните о graceful degradation и пусть никто не уйдет из этого треда голодным.

    Одобрить 0 Байкотировать 0 (0)

  11. Дима, в целом решение принимается — круто сделано! 🙂 Я недооценил современные возможности Java Script (в частности плагинов к jQuery) 🙂
    Хотя, минусы такого решения есть:
    дополнительные 155 килобайт js библиотек и 11 килобайт под картинки с цифрами (а если бы дизайнер нарисовал таким шрифтом тексты в кириллице, есть готовое решение?),
    заказчик будет вставлять, как я, или слишком широкие картинки или слишком узкие или шестизначную цену или слишком длинное описание:
    http://www.yenisite.ru/pizza/
    И со всем этим придется тоже бороться.
    Кстати, в IE6, IE7, IE8 отступы везде разные, но условия кроссбраузерности я не выдвигал.

    В общем, жду на мыло выбранную пиццу, адрес и время доставки 🙂

    PS: Ну и посмотрим какими будут в итоге верстка и программирование этого сайта.

    Одобрить 0 Байкотировать 0 (0)

    1. Ну сам файл js со шрифтом можно ужать, я просто не стал играться с настройками. Про слишком широкие цены — да, согласен, но это не предусмотрено дизайном. Отступы в ИЕ — ну тут хаки в руки, думаю, не в этом суть была.
      Можно в принципе сделать шрифт прям с обводкой и его в куфон и запихать. Или нет? Дизайнеры должны знать ))

      Пиццу пепперони без оливок. Адрес доставки: студия Метадизайн (ул. Борисова 14 «Б», офис 401). Время: лучше 12:00-13:00, хотя можно в любое рабочее ) Если есть вопросы: dima@metadesign.ru

      Одобрить 0 Байкотировать 0 (0)

    2. Еще есть один минус — текст выделить нельзя, чтобы скопипастить. Скажем скинуть знакомому сколько стоит подарок, который ты хочешь на ДР, ну илил что-нить в таком духе.

      Одобрить 0 Байкотировать 0 (0)

    3. Если использовать прямую ссылку на библиотеку с сайта jquery то есть большая вероятность загрузить скрипт из кеша пользователя… Ну это так к слову… 🙂

      Одобрить 0 Байкотировать 0 (0)

  12. Я тут вас читаю и вдруг что то подумал про text-shadow.. Чем он плох? :DDDD Не говоря уже про загрузку собственного шрифта «уже» стандартными средствами через @font-face.

    Одобрить 0 Байкотировать 0 (0)

    1. Мало времени даёшь. Подожди с пол годика. Когда уже и ИЕ9 полноценная выйдет и все будут всё, что надо поддерживать. Для такого сайта Интернет должен созреть )

      Одобрить 0 Байкотировать 0 (0)

Добавить комментарий