• Не понимаю, что такое модульная сетка?

    @htmleater
    Всё попробую объяснить проще: изначально понятие модульной сетки возникло в книгопечатании, куда основы попали из архитектуры. Но и там и там всё это изначально строилось по правилам золотого сечения.
    Человеческий глаз - штука странная, мы иногда не видим очевидного, но способны и поддаться оптическому обману. Однако почти все безошибочно способны рассмотреть несоответствия золотому сечению, и у почти у каждого, выросшего в европейской традиции или тех, которые соприкасались с ней, эта способность забита в подкорку.
    Сетка нужна для того, чтобы минимизировать/избежать таких несоответствий. Т.е. ты располагаешь блоки в соответствии с выбранной сеткой (а они бывают в вебе 3-х видов: кратные 3, 4, и 5). Показывать юзеру эту сетку совсем не нужно, т.к. его глаз и мозг сами справятся. Посему любая сетка является вспомогательным инструментом.
  • Верно ли я понимаю логику верстки на бутстрапе?

    @htmleater
    Ingword: "я рисую и я же верстаю :) "
    Какие тогда вообще проблемы?
    Я не люблю Бутстрап и пр. фреймворки.
    Я делаю так: рисую сетку на 1000пикс (так проще переводить в проценты) в векторе, на другом слое сверху по этой сетке накидываю блоки без деталей.
    Открываю Дримвеавер и верстаю на флексбоксах (для упрощения задачи подключаю отдельный файл стилей для флексбоксов, в котором примерно 30-40 классов) по получившимся в прототипе размерам.
    Потом смотрю на поведение блоков под разными разрешениями и в медиаквери регулирую поведения.
  • Можете посоветовать качественные курсы/школу по веб дизайну?

    @htmleater
    Div-p: Понимаете, вы рассуждаете чисто с технической стороны. Как вы думаете, зачем у архитекторов обязательной дисциплиной идут рисунок и композиция весь период обучения? Ведь всё так просто - чистая геометрия.
    Почему те немногочисленные специалисты, занимающиеся проектированием шрифтов ОБЯЗАТЕЛЬНО прекрасные рисовальщики, а дизайнеры в классическом понимании (промышленный дизайн) натасканы в рисунке почти как графики?
    Вот казалось бы, чего нужно шрифтовику-типографу? Хорошее знание черчения (строительное и машиностроительное даже можно и не знать) и книжки по теме почитать. Однако попробуйте сделать шрифт сами.
    Тут без углублённого понимания Композиции как раз никуда, а понимание это приходит через многолетнюю дрочку, ежедневное рисование по нескольку часов в день, хотя бы поверхностное изучение истории искусств и т.д.
    Это именно для настоящего освоение профессии.
    А топик-стартер имел в виду общее понимание предмета, а этого можно добиться внимательным листанием альбомов, увлечением историей искусств, изучением сеток и цветоведения
  • Можете посоветовать качественные курсы/школу по веб дизайну?

    @htmleater
    Div-p: Ну, во-первых, не нужно путать рисование со всем остальным. Рисовать умеют ВСЕ, только большинство об этом не догадывается))), ибо рисунок - суть то же черчение, только без инструментов. Развить глазомер, твёрдость руки и некоторые технические навыки может всякий при должном усердии и постоянной практике.
    Можно глубоко профессионально постигнуть законы оптики, которые действительно есть (про Законы колорита слышу впервые, очевидно вы имели в виду колорит, как составляющую цветоведения). Есть также законы перспективы, есть пластическая анатомия, есть материаловедение и ещё куча всякого, что преподаётся в худ. заведениях в обязательном порядке, ни одна из этих дисциплин не рассматривается как наука, которые человеку, желающему научиться рисовать, следует погружаться с головой, да и не нужно, достаточно общего представления.
    Можно освоить техники живописи, лепки и т.д., но вот здесь уже обязательны природные задатки.
    А вот чего нельзя освоить без многолетней дрочки - это т.н. композицию (как предмет). Тут уже и природные данные нужны, и опыт, и умение рисовать, знание черчения, перспективы и цветоведения, и психологии, и глазомер и пр., пр., пр.
  • Можете посоветовать качественные курсы/школу по веб дизайну?

    @htmleater
    Думай Головой: Т.е. если тебе не критично уметь с первого взгляда определить стиль архитектуры, стилевую принадлежность какой-либо вещи в периоде 25-50 лет, умение замечать профессионализм фотографа. оператора и иллюстратора и т.д.. то настолько глубокие знания не нужны.
  • Можете посоветовать качественные курсы/школу по веб дизайну?

    @htmleater
    Если для самообразования, то действительно хватит популярных книжек (типа Кирсанова) и упорства. Моему старшему брату хватило для этого хобби - филателии живописных шедевров и рассматривания альбомов. Правда, лет через 10 пришёл к тому, чтобы попробовать самому и даже обнаружить некоторые успехи.
  • Можете посоветовать качественные курсы/школу по веб дизайну?

    @htmleater
    Думай Головой: Вполне возможно, но нужно быть готовым к тому, что придётся потратить лет 10-15 для того, чтобы самостоятельно делать качественные индивидуальные дизайны. Это путь только для всерьёз заболевших.
    А воровством и компиляциями занимаются сейчас процентов так >95 "дизайнеров". Особо плохого в этом нет ничего, но это вторично, проще и дешевле найти и подключить профессионала. Как-минимум, для заработка точно лучше.
  • Под какие значения @media адаптировать дизайн сайта?

    @htmleater
    960 - 1023 вполне можно пропускать, ибо это уже достаточно широкий экран и разница до следующего пойнта в 64pх несущественна.
  • Animate.css+one-scroll-page.js как совместить?

    @htmleater
    Спасибо! Хотя я, благодаря этому, убедил себя отказаться от анимации вовсе, что, имхо, в моём случае, оказалось удивительно правильным решением)))
  • Адаптив. Как сверстать такие блоки?

    @htmleater
    teotlu: У нас в конторе 9-ку поддерживают чисто номинально и я пишу отдельный файл стилей для неё с дисплей: табле и т.д. или просто инлайнами, благо под неё респонсив не нужен. Единственное, что нельзя в ней сделать - сортировку вывода итемов.
  • Адаптив. Как сверстать такие блоки?

    @htmleater
    На начало года поддержка флексбокса была у 93-х% пользователей. А так да, это делается за 15 минут во флексбоксе.
  • Flex align-items:stretch; не работает если высота больше высоты окна, как пофиксить?

    @htmleater
    userAlexander: сожалению, готовое решение я потерял и восстановить сейчас возможности нет. Но, как только время появится, планирую восстановить и серьёзно потестить решение, т.к. частенько нужно бывает.
  • Flex align-items:stretch; не работает если высота больше высоты окна, как пофиксить?

    @htmleater
    userAlexander: Это уже ставшее почти классическим решение, однако именно с ним у меня на одном из крайних проектов были проблемы, ибо обязательна нужна была поддержка ИЕ9. Простая адаптация свойствами display:table (row, col) вызывала некорректное поведение в Мозилле на телефонах, скачки вокруг которого приводили к переполнению контентом контейнера.
    Вообщем там была довольно сложная свадьба различных значений флексбоксовых и спец. значений для ИЕ9 + даже небольшого хака для Мозиллы.
  • Flex align-items:stretch; не работает если высота больше высоты окна, как пофиксить?

    @htmleater
    userAlexander: Я уже в нескольких проектах использховал.
    Плюсы:
    1. очень хорошо использовать для респонсив сайтов - при правильной настройке вполне предсказуемое поведение
    2. возможность сортировки
    2. с медиа дисплей:ноне вообще можно сказку устроить
    Из сырого:
    1. так и не удалось до конца решить проблему привязывания неизвестного по высоте футера к низу экрана, хотя в теории всё нормально - разночтения в браузерах
    2. отдельный цcc для Ие9 на дисплей:тейблах
    Вывод:
    пока с кайфом можно применять в мелких формах - меню, общем скелете, боковых блоках.
    Целиком для всего сайта делать не решаюсь - проблемы всплывают и даже раз было, что уже в процессе эксплуатации.
  • Flex align-items:stretch; не работает если высота больше высоты окна, как пофиксить?

    @htmleater
    userAlexander: Ну дык, таблицу распирает в любую сторону при явном переполнении. Просто следует помнить об однозначном поведении контейнера и предсказывать в условиях различные ситуации.
  • Дизайн сайта: графическая вёрстка (текста и картинок) и модульная сетка, как лучше?

    @htmleater
    oxarts: Да вы прям диагност))) Я по профессии художник хорошо умеющий верстать. 18 лет стажа в Вебе, более 450 сайтов. Как говорится: И Крым и рым и трубы.
    Сурпрайз-сурпрайз — любая векторная программа умеет экспортировать почти в любой растровый формат + svg и eps, а вот умение нарисовать всё, что хочется зависит только от личного опыта.
    Вы, возможно, удивитесь, но рисование логотипов, иконок, символов, буквиц в растре — откровенный мазохизм, я уж не говорю о большом макете. Верстальщики оценили - кликнул на объекте и увидел расстояния, размер и отступы, прописал в стиле проценты. Вуаля!
    Сетка забита один раз в темплейте, в настроках привязка к ней. Нарисовали внешний блок. внутри ещё один с отступами. заполняем его содержимым, сгруппировали. Верстальщику остаётся только в один клик разгруппировать, кликнуть на объекте, посмотреть на значения вверху окна (расстояния. размеры). Кликнуть на внутренний блок, вычесть на куркуляторе или в уме разницу. Всё -верстай. не хочу!
    В ФШ только обработка фоток и коллажей, характерных паттернов и фонов, больше ничего, ну не текстовые же блоки там эмулировать.
    Только как-то в нынешнее время сложно себе представить сайт, ну кроме фешион-бутиков, цветочных и ювелирных магазинов, что-то ещё требующих большого юзанья ФШ.
    Примеры: Крайний проект, который сейчас на стадии сдачи. Один раз открытый ФШ, для подгонки размеров и цветности 3-х фоток для слайдера. Остальное ВСЁ в векторе.
    Ещё один проект в работе - новая версия портфолио. 6 картинок за полчаса в ФШ из скриншотов с тенями, всё остальное наживо в Dreamweaver. Лого - вектор (Corel > Inkscape). Остальное - jQuery + CSS
    Расскажите мне о руководящей роли Партии - Фотошопе. Нужно всего лишь уметь менять подходы в зависимости от задачи.
    По-моему, глупо рисовать страницу современного сайта в растре - нет логичного объяснения зачем. Попробуйте всерьёз освоить вектор - не пожалеете и удивитесь, что ту же самую работу можно при определённом навыке делать в три-четыре раза быстрей. И всё же для такой работы Корел лучше заточен. чем АИ.
  • Дизайн сайта: графическая вёрстка (текста и картинок) и модульная сетка, как лучше?

    @htmleater
    oxarts: Перевёл на работе уже года два тому процесс в вектор - производительность дизайнеров и верстальщиков увеличилась в разы.
    Куда как проще пользовать правильный макет в векторе + отдельно заготовленные картинки растровые и svg при вёрстке - отпадает необходимость в куче операций. Рисуем почти всё в векторе, правильно группируя и разнося по слоям, а в ФШ только отдельные картинки, да и то не все, а только изначально растровые фото и коллажи.
    Вот теперь расскажите мне, любезный, зачем в современном сайтостроении нужен этап нарезки макета из ФШ?
    Фотошоп стал вынужденным стандартом для веба на безрыбье в те времена, когда все сайты практически полностью делались из картинок.
    Ну так, пжлст, снизойдите до объяснения без мифологии и консервативного следования традициям, типа "как все", отчего, по вашему ничего хорошего нельзя сделать в векторном редакторе?
  • Хаки для Safari?

    @htmleater Автор вопроса
    Ну дык ИЕ 8 и ниже я уже давно не учитываю в большинстве проектов. В ИЕ 9 и выше calc работает при соблюдении определённых несложных условий. В старых Андроидах тоже обходится.
    А для Сафари пришлось писать спец. скрипт
  • Какой должен быть порядок следования @media queris при формате "Сначала десктоп"?

    @htmleater
    Ваше право. Имею опыт вёрстки одного и того же проекта, как снизу, так и сверху. Личный опыт показал, что вёрстка снизу увеличивает код, хаос и повторяющиеся правила стилей значительно.