Ответы пользователя по тегу HTML
  • Какие тестовые задания дают на верстальщика?

    tolfy
    @tolfy
    Фирменный стиль
    Требование работодателя ради тестирования на вакансию что-то сверстать яркий признак проблем с работодателем в будущем.

    Вариантов причин подобного подхода немного:
    • В конторе либо нет программиста(ов), способных провести классическое собеседование с будущим коллегой, либо они есть, но в конторе бардак с дисциплиной и ролями. (будет крайне тяжело работать)
    • Это не контора, а чел "набрал по объявлению", как правило "под идею", в надежде либо развиться во что-то за счёт стартового энтузиазма новичков, либо тупо ставя на использование рабского труда, типа, "не платили и я сам ушёл". (нормальной работы не получится вообще, наниматель вначале немного может и заплатит)
    • Чистое мошенничество "на доверии", посредничество между заказчиками и разовыми исполнителями. (работы много, вся без оплаты, много нервов)

      Любой другой вариант -- из области фантастики.

      По стандарту, кандидата просят что-то предъявить, какие-то образцы его работ (если нет портфолио), проводят собеседование (часто не одно). Солидные конторы изучают кандидатов и их скилы ещё до всякого собеседования :)

      p.s. имейте свои заготовки, выполненные самостоятельно(не копипаст) и залитые вами на какой-то доступный хостинг, с использованием разных технологий и сеток, например:
      //на чистом CSS //с bootstrap //с *SS(препроцессоры);
      реализация этого добра в виде //трёх-страничного сайта //леддинга //+ какая-нибудь сложная форма (корзина интернет-магазина тут выигрывает)
      Это и показывайте, пары-тройки примеров вполне должно хватить работодателю для оценки культуры и мастерства верстальщика.
      заодно натренируетесь ;)
      Удачи!
    Ответ написан
    Комментировать
  • Как кроссбраузерно растянуть видео?

    tolfy
    @tolfy
    Фирменный стиль
    попробуйте
    https://css-tricks.com/almanac/properties/o/object-fit/
    (в комментах много дельного, особенно от Federico Brigante )
    Ответ написан
    2 комментария
  • Как с помощью css создать таблицу по центру экрана?

    tolfy
    @tolfy
    Фирменный стиль
    table же :)
    Пример на table

    p.s. заточено под ваши условия
    Ответ написан
    Комментировать
  • Как сделать действие после анимации при hover?

    tolfy
    @tolfy
    Фирменный стиль
    Комментировать
  • Как организован workflow фронтенд разработчика?

    tolfy
    @tolfy
    Фирменный стиль
    Есть работа. Реальный сайт в количестве 1шт.
    Советы получите в процессе производства.
    скайп antonybark
    Ответ написан
    Комментировать
  • Как сделать резиновый svg?

    tolfy
    @tolfy
    Фирменный стиль
    может быть так? preserveAspectRatio="none"
    Ответ написан
    Комментировать
  • Какой редактор для разработки вы используете?

    tolfy
    @tolfy
    Фирменный стиль
    история моих редакторов за 15 лет:
    notepad*, php editor, notepad+, sublime*, shorm, idea
    * использую и сейчас
    Ответ написан
    Комментировать
  • Верстать без фреймвороков это значит быть не професионалом?

    tolfy
    @tolfy
    Фирменный стиль
    тема годная )
    если верстак не умеет "писать код руками", применение им бутстрап и прочих "ускоряющих дело" технологий только во вред делу.
    от "яростных" поборников технологий бывает потом ох как немало проблем
    Ответ написан
    Комментировать
  • Требования в вакансиях для верстальщиков?

    tolfy
    @tolfy
    Фирменный стиль
    Г-да, не ломайте копий )

    Верстальщик владеет профессионально HTML{XML}\CSS

    + хорошо знаком с рядом графических программ и базовых технологий для уверенной работы с макетами от дизайнеров: иконки, растрово-векторные дела{PNG\SVG}, спрайты.. понимание основ типографики и "usability" очень приветствуется ;-)

    + верстак способен не накосячить в применении шаблонов JS (счётчики, эффекты и проч.)

    + также надо уметь не косячить, верстая в "смешанном" коде, с пересекающимися технологиями (PHP, JAVA, NODEJS ..), понимая основные языки программирования на уровне простейшего синтаксиса, и не более того (понимать механизмы работы "программерского" кода - лишнее, главное понимать, где начинается и где кончается "чужой" код, применение "''" и тд. )
    -- в последнем верстальщику вполне помогают специализированные инструменты, подсвечивающие синтаксис и ошибки, например верстать в среде IntelliJ IDEA )

    Естественно, знание VCS SFTP/SCP основ работы с хостингом всегда приветствуется

    Вообще, умение быстро "раскусывать" проблемы и грамотный подбор инструментария для работы, по-моему, самые важные вещи для верстальщика

    всем бобра!
    Ответ написан
    Комментировать
  • Как организовать план дальнейшего развития front-end разработчика?

    tolfy
    @tolfy
    Фирменный стиль
    spacetraveller! стукните скайп antonybark
    Ответ написан
    Комментировать
  • Где можно почитать про правила построения Web страниц?

    tolfy
    @tolfy
    Фирменный стиль
    Банально, но крайне практично и эффективно:
    видим сайт с хорошим или приятным нашему глазу дизайном:
    а\ жмём ПКМ > Исходный код
    б\ жмём F12
    изучаем. Учимся
    Рекомендую!

    p.s. Если что-то в коде не понимаем или просто находим интересные моменты кода - повторяем это самостоятельно в своём HTML\CSS, как урок.
    Ответ написан
    Комментировать
  • БЭМ. Не понятие основных понятий - блок, элемент, модификатор?

    tolfy
    @tolfy
    Фирменный стиль
    BEM шляпа. bem2.pngbem1.gif
    Ответ написан
    Комментировать
  • Расположить шесть DIV в две колонки/три строки. Существует ли решение?

    tolfy
    @tolfy
    Фирменный стиль
    обычный html\css тоже справляется
    <!DOCTYPE html>
    <html>
    <head>
    	<meta charset="utf-8">
    <style type="text/css">
      html{height:100px;margin:0;padding:0;}
      body{margin:0;padding:0;}
      .L1,.R1,.L2,.R2,.L3,.R3{display:inline-block;}
      .L1,.L3,.R2{background-color:#EEE;}
      .L1,.R1,.L2,.R2,.L3,.R3{width:100%;}
      .dr{float:right;width:50%;}
      .dl{float:left;width:50%;}
    @media screen and (max-width : 600px){.dr,.dl{float:none !important;width:100% !important;}
      .L1,.R1,.L2,.R2,.L3,.R3{display:block;}}
    </style>
    </head>
    <body>
      <div class="dl">
        <div class="L1">L1
         <pre><br><br><br><br><br></pre>
        </div>
        <div class="L2">L2
        </div>
        <div class="L3">L3
         <pre><br><br><br><br><br></pre>
        </div>
      </div>
      <div class="dr">
        <div class="R1">R1
        </div>
        <div class="R2">R2
          <pre><br><br><br><br><br></pre>
        </div>
        <div class="R3">R3
        </div>
      </div>
    </body>
    </html>

    пример на codepen
    Ответ написан