Людям любых профессий свойственно совершать ошибки, и это нормально. Особенно в начале карьеры. Главное — вовремя замечать ошибки и успевать их предотвращать.

Разбираем, как всё-таки не допустить ошибок при обучении программированию.

Не бойтесь задавать вопросы и просить о помощи. А честность значительно сэкономит время и эмоциональные ресурсы.

Текст — основная часть контента большинства сайтов, поэтому нужно серьёзно относиться к его отрисовке. Стандартный шрифт мало кого удивит, а вот необычный и грамотно подобранный — привлечёт внимание и порадует глаз читателя.⠀

Рассказываем, как правильно подключать нестандартные шрифты и оптимизировать их: https://tml.io/fow4w

Любой разработчик должен понимать, что он делает сайт в первую очередь удобный и быстрый для пользователя. Если сайт долго загружается, пользователи будут покидать страницу.

В результате потери могут быть колоссальными. Для сравнения: крупный бизнес, как Google или Yahoo, теряет миллионы долларов за каждые 100 миллисекунды задержки загрузки сайта. Компания BBC обнаружила, что ко всему прочему 10% пользователей уходит от них за каждую дополнительную секунду загрузки контента. Мотивирует на оптимизацию сайта, не правда ли?

Мой сайт загружает X секунд. Как понять — это долго или нет? Для этого вам нужно замерить скорость загрузки сайтов ваших конкурентов или похожих на вас ресурсов и сделать не медленнее, чем у них. Для проверки скорости загрузки сайта вы можете использовать Pagespeed от Google. В отчёте сервиса будет подробно описано, что можно исправить для повышения быстродействия загрузки сайта.

Пользователи будут ощущать каждые 25% ускорения загрузки вашего сайта. Если сайт загружался 10 секунд, то следующее время, к которому вы должны стремиться — 7,5 секунд. И так шаг за шагом по 25% от предыдущего времени загрузки.

Ещё пара цифр, к которым вы должны стремиться:
Первое отображение изображения или текстового блока, видимого в области просмотра — 2.5 секунды.
Первое взаимодействие с сайтом — 100 миллисекунд. Если это страница с формой, то после показа формы у пользователя должна быть возможность взаимодействовать с ней уже через 100 миллисекунд. То же самое касается и остальных блоков, которые являются важными для страницы.

В 2020-2021 годах быстро загружаемые сайты будут повышаться в списке поисковой выдачи Google. Для постоянного отслеживания изменения загрузки сайта используйте Lighthouse.

Новичкам зачастую сложно понять, какой язык программирования выучить. Вариантов много, знать хочется всё и сразу.⠀⠀

Как насчёт JavaScript? Он отлично подходит для того, чтобы стать первым языком программирования.⠀

Главные его преимущества:
🔸 JavaScript имеет низкий порог входа. Это достаточно простой язык, понятный даже тем, кто никогда не занимался программированием.
🔸 Содержит много готовых решений для базовых задач. А это значит, что придумывать велиосипед вам точно не придётся
🔸 Популярность языка и развитое комьюнити. Практически на любой вопрос можно найти ответ в Google, либо обратиться за помощью к более опытным разработчикам.
⠀
Начните изучать JavaScript c нашим профессиональным курсом «JavaScript. Профессиональная разработка веб-интерфейсов», который рассчитан для новичков, желающих развиваться в IT.

Ребята из компании REG.RU поделились с нами сокровенным и рассказали, как они организовывают рабочий процесс с помощью телеграм-ботов.

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

В новой статье даём подробную инструкцию по настройке подобных ботов: https://tml.io/jsicm

В CSS есть четыре математические функции: min(), max(), clamp() и calc(). Разбор этих функций даётся в статье: http://css.yoksel.ru/css-math/

Поздравляем с Днём учителя всех, кто причастен к празднику!

В честь этого события запускаем акцию — скидка до 70% на тренировочные материалы: навык «Создание семантической разметки по макету» и макет «Детский планетарий».

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

Акция продлится до 7 октября включительно.

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

Давайте разберёмся, какие навыки в первую очередь стоит прокачивать новичку.

Задача верстальщика — создать рабочий интерфейс, используя грамотный и валидный код. В начале пути многим непонятно, где находить решения для правильной вёрстки. Чтобы помочь с ответом, мы создали «профессиональные навыки», в которых собрали примеры решения реальных задач и подготовили подробные инструкции для каждой из них.

В новой статье мы рассказываем, что включают в себя навыки, и как с ними работать: https://tml.io/nfo7i

Напоминаем, что до 7-го октября включительно действует акция — скидка до 70% на тренировочные материалы — навык «Создание семантической разметки по макету» и макет «Детский планетарий».

Туториал реализации эффекта drag & drop на ванильном JavaScript. Разбираем, в каких ситуациях может пригодиться эффект, и как его применять при создании сортировки списка задач.

Статья содержит подробный разбор и интерактивную демонстрацию с полным кодом решения.

Вышел в релиз первый проект по JavaScript средней сложности — «Канбан-доска».

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

В тренировочный комплект входит техническое задание, готовая вёрстка и примеры эталонной реализации.

Продолжаем тему оптимизации сайта. В этот раз разбираем, что надо улучшить при разработке, чтобы сайт должным образом отображался в поисковиках.⠀

Поисковые роботы лучше понимают контент сайта, если у них есть подсказки от разработчиков. Благодаря этим подсказкам результат выдачи для пользователя будет не только релевантным, но и удобным и понятным. ⠀

Давайте рассмотрим основные приёмы улучшения сайта для поисковиков. ⠀

Заполняйте <title>. Title должен быть уникальным для каждой страницы, так как именно он используется в поисковой выдаче. Чем он яснее и понятнее написан, тем больше шансов, что пользователь посетит ваш сайт.⠀

Используйте семантические теги, которые присутствуют в HTML Стандарте. Например, сервис путешествий Tutu.ru использовал в разработке таблицу для расписания электричек. Google это учёл и прямо в выдаче показал удобную и наглядную для пользователя таблицу расписания. Пример можно найти по поисковому запросу «Расписание электричек СПБ — Сестрорецкий курорт».⠀

Если у вас сайт про кулинарию или кино, то карточки рецептов и фильмов лучше описать с помощью дополнительный семантической разметки данных. Самая популярная — https://schema.org/, но есть и другие: Open Graph, JSON-LD. ⠀

Примеры таких карточек можно найти по поисковым запросам: «Курица в духовке» или «Брюс Уиллис». ⠀

Не забывайте про оптимизацию и улучшение сайта при разработке, тогда сайт будет приносить прибыль и пользоваться популярностью.