UX: запрет перетаскивания картинок
Когда картинки используются как ссылки, то при нажатии надо отменить перемещение картинки по экрану. Это просто!
Код на CODEPEN ❯
UX: видео лента - ускорить загрузку
Если на вашей странице много видео из Ютуба, то грузиться такая страница будет долго, если вы используете вставку во фрейме. Это можно заменить обычной ссылкой с картинкой для данного видео.
Код на CODEPEN ❯
UX: изображение ссылка - добавить реакцию при выборе.
Картинки часто применяются как кнопки или ссылки. При выборе такой картинки пользователь должен получить обратную связь, какую картинку он выбрал.
Код на CODEPEN ❯
Проект Visual Studio 2022 для создания статического веб сайта
C помощью Visual Studio 2022 сделаем проект для разработки простого веб сайта.
Этот проект не будет использовать серверные языки программирования, зато пригодится для разработки статических сайтов, например на html css javascript, или других фронтенд проектов. Для javascript разработки мы сможем использовать отладчик.
Кроме того мы сможем сразу разместить этот сайт в интернете и видеть результаты своей работы над проектом сразу в интернете.
Код на Гидхабе ❯
Анимированный CSS градиент с шаблоном bootstrap cover
Градиент делаем на чистом CSS, без использования библиотек, Javascript. Посмотрим, как с помощью графического редактора задать параметры градиента - цвета, точки перехода.
Код на Гидхабе ❯
CSS анимация кнопки
Рассмотрим применение анимации для кнопки, сделаем наш интерфейс более удобным для пользователей:
настройка проекта net core, стили браузера для кнопки, кнопка в стиле Material Design с анимацией без javascript.
css переходы, css transitions, css анимация.
Код на Гидхабе ❯
Несколько проектов в одном решении Visual Studio 2019
В этом видео посмотрим, как поместить в одно решение Visual Studio несколько проектов, или вообще, сделать пустое решение без всякого проекта, например для хранения файлов дизайна или документации.
Visual Studio 2020, Visual Studio 2019 пустое решение, Visual Studio empty solution, Visual Studio multi project
Код на Гидхабе ❯
Инструменты веб разработки: Visual Studio и Git Hub
Скачиваем бесплатную официальную версию Visual Studio 2019, устанавливаем, подключаемся к репозитарию Git и сохраняем наш проект в облако.
Показано, как переключатся между Git и TFS (DevOps).
Visual Studio 2019 скачать, Visual Studio 2019 бесплатно, репозиторий Git, Github
Код на Гидхабе ❯
Фронтенд - приступаем к разработке
Всё, что выполняется в браузере - HTML, CSS, Javasctript. Обсудим то, что понадобится при разработке текущего приложения.
фронтенд разработчик гитхаб
Код на Гидхабе ❯
:)
Атомарный дизайн в веб разработке
Атомарный дизайн является широко признанным подходом модульности в веб дизайне. Иерархия и принципы построения модулей дизайна на примере реального веб приложения.
атомный дизайн, модульный веб дизайн, уроки веб дизайна, atom design
Применяем стандарты и принципы веб дизайна
В этом уроке веб дизайна рассмотрим типографику в веб дизайне, цвет в веб дизайне, веб дизайн кнопки. Учтём эти стандарты в разработке веб приложения.
Модульные сетки в адаптивном веб дизайне. Веб дизайн с нуля.
Статические веб сетки и адаптивные колонки для размещения контента. Каким образом модульные сетки адаптируются под разные размеры экранов. Строим сетку самостоятельно в программе Affinity Designer. Технологичность веб дизайна, что делает css верстку легкой.
Галерея систем дизайна ❯
Адаптивная сетка css: Boostrap сетка ❯
Basscss сетка адаптивных колонок ❯
Сетка веб дизайн: Статья Адаптивные сетки и как их использовать ❯
Первый веб дизайн сайта с нуля в программе Affinity Designer
Начинаем небольшой веб дизайн курс для программистов на примере реального приложения. Разрабатываем дизайн сайта с нуля, первый проект, в котором мы сделаем эскиз простой страницы веб приложения в графическом редакторе.
веб дизайн с нуля, веб дизайн уроки, веб дизайн с чего начать
Иконки: Material Design Icons ❯
Bootstrap Icons ❯
Графический редактор: Affinity Designer ❯
Учебник Affinity Designer ❯
О проекте: Веб дизайн и веб программирование на примере реального приложения.
На канале будет публиковаться учебное видео по веб программированию и веб дизайну в процессе создания современного веб приложения рассчитанного на высокие нагрузки.