Добавилось новое руководство Переменные CSS с нуля. Написал его пакистанский фронтенд-разработчик Ахмад Шадид, перевод мой.

Если не знаете, что это вообще такое и как эти переменные использовать, то читать обязательно.

Мы долго к этому шли и наконец пришли. htmlbook теперь работает по защищённому протоколу https. Никаких закладок обновлять не надо, всё настроили автоматически. Теперь идёт переход с http на https, а ещё с www на сайт без www. Адрес теперь один и это https://htmlbook.ru

Но если всё-таки заметите какие-то неполадки, пишите мне на ящик vlad@htmlbook.ru

Вот что мы будем делать в этом руководстве:

Реклама

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

Основы ссылочной массы

Ссылочная масса, также известная как «backlink profile», представляет собой совокупность всех внешних ссылок, которые указывают на конкретный веб-сайт. Каждая ссылка воспринимается поисковыми системами как голос за авторитетность и качество сайта. Чем больше ссылок от релевантных и авторитетных источников указывает на сайт, тем выше вероятность того, что поисковая система рассмотрит его как надёжный и ценный для пользователей.

Обновил приложение под Андроид Практика по HTML и CSS, в котором можно решать задачи на разные темы, повышать свой уровень знаний HTML и CSS на практике.

Если ещё не установили, то самое время это сделать прямо сейчас.

Вы сверстали сайт и сделали его красивым с помощью CSS. Осталось добавить интерактива, и можно добавлять проект в портфолио.

«Оживить» на сайте можно что угодно: меню, модальные окна, корзину, пагинацию… В этой статье мы разберём слайдер — посмотрим, как его сделать на чистом JavaScript. Слайдер пригодится для раздела с отзывами, фотографиями сотрудников, изображениями товаров или чего-нибудь ещё — всё зависит только от вашей фантазии и проекта.

Сделать слайдер

Вот три статьи о правильной вёрстке текста, после которых всё станет гораздо понятнее:

• Как оформить текст. 11 главных CSS-свойств
• Как установить стиль шрифта. Свойство font
• Как верстать и оформлять цитаты

Прочитайте, чтобы разобраться раз и навсегда.

Редакция HTML Academy поговорила с ChatGPT и попросила нейросеть сделать просто красивую кнопку. Получилось то, что получилось.

Читать

Привет, это HTML Academy!

Мы уже 11 лет делаем курсы для веб-разработчиков и хотим помочь разобраться в IT всем, кому это интересно. Поэтому 28 июня в 13:00 приглашаем вас на бесплатный лайв «Где учиться программированию и не потратить время зря: вузы, курсы или самообучение».

В прямом эфире обсудим:

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

Всех записавшихся ждут скидки и подарки от Академии!

Записаться

До встречи на лайве

Добавил более 10 задач для самостоятельного решения по вёрстке кнопок. К каждой такой задаче идёт ответ, где можно подсмотреть решение и увидеть, как стилизованные кнопки будут выглядеть в браузере.

Почему пройдя курсы вы не устроитесь на работу?

Мы не хотим вас напугать, просто напоминаем, что 31 мая в 13:00 пройдёт лайв с Артёмом Альтигиным. На нём узнаем, чего не хватает выпускникам курсов, чтобы найти свою первую работу. Присоединяйтесь!

Записаться на лайв

А может, всё-таки устроитесь?

Разберёмся 31 мая в 13:00 — Артём Альтигин из «Лига А.» в прямом эфире расскажет, почему курсы без практики не имеют смысла, почему 95% наших выпускников трудоустраиваются и почему на рынке до сих пор нет аналогов Лиге.

А ещё узнает у нашего трудоустроенного выпускника, что помогло ему получить первый оффер и что рынок требует сегодня от новичков в веб-разработке.

Записаться на лайв

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

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

Читать статью

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

На примерах с CodePen покажем, какими они бывают.

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

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

Читать статью.