Как стать автором
Обновить
-2
0
Зирка Андрей @BlackStar1991

Увлеченный сайтодел

Отправить сообщение

Дизайнерский Multiselect на протеинах

Время на прочтение7 мин
Количество просмотров23K

Те из верстальщиков кто часто клепает формы регистрации или обратной связи обязательно столкнутся с задачей по выводу множественного выбора результатов - multiselect. К сожалению, не все элементы тега <select> все ещё можно из коробки стилизовать по желанию дизайнера. В этом маленьком уроке я хотел бы поделиться своим опытом решения данной проблемы на базе знания CSS и немного ванильного JS.

Про дизайнерский select
Всего голосов 11: ↑9 и ↓2+7
Комментарии6

Три способа создания клякс с помощью CSS и SVG

Время на прочтение6 мин
Количество просмотров13K

Кляксы (Blob) - это гладкие, аморфные, желеобразные формы, обычно  причудливые и забавные. Их можно использовать в качестве элементов иллюстраций и фоновых эффектов в сети.

Итак, как же они устроены? Разумеется, можно открыть какой-то графический редактор и сделайте их, верно? Конечно, это круто. Но мы пишем здесь о CSS финтах, и было бы гораздо интереснее посмотреть на возможности, которые нам дают CSS и SVG - двух наших любимых ингредиентов!

У нас есть несколько способов сделать кляксы. Давай проверим их.

Читать далее
Всего голосов 10: ↑9 и ↓1+8
Комментарии3

Обходим проверку сертификата SSL

Время на прочтение2 мин
Количество просмотров153K

В этом кратком обзоре я хотел бы поделиться своим опытом, как отключить проверку SSL для тестовых сайтов, иначе говоря, как сделать HTTPS сайты доступными для тестирования на локальных машинах.

Читать дальше →
Всего голосов 29: ↑20 и ↓9+11
Комментарии23

41 термин в дизайне, полезный для UX-исследователя

Время на прочтение9 мин
Количество просмотров34K


Работа с UX-дизайнерами и знакомство с их словарным запасом — это почти изучение нового языка. Давайте посмотрим на 41 часто используемый дизайнерский термин. Для лучшего взаимопонимания в команде.


Всего голосов 9: ↑8 и ↓1+7
Комментарии3

Пришло время ленивой загрузки закадровых <iframe>

Время на прочтение7 мин
Количество просмотров22K


Нативная отложенная загрузка для изображений была добавлена в Chrome 76 через атрибут loading, а затем пришла и в Firefox. Мы рады сообщить, что встроенная отложенная загрузка для iframe теперь стандартизирована и также поддерживается в браузерах на основе Chrome и Chromium.


<iframe src="https://example.com"
        loading="lazy"
        width="600"
        height="400"></iframe>

Встроенная lazy-loading загрузка iframe откладывает загрузку закадровых элементов iframe до тех пор, пока пользователь не прокрутит их рядом. Это сохраняет данные, ускоряет загрузку других частей страницы и уменьшает использование памяти.

Всего голосов 12: ↑7 и ↓5+2
Комментарии6

Почему не надо удалять все элементы массива, переназначая его на [ ]?

Время на прочтение3 мин
Количество просмотров8.5K

Очень часто бывают моменты, когда мы хотим удалить все элементы массива, как вариант, у нас есть список задач, и мы хотим удалить все задачи одновременно.


Рассмотрим такой список элементов:


let items = ["tea", "coffee", "milk"];

Чтобы удалить все элементы из массива, мы устанавливаем его значение в пустой массив


items = [];

Это работает отлично, и вы обнаружите, что данный пример используют постоянно. Но с этим есть проблема ...


Читать дальше →
Всего голосов 56: ↑6 и ↓50-44
Комментарии51

10 лучших расширений Chrome для дизайнеров

Время на прочтение3 мин
Количество просмотров26K

Как дизайнеры, мы почти всегда ищем новые советы, хитрости и инструменты, которые помогут ускорить и улучшить наш рабочий процесс. После нескольких месяцев тестирования расширений Chrome я составил список из 10 лучших расширений и плагинов для дизайнеров.

Всего голосов 12: ↑6 и ↓60
Комментарии8

Якорная ссылка на протеине с анимацией

Время на прочтение7 мин
Количество просмотров2.7K
Big image in HTML

В статье речь пойдет о том, как подключать в web страницу объемные элементы анимации, и не поломать все и сразу.


