Задать вопрос
bugo_aneo

Полина Емельянова

Верстальщик по жизни, буддист, кофеман
Лайки

  • Какую схему мотивации можно предложить программисту, решающему сложные задачи (последняя линия поддержки, с задачей никто не смог справиться)?

    AlexanderYudakov
    @AlexanderYudakov
    C#, 1С, Android, TypeScript
    Директор хочет видеть конкретные и измеримые показатели работы.


    Это невозможно.
    Выход один — заменить директора.
    Ответ написан
    Комментировать
    Комментировать

  • Как сделать ризиновым блок с картинкой сжимаемый соседним блоком?

    @hoindex Автор вопроса
    Чувствую себя динозавром.
    Про флексбокс услышал год назад, с комментариями что пока не до конца всеми поддерживается, не стал эксперементировать.

    Кстати по ссылке под float элементами как раз флексбокс, а по ссылке под флексбокс код без правок :)
    Только вот сомнения у меня по поводу float, там же у блоков непонятки с определением высоты нацинаются, соответственно родительский не отыграет как нужно...
    По-крайней мере так у меня и было, и было, изначально делал через float, потом переделал в inline-block
    Ответ написан
    1 комментарий
    1 комментарий

  • Какая есть годная библитека для составления графиков?

    @Insolation
    https://www.chartjs.org/
    Ответ написан
    Комментировать
    Комментировать

  • В чем отличие верстки под CMS (Wordpress/Joomla) от обычной верстки?

    viktorvsk
    @viktorvsk
    Когда кто-то пишет "верстка под ХХХ", то он просто хочет сбить цену.
    Есть прототип\концепт (над ним могут работать копирайтер, специалист по контекстной стратегии, информационные архтектор\дизайнер и т.д и т.п.)
    Есть дизайн, над ним работает дизайнер, художник, графический дизайнер
    Есть верстка, над ней работает верстальщик, который в простом случае верстает с картинки то, что видит, в сложном - он умеет не только jquery плагины подключать (хотя, иногда и не умеет и это, по сути, нормально), но и делать более сложные client-side штуки
    Есть программирование: в простом случае это установить цмс, скачать шаблоны\плагины, настроить. В сложном - взять цмс\магазин и скорректировать необходимый функционал\написать нужные плагины. Ну, или просто взять фреймворк и разработать проект.

    А есть такой момент, как натягивание. Когда дизайнер нарисовал по прототипу дизайн, программисты сделали проект и как-то надо свести концы с концами. И этим должен заниматься отдельный человек. Он может быть верстальщиком, которому придется разобраться в проекте, или программистом, которому придется разобраться в верстке.

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

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

  • Как сверстать два соседних скошенных блока, если у них есть бекграунды?

    webinar
    @webinar
    Учим yii: https://youtu.be/-WRMlGHLgRg
    Мне кажется лучше играться с svg
    pattern-blog.com.ua/article/skoshennyie-elementyi-...
    bennettfeely.com/clippy
    Ответ написан
    Комментировать
    Комментировать

  • Почему между фото разные расстояния?

    Vlad_IT
    @Vlad_IT Куратор тега CSS
    Front-end разработчик
    Ширина у слайдов одинаковая, чтобы задать автоматическую ширину для каждого блока, в конфигурацию slick добавьте variableWidth: true
    Подробнее в документации kenwheeler.github.io/slick в примере "Variable Width"
    Ответ написан
    Комментировать
    Комментировать

  • Непонимание сути Frontend. Как есть?

    @awesomer
    Фронтэнд занимается исключительно тем, что видит пользователь, бэкэнд, соответственно, наоборот.


    Нет, не так.

    Фронтенд-программирование - это создание программы, исполняемой непосредственно браузером у пользователя.
    Бэкенд-программирование - это создание программы, исполняемой на сервере.

    Фронтенд-код вполне может делать не визуальные вещи (да хоть валюту майнить в браузере).
    А бэкенд-код вполне может отдавать готовые странички HTML, которые сразу же отображаются браузером.

    Можно создать сайт с комментариями - если использовать Disquis и т.п.
    Можно создать сайт с авторизацией - если использовать сторонние oAuth

    Вообще для таких как вы - есть специализированные платформы бэкенда типа Google Firebase

    То есть для авторизации и комментариев бэкенд нужен, но можно обойтись и уже готовыми бэкендами. Чужими.
    А вот, к примеру, поиск - вполне можно сделать (без обращения к внешним сервисами поиска) - чисто средствами JS в браузере.
    На сервере нужно только заранее создать индексы и положить их. Но это просто статические файлы. www.tipue.com/search
    Ответ написан
    Комментировать
    Комментировать

  • Как сверстать UIkit, чтобы были примеры кода (с подсветкой ключевых слов HTML) для каждого элемента?

    Salk
    @Salk
    Для подсветки кода используй стороннюю библиотеку, например:
    prismjs.com
    highlightjs.org
    alexgorbatchev.com/SyntaxHighlighter/
    Ответ написан
    1 комментарий
    1 комментарий

  • Жив ли русскоязычный фриланс?

    gadfi
    @gadfi
    https://gamega.org
    он не умер, он просто так пахнет
    Ответ написан
    7 комментариев
    7 комментариев

  • Почему Slick Slider обрезает высоту у активного слайда при centerMode?

    @its2easyy
    Слик считает высоту не учитывая scale, а на блоке .slick-list висит overflow: hidden которое обрезает по высоте.
    Можно к .slick-slide добавить padding-top и padding-bottom, чтобы высота каждого слайда стала равной нужной высоте центрального слайда с увеличенной картинкой, тогда картинка после scale займёт свободное место
    Ответ написан
    Комментировать
    Комментировать

  • Почему Slick Slider обрезает высоту у активного слайда при centerMode?

    fruity4pie
    @fruity4pie
    A
    5a99827b65f11439382203.png

    Вот с этого значения расчитывается высота центрированного слайдера:

    <div class="slick-slide slick-current slick-active slick-center" data-slick-index="0" aria-hidden="false" style="width: 573px;" tabindex="-1" role="option" aria-describedby="slick-slide00"><img src="https://pp.userapi.com/c837322/v837322210/33ccb/saIIiGQzX7g.jpg" alt=""></div>
    Ответ написан
    Комментировать
    Комментировать

  • Как сверстать такой фон?

    dom1n1k
    @dom1n1k
    Ну только цельной картинкой, подложенной в фон. Работать будет, но:
    а) будет дофига весить
    б) нужно думать, как её лучше размножать или тянуть, если будет очень широкий монитор или очень длинная страница.

    В целом дизайн - полное г**но (не только из-за этого фона).
    Ответ написан
    Комментировать
    Комментировать

  • Вёрстка. Как реализовать border внутри блока, а не на его границе? Пример в описании

    @Serator
    outline:1px dashed red;
    outline-offset:-4px;
    Ответ написан
    1 комментарий
    1 комментарий

  • Что почитать программисту о дизайне?

    @itlen
    По типографике и сеткам Чихольда и Мюллера-Брокманна. По анимации можно погуглить Диснея и «Физика в анимации». Много разного интересного, конкретно увы не вспомню. По UX Якоба Нильсена.
    Ответ написан
    3 комментария
    3 комментария

  • Как сделать изогнутую линию?

    webirus
    @webirus
    Тыжверстальщик! Наверстай мне упущенное...
    https://tympanus.net/Development/SectionSeparators/
    Ответ написан
    1 комментарий
    1 комментарий

  • Верстка на CSS фреймворке - много тегов HTML или правила CSS?

    Mike_Ro
    @Mike_Ro
    Python, JS, WordPress, SEO, Bots, Adversting
    Как верстать правильно и по "феншую"?

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

  • Относительные единицы em?

    dom1n1k
    @dom1n1k
    В em удобно задавать размеры внутри одного смыслового блока. В терминологии БЭМ - для элементов. Ну потому что все элементы зависят от своего блока-родителя, подчиняются какой-то внутренней логике, и он применяется как единое целое. Для самого блока задается размер шрифта в rem/px и играет роль "локального корня". А для вложенных элементов, паддингов, отступов - в em.

    В приведенном примере с h1 смысла действительно немного, потому что между body и h1 могут быть ещё элементы. А могут и не быть. А если будут, то непонятно сколько. Ну то есть цепочка наследования не определена точно. Нельзя наследовать размер от элемента, который состоит с тобой в непредсказуемой степени родства.
    Ответ написан
    Комментировать
    Комментировать

  • Какие плюсы и минусы у Mobile First и Desktop First вёрстки?

    Wolfnsex
    @Wolfnsex
    Если не хочешь быть первым - не вставай в очередь!
    Давайте попробую по пунктам:
    Почему (Mobile First) или (Desktop First) лучше ;
    Почему (Mobile First) или (Desktop First) хуже ;
    что-то из серии "Что лучше, ложка или вилка?" Ну Вы поняли... Это вопрос исключительно удобства и он напрямую зависит от того, какой у Вас исходный шаблон, и в какую сторону его проще будет адаптировать. Но даже и в этом случае, слово "лучше" тут мало уместно, скорее это вопрос удобства. Мы (в общей сложности человек 50+, от студентов до матёрых разработчиков) взяв за основу ряд параметров с отметкой "нужно делать вот так" от Google PageSpeed провели массу тестов и дискуссий... В результате которых, едино правильного подхода найдено не было. Самый удобный с точки зрения здравого смысла, был такой вариант:
    1. Сначала пишем все общие стили, описывающие цвета, шрифты и всю такую ерунду
    2. Для каждого диапазона разрешений создаём свой стиль-корректор, который описывает (корректирует) позиционирование элементов, их размеры, размер шрифта и т.д.

    Таким образом, как Вы понимаете, "first" вообще отпадает как таковой, получается "and". Но Google'у не нравится такой подход, он просит запихивать "все важные стили" в , и отделить в таком режиме "важные стили" от "не важных" невозможно, т.к. степень "важности" определяется в зависимости от разрешения устройства. Но, говоря исключительно о личном удобстве - удобнее - начинать с мобильной версии, т.к. она априори "меньше" и расширить элемент гораздо проще, чем "слепить более мелкую его версию".

    Производительность (Mobile First) или (Desktop First) ;
    На производительность это в общей сложности не влияет никак, т.к. Вы банально даже JS'ы можете подгружать нужные на нужное разрешение, по этому вопрос производительности тут вообще сложно обозначить. Хотя, конечно можно опираться на такое условие как "мобильные всегда медленнее чем стационарные устройства", и из этих соображений, если такое условие "сильно вывернуть" и возвести в ранг абсолюта - тоже будет логичнее сначала делать "Mobile first".

    Где и каким сайтам подходит (Mobile First) или (Desktop First) ;
    MobileFirst по определению идеально подходит тем сайтам, которые изначально (в первую очередь) рассчитаны именно на мобильные устройства, например какой-нибудь "музыкальный сервис онлайн, с возможностью прослушивать MP3'шки в качестве 32-64Кбит, специально для тех у кого кончился трафик и интернет работает с ограничениями скорости". Остальное я описал выше :)
    Ответ написан
    2 комментария
    2 комментария

  • Как "зафиксировать" ширину блока при присвоении position: fixed; и контролировать его поведение?

    alvvi
    @alvvi
    export default apathy;
    Вообще поведение полностью логичное. Вы сами пишите
    что, в принципе, естественно, т.к. отчет от экрана, и с этим можно бороться

    относительный размер (как у вас) тоже будет считаться от экрана.
    Насколько я понимаю эту проблему призван решить position: sticky, (поправьте, если нет) но работает он пока что далеко не везде.

    1. В любом решении без JS необходимо будет какое-то фиксированное значение, один из вариантов: добавить контейнеру фиксированный max-width, а блоку 
    width: inherit;
max-width: inherit;

    Таким образом блок унаследует max-width контейнера и не будет выходить за его пределы.

    2. Как контролировать поведение и сделать плавное "скольжение" блока без прыжков на старте?

    "Прыжок" в вашем случае это премещение на 12px от края экрана, поскольку вы добавляете класс с 
    position: fixed 
top: 12px
    только когда scrollTop становится равен offsetTop, а после этого он естественно отпрыгивает вниз на 12px. Чтобы избежать этого надо добавлять класс когда scrollTop равен (offsetTop - 12px), потому что в этом случае блок при добавлении будет уже в "нужном" месте.

    https://codepen.io/Alvvi/pen/MEXeaV
    Ответ написан
    Комментировать
    Комментировать

  • Как "зафиксировать" ширину блока при присвоении position: fixed; и контролировать его поведение?

    Avarskiy
    @Avarskiy 
    .fixed {
	position: relative;
	//width: 100%;
	margin: 0 auto;
	border: 1px solid #0C0;
	background: #EAFFEA;
}


    потому что тут position: relative; и размер он берет относительно родителя. а когда вы делаете блок фиксированным, размер берется относительно окна.
    Ответ написан
    6 комментариев
    6 комментариев