Недавние комментарии

1
переводишь ли в Фигме контурные иконки в заливку?

Привет. Ничего не делаю. Даже в отдельную страницу не собираю. Просто отдаю ссылку на макет и все довольны :)

paragraph indentation

Да, работа с абзацами в Фотошопе была сильно удобнее, а тут приходится или два отдельных текстовых блока делать или пустые строки добавлять

2

Привет. Я опять к тебе с вопросом по Фигме). Не помню где и не помню когда (но явно очень давно), я тебя спрашивала стоит ли в Иллюстраторе переводить stroke в fill при сдаче контурных иконок в svg. Тогда ответ был утвердительным и, в принципе, во всех обзорах в те времена советовали лучше переводить контур в заливку, что это более безопасно в плане кроссбраузерности сгенерированного svg и т.д. и т.п.

Скажи, пожалуйста, а как сейчас: переводишь ли в Фигме контурные иконки в заливку? (имею в виду outline strokes). Проверила на наборе контурных иконок, вроде бы все хорошо экспортируется в svg и без перевода в заливку, да и браузеры уже более современные. Может уже неактуальна та информация про кроссбраузерность? Решила уточнить у тебя, вдруг и сейчас есть какие-то подводные камни.

И еще, у всех ли paragraph indentation работает странно или я что-то делаю не так? Не получается в блоке сдвинуть только несколько абзацев (например, для списка внутри текста), сдвигаются только все абзацы этого блока вместе. Нагуглила такие же жалобы еще от середины 2018, неужели еще не пофиксили... Конечно, это не прям громадная проблема, но, как для меня, все же мааааааленькая ложечка дегтя в большой фигмовской банке меда)

3

Похоже, что только я называл вертикальным ритмом равные расстояния, а все остальные обзывали так сетку в 10 пх. Поэтому я сдался, и тоже так начал :) Вот на эту сетку в 10 пх я вообще не обращаю внимания.

А уведомления не работают уже года два. Еще в прошлой версии сайта они сломались, поэтому и пришлось последние комменты в отдельную страницу оформлять.

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

Уточню, под вертикальным ритмом ты сейчас имеешь в виду горизонтальную сетку или повторяющиеся расстояния? Вначале подумала, что ты о горизонтальной сетке с шагом 10 (как в твоих сетках в Фигме), но потом вспомнила и открыла твою старую заметку https://alexeybychkov.com/blog/webdesign/gorizontal_grid/, а там увидела блок:

Горизонтальная сетка — ацтой. Никогда никому не советую ей пользоваться. Используйте вертикальный ритм (равные расстояния или пары расстояний у блоков), а не такую сетку.

P.S. Спасибо тебе огромнейшее за, как всегда, емкие ответы :)

P.S.2. Почему-то в блоге перестали приходить на почту уведомления об ответах :( - уже и почту другую ввожу, а все равно тишина...

5
Скажи, в начале работы с новым заказчиком ты сейчас оговариваешь, в чем для него лучше делать дизайн (Фигма / Фотошоп)?

Нет. В конце даю ссылку на видос

https://www.youtube.com/watch?v=Jz-ywNAa150

и все. Месяца 3 назад был 1 случай, когда и так с заказчиком не очень понимали друг друга — ну это вот такие заказчики, которых ты в конце проекта не очень ждешь на веблансере, чтобы они отзыв оставляли, потому что хрен его знает, что они там тебе напишут — вот тоже было: «нужен фотошоп!!!!» / «ВЕРСТААААЛЬЩИКИ СКААААЗАЛ НУЖЕН ФОТОШОООООП!!!» / «у тебя на сайте нигде не написано, что ты делаешь макеты в какой-то фигме!!!!». На что естественно, я в ответ ответил, что и в ТЗ не было ни слова про Фотошоп, иначе я бы отказался. Короче как два барана матом орали друг на друга минут 20 и соревновались в количестве восклицательных знаков. Потом надоело, сказал ему, чтобы успокоился и просто видос мой глянул. Ну и показал ему некоторые фишки, вроде расшаренного экрана, комментирования, истории версий. Через 10 минут согласился, что фигма сильно лучше и извиняться начал. Но такое было 1 раз, поэтому не вижу повода переживать :)

Делая проект в Фигме, ты выносишь что-то на отдельные страницы

Нет, все делаю на соседних фреймах. У меня, к слову, в библиотеке компонентов только курсор-палец, который я ставлю, чтобы показать ховеры :) Сильно быстрее, нарисовать кнопку с нуля (это же просто прямоугольник и текст), и сделать из нее компонент, чем лазить в библиотеку, там что-то искать, потом переносить в макет, переключать вкладку обратно, компонент перетягивать по слоям в нужное место. Причем все равно прямоугольник придется перенастраивать и текст перепечатывать. Надо работать так, чтобы время экономить, а не тратить. Вот примерно из этой серии и дополнительная страница со всякой «хренью» :) Которую еще не факт, что верстальщик найдет потом))

По умным направляющим от высоты текстового блока?

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

6

Привет. Вопросы в большинстве по Фигме, потому напишу в заметке о ней.

1. Скажи, в начале работы с новым заказчиком ты сейчас оговариваешь, в чем для него лучше делать дизайн (Фигма / Фотошоп)? Имею в виду те случаи, когда макеты потом верстают не твои верстальщики, а кто-то со стороны заказчика (не факт, что знакомый с Фигмой). Бывают ли случаи, что говорят: «Фигма? Нет-нет, мой верстальщик говорит, что лучше в Фотошопе». Спрашиваю, поскольку как-то приходилось даже просто в отношении сетки переделывать с 1170px на 1110px, потому что верстальщик передал через заказчика, что обязательно должно быть один в один под бутстрап 4 (про то, что сетку можно там быстро настроить, видно, он еще не знает). Так вот, сомневаюсь, что такой верстальщик не заставил бы меня переносить из Фигмы в Фотошоп, потому что ему там удобнее)).