Если вы очень переживаете за показатели Google Page Speed в разработке сайтов, и у вас подгорает за каждый лишний килобайт не стоит продолжать читать данную статью.


Тех же, кого не пугают большие размеры, и любит риск прошу под кат ;)

Всего голосов 13: ↑7 и ↓6+1
Комментарии6

Исчерпывающий путеводитель по тегу iframe

Время на прочтение11 мин
Количество просмотров217K
iframe tag

Элемент iframe (сокращение от встроенного фрейма), вероятно, является одним из старейших тегов HTML и был представлен ещё в далеком 1997 году в HTML 4.01 Microsoft Internet Explorer.


Хотя все современные браузеры поддерживают данный тег, многие разработчики пишут бесконечные статьи, не советуя им пользоваться. Я считаю, что плохая репутация, которая сформировалась, около данного тега не должна мешать вам использовать его. У данного тега есть много хороших примеров применения. Кроме того, iframe не так сложно защитить, поэтому вам не придется беспокоиться о заражении компьютера вашего пользователя.


Чтобы помочь вам сформировать собственное мнение и отточить свои навыки разработчика, мы расскажем обо всем, что вам нужно знать об этом противоречивом теге.


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


Читать дальше →
Всего голосов 27: ↑27 и ↓0+27
Комментарии9

Клади плитку эффективно ( Про CSS, SVG, pattern и другое)

Время на прочтение8 мин
Количество просмотров13K

Статья про ремонт квартиры, про эффективное использование графических ресурсов для современных устройств. От смарт часов до телевизоров на стену.


Сказ о том, как вставлять фоновые повторяющиеся изображения страниц, что бы всем было хорошо.


Ну, что готовы поиграть ..? Тогда погнали


Всего голосов 5: ↑5 и ↓0+5
Комментарии1

А есть ли случайные числа в CSS?

Время на прочтение5 мин
Количество просмотров11K


CSS позволяет создавать динамические макеты и интерфейсы в Интернете, но как язык разметки он является статическим — после установки значения его нельзя изменить. Идея случайности не обсуждается. Генерация случайных чисел во время выполнения — это территория JavaScript, а не CSS.

Или нет? Если мы учтем небольшое взаимодействие с пользователем, мы на самом деле можем генерировать некоторую степень случайности в CSS. Давайте взглянем!
Всего голосов 11: ↑11 и ↓0+11
Комментарии2

Figma — простое решение для дизайнера, сложное решение для верстальщика

Время на прочтение6 мин
Количество просмотров217K

Если вы работаете в области web-разработки, то рано или поздно, вам суждено будет познакомиться с Figma. Смиритесь с этим фактом и начинайте изучать. Я же попробую описать данный продукт, с точки зрения повседневного пользователя.
Читать дальше →
Всего голосов 26: ↑19 и ↓7+12
Комментарии41

Машинное обучение контент менеджера

Время на прочтение42 мин
Количество просмотров4.3K


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

Разумеется, вы можете подойти к коллеге, и сказать, что он/она по невнимательности забыл поставить картинку, но ведь это же не наш метод.
Читать дальше →
Всего голосов 33: ↑20 и ↓13+7
Комментарии4

Камень в огород дизайнера

Время на прочтение6 мин
Количество просмотров9.4K


*Статья предназначена для начинающих дизайнеров интернет-магазинов, а также frontend разработчикам способных как-то повлиять на оных. Если Вы не относитесь к этим категориям, можете не тратить свое время. Я предупредил.
“ Все ошибки которые допустил frontend разработчик ему вернутся при сборке сайта, все недоработки которые поленился прорисовать дизайнер будет додумывать верстальщик ”
Читать дальше →
Всего голосов 12: ↑8 и ↓4+4
Комментарии20

Размещение иконок на странице сайта. Делать проще, поддерживать легче

Время на прочтение3 мин
Количество просмотров25K
Все должно быть изложено так просто, как только возможно, но не проще.
А. Эйнштейн

Добрый день уважаемые разработчики. Довольно часто просматривая копаясь в чужом коде я наталкиваюсь на такое написание кода для кнопки с иконкой.

HTML

<div class="bl_button__wrapp">
  <div class="bl_button">
      <i class="fa fa-bars" aria-hidden="true"></i>
      <span class="bl_button__text">menu</span>
    </div>
</div>
Читать дальше →
Всего голосов 21: ↑8 и ↓13-5
Комментарии23

Информация

В рейтинге
Не участвует
Откуда
Киев, Киевская обл., Украина
Дата рождения
Зарегистрирован
Активность