Мы уже в эфире, чтобы поговорить с сотрудниками Selectel о том, как устроен фронтенд в компании, и об опыте найма выпускников Академии — подключайтесь.
Разбираемся, какие существуют популярные способы создания кнопок для закрытия попапов и модальных окон, их плюсы и минусы.
https://habr.com/ru/company/ruvds/blog/505758/
https://habr.com/ru/company/ruvds/blog/505758/
Два факта о сегодняшнем дне:
🌮 в мире отмечается День устойчивой гастрономии (что бы это ни значило);
💸 а мы проводим распродажу вечного доступа к тренажёрам!
При покупке вечного доступа:
— материалы курсов останутся у вас навсегда;
— не нужно продлевать доступ;
— все будущие курсы станут доступны вам без дополнительной оплаты.
Только до 21 июня стоимость тарифа «навсегда» 12990 рублей вместо 18990.
🌮 в мире отмечается День устойчивой гастрономии (что бы это ни значило);
💸 а мы проводим распродажу вечного доступа к тренажёрам!
При покупке вечного доступа:
— материалы курсов останутся у вас навсегда;
— не нужно продлевать доступ;
— все будущие курсы станут доступны вам без дополнительной оплаты.
Только до 21 июня стоимость тарифа «навсегда» 12990 рублей вместо 18990.
Короткая шпаргалка о том, как правильно ставить ссылки и не теряться в адресах.
HTML Academy
Абсолютные и относительные ссылки
Всё, что вы хотели знать об адресации ссылок.
Про консультации с наставниками
На профессиональных курсах с каждым студентом работает наставник. Рассказали, какие типы консультаций доступны для учащихся, и как к ним лучше подготовиться👨💻 А о том, как отличить хорошего наставника от плохого, писали в блоге.
Консультации — это возможность задать своему наставнику любой вопрос по теории или заданию. При этом сначала нужно попробовать найти решение самостоятельно. И только если вы не смогли найти решение ни в лекции, ни в материалах, ни в интернете, стоит это добавить в список своих вопросов, которые вы планируете обсудить на ближайшей консультации.
Консультации могут быть как голосовыми, так и письменными. Наличие двух подходов не означает, что вам нужно выбрать только один из них. Они легко сочетаются и могут быть использованы в зависимости от ситуации и сложности вопросов, которые необходимо обсудить с наставником. Если вы не уверены, какой из вариантов подойдёт вам лучше, обсудите это с наставником сразу после знакомства. Вы можете уточнить в каком формате удобно работать вашему наставнику и рассказать о том, как хотели бы работать вы.
Голосовые консультации подойдут тем, кто легко воспринимает информацию на слух или у кого ограничено количество свободного времени на общение с наставником. На такой консультации вы сможете задавать дополнительные вопросы или уточнять то, что вам не понятно, «в прямом эфире». При этом мы советуем не конспектировать ответы наставника, чтобы не терять нить объяснений, а записывать разговор на видео. Для этого можно использовать либо функцию записи, встроенную прямо в Skype, либо установить любую программу для захвата экрана. Для удобной навигации по записи при перепросмотре мы советуем всегда проводить такие консультации с шарингом экрана.
Если вам неудобно общаться с наставником голосом — используйте письменные консультации. Перед консультацией лучше всего собирать вопросы в ходе изучения материалов или выполнения домашних заданий, а потом присылать их все сразу в виде нумерованного списка. В таком формате вам будет легче сохранять контекст ответов и не придётся переспрашивать на какой вопрос это был ответ.
На профессиональных курсах с каждым студентом работает наставник. Рассказали, какие типы консультаций доступны для учащихся, и как к ним лучше подготовиться👨💻 А о том, как отличить хорошего наставника от плохого, писали в блоге.
Консультации — это возможность задать своему наставнику любой вопрос по теории или заданию. При этом сначала нужно попробовать найти решение самостоятельно. И только если вы не смогли найти решение ни в лекции, ни в материалах, ни в интернете, стоит это добавить в список своих вопросов, которые вы планируете обсудить на ближайшей консультации.
Консультации могут быть как голосовыми, так и письменными. Наличие двух подходов не означает, что вам нужно выбрать только один из них. Они легко сочетаются и могут быть использованы в зависимости от ситуации и сложности вопросов, которые необходимо обсудить с наставником. Если вы не уверены, какой из вариантов подойдёт вам лучше, обсудите это с наставником сразу после знакомства. Вы можете уточнить в каком формате удобно работать вашему наставнику и рассказать о том, как хотели бы работать вы.
Голосовые консультации подойдут тем, кто легко воспринимает информацию на слух или у кого ограничено количество свободного времени на общение с наставником. На такой консультации вы сможете задавать дополнительные вопросы или уточнять то, что вам не понятно, «в прямом эфире». При этом мы советуем не конспектировать ответы наставника, чтобы не терять нить объяснений, а записывать разговор на видео. Для этого можно использовать либо функцию записи, встроенную прямо в Skype, либо установить любую программу для захвата экрана. Для удобной навигации по записи при перепросмотре мы советуем всегда проводить такие консультации с шарингом экрана.
Если вам неудобно общаться с наставником голосом — используйте письменные консультации. Перед консультацией лучше всего собирать вопросы в ходе изучения материалов или выполнения домашних заданий, а потом присылать их все сразу в виде нумерованного списка. В таком формате вам будет легче сохранять контекст ответов и не придётся переспрашивать на какой вопрос это был ответ.
Что должен уметь верстальщик в 2020 году: собрали список навыков, которые повышают шансы найти работу.
HTML Academy
Что должен уметь верстальщик
Рассказываем об основных технологиях и инструментах, которые требуются в вакансиях верстальщика.
На нашем сайте опубликован в открытом доступе учебник по PHP.
Он состоит из шести глав:
— Знакомство с языком;
— Шаблонизация и подключение файлов;
— Протокол HTTP и формы;
— Идентификация пользователя на сайте;
— Базы данных;
— Объекты и использование библиотек.
Учебник полностью актуален, рассчитан для новичков и подходит для желающих освоить основы языка.
Пользуйтесь на здоровье!
Он состоит из шести глав:
— Знакомство с языком;
— Шаблонизация и подключение файлов;
— Протокол HTTP и формы;
— Идентификация пользователя на сайте;
— Базы данных;
— Объекты и использование библиотек.
Учебник полностью актуален, рассчитан для новичков и подходит для желающих освоить основы языка.
Пользуйтесь на здоровье!
Туториал по реализации эффекта drag & drop на ванильном JavaScript. Разбираем на примере сортировки списка задач.
В конце статьи — ссылка на интерактивную демонстрацию с полным кодом решения.
В конце статьи — ссылка на интерактивную демонстрацию с полным кодом решения.
HTML Academy
Туториал. Список задач с drag & drop
Расписали по шагам, как сделать интерактивный список задач, используя HTML Drag and Drop API.
Как доступно прятать и стилизовать чекбоксы и радиокнопки.
https://www.sarasoueidan.com/blog/inclusively-hiding-and-styling-checkboxes-and-radio-buttons/
https://www.sarasoueidan.com/blog/inclusively-hiding-and-styling-checkboxes-and-radio-buttons/
Будучи веб-разработчиком, вам, наверняка, доведётся поработать с тестировщиками. Чтобы знать, к чему готовиться, мы поговорили с Михаилом, специалистом по тестированию из Яндекс.Денег.
Получилось 18 вопросов о его работе и о том, что тестировщиков бесит в программистах.
Получилось 18 вопросов о его работе и о том, что тестировщиков бесит в программистах.
Запускаем новый продукт на базе Акселератора — «Аттестацию». Она поможет узнать свой уровень в вёрстке и понять, какие навыки развивать в первую очередь.
Как проходит «Аттестация»:
— вы получаете вводную информацию, макет и техническое задание;
— мы засекаем ровно 7 дней с момента получения вами макета (этого достаточно для работы в комфортном темпе);
— затем проверяем вашу работу на соответствие техническому заданию и критериям, подводим итоги и пишем фидбек;
— возвращаем вам результат, в котором вы найдете файл с проверкой, где указаны ошибки по конкретным критериям, и рекомендации для дальнейшего развития.
«Аттестация» — как экзамен в университете, только все полученные навыки пригодятся в работе.
10 первых проектов в «Аттестации» доступны за 2000 ₽ вместо 2500 ₽ ⚡️
Как проходит «Аттестация»:
— вы получаете вводную информацию, макет и техническое задание;
— мы засекаем ровно 7 дней с момента получения вами макета (этого достаточно для работы в комфортном темпе);
— затем проверяем вашу работу на соответствие техническому заданию и критериям, подводим итоги и пишем фидбек;
— возвращаем вам результат, в котором вы найдете файл с проверкой, где указаны ошибки по конкретным критериям, и рекомендации для дальнейшего развития.
«Аттестация» — как экзамен в университете, только все полученные навыки пригодятся в работе.
10 первых проектов в «Аттестации» доступны за 2000 ₽ вместо 2500 ₽ ⚡️
Цикл статей про базовые возможности Chrome DevTools:
«Введение в Chrome DevTools. Панель Elements» — https://tml.io/38z3d
«Введение в Chrome DevTools. Console, Sources, Network» — https://tml.io/2p9jt
«Введение в Chrome DevTools. Панель Elements» — https://tml.io/38z3d
«Введение в Chrome DevTools. Console, Sources, Network» — https://tml.io/2p9jt
HTML Academy
Введение в Chrome DevTools. Панель Elements
Рассказали, как Chrome DevTools помогут вам при вёрстке интерфейсов.
Разрабатывать программы можно самостоятельно, делая всё с нуля, или прибегнув к помощи фреймворков.
Фреймворк — это набор библиотек и компонентов, которые предоставляют собой базовый каркас продукта. Они нужны для того, чтобы разработчикам не приходилось каждый раз при типовых задачах «изобретать колесо». Самый популярный HTML/CSS фреймворк — это Bootstrap.
Фреймворки ограничивают программиста своей архитектурой, но экономят время на разработку и упрощают подключение новых людей к проекту, так как есть стандарты и порядок при работе с конкретным фреймворком.
Фреймворк — это набор библиотек и компонентов, которые предоставляют собой базовый каркас продукта. Они нужны для того, чтобы разработчикам не приходилось каждый раз при типовых задачах «изобретать колесо». Самый популярный HTML/CSS фреймворк — это Bootstrap.
Фреймворки ограничивают программиста своей архитектурой, но экономят время на разработку и упрощают подключение новых людей к проекту, так как есть стандарты и порядок при работе с конкретным фреймворком.
Список цветов в CSS, сгруппированных по оттенкам, яркости и насыщенности.
https://enes.in/sorted-colors/
https://enes.in/sorted-colors/
Почему компании смотрят на софт-скиллы
На собеседованиях работодатели обращают внимание не только на технические знания, но и на софт-скиллы (или «гибкие навыки»). Иначе говоря на то, как человек общается, реагирует на критику, насколько он организован.
Почему это важно
Для этого есть очень простое объяснение — человека не хочется перевоспитывать на работе. Подтянуть знания — несложно: нужен только учебник и наставник. Но объяснить человеку, что он себя как-то не так ведёт — сложнее и болезненнее. Поэтому берут на работу тех, с кем будет комфортно взаимодействовать всем членам команды, даже если его навыки чуть менее развиты, чем у других претендентов на должность.
Что же делать на собеседовании
Обращайте внимание, насколько ясно и понятно вы доносите свою мысль. При указании на ошибку — не воюйте, учитесь признавать свои ошибки и исправлять их. На собеседовании будьте дружелюбны и позитивно настроены.
Готовы быстро учиться и приспосабливаться к новым условиям? Здорово, в сфере веб-разработки это точно пригодится! Опишите работодателю, как вы осваивали новую технологию, расскажите, что ещё планируете выучить и куда планируете развиваться.
Если представится возможность — расскажите о своих менеджерских навыках: что вы хорошо организуете свою работу, не срываете дедлайны, готовы взаимодействовать и общаться с коллегами из других отделов. Не во всех компаниях эту работу за вас будет делать тимлид, поэтому умение общаться и решать проблемы — это важно.
Прокачивайтесь
Если чувствуете, что с гибкими навыками есть проблемы — осознайте их и работайте над собой. Начните с нашей статьи о том, какие софт-скиллы прокачивать начинающему разработчику. И вот ещё несколько книг, которые тоже помогут в развитии:
М. Дорофеев. «Джедайские техники: Как воспитать свою обезьяну, опустошить инбокс и сберечь мыслетопливо» — развиваем личную эффективность.
М. Мэнсон. «Тонкое искусство Пофигизма. Парадоксальный способ быть счастливым» — прокачиваем стрессоустойчивость.
Г. Кеннеди. «Договориться можно обо всём! Как добиваться максимума в любых переговорах» — учимся договариваться и общаться.
На собеседованиях работодатели обращают внимание не только на технические знания, но и на софт-скиллы (или «гибкие навыки»). Иначе говоря на то, как человек общается, реагирует на критику, насколько он организован.
Почему это важно
Для этого есть очень простое объяснение — человека не хочется перевоспитывать на работе. Подтянуть знания — несложно: нужен только учебник и наставник. Но объяснить человеку, что он себя как-то не так ведёт — сложнее и болезненнее. Поэтому берут на работу тех, с кем будет комфортно взаимодействовать всем членам команды, даже если его навыки чуть менее развиты, чем у других претендентов на должность.
Что же делать на собеседовании
Обращайте внимание, насколько ясно и понятно вы доносите свою мысль. При указании на ошибку — не воюйте, учитесь признавать свои ошибки и исправлять их. На собеседовании будьте дружелюбны и позитивно настроены.
Готовы быстро учиться и приспосабливаться к новым условиям? Здорово, в сфере веб-разработки это точно пригодится! Опишите работодателю, как вы осваивали новую технологию, расскажите, что ещё планируете выучить и куда планируете развиваться.
Если представится возможность — расскажите о своих менеджерских навыках: что вы хорошо организуете свою работу, не срываете дедлайны, готовы взаимодействовать и общаться с коллегами из других отделов. Не во всех компаниях эту работу за вас будет делать тимлид, поэтому умение общаться и решать проблемы — это важно.
Прокачивайтесь
Если чувствуете, что с гибкими навыками есть проблемы — осознайте их и работайте над собой. Начните с нашей статьи о том, какие софт-скиллы прокачивать начинающему разработчику. И вот ещё несколько книг, которые тоже помогут в развитии:
М. Дорофеев. «Джедайские техники: Как воспитать свою обезьяну, опустошить инбокс и сберечь мыслетопливо» — развиваем личную эффективность.
М. Мэнсон. «Тонкое искусство Пофигизма. Парадоксальный способ быть счастливым» — прокачиваем стрессоустойчивость.
Г. Кеннеди. «Договориться можно обо всём! Как добиваться максимума в любых переговорах» — учимся договариваться и общаться.
Текст — основная часть контента на большинстве сайтов, и важно грамотно подходить к его отрисовке. В этой статье мы разберём базовые моменты, касающиеся подключения и оптимизации шрифтов.
HTML Academy
Как подключить и оптимизировать нестандартные шрифты
Рассказали про ускорение загрузки шрифтов и их подключение через Google Fonts и @font-face.
Советы по созданию сложных CSS-иллюстраций.
https://css-tricks.com/advice-for-complex-css-illustrations/
https://css-tricks.com/advice-for-complex-css-illustrations/
Отзыв выпускника девятнадцатого потока «HTML и CSS. Адаптивная вёрстка и автоматизация» #19 Ильи Исаченкова. Новый поток курса стартует уже 13 июля!
«Я обучаюсь на профессии «Фронтенд-разработчик», и это уже второй интенсив, который я защитил на 100%. Честно, по сравнению «HTML и CSS. Профессиональная вёрстка сайтов» он мне дался легче, потому что уже были базовые знания с первого уровня. Но были свои трудности и непонимание того, что происходит. Приходилось по нескольку раз смотреть одну и ту же лекцию и один раз даже переписать полностью проект с нуля.
На этом уровне получил колоссальную базу навыков, которую не получил бы нигде. Научился оптимизации сайта и его контента, что в наше время очень и очень важно. Потому что если сайт будет долго грузиться, фирма потеряет очень много клиентов.
Мои советы тем, кто хочет прийти на этот интенсив или профессию. Первое — изначально пройти все-все интерактивные тренажёры, потому что большую часть базовых знаний и небольшой практики дают именно они. Второе — выбрать хорошего наставника, потому что от него зависит всё. После чего не бояться делать ошибки и находить правильные варианты решения проблемы. Потому что пока ты не встретишь проблему,ты ни когда не найдешь решение, чтобы больше не совершать такую ошибку.
На данном уровне будет колоссально много строк кода, но мой совет — не стоит бояться. Глаза боятся, а руки кодят!»
«Я обучаюсь на профессии «Фронтенд-разработчик», и это уже второй интенсив, который я защитил на 100%. Честно, по сравнению «HTML и CSS. Профессиональная вёрстка сайтов» он мне дался легче, потому что уже были базовые знания с первого уровня. Но были свои трудности и непонимание того, что происходит. Приходилось по нескольку раз смотреть одну и ту же лекцию и один раз даже переписать полностью проект с нуля.
На этом уровне получил колоссальную базу навыков, которую не получил бы нигде. Научился оптимизации сайта и его контента, что в наше время очень и очень важно. Потому что если сайт будет долго грузиться, фирма потеряет очень много клиентов.
Мои советы тем, кто хочет прийти на этот интенсив или профессию. Первое — изначально пройти все-все интерактивные тренажёры, потому что большую часть базовых знаний и небольшой практики дают именно они. Второе — выбрать хорошего наставника, потому что от него зависит всё. После чего не бояться делать ошибки и находить правильные варианты решения проблемы. Потому что пока ты не встретишь проблему,ты ни когда не найдешь решение, чтобы больше не совершать такую ошибку.
На данном уровне будет колоссально много строк кода, но мой совет — не стоит бояться. Глаза боятся, а руки кодят!»
Подборка подробных туториалов из нашего блога:
«Простая анимация на чистом CSS» — рассказали, как создать анимацию с нуля.
«Интерактивная SVG-диаграмма» — показали, как создавать SVG-элементы, добавлять им анимацию и интерактивность.
«Список задач с drag & drop» — расписали по шагам, как сделать интерактивный список задач, используя HTML Drag and Drop API.
«Простая анимация на чистом CSS» — рассказали, как создать анимацию с нуля.
«Интерактивная SVG-диаграмма» — показали, как создавать SVG-элементы, добавлять им анимацию и интерактивность.
«Список задач с drag & drop» — расписали по шагам, как сделать интерактивный список задач, используя HTML Drag and Drop API.
HTML Academy
Туториал. Простая анимация на чистом CSS
Рассказали, как создать анимацию с нуля.
Открыт набор тестировщиков для новой главы ⚡
С тестирования последней главы тренажёра «Знакомство с PHP» прошёл почти месяц… а это значит, что настало время тестировать новую главу! Кто готов помочь?
Город и часовой пояс значения не имеют. Тестирование будет проходить удалённо. За свои труды каждый тестировщик получит навык на выбор.
Минимальные требования для участия в тестировании:
пройден курс «Знакомство с HTML и CSS»,
пройдены первые три главы курса «Знакомство с PHP».
Чтобы стать тестировщиком, заполните анкету: https://forms.gle/Q1dfnjPTTnTXkCZe7
P.S. Заполненная анкета не гарантирует участия в тестировании. Если вас отобрали, то через несколько дней на указанную почту придёт письмо с инструкцией. Если нет — пожалуйста, не расстраивайтесь. Будут новые главы и новые тестирования
С тестирования последней главы тренажёра «Знакомство с PHP» прошёл почти месяц… а это значит, что настало время тестировать новую главу! Кто готов помочь?
Город и часовой пояс значения не имеют. Тестирование будет проходить удалённо. За свои труды каждый тестировщик получит навык на выбор.
Минимальные требования для участия в тестировании:
пройден курс «Знакомство с HTML и CSS»,
пройдены первые три главы курса «Знакомство с PHP».
Чтобы стать тестировщиком, заполните анкету: https://forms.gle/Q1dfnjPTTnTXkCZe7
P.S. Заполненная анкета не гарантирует участия в тестировании. Если вас отобрали, то через несколько дней на указанную почту придёт письмо с инструкцией. Если нет — пожалуйста, не расстраивайтесь. Будут новые главы и новые тестирования
Google Docs
Анкета тестировщика