Вёрстка сайтов | HTML, CSS, JS
Ir al canal en Telegram
👋 Привет, друг! В этом канале я выкладываю структурированные, обучающие уроки и материалы по вёрстке сайтов и фронтенду. Присоединяйся и начинай учиться! Связь: @Tigran1963
Mostrar más
Red:4 499
Suscriptores
-224 horas
+17 días
-3030 días
Cargando datos
Canales Similares
Nube de Etiquetas
Menciones Entrantes y Salientes
---
---
---
---
---
---
Atraer Suscriptores
octubre '26oct '26
octubre '26
+31
en 2 canales
septiembre '26
+73
en 10 canales
Get PRO
agosto '26
+47
en 2 canales
Get PRO
julio '26
+39
en 2 canales
Get PRO
junio '26
+81
en 5 canales
Get PRO
mayo '26
+75
en 2 canales
Get PRO
abril '26
+93
en 7 canales
Get PRO
marzo '26
+83
en 3 canales
Get PRO
febrero '26
+54
en 2 canales
Get PRO
enero '26
+85
en 3 canales
Get PRO
diciembre '25
+45
en 3 canales
Get PRO
noviembre '25
+72
en 5 canales
Get PRO
octubre '25
+48
en 7 canales
Get PRO
septiembre '25
+126
en 5 canales
Get PRO
agosto '25
+74
en 8 canales
Get PRO
julio '25
+75
en 7 canales
Get PRO
junio '25
+49
en 2 canales
Get PRO
mayo '25
+73
en 10 canales
Get PRO
abril '25
+81
en 4 canales
Get PRO
marzo '25
+177
en 8 canales
Get PRO
febrero '25
+176
en 10 canales
Get PRO
enero '25
+155
en 6 canales
Get PRO
diciembre '24
+91
en 9 canales
Get PRO
noviembre '24
+119
en 9 canales
Get PRO
octubre '24
+224
en 8 canales
Get PRO
septiembre '24
+222
en 10 canales
Get PRO
agosto '24
+115
en 9 canales
Get PRO
julio '24
+153
en 4 canales
Get PRO
junio '24
+98
en 3 canales
Get PRO
mayo '24
+115
en 5 canales
Get PRO
abril '24
+126
en 4 canales
Get PRO
marzo '24
+110
en 3 canales
Get PRO
febrero '24
+133
en 6 canales
Get PRO
enero '24
+243
en 3 canales
Get PRO
diciembre '23
+231
en 6 canales
Get PRO
noviembre '23
+165
en 4 canales
Get PRO
octubre '23
+160
en 5 canales
Get PRO
septiembre '23
+166
en 0 canales
Get PRO
agosto '23
+221
en 0 canales
Get PRO
julio '23
+274
en 0 canales
Get PRO
junio '23
+137
en 0 canales
Get PRO
mayo '23
+143
en 0 canales
Get PRO
abril '23
+219
en 0 canales
Get PRO
marzo '23
+251
en 0 canales
Get PRO
febrero '23
+415
en 0 canales
Get PRO
enero '23
+265
en 0 canales
Get PRO
diciembre '22
+193
en 0 canales
Get PRO
noviembre '22
+229
en 0 canales
Get PRO
octubre '22
+681
en 0 canales
Get PRO
septiembre '22
+216
en 0 canales
Get PRO
agosto '22
+2 368
en 0 canales
| Fecha | Crecimiento de Suscriptores | Menciones | Canales | |
| 18 octubre | +1 | |||
| 17 octubre | +1 | |||
| 16 octubre | +5 | |||
| 15 octubre | +2 | |||
| 14 octubre | 0 | |||
| 13 octubre | +2 | |||
| 12 octubre | +2 | |||
| 11 octubre | +3 | |||
| 10 octubre | 0 | |||
| 09 octubre | +4 | |||
| 08 octubre | +1 | |||
| 07 octubre | +1 | |||
| 06 octubre | +1 | |||
| 05 octubre | +1 | |||
| 04 octubre | 0 | |||
| 03 octubre | +3 | |||
| 02 octubre | 0 | |||
| 01 octubre | +4 |
Publicaciones del Canal
Подборка лучших постов за прошлую неделю
Лучшие статьи @free_html_lessons:
1. Как создать адаптивный текстовый градиент
2. Как использовать псевдокласс :has() для навигации
3. Создаём красивую кнопку загрузки с анимацией на CSS
Лучшие фронтенд вакансии @job_webdev:
1. Стажер frontend-разработчик
2. javascript developer
3. веб-разработчик
Лучшие дизайн вакансии @job_webdesign:
1. UI/UX дизайнер интернет-магазина
2. ux/ui дизайнер электронной коммерции
3. Web-дизайнер для мобильных приложений
#лучшеезанеделю
| 2 |  JS Задача: Объедините два массива по ID
Описание:
Учитывая два массива arr1 и arr2, верните новый массив joinedArray. Все объекты в каждом из двух входных массивов будут содержать поле id, которое имеет целочисленное значение.
joinedArray - это массив, сформированный путем объединения arr1 и arr2 на основе их идентификационного ключа.
Длина joinedArray должна быть равна длине уникальных значений id. Возвращаемый массив должен быть отсортирован в порядке возрастания на основе идентификационного ключа.
Если данный идентификатор существует в одном массиве, но не в другом, то единственный объект с таким идентификатором должен быть включен в результирующий массив без изменений.
Если два объекта имеют общий идентификатор, их свойства должны быть объединены в один объект:
Если ключ существует только в одном объекте, эта единственная пара ключ-значение должна быть включена в объект.
Если ключ включен в оба объекта, значение в объекте из arr2 должно переопределять значение из arr1.
Пример:
Input:
arr1 = [
{"id": 1, "x": 1},
{"id": 2, "x": 9}
],
arr2 = [
{"id": 3, "x": 5}
]
Output:
[
{"id": 1, "x": 1},
{"id": 2, "x": 9},
{"id": 3, "x": 5}
]
#домашка | 163 |
| 3 | «Там поправить на пять минут»: почему правка на сданном сайте съедает вечер
Сайт сдан, а заказчик пишет: смените телефон, форма не доходит, страница грузится вечность. На деле это доступ к хостингу, поиск по шаблонам, кэш и проверка, что вёрстка не поехала. Что исправить, нейронка распишет за минуту, но в админку и файлы сама не полезет.
Мы сделали ИИ-агента, который правит сайт сам: заходит в админку, шаблоны и файлы и вносит изменения, а не присылает ещё одно ТЗ. Он живёт в вашем браузере и работает под вашими доступами. Задачу можно наговорить голосовым, как коллеге: агент сделает её после вашего «да» и пришлёт «было — стало».
Вот что агент уже сделал на сайтах довольных клиентов.
1. Окна, 1С-Битрикс. Сайт тормозил из-за старого виджета. После правки агента страница грузится в 20 раз быстрее, а форма заявки отвечает в 400 с лишним раз быстрее.
2. Магазин кирпича. Агент сам перенёс сайт: 403 страницы и 217 переадресаций. За месяц страниц в поиске Яндекса стало на 52% больше, показы выросли на 79%.
3. Панорамное остекление. Нашёл картинки без подписей на 149 страницах и поправил шаблон. Переходы из поиска за три месяца — плюс 48%.
Пока «пятиминутная» правка ждёт свободного вечера, заказчик теряет заявки, а вы — выходные. С агентом правка выходит на сайт в день задачи, а стоит он от 15 000 ₽ в месяц — сайты можно брать на сопровождение и не сидеть над ними ночами.
👉 Запишитесь на демо — покажем на вашем сайте, что агент исправит первым.
#реклама
О рекламодателе | 176 |
| 4 | К каким элементам можно применить css св-во zoom? | 208 |
| 5 |  Бесплатный курс по дизайну в FIGMA от Yudaev School
Онлайн-программа с наставником и чатом.
Внимание! 80% практики.
✅По результату обучения у вас будет портфолио из нескольких работ.
✅Сертификат о прохождении курса.
✅Возможность пройти полное обучение и получить карьерное сопровождение!
Учитесь дизайну у профессионалов в Yudaev Shool.
Переходи по кнопки: "Подробнее" и начинай свое обучение.
Доступ 0 руб.
Узнать больше
#реклама 16+
yudaevschool24.online
О рекламодателе | 234 |
| 6 |  Макет для тренировки (метры)
Перейти к макету 🧑💻
#практика | #макет | 247 |
| 7 |  Создаём красивую кнопку загрузки с анимацией на CSS
Эффектная кнопка загрузки сделает ваш интерфейс более современным и приятным для пользователя. Вот простой способ её реализации:
HTML:
<button class="loading-button">
<span class="loading-text">Загрузка...</span>
<span class="spinner"></span>
</button>
.loading-button {
position: relative;
padding: 10px 20px;
font-size: 16px;
color: #fff;
background: #007bff;
border: none;
border-radius: 5px;
cursor: pointer;
overflow: hidden;
}
.spinner {
position: absolute;
top: 50%;
right: 10px;
width: 15px;
height: 15px;
border: 2px solid transparent;
border-top-color: #fff;
border-radius: 50%;
animation: spin 1s linear infinite;
transform: translateY(-50%);
}
@keyframes spin {
0% { transform: rotate(0deg) translateY(-50%); }
100% { transform: rotate(360deg) translateY(-50%); }
}
Теперь у вашей кнопки есть анимация загрузки, которая мгновенно привлекает внимание.
#какэтосделать | 315 |
| 8 |  Хотите стать CIO? Узнайте, как ИИ меняет требования
Готовитесь к роли CIO и хотите понимать, как ИИ меняет требования к этой позиции? Какие компетенции станут критичными в ближайшие годы?
Присоединяйтесь к открытому уроку и узнайте, как ИИ меняет роль CIO.
📅 19 октября в 19:00. Сергей Фегон разберёт:
- Как AI меняет роль CIO и требования бизнеса к IT-руководителю.
- Как выбирать приоритетные сценарии применения ИИ.
- Как оценивать ИИ-инициативы по бизнес-эффекту, стоимости и рискам.
- Какие требования ИИ предъявляет к данным и IT-архитектуре.
Вы научитесь организовывать переход от экспериментов к промышленному использованию ИИ и говорить с бизнесом на языке результатов.
✅ Запишитесь сейчас и сделайте шаг к роли CIO в эпоху ИИ!
Узнать больше
#реклама 16+
otus.ru
О рекламодателе | 191 |
| 9 | Как использовать псевдокласс :has() для навигации
С помощью :has() можно улучшить UX меню. Например, сделать так, чтобы активный раздел подсвечивался, даже если вы находитесь на дочерней странице.
HTML:
<nav>
<ul>
<li><a href="/">Главная</a></li>
<li>
<a href="/blog">Блог</a>
<ul>
<li><a href="/blog/post1">Пост 1</a></li>
<li><a href="/blog/post2">Пост 2</a></li>
</ul>
</li>
</ul>
</nav>
CSS:
nav li:has(a.active) > a {
font-weight: bold;
color: #007bff;
}
Если на любой из дочерних страниц будет класс active, родительский пункт меню автоматически подсветится. Это полезно для сложных сайтов.
#какэтосделать | 307 |
| 10 |  Почувствуйте ритм Дубая с отелями Jumeirah
Семейный отдых обретает свой ритм - время для открытий, игр и особенных моментов вместе.
Узнать больше
#реклама
jumeirah.com
О рекламодателе | 215 |
| 11 | Как создать адаптивный текстовый градиент
Градиенты в тексте — это модный тренд, который можно использовать не только для заголовков, но и для адаптивных интерфейсов.
HTML:
<h1 class="gradient-text">Смотри, я градиентный!</h1>
CSS:
.gradient-text {
background: linear-gradient(90deg, #ff6ec4, #7873f5, #00d4ff);
-webkit-background-clip: text;
color: transparent;
font-size: clamp(2rem, 5vw, 4rem);
}
clamp() обеспечивает адаптивный размер текста.
linear-gradient() позволяет настроить цвета и направление.
#какэтосделать | 322 |
| 12 | Подборка лучших постов за прошлую неделю
Лучшие статьи @free_html_lessons:
1. Атрибут rel="noreferrer"
2. Красивый шаблон для портфолио
3. Атрибут disabled
Лучшие фронтенд вакансии @job_webdev:
1. frontend engineer
2. Fullstack JavaScript разработчик
3. HTML-верстальщик
Лучшие дизайн вакансии @job_webdesign:
1. веб дизайнер для сайтов и промо-страниц
2. UX/UI-дизайнер цифровых продуктов Издательства
3. арт-директор автономного транспорта
#лучшеезанеделю | 337 |
| 13 |  Обучайте команду: 2 курса в подарок — Я.Практикум
Расширьте навыки команды без доплат. Получите 3 курса Яндекс Практикума по цене 1
Развивайте команду по трём направлениям — платите за одно. Так тоже можно.
Оформите обучение в Практикуме для себя или сотрудников до 31 октября и получите бесплатно 2 курса:
✅ «Базовые навыки работы с ИИ» — о том, как применять ИИ в ежедневных рабочих задачах.
✅ «Экономика и бизнес-модель продукта» — о юнит-экономике и способах монетизации продуктов.
Подберите обучение под любой запрос: в каталоге Практикума 180+ актуальных программ по ИИ, разработке, менеджменту, аналитике и другим направлениям.
С нами уже сотрудничают 6000+ компаний. Начните и вы развивать команду с фокусом на бизнес-результат.
Оставить заявку и получить бонусы
Узнать больше
#реклама 16+
practicum.yandex.ru
О рекламодателе | 356 |
| 14 |  Макет для тренировки (florist man)
Перейти к макету 🧑💻
#практика | #макет | 321 |
| 15 | Атрибут disabled
С помощью атрибута disabled можно отключать интерактивные элементы форм. Пока этот атрибут есть, с элементом нельзя будет взаимодействовать.
Это булевый атрибут. Само его наличие говорит браузеру, что элемент нужно отключить.
Может применяться к следующим элементам формы:
button, input, option, select, textarea, optgroup, filedset
Атрибут disabled делает элемент неактивным: с ним нельзя взаимодействовать, кликнуть на него, на нём нельзя сфокусироваться, отключённое поле не будет отправлено вместе с остальными полями формы.
Атрибут срабатывает не только на самом элементе, но и на всех его потомках.
💡 Элемент с атрибутом disabled можно стилизовать при помощи псевдокласса :disabled. По умолчанию браузер делает их серыми и менее контрастными.
#html | #полезности | 393 |
| 16 |  Как зарабатываются деньги на удалёнке в IT?
Пройти симуляцию настоящего первого заказа, где за 3 дня без опыта ты:
- Получишь первую задачу от «клиента» стоимостью 10 000 руб. и соберёшь структуру сайта на HTML;
- Оформишь внешний вид сайта с помощью CSS по пожеланиям клиента;
- Добавишь на страницу интерактивность с JavaScript — нажал → сработало;
- Внесёшь финальную правку и сдашь готовый проект;
- Оформишь этот проект как кейс в портфолио.
С нас задача, подсказки на каждом шаге и разбор, если что-то не получается.
С тебя 20–30 минут в день.
👉 Начать бесплатно
К концу третьего дня у тебя будет не абстрактное «прошёл курс», а готовый проект и понимание, как зарабатываются деньги на удалёнке в IT. | 222 |
| 17 |  Красивый шаблон для портфолио
Смотреть на codepen 👨💻
#какэтосделать | 416 |
| 18 |  Volkswagen Polo 2021 под ключ 1180000 р.
Пробег: 33899 км. Двигатель: 1.5 Бензин.
Коробка: Автомат. Привод: Передний.
Хороший вариант за свои деньги. Больше информации в канале.
Узнать больше
#реклама
О рекламодателе | 255 |
| 19 |  Cтартовый шаблон для верстки и js проектов на vite (scss, PostCSS)
Ссылка на github 👨💻
#полезности | 453 |
| 20 |  Встречай смартфон Honor — с выгодой для себя!
✅ Стильный дизайн
✅ Заряд надолго
✅ Качественные фото
✅ Быстрая и плавная работа
Выбирай свой Honor по привлекательной цене!
Купить
#реклама
market.yandex.ru
О рекламодателе | 259 |
