Через 15 минут в прямом эфире расскажем, как продолжить развиваться в IT и что вас ждёт дальше.
Вы ещё успеваете присоединиться
Вы ещё успеваете присоединиться
👍11
Подборка инструментов для работы с SVG
SVG — вид графики, которую образуют детали будущего изображения: линии, кривые, эллипсы, круги, прямоугольники. Картинки формата SVG легко масштабировать, а ещё они быстро загружаются, нет проблем с адаптивностью.
В подборке собрали несколько инструментов, которые помогут разработчику в два клика оптимизировать и конвертировать графику формата SVG.
SVGOMG — оптимизация и очищение SVG от всякого мусора.
SVG to bg — конвертер SVG-иконок в код для использования в CSS. Подробная инструкция прилагается на сайте автора.
URL-encoder для SVG — конвертируем SVG для использования его в качестве background-image, border-image или mask.
SVG — вид графики, которую образуют детали будущего изображения: линии, кривые, эллипсы, круги, прямоугольники. Картинки формата SVG легко масштабировать, а ещё они быстро загружаются, нет проблем с адаптивностью.
В подборке собрали несколько инструментов, которые помогут разработчику в два клика оптимизировать и конвертировать графику формата SVG.
SVGOMG — оптимизация и очищение SVG от всякого мусора.
SVG to bg — конвертер SVG-иконок в код для использования в CSS. Подробная инструкция прилагается на сайте автора.
URL-encoder для SVG — конвертируем SVG для использования его в качестве background-image, border-image или mask.
👍18🔥2
Вчера мы рассказали про скидку на курс «Профессиональная вёрстка сайтов». С профессией «Фронтенд-разработчик» всё точно также. Начало обучения — 13 декабря, если записываетесь до 11 октября — получаете профессию по самой выгодной цене.
Узнать подробнее и записаться
Узнать подробнее и записаться
HTML Academy
Профессия «Фронтенд-разработчик»
Курс разработан для тех, кто хочет сменить профессию и стать высокооплачиваемым профессионалом. Он подойдёт для работающих людей, у которых мало времени.
👍4🔥3
Что такое семантическая вёрстка и зачем она нужна
Семантическая вёрстка — подход к разметке, который опирается не на содержание сайта, а на смысловое предназначение каждого блока и логическую структуру документа.
Если вы ещё только знакомитесь с вёрсткой, то пора узнать про основные теги и как их использовать, как разметить страницу и где чаще всего ошибаются новички.
Всё в статье, узнать
Семантическая вёрстка — подход к разметке, который опирается не на содержание сайта, а на смысловое предназначение каждого блока и логическую структуру документа.
Если вы ещё только знакомитесь с вёрсткой, то пора узнать про основные теги и как их использовать, как разметить страницу и где чаще всего ошибаются новички.
Всё в статье, узнать
HTML Academy
Что такое семантическая вёрстка и зачем она нужна
Или почему лучше не использовать дивы и спаны для всего подряд.
🔥9👍2
Хотите, завтра опубликуем инструкцию по методике семантической вёрстки?
Anonymous Poll
94%
Да
6%
Нет
🔥14
Идеи для анимаций по ховеру: подборка с CodePen
CSS-анимации по ховеру — отличный способ сделать сайт ещё более увлекательным. Каждая картинка, подпись или логотип могут стать интерактивным развлечением для пользователя. Собрали несколько интересных вариантов в подборке, смотрите и забирайте в проект.
Танец клавиш
автор: @Numb boi Nate
Анимация изображения
автор: @RomainJeff
Анимация кнопок
автор: @webcrafterscz
Touch ID анимация
автор: @ctcworksg
Анимация логотипа
автор: @Joseph Victory
А чтобы научиться делать также — приходите на курс «CSS-анимации», сейчас его можно пройти со скидкой 30%. Ещё есть пакет «Золотой», в котором три курса: «CSS-анимации», «Алгоритмы и структуры данных» и TypeScript. На этот пакет тоже действует скидка. Вы сможете научиться делать не только анимации, но и полноценно встраивать их в любой пользовательский интерфейс, самостоятельно продумывать логику, чтобы всё работало как надо.
Забрать весь пакет или необходимый курс
CSS-анимации по ховеру — отличный способ сделать сайт ещё более увлекательным. Каждая картинка, подпись или логотип могут стать интерактивным развлечением для пользователя. Собрали несколько интересных вариантов в подборке, смотрите и забирайте в проект.
Танец клавиш
автор: @Numb boi Nate
Анимация изображения
автор: @RomainJeff
Анимация кнопок
автор: @webcrafterscz
Touch ID анимация
автор: @ctcworksg
Анимация логотипа
автор: @Joseph Victory
А чтобы научиться делать также — приходите на курс «CSS-анимации», сейчас его можно пройти со скидкой 30%. Ещё есть пакет «Золотой», в котором три курса: «CSS-анимации», «Алгоритмы и структуры данных» и TypeScript. На этот пакет тоже действует скидка. Вы сможете научиться делать не только анимации, но и полноценно встраивать их в любой пользовательский интерфейс, самостоятельно продумывать логику, чтобы всё работало как надо.
Забрать весь пакет или необходимый курс
🔥7
Положительные ответы в опросе делают своё дело — мы публикуем отрывок из навыка «Создание семантической разметки по макету».
Читать
Читать
👍27❤1🥰1
17 октября стартует курс «React. Разработка сложных клиентских приложений»
Разработчик, который дружит с React и TypeScript, уже не верстает макеты, он пишет приложения и продумывает их логику, разрабатывает пользовательские интерфейсы, с которыми ежедневно взаимодействуют миллионы людей.
На рынке труда его зарплата начинается минимум с 80 000 рублей. Этих денег вполне может хватить, чтобы снять маленькую студию и съехать от родителей или купить билет на самолёт и улететь, куда хочется.
Здесь должна быть красивая картинка со словами «Записывайтесь на курс», но мы скажем чуть иначе. Мы будем рады новым студентам. Дадим все необходимые знания и практику для старта в профессии «React-разработчик».
Для записи кликать сюда
Разработчик, который дружит с React и TypeScript, уже не верстает макеты, он пишет приложения и продумывает их логику, разрабатывает пользовательские интерфейсы, с которыми ежедневно взаимодействуют миллионы людей.
На рынке труда его зарплата начинается минимум с 80 000 рублей. Этих денег вполне может хватить, чтобы снять маленькую студию и съехать от родителей или купить билет на самолёт и улететь, куда хочется.
Здесь должна быть красивая картинка со словами «Записывайтесь на курс», но мы скажем чуть иначе. Мы будем рады новым студентам. Дадим все необходимые знания и практику для старта в профессии «React-разработчик».
Для записи кликать сюда
👍10
Ликбез по паттернам проектирования
Многие проблемы, с которыми разработчики сталкиваются в работе, уже кто-то решил. Поэтому не нужно придумывать новые решения или создавать костыли — лучше использовать в проекте готовые паттерны.
Паттернов проектирования много, и каждый решает свои задачи. В статье рассказали, какие паттерны бывают, какие проблемы решают, как и когда их можно использовать.
Многие проблемы, с которыми разработчики сталкиваются в работе, уже кто-то решил. Поэтому не нужно придумывать новые решения или создавать костыли — лучше использовать в проекте готовые паттерны.
Паттернов проектирования много, и каждый решает свои задачи. В статье рассказали, какие паттерны бывают, какие проблемы решают, как и когда их можно использовать.
HTML Academy
Паттерны проектирования
«Абстрактная фабрика» это вам не просто «Фабрика»
🔥7👍1
Все научились программировать. А дальше-то что?
Идеи и предложения, что делать, если вы уже научились программировать, но не знаете, куда со своими знаниями податься дальше.
Заглядывайте, чтобы узнать
Идеи и предложения, что делать, если вы уже научились программировать, но не знаете, куда со своими знаниями податься дальше.
Заглядывайте, чтобы узнать
HTML Academy
Все научились программировать. А дальше-то что?
Ученье — свет.
👍15❤1
Мне тяжело учиться, кто поможет?
Вы записались на курс. Сначала всё было хорошо, мотивации море, задания делаются за секунду. Но вот, прошёл месяц, сложности нашли вас и застали врасплох.
В статье мы расскажем, к кому и с каким вопросом вы можете обратиться в Академии, чтобы быстро получить помощь.
Лучи поддержки и розовые сердечки тут
Вы записались на курс. Сначала всё было хорошо, мотивации море, задания делаются за секунду. Но вот, прошёл месяц, сложности нашли вас и застали врасплох.
В статье мы расскажем, к кому и с каким вопросом вы можете обратиться в Академии, чтобы быстро получить помощь.
Лучи поддержки и розовые сердечки тут
HTML Academy
Мне тяжело учиться, кто поможет?
Попали в патовую ситуацию? Тогда кликайте на статью.
👍15❤6
Подборка статей, которые ответят на все вопросы о вёрстке
Сели за первый проект? Отлично, желаем удачи и советуем несколько статей из блога, которые помогут не закрыть редактор кода в первые десять минут и довести начатое до конца.
Как написать и запустить HTML на компьютере
За 6 шагов разберётесь, как и в чём написать и запустить HTML-код на своём компьютере.
Обзор редакторов кода
Редакторов кода много — даже из числа популярных. Они есть под любую систему, некоторые даже работают в терминале. В этой статье — обзоры VS Code, Atom и Sublime Text. Узнайте, что они умеют, как к ним прикрутить плагины и как это всё будет работать.
Как сверстать макет. Пошаговый план
Когда разобрались, как запустить HTML на компьютере, установили редактор кода и поняли, как в нём работать — настало самое время приступить к вёрстке. Наш план вам в помощь.
Сели за первый проект? Отлично, желаем удачи и советуем несколько статей из блога, которые помогут не закрыть редактор кода в первые десять минут и довести начатое до конца.
Как написать и запустить HTML на компьютере
За 6 шагов разберётесь, как и в чём написать и запустить HTML-код на своём компьютере.
Обзор редакторов кода
Редакторов кода много — даже из числа популярных. Они есть под любую систему, некоторые даже работают в терминале. В этой статье — обзоры VS Code, Atom и Sublime Text. Узнайте, что они умеют, как к ним прикрутить плагины и как это всё будет работать.
Как сверстать макет. Пошаговый план
Когда разобрались, как запустить HTML на компьютере, установили редактор кода и поняли, как в нём работать — настало самое время приступить к вёрстке. Наш план вам в помощь.
❤🔥16❤3