2. Делая проект в Фигме, ты выносишь что-то на отдельные страницы (имею в виду Pages в панели слоев) или размещаешь все на одной? Стоит ли, например, на отдельную выносить состояния кнопок, инпутов и т.д. или нагляднее размещать все на соседних фреймах?

3. Третий вопрос не по Фигме, а скорее по твоей второй книге. Относительно выравнивания текста по строчным и... нерациональности этого метода)) Полностью согласна с твоими словами, что ни один верстальщик не будет измерять расстояние от края строчных, чтобы вручную высчитать и задать сверху эти заманьяченные дизайнером ровненькие 20px или 30px от малых букв. Но! Выработанная годами привычка отсчитывать расстояние от строчных никуда не девается :). Подскажи, пожалуйста, как ты сейчас в макетах выравниваешь заголовки/тексты, чтобы максимально приблизить к будущему виду в верстке? По умным направляющим от высоты текстового блока?

7

Alexey Bychkov

Hello world 4.0

Давай)

8

Стоило отвлечься на недельку-другую, как тут уже столько новенького: и новый дизайн, и новый проект, и новые видосы :) Все прочитала, просмотрела, пролайкала)) Очень клево, хотя удивительно было бы, будь это не так).

P.S. Такой непривычный курсор – все время чувство, что сейчас начнешь рисовать на странице)))

P.S.2. Можно задам несколько околофигмовских вопросов? Они по разным направлениям, но, если можно, напишу в одной заметке по пунктам.

9

Пожалуйста :)

10

Спасибо! Сервис работает

11

Спасибо, но мне и так хорошо) PS. закомментил wrap — вроде нормуль теперь. Спасибо)

12

Владимир

Сетка в футере

Или как вариант, можешь мне выслать копию файла style.css. А потом уже готовый зальешь вместо старого.

13

Владимир

Сетка в футере

Если доступ к стилям есть, то это легко поправить.

В файле style.css, нужно будет кое-что изменить и кое-что добавить.

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

https://ibb.co/pQVRHJL

Удаляем правило flex-wrap:wrap;

Или меняем на flex-wrap: nowrap;

https://ibb.co/FXvHFTd

Теперь поля сжимаются, и на планшетах в инпутах уже не хватит места для длинной почты или имени отчества. А в текущих стилях, поля перестраиваются только для экранов меньше 767px. Поэтому добавим такое вот правило:

@media only screen and (max-width: 1000px) {

.add-comment .decomments-add-comment-top .decomments-enter-row .decomments-enterform {

display: block;

}

.add-comment .decomments-add-comment-top .decomments-enter-row .de-form-field+.de-form-field {

margin: 10px 0 0;

}

}

Читается как:

Для экранов с максимальной шириной до 1000px применить правила.

1. Меняем для формы тип отображения на блочный, чтобы инпуты встали друг под другом

2. Для поля почты убираем отступ слева, а вместо него делаем отступ сверху.

Тут важная штука, порядок размещения правил.

Правила @media ... (max-width: ) { } нужно размещать по убыванию ширины.

То есть, в файле сначала идут общие стили, после них пишут правила @media и они расположены должны быть примерно так:

@media ... (max-width: 1000px) { ... }

@media ... (max-width: 900px) { ... }

@media ... (max-width: 600px) { ... }

Нужно будет проследить, чтобы не сделать на оборот, иначе правило просто не будет работать.

Должно помочь, но на всякий пожарный, перед изменениями, скопируй файлик style.css куда-нибудь. Чтобы в крайнем случае, просто заменить новый файл старым и вернуть как было.

14

Да, спасибо, эти комменты еще с первой версии сайта тянутся. А уже 4-ая. Поэтому приходится терпеть этот кривой и корявый плагин. Убрал 3 уровень вложенности, а вместе с ним и баг этот

15

Владимир

Сетка в футере

Большущее мерси!

Чуть обесцветил описание, и правда приятнее стало.

Про фотку, я сначала тоже по центру хотел, потом попробовал так поставить, показалось неплохо. Позже еще по центру попробую, сравню.

Пы. Сы. Сейчас заметил, что на сайте форма комментов съезжает.

https://ibb.co/xYfCqd1

16

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

17

Владимир

Сетка в футере

Спасибо. Посмотрел 14-15px, выглядит лучше, кажется. А вчера вечером показалось не очень, чудеса восприятия)

А можно я совсем обнаглею и мнения попрошу?) Не слишком дешево смотрится:

https://ibb.co/9Vc8hSk

И с тенюшками

https://ibb.co/YycqLqV

Merriweather и Open Sans, норм так или не очень?

18

Так год уже закончится скоро :) Может ближе к НГ пособираю инфу про 2020-ый

19

Привет. У меня когда-то давным-давно была любовь к четным размерам шрифтов: 14, 16, 20 для контента. Потом переобулся в нечетные. И вот уже несколько лет последних делаю контент на компах / планшетах 17, а на смартфонах уменьшаю до 15-ти. Меньше не делаю. Ну и от шрифта зависит, иногда контент делаю 20-кой. В общем у меня такие цифры чаще всего: 15, 17, 20 -- контент. 24, 32, 42, 64+ -- заголовки. Не претендую ни на что, но мне нравится как в таких размерах все смотрится и читается.

20

Леша, привет!

А что популярно в этом или набирает популярность? Расскажешь о трендах этого года и прогнозах на следующий, или течение все то же?