Обновить
61.51

HTML *

Стандартный язык разметки web-страниц

Сначала показывать
Порог рейтинга
Уровень сложности

Как сделать сервисы доступнее для людей с нарушениями зрения. Исправляем 5 самых частых ошибок

Уровень сложностиПростой
Время на прочтение8 мин
Охват и читатели3.8K

Всем привет! Меня зовут Юля Долгун, я фронтенд-разработчик из Поиска. Одна из моих задач — поддерживать доступность в поиске по товарам для пользователей с различными ограничениями здоровья.

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

Читать далее

Butterflynet. Обзор приложения с JS на Android

Уровень сложностиСредний
Время на прочтение4 мин
Охват и читатели2.8K

Чуть больше года назад у меня появилась идея сделать мобильное приложение, в котором можно будет писать код и смотреть результат прямо «не отходя от кассы». Для реализации такого «механизма» был выбран язык JS и HTML в качестве каркаса для представления. Разработка велась на Xamarin. Давайте посмотрим, что из этого вышло.

Читать далее

Вышел Chrome 113

Уровень сложностиПростой
Время на прочтение3 мин
Охват и читатели9.8K

Что вы узнаете:

WebGPU уже здесь, он позволяет использовать высокопроизводительную 3D-графику и параллельные вычисления в вебе.

С помощью инструментов разработчика теперь можно переопределять заголовки ответов сети.

Начинает распространяться First Party Sets, часть Privacy Sandbox, которая позволяет организациям объявлять связанные сайты.

И многое другое.

Читать далее

Webpack. Создание WebP вместе с Jpeg и Png

Время на прочтение2 мин
Охват и читатели9.4K

Как вы знаете, формат изображений WebP в большинстве случаев имеет меньший вес, по сравнению со своими братьями: png и jpeg. Поэтому использовать его в своих приложениях - это хорошая практика.

Читать далее

Как я написал удобную оболочку над электронным дневником

Уровень сложностиПростой
Время на прочтение4 мин
Охват и читатели20K

Статья о том, как я в 15 лет облегчил работу с электронным дневником, представленным Кировской области в 2022 году.

Что получилось сделать и как это было реализовано.

Читать далее

Интересные трюки HTML, CSS и JS

Уровень сложностиСредний
Время на прочтение8 мин
Охват и читатели24K

Здесь вы найдёте небольшую подборку нестандартных вариантов использования HTML/CSS/JS. Если информация окажется полезной, будем собирать эти хаки на постоянной основе и публиковать по мере накопления.

Примечание. Некоторые трюки основаны на открытых уязвимостях браузеров и поисковой системы Google и др. Поэтому могут перестать работать в ближайшее время (или продолжат, если разработчики не признают баги и не захотят их исправлять). Другие функции работают только начиная с конкретных версий Chrome, Firefox и т. д.
Читать дальше →

Веб-разработка: 15 материалов для самостоятельного изучения

Время на прочтение4 мин
Охват и читатели44K

Привет, Хабр! Мы на курсе Практикума по веб-разработке постоянно смотрим, что новенького появилось в сети для самостоятельного обучения веб-технологиям. И ресурсов в доступе довольно много. Они разнообразны и обучают современным технологиям в разных форматах: видео, учебники, интерактивные курсы, гайды и доклады. Если вы учитесь на курсах или уже работаете во фронтенде, эти материалы помогут улучшить навыки и избавиться от белых пятен. Делимся найденными сокровищами.

Читать далее

Фичи WebKit в Safari 16.4

Уровень сложностиПростой
Время на прочтение21 мин
Охват и читатели12K

Сегодня мы рады рассказать вам о многочисленных дополнениях к WebKit, которые включены в Safari 16.4. Этот выпуск содержит 135 новых веб-функций и более 280 обновлений. Давайте посмотрим.

Читать далее

ARRS // Нам нужна ваша помощь

Уровень сложностиПростой
Время на прочтение3 мин
Охват и читатели7.5K

Русскоязычное Комьюнити Escape From Tarkov обращается к дешифровщикам и криптографам за помощью в дешифровке изображений из игры альтернативной реальности ARRS терминал.

Текущий процесс дешифровки силами энтузиастов из комьюнити зашёл в тупик.

Что такое ARRS?

Этот смартфон должны были выдавать выпускникам курсов JavaScript — смотрим на Alcatel Fire E на базе FireFox OS

Уровень сложностиСредний
Время на прочтение9 мин
Охват и читатели5.4K
image

Веб-технологии давно и прочно вошли в нашу жизнь. Мы каждый день пользуемся уже ставшими привычными нам сервисами вроде социальных сетей или новостных сайтов. Браузер стал неотъемлемой частью современного смартфона, а некоторые приложения и вовсе полностью «переехали» в браузер, получив название PWA, хотя подавляющее большинство приложений всё ещё остаются нативными. Ребята из Mozilla как-то раз подумали: «отдельные PWA приложения это, конечно, круто, но почему бы не сделать мобильную систему, которая построена практически полностью на веб-технологиях?». И таки умудрились сделать, дав ей имя — FireFox OS(B2G), предназначенная для бюджетных смартфонов! Сегодня мы с вами: узнаем, что же это за ОС такая, что у неё под капотом и проверим, на что она способна в 2023 году. Встречаем — Alcatel OneTouch Fire E!
Читать дальше →

Два прихлопа, два притопа: как я делал раннер со звуковым управлением на JS

Уровень сложностиПростой
Время на прочтение11 мин
Охват и читатели2.7K

Привет, Хабр! Как-то раз после работы мне захотелось взять и написать небольшую компьютерную игру. А почему бы и нет? Играть я люблю, программировать — тоже. Захотелось проверить, можно ли сделать что-то прикольное на уровне современных AAA-игр, не изучая дополнительных языков программирования, а также избежать банального повторения тех же «велосипедов», которые уже 100500 раз выложены на различных стримах и, конечно, не раз разбирались на Хабре. В этом посте я хотел бы поделиться с вами своим небольшим экспериментом в области GameDev на базе JS и обсудить возможности, которые есть у любознательного программиста с бэкграундом в сфере JavaScript.

Читать далее

Работа с размерами изображений с помощью класса Uri в Joomla 4

Уровень сложностиСредний
Время на прочтение6 мин
Охват и читатели2.4K

Парадокс, конечно, но это возможно. Казалось бы, причем тут класс ядра для работы со строками url. Но именно он может помочь нам в Joomla 4. Статья о том, как автоматически определять размеры файлов изображений для атрибутов width и height с помощью ядра Joomla 4 и не грузить сервер.

Читать далее

Конец тирании Outlook: HTML в почте без таблиц

Время на прочтение9 мин
Охват и читатели8K

Первый пункт руководства по разработке электронной почты MailChimp гласит: «Кодируйте всю структуру при помощи элемента table». В рекомендациях Cerberus (вероятно, самого популярного шаблона HTML-писем) говорится: «В случае сомнений встройте ещё одну таблицу». Прогресс не дошёл даже до структур на основе float. Кодинг электронной почты — это коллекция обходных путей, хаков и устаревших неподдерживаемых HTML-элементов.

Он долго был Диким Западом несогласованности, для решения задач на котором требовались тайные знания. Изучив таблицу поддержки на сайте look Can I Email (это аналог Can I Use для электронной почты), ты понимаешь, что клиенты электронной почты очень сильно различаются. Создание электронного письма для Apple Mail, Hey, Fastmail, Outlook for Mac, Proton Mail или Mail.ru не сильно отличается от кодинга современной веб-страницы. Однако, например, Yahoo Mail даже не поддерживает фоновые градиенты. Но гораздо сильнее, чем какой-либо иной клиент, электронной почте не давал вырваться из прошлого Outlook для Windows.
Читать дальше →

Ближайшие события

Гипертекстовое чтиво. Жанр литературы, который предопределил Интернет

Уровень сложностиПростой
Время на прочтение7 мин
Охват и читатели5.5K

Если бы Википедия была художественным романом, получилась бы одна большая фрагментированная история с нелинейным сюжетом. К персонажам, отдельным историям или эпизодам и главам можно было бы переходить по гиперссылкам, независимо, начало это или конец романа (и вообще, при такой форме там не было бы ни начала, ни конца). Современные электронные энциклопедии, социальные сети и Всемирная Паутина в целом являются производными такой гипертекстовой литературы.

Гипертекстовая литература (hypertext fiction) — это жанр электронной литературы, характеризующийся использованием гипертекстовых ссылок, которые обеспечивают новый контекст нелинейности и взаимодействие с читателем. Электронная или цифровая литература охватывает произведения, созданные исключительно на цифровых устройствах и для них. Это означает, что сочинения не могут быть легко или вообще не могут напечатаны, потому что элементы, имеющие решающее значение для текста, не могут быть перенесены в печатную версию. Не путать электронную литературу с оцифрованной печатной литературой!

Интересно то, что идея гипертекстовой литературы появилась задолго по изобретения первых гиперссылок. Литературовед Ролан Барт в своей книге S/Z описывает тип письма, в котором «сетей много и они взаимодействуют», где «у неё нет начала» и где «читатель получает к ней доступ через несколько входов, ни один из которых не может быть главным». Очевидно, он описывает текст, функционирующий так же, как Интернет. Однако есть один нюанс: S/Z был написан более чем за десять лет до того, как был изобретён первый персональный компьютер.
Читать дальше →

Как работает веб-браузер (с картинками)

Уровень сложностиПростой
Время на прочтение6 мин
Охват и читатели47K

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

Эта статья приоткроет завесу магии, скрывающуюся за кулисами веб-браузеров.

Давайте начнем!

Читать далее

CSR, SSG, SSR — про рендеринг приложений на примерах

Уровень сложностиПростой
Время на прочтение12 мин
Охват и читатели85K

Всем привет, меня зовут Хаджимурад, занимаюсь фронтенд разработкой уже 3,5 года и за это время успел поработать на многих проектах: интернет магазин, панели администрирования, проекты для университета. Сейчас работаю на проекте в банке и сегодня хочу поделится с вами своим опытом.

В статье на примере простого сайта, постараюсь описать три способа рендеринга приложений, раскрыть их плюсы и минусы, и на практических примерах провести сравнение производительности и размеров приложения. Материал больше подойдёт начинающим фронтенд-разработчикам, или тем, кто хочет познакомиться c CSR, SSG и SSR. Для лучшего понимания от вас потребуются начальные знания React, менеджеров пакетов npm или yarn.

Читать далее

JavaScript. Работа с буфером, Ctrl+C Ctrl+V

Уровень сложностиПростой
Время на прочтение3 мин
Охват и читатели17K

Как копировать в буфер картинки. Какие типы данных можно класть в буфер. Поддержка кастомных типов. Как сделать свои кнопки копировать/вставить.

Читать далее

Создание карты потоков с помощью JavaScript: пошаговое руководство

Уровень сложностиСредний
Время на прочтение16 мин
Охват и читатели7.6K

Карты потоков – это мощный способ представления движения объектов между различными географическими локациями, который очень легко реализуется с помощью JavaScript. По сути, они совмещают в себе функциональность карты и потоковой диаграммы. Такой тип визуализации показывает направление движения людей, товаров, денег или информации, а также их количество.

В текущем руководстве мы познакомим вас с процессом создания карты потоков. А чтобы сделать этот процесс более практичным, мы используем пример визуализации количества студентов из Индии, обучающихся в разных странах. Следуя этому руководству, вы научитесь создавать собственные карты потоков с помощью JS для любых видов данных.
Читать дальше →

Пишем свой мессенджер на PHP

Уровень сложностиПростой
Время на прочтение6 мин
Охват и читатели20K

Пишем свой Мессенджер на PHP через WebSocket. Так и для Начинающих так и далёких от IT людей.

Тут вы узнайте как установить PHP, WebSocket и в чём его различие с AJAX (http) запросами как написать сервер и клиент Мессенджера полностью.

Читать далее

Советы по веб-разработке, которые я дал бы себе 2 года назад

Уровень сложностиПростой
Время на прочтение2 мин
Охват и читатели10K

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

Узнать больше