Задать вопрос
  • Возможен ли mixin внутри box-shadow?

    SeaInside
    @SeaInside
    16 лет пилю все эти штуки
    Добрый день.
    Используйте не миксин, а функцию - и будет вам счастье.
    Ответ написан
    1 комментарий
  • Отличие микса от модификатора в данном примере BEM?

    SeaInside
    @SeaInside
    16 лет пилю все эти штуки
    С точки зрения ванильного CSS - разницы никакой, вы просто добавляете дополнительную функциональность с помощью добавления класса.

    С точки зрения чтения стилей есть разница в том, где вы описываете то, что хотите достичь - в первом случае (модификатор) изменения описываются в самом компоненте, во втором (микс) изменения описываются в родительском компоненте (header, footer).

    В вашем случае следует использовать исключительно микс, использование модификатора будет являться ошибкой, так как:
    • создание модификатора, который нужен только для использования внутри одного блока - ни к чему;
    • изменять геометрию и позиционирование в модификаторе - плохо. Есть кейсы, когда в какой-то мере это допустимо, но не в этом случае.


    А вообще меню - не очень показательный пример, лучше эту концепцию рассматривать на примере чего-то, что используется на сайте многократно - кнопки, например.
    Ответ написан
    Комментировать
  • Как это исправить - "Минимизируйте работу в основном потоке - Google page speed"?

    SeaInside
    @SeaInside
    16 лет пилю все эти штуки
    Здравствуйте.
    Вопрос к WP не относится, но на ответ не влияет - универсального совета здесь нет.
    У вас узким местом является время выполнения скриптов, соответственно всё, что вы можете - уменьшить их размер (путём подбора более лёгких и оптимальных решений, либо выбрасывания ненужноло) и/или отложить загрузку некритичных скриптов.
    Волшебного инструмента (при таком количестве входных данных) для этого нет, задача решается головой и руками.
    Ответ написан
  • HTML5 плавное повторение видео, есть ли способ?

    SeaInside
    @SeaInside
    16 лет пилю все эти штуки
    Только зациклить в видео-редакторе таким образом, чтобы оно в конце приводилось к своему изначальному состоянию (первому кадру) как вам нужно. Это единственно правильный метод.

    Есть ещё вариант: сделать два видео, расположить друг над другом, одно запустить, другое стоп, отслеживать прогресс воспроизведения и за пару секунд до окончания видео его плавно скрыть, другое видео в этот момент стартуем, ну и такую карусель устраиваем.
    Но делать так настоятельно не рекомендую - это создание сложности на ровном месте, да и перфоманс такой себе получится.
    Ответ написан
    6 комментариев
  • Что нужно сделать чтобы плагин таблиц jQuery видел и сортировал элементы созданные динамически с помощью js?

    SeaInside
    @SeaInside
    16 лет пилю все эти штуки
    От решения зависит, тут мало данных.
    Хорошее решение повесит MutationObserver и сделает всё само (не ваш случай, видимо).
    Умеренно хорошее решение должно иметь метод .update() или что-то в таком духе.
    Такое себе решение имеет метод destroy(), который DOM возвращает к исходному состоянию, чтобы можно было вставить и инициализировать заново.
    Для всего остального - храним где-то наши данные, в случае необходимости убиваем узел целиком, формируем новый DOM, инициализируем плагин заново.
    Ответ написан
    Комментировать
  • Что из фронтэнда должен знать бакэнд разработчик?

    SeaInside
    @SeaInside
    16 лет пилю все эти штуки
    Прям должен - да никаких.
    Хорошим бонусом будет иметь представление о том, как во фронте удобно принимать данные и работать с ними, чтобы отдавать в удобном виде.
    Также бонусом (лично для вас) будет умение сверстать что-то простенькое - хоть на том же бутстрапе.
    Сноска про бутстрап

    Ни одному профильному специалисту никогда не буду советовать использовать бутстрап (только для ознакомления), но бэкендщику - позволительно, так как бутстрап фактически изначально задумывался для тех, кто особо вникать не хочет, а страничку набросать надо. Но потом что-то пошло не так >.<

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

    А вообще пересечений никаких, если не метите на позицию фулстака :)
    Ответ написан
    Комментировать
  • Как удалить "Отрывок" в Wordpress?

    SeaInside
    @SeaInside
    16 лет пилю все эти штуки
    Здравствуйте.
    За длину отрывка отвечает фильтр 'excerpt_length' - вы его верно сбросили.
    За окончание отрывка отвечает другой фильтр - 'excerpt_more'.

    Таким образом, ваша проблема решается так:
    add_filter('excerpt_more', '__return_false');

    А лучше всего, если отрывок в конкретном месте вам не нужен - просто уберите его оттуда без фильтров.
    Год спустя понадобится вывести отрывок в другом месте - и будете удивляться и долго вспоминать, почему вызов the_excerpt() есть, а отрывок не выводится. Или хотя бы фильтр вешать не глобально, а проверяя перед навешиванием, чтобы он применялся только в нужном вам случае.
    Ответ написан
    Комментировать
  • Кто платит за шрифт?

    SeaInside
    @SeaInside
    16 лет пилю все эти штуки
    Здесь была неправильная аналогия, почему - объяснили в комментариях

    Вы вызвали сантехника. Приехал мужик с чемоданом инструментов. Кто должен платить за инструменты? Вам, очевидно, кажется диким, что вы.
    Можете ли вы при этом сказать, что хотите, чтобы он поменял эту гайку не на абы какую, а определенной фирмы? Можете. А если у него такой гайки нет, то он вполне может сказать, что такой гайки нет, и стоимость гайки плюсуем...

    ИМХО, приоритет специалиста - сделать свою работу хорошо, и если для этого нужен определенный инструмент - то это проблема специалиста. Если специалист может сделать хорошо имеющимися (бесплатными) инструментами, а заказчику кровь из носу нужно другими - то это проблема заказчика. Но вообще всё это не особо имеет смысл, ибо в конечном итоге за всё так или иначе платит заказчик, просто в одном случае платёж неявный (работа стоит столько-то), а в другом явный (работа стоит столько-то плюс стоимость инструмента).
    Ответ написан
    3 комментария
  • Система комментирования для WordPress?

    SeaInside
    @SeaInside
    16 лет пилю все эти штуки
    Если не нужен социальный логин - возьмите штатную систему WP и докрутите AJAX-комментарии.
    Если нужен социальный логин - у вас варианта два: wpDisquz и AnyComment.
    wpDisquz недавно ковырял, и проблем у него ровно две:
    1. отвратительное качество вёрстки и большая сложность (невозможность) что-то в нём кардинально изменить. То есть если он визуально нравится "как есть" (там есть несколько вариантов "тем") - можно брать.
    2. ужасный перфоманс (впрочем, лишних пару секунд при загрузке важно далеко не всем)

    AnyComment выглядит как более по уму сделанное решение, но чего-то мне в нём не хватило в сравнении с wpDisquz, поэтому близко не смотрел.

    Если нет нужды хранить комментарии у себя - посмотрите Disquz, он бесплатный до 50к запросов в сутки, если память меня не подводит, и интегрируется предельно легко.
    Ответ написан
  • Как быстро научится работать с DOM?

    SeaInside
    @SeaInside
    16 лет пилю все эти штуки
    Это база, так что нарабатывается только многократным повторением и умением быстро загуглить.
    Конструкции, которые вы будете использовать каждый день, за какое-то время в памяти останутся (их не так много вообще). Ручками только набирайте, не копируйте со Стака.
    А те, что не используются каждый день - всегда можно быстро загуглить. Несколько раз пройдитесь по документации, просто чтобы иметь представление о том, что вообще существует - и практиковаться. :)
    Ответ написан
    Комментировать
  • Какие модные фронтенд-фишки можете посоветовать?

    SeaInside
    @SeaInside
    16 лет пилю все эти штуки
    Лучшее, что вы можете сделать - не тащить на сайт кучу всякой херни, которая обычно много весит, ухудшает перфоманс, затрудняет восприятие контента и не нужна никому, кроме вас. Серьёзно.
    Любая анимация должна быть уместна, и если вам, глядя на дизайн, никаких конкретных идей в голову не приходит - то и не нужно. Нет способа удешевить сайт сильнее, чем добавить элементам разного толка выпрыгивания со всех сторон, глитч-эффекты и всё такое.
    Хочется динамики - найдите какое-нибудь не сильно быстрое видео и поставьте его как фон, или по запросу "canvas background animation" найдите ненапрягающую анимацию.

    P.S. Речь идёт не о сайтах, которые должны побеждать на Awwwards, а об обычных сайтах, которые делаются для людей, а не для конкурсов.
    P.P.S. Если всё-таки очень хочется, то нужно гуглить по запросам "hover effects" и "canvas animation", остальное без конкретной дизайнерской задумки вреда несёт куда больше, чем пользы.
    Юзабилити - это про то, чтобы "работает быстро и понятно (как у всех)".
    Ответ написан
    2 комментария
  • Что не так с шоткодом?

    SeaInside
    @SeaInside
    16 лет пилю все эти штуки
    Привет.
    Нужно сделать так:
    add_shortcode('fbbuttons', 'show_fbbuttons'); // shotcode: [fbbuttons]
    function show_fbbuttons() {
      ob_start();
      require_once(TEMPLATEPATH . '/block-fbbuttons.php');
      $fbbuttons = ob_get_clean();
    
      return $fbbuttons;
    }


    Вероятнее всего, будет работать нормально, даже если не включать буферизацию, то есть:
    add_shortcode('fbbuttons', 'show_fbbuttons'); // shotcode: [fbbuttons]
    function show_fbbuttons(){
      require_once(TEMPLATEPATH . '/block-fbbuttons.php');
    
      return '';
    }

    Но так делать не принято, шорткод должен возвращать значение, а не выводить.

    Ошибка в том, что include и require - это не функции, а управляющие конструкции языка (я бы вообще запретил их вызывать со скобками), и они не работают как функции. Вы результат require присваиваете переменной и его возвращаете - он и выводится.
    Ответ написан
    1 комментарий
  • Сборка html из фрагментов?

    SeaInside
    @SeaInside
    16 лет пилю все эти штуки
    Компонентный подход - это всегда правильно.
    Сейчас в трендах работа с JS-компонентами, но практически тоже самое можно и на бэке делать, просто это менее удобно и готовых решений (и хороших практик) меньше.

    Вам нужен шаблонизатор. Если пишите на PHP - возьмите Blade, он простой как три копейки, есть в отрыве от Laravel, и хоть и несколько кастрирован в части работы с данными, но свои задачи как шаблонизатор выполняет более чем.
    Альтернативой может послужить Twig, но мне его синтаксис по сравнению с Blade нравится куда меньше, а регулярные задачи плюс-минус и там и там решаются.

    Чего-то готового найти довольно сложно, поэтому организовать воркфлоу, структуру придётся самостоятельно.
    Я, когда занимался, сделал себе вот так и использовать было не особо больно:
    5e89e66f399e0313757656.jpeg

    Те же компоненты, те же "пропсы" - это, пожалуй, в рамках шаблонизирования на PHP максимально приближенный вариант к модным фронтовым штукам.
    Из минусов по сравнению с ними - нет автокомплита и быстрой навигации по дочерним компонентам (всё приходится искать прям в файловой структуре, без Alt+LKM), нужно самостоятельно организовывать вопросы документирования компонентов.
    На скриншоте компонент входит в один экран и принимает три параметра, в таких случаях допустимо не документировать, но есть и другие, где параметров целая гора, там самостоятельно нужно думать о том, как организовать документацию, чтобы не запутаться.
    Для JS-фреймворков если классные инструменты для этого, Storybook мне например нравится очень.

    Если лень заморачиваться, всегда можно тем же пыхом сделать что-то в духе:
    function component($name, $params) {
      extract ($params);
      include 'path/to/components/' . $name;
    }
    
    component('component-name', [
      'param' => '123',
    ]);

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

    Ну а если вам и вашим клиентам стек не важен, не возникает проблем с SSR - то берите любой модный JS-фреймворк и пишите на нём, там всё до вас придумано и довольно удобно.
    Ответ написан
    Комментировать
  • Проверка кривоты скрипта?

    SeaInside
    @SeaInside
    16 лет пилю все эти штуки
    1. Класс .knopka - омерзительно, в работе должны использоваться только английские слова (хотя на сайте Сбербанка пару лет назад видел "telefon_batton", то было больнее).
    2. Если навешиваете события по селектору, то будет хорошей идеей добавить элементу дополнительный класс именно для JS с соответствующим префиксом (.js-button).
    3. Логика работы вашей функции такова, что вам проверка просто не нужна
      if (cont.classList.contains('text') ) {
        cont.classList.replace('text', 'text2');
      } else {
        cont.classList.replace('text2','text');
      }
      
      // Заменяется на 
      cont.classList.toggle('text');
      cont.classList.toggle('text2');


    Ответ написан
    1 комментарий
  • Должен ли UX/UI дизайнер знать компоненты React/Vue?

    SeaInside
    @SeaInside
    16 лет пилю все эти штуки
    Смешались в кучу кони, люди...
    Давайте по порядку.

    Должен ли UX/UI дизайнер знать компоненты таких фреймворков как React и Vue

    Если команда разработчиков заранее знает, что будут использовать какой-нибудь набор готовых компонентов для работы (Vuetify, Material UI, etc), то дизайнер должен их знать и использовать как основу, дабы не плодить лишних сущностей, так как без боли эти компоненты можно разве что перекрашивать.

    подготавливать макет прямо на React, но без логики

    "Макет на React без логики" - это вёрстка.
    И боже упаси, чтобы это делал дизайнер - с этим и большинство фронтов так себе справляется (во многом потому, что через 3 месяца работы над пет-проектом говорят "я уже хорошо знаю HTML и CSS, пошёл учить Реакт и получать ЗП в 200+", ха-ха).

    не зная можно ли вообще реализовать такой календарь

    Реализовать в принципе можно почти всё что угодно, вопрос кому оно нужно и кто готов за это платить.

    но наверное какие-то основы, работу с NPM, CSS/SASS препроцессоры он должен знать?

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

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

    Вообще такое ощущение, что все вокруг просто на самом деле ничего толково делать не умеют, но пытаются себе цену добавить мнимым знанием кучи всего. Сфокусируйтесь на одном чём-нибудь.
    Человеку, который делает гениальный дизайн, прощают всё - сложный характер, срывы сроков, никакую структуру файлов, Layer1-layer2 - и возвращаются к нему снова, потому что это профессионал в своём деле, и нет совершенно никакой нужды добавлять себе стоимость второстепенными навыками. Разве что самому интересно..
    Ответ написан
    Комментировать
  • Почему тормозит слайдер?

    SeaInside
    @SeaInside
    16 лет пилю все эти штуки
    Оптимизировать SVG путём упрощения фигур (уменьшения числа точек), удаления не значимых элементов, иногда какие-то забытые фигуры встречаются вне viewbox'a.
    Если уже оптимизировано - смириться или переключиться на растровую графику, у всего своя цена, объёмные SVG - стоят дорого.
    Ответ написан
    Комментировать
  • На что влияет p и чему оно равно в css?

    SeaInside
    @SeaInside
    16 лет пилю все эти штуки
    В CSS функции плавности описываются не формулами, а кривой Безье.
    Соответственно - ничему не равно, это просто разные сущности.
    Ну или равно одному из вариантов [sine, quad, cubic, etc] буквенного обозначения, если уж прям хочется определения.

    В вашем JS вы добротность (слово не совсем про это, но лучше не придумалось) воображаемой кривой регулируете с помощью параметра P (sine, quad, cubic и так далее), на CSS - только точки иначе поставить.

    Вот хороший сайт-шпаргалка, с него же можно перейти на вот такой, где можно самому покрутить.
    Ответ написан
    Комментировать
  • Какую стратегию обучения выбрать, когда в запасе есть 1.5 года и смартфон?

    SeaInside
    @SeaInside
    16 лет пилю все эти штуки
    Си и плюсы - это, как правило, серьёзные приложения, которые заказывают компаниям, а не частным лицам.
    То есть придётся устраиваться. Как компании относятся к судимости - актуальных данных у меня нет, но вряд ли что-то сильно изменилось - такое себе отношение, шансов мало, тем более без реального опыта.

    Я бы смотрел на работы, которые можно оказывать в частном порядке. Это всё вещи попроще - веб вполне подходит. Меня ни один заказчик никогда не спрашивал не то что о судимости, но даже об образовании.

    Ну и ещё стоит отметить, что не нужно обманываться большим количеством времени и телефоном на руках - без реального применения знаний закрепляется оно примерно никак. А на телефоне адекватно применять любые ИТ-знания - не получится.
    В любом случае, успехов вам, надеюсь, что сложится когда-то. :)
    Ответ написан
    7 комментариев
  • Данный скилл ближе к верстальщику или начинающему front-end разработчику?

    SeaInside
    @SeaInside
    16 лет пилю все эти штуки
    Вопрос глупый, буду бузить.
    Это не персонально к вам, просто накипело.

    Вам вот это навешивание ярлыков зачем?
    Прочитать документацию и сделать пет-прожект на Реакте/Вью/Свелте, подумать, что тут всё понятно, а потом с лёгким презрением смотреть на тех, кто этого не сделал? Я же теперь не "какой-то верстальщик, я фронтенд-разработчик"? Так назовитесь CSS-архитектором и HTML-гуру, потом откройте горе-стартап и допишите "СЕО `Рога и Копыта`", куда круче смотрится.

    С популяризацией модных фреймворков слово "фронтенд" вообще жутко опопсело.
    "Фронтенд" - это всё, что "не бэкенд", и да, верстальщик - тоже фронтенд-разработчик, внезапно (оставим в стороне вопрос, кому нужен такой разработчик без знания JS).
    Что ж вы дальше не дробите?
    Нарезальщика картинок давайте найдём, оптимизатора SVG-иконок и так далее (FrontOps в сторонке потупил взгляд).

    Вы умеете в базовый JS (надеюсь, не копипастом с кодпена) - вы знаете как делать сайты - этого достаточно для огромного количества бизнесов и разных идей, уметь бы только себя правильно подать.
    Конечно, всегда найдутся те, кто иронично будет звать "формошлёпом", как будто сами не делают 90% времени то же самое, только похороненное под огромным числом абстракций (а часто вообще без понимания, что там под этими абстракциями происходит). Мы же тут разработчики, у нас сложная бизнес-логика - надо три числа в JSON забрать с сервера, с помощью математики второго класса их пересчитать и вывести. В вебе, которым все мы, преимущественно, занимаемся - сложных задач нет. Вообще нет.

    Развивайтесь и продвигайте своё умение решать задачи бизнеса, выбирая правильные инструменты, и продавать себя - и всё нормально будет. Не надо этих ярлыков, смотрите на свою реальную полезность и не оглядывайтесь, кого там и как называют.
    Я повидал "мидл реакт-разработчиков и вообще очень крутых фронтендеров", которые без бутстрапа сетку из трёх колонок не знают как сверстать. Не надо так. Идите с богом.
    Ответ написан
    1 комментарий
  • Какой правильный плагин для группировки @media без конфликтов с sourcemap?

    SeaInside
    @SeaInside
    16 лет пилю все эти штуки
    Только через PostCSS, благо, он у вас уже подключен.
    Раз и два, на выбор.
    Лично я пользуюсь первым, но не то чтобы сравнивал - просто он мне на глаза раньше попался, а вообще это "крайности одной плоти", очень похожие инструменты для решения одной и той же задачи.
    Ответ написан