Постаралась подобрать не менее важные с точки пользователя, и уж точно не менее полезные со стороны дизайнера СОВЕТЫ?, которые с уверенностью можно положить в верхний ящик вашего стола, и при необходимости быстро дергать их.
Готовый набор окружения веб сервера на базе контейнеров Docker. Включает в себя MySQL, PHP, NGINX, composer, SSL сертификаты и механизм резервного копирования в облако.
В проектировании сложно давать универсальные советы. Сколько задач, контекстов и целевых аудиторий — столько и решений. Поэтому вместо чек-листа с рекомендациями предлагаю вашему вниманию чек-лист с вопросами. Сегодня на повестке вопросы, которыми я задаюсь при проектировании форм регистрации пользователей (которые сами по себе могут оказаться вершинами айсберга). Для новичков контент полезный. Для продвинутых — интересный (проверьте, сколько пунктов учитываете в работе вы сами). А для профессионалов — повод показать автору, что он упустил что-то важное, и утереть ему нос. Поехали.
Недавно телеграм выпустил обновление, в котором бот может открывать любое веб-приложение, что предоставляет много возможностей для разработчиков.
Я был несказанно этому рад, так как уже на тот момент разрабатывал бота, с помощью которого можно играть в игры. А теперь, с новыми возможностями — пользователя не будет перекидывать в браузер, а игры будут открываться прямо в телеграме. Красота!
Изначально Flutter был известен как фреймворк для создания кроссплатформенных мобильных приложений для Android и iOS. Но концепция Flutter не ограничивается мобильной разработкой, фреймворк позволяет создавать пользовательские интерфейсы для любого экрана с помощью кроссплатформенной разработки: разрабатывать web и desktop-приложения. Мы в Friflex работаем на Flutter с момента выхода первой версии и хорошо знаем особенности фреймворка. В этой статье Никита Улько, Flutter fullstack developer в Friflex, рассказывает об особенностях разработки Flutter для Web. Если вы хотите попробовать Flutter для web, этот гайд для вас.
Каждый из нас говорит на собственном языке. К счастью, иногда эти индивидуальные языки достаточно похожи, чтобы объединять их в большие группы. Всё, что внутри такой группы, мы условно считаем одним языком — например, русским.
Но порой неизбежно вылезают различия. «Гражданский брак» значит разное для юриста и не-юриста. Обыватель назовёт цифрой то, что математик — числом. Слово «крайний» имеет особое значение для лётчиков и парашютистов.
Дизайнер и фронтенд-разработчик — не чужие друг другу люди. Они работают в соседних кабинетах, вместе ходят в курилку (по крайней мере, так было до повсеместной ковидной удалёнки). Оба делают части одного большого дела и общаются если и не постоянно, то регулярно. И всё же их языки во многом отличаются. Да и не только языки — сами образы мышления.
Мы поговорили с сотрудниками Промсвязьбанка, чтобы составить небольшой… Нет, не разговорник. Понимайник. Возможно, кому-то он поможет общаться с коллегами по ту сторону HTML более конструктивно, эффективно, а главное — приятно.
Интерактивный видеоконтент позволяет своим зрителям взаимодействовать с контентом и влиять на дальнейшее его повествование. Это уникальное направление видеоконтента, которое активно развивается в последнее время в различных сферах.
В данной статье мы хотим поделиться опытом создания платформы для проектирования интерактивного видеоконтента.
Use-case
Для формализации функциональных требований применяются диаграммы использования (use-case). Диаграмму вариантов использования есть смысл строить во время изучения технического задания, она состоит из графической диаграммы, описывающей действующие лица и прецеденты (варианты использования - сервисы, которые наша система предоставляет акторам), а также спецификации, представляющего собой текстовое описание конкретных последовательностей действий (потока событий), которые выполняет пользователь при работе с системой.
Прецеденты нашего пользователя:
В HTML4 не было способа семантически разметить HTML, чтобы сохранить связь между изображением и его подписью. В HTML5 нам дали такую возможность с помощью элементов <figure> и <figcaption>.
Давайте для начала определимся с терминами.
alt — альтернативное описания изображения.
<figcaption> — заголовок или сводка для содержимого <figure>. Если у <figure> нет дочернего <figcaption>, то нет и заголовка.
Содержимым у <figure> может быть изображение или что угодно ещё, например, таблица или список. В<figcaption> можно указать описательную метку для фрагмента контента: таблицы, фрагмента кода, списка, цитаты, текста и изображения, но это описание не является жизненно важным для его понимания. Но почему же <figcaption> как подпись не может заменить alt?
В веб-разработке Python используется в основном на бэкенде с такими фреймворками, как Django и Flask. А сегодня, к старту курса по Fullstack-разработке на Python, расскажем о PyScript, который даёт возможность запускать Python прямо в HTML.
Дайджест новостей и полезных статей из мира фронтенд-разработки за последнюю неделю 30 мая–05 июня.
Привет, Хабр! Меня зовут Вероника, я QA-lead в одном из внутренних продуктов Самоката. Хочу поделиться, какие практики мы в команде применяли, чтобы адаптировать процесс разработки под реалии запуска нового проекта.
Когда мы начинаем с нуля делать новый IT-продукт (или проект внутри компании), часто на помощь приходит концепция MVP. Делаем хоть сколько-то готовую версию, чтобы как можно раньше получить обратную связь от пользователей и стейкхолдеров, а дальше разберёмся.
Ради этого «как можно раньше» процесс часто выглядит как яростный забег: жертвуем регламентами, документацией и другими вещами, которые «полезные, но давайте потом». Работаем в режиме «не поднимая головы». Для полноты картины добавим сюда часто меняющиеся требования — на ранних стадиях создания продуктов такое регулярно случается. Знакомо?
Что при этом происходит с командой? Переработки, стресс, демотивация, а там и до выгорания недалеко. В статье расскажу, как мы делали MVP нового внутреннего продукта, что для нас сработало (и не сработало), чтобы помочь команде работать в высоком темпе, адаптироваться к меняющимся требованиям и не терять боевой дух и мотивацию.
Angular не поддерживет возможность использования Content Projection для шаблонов (ng-template), но её можно реализовать самостоятельно.
Перевод статьи "Disabling My Favicon: How and Why"
Статья о том как и зачем я убирал фавиконку со своего сайта.
Всем привет, мне пришлось очень долго промучаться с анимацией Аккордеона и свойства max-height не прибегая к помощи Js в вычислениях, и сейчас я поделюсь с вами оптимальным решением.
Код на Codepen https://codepen.io/webfrontden/pen/poaOPER
Меня зовут Виктор, я разрабатываю страницу результатов поиска Яндекса. Несмотря на внешнюю простоту, поисковая выдача — сложная штука: на каждый запрос генерируется своя уникальная страница, на которой в зависимости от запроса может присутствовать блок Картинок, Карты, Переводчик, видеоплеер и многие другие компоненты. Все они должны запускаться и работать в памяти обычных бюджетных телефонов, которые использует большинство наших пользователей. Браузерам должно хватать ресурсов, чтобы пользователь не видел вот такого:
На своих серверах мы должны генерировать сотни миллионов уникальных страниц в сутки — это сложнее, чем просто отдавать одни и те же ресурсы. Генерация страницы не должна быть слишком требовательной к памяти сервера.
Разрабатывая проект на JavaScript (TypeScript, ClojureScript или каком-то другом языке, транслируемом в JavaScript), мы привыкли создавать объекты, массивы, строки и вообще писать код, как будто память бесконечна. Это не так. Я расскажу о видах проблем с памятью, о том, какие ограничения мы часто забываем и как их можно преодолеть. В ответ браузеры и пользователи скажут вам спасибо.
Давайте поговорим о том, как написать хорошее описание фотографий в атрибуте alt, или альтернативный текст.
Альтернативный текст — это описание картинки на сайте словами. Оно должно помогать людям, которые не видят картинку, но читают или слышат это описание. А иначе можно вообще ничего не писать.
Давайте разбираться, почему правильное описание важно, и как его вообще-то сделать правильным. Всего есть шесть правил.
Научить ИИ разговаривать шёпотом — непростая задача даже сегодня. Но мы покажем, насколько простыми стали распознавание и транскрипция речи, по крайней мере, на поверхности. Интересно? Тогда добро пожаловать под кат.
Вёрстка помогает нам выстраивать содержимое веб-страниц по определённым правилам: например, строго в соответствии с согласованным макетом или в зависимости от пользовательского устройства.
Сегодня сайты неплохо умеют подстраивать свой контент и под различные размеры экранов, но так было не всегда.
Заголовки должны быть большими, жирными и громкими, чтобы привлекать внимание пользователя за несколько секунд. Мы перевели статью о стилях заголовков, сегодня предлагаем изучить градиенты.
