Рубрика «веб-дизайн» - 20

В течение последних двух месяцев я углубился в изучение CSS Grid. В этой заметке я хочу поделиться своими основными соображениями. Чтобы было более понятно, я объясню все с помощью диаграмм.

Вероятно, вы уже знакомы с блоковой моделью CSS для обычных элементов. Давайте начнем с аналогичного «общего обзора» для CSS Grid:

CSS Grid — швейцарский армейский нож для макетов сайтов и приложений - 1
В основе структуры CSS Grid находится основной контейнер, представляющий собой обычный div, имеющий margin, border и padding. Для создания CSS grid контейнера добавим свойство display: grid. Элементы сетки — это потомки, размещенные внутри родительского контейнера. Они обычно определяются как список, описывающий header, sidebar, footer или другие аналогичные элементы макета сайта, зависящие от его дизайна.
Читать полностью »

Превентивный интерфейс: редизайн страницы поисковой выдачи Google по суицидальным запросам - 1

Будучи студентом колледжа, я оказался тем самым одним из пяти, который подвержен тревожному расстройству и депрессии. Отчаянное стремление хорошо учиться, поиск работы, отношения, просто ощущение, что я «вступаю во взрослую жизнь» — все это слилось в лавину забот, которые поглотили меня с головой (оглядываясь назад, я понимаю, что многие из них были пустячными).

Однажды в первый год учебы у меня выдался особенно напряженный день — один из тех дней, когда расписание уже и так забито под завязку, а новые проблемы и встречи все прибывают и прибывают. В ту ночь я лежал в постели совершенно изможденный, но не мог сомкнуть глаз из-за паранойи. Через три часа, так и не сумев заснуть, я встал с кровати и загуглил: «простые способы умереть».

И вот что я увидел:
Читать полностью »

Все течет, все меняется, но только input[type=file] как портил нервы всем начинающим веб-разработчикам, так и продолжает это делать до сих пор. Вспомните себя N лет назад, когда вы только начинали постигать азы создания веб-сайтов. Молодой и неопытный, вы искренне удивлялись, когда кнопка выбора файла напрочь отказывалась менять цвет своего фона на ваш любимый персиковый. Именно в тот момент вы впервые столкнулись с этим несокрушимым айсбергом под названием «Загрузка файлов», который и по сей день продолжает «топить» начинающих веб-разработчиков.

На примере создания поля для загрузки файлов я покажу вам, как правильно прятать input[type=file], настраивать фокус на объекте, у которого фокуса быть не может, обрабатывать события Drag-and-Drop и отправлять файлы через AJAX. А также я познакомлю вас с парой браузерных багов и путями их обхода. Статья написана для новичков, но в некоторых моментах может быть полезна и занимательна даже для матерых разработчиков.
Читать полностью »

Плохой, зато свой: как написать по-настоящему ужасный CSS - 1

Это перевод статьи Оханса Эммануэля, который уже много лет работает в сфере разработки веб-сайтов и сервисов. Его главное увлечение — CSS, здесь он чувствует себя как рыба в воде. Свою любовь к делу и знания Оханс охотно передает читателям.

Сегодня мы поговорим о том, как можно сделать CSS-стили ужасными, само собой, решая прямо противоположную задачу — научиться создавать красивый и чистый CSS. Материал подойдет в основном начинающим веб-дизайнерам и разработчикам, хотя в качестве напоминания статья пригодится и их более опытным коллегам.
Читать полностью »

10 самых популярных видео ретро-докладов Фестиваля 404

Как вы знаете, в городе-курорте Самара мы время от времени проводим Фестиваль 404, куда приезжают разные люди и делятся опытом. Доклады записываем на видео и выкладываем совершенно бесплатно на свой канал youtube. Там накопилось много интересного и мы сделали небольшую подборку самого популярного видео докладов прошлых лет.

Вас ждут тонны полезной информации и реки ностальгических слёз!

Читать полностью »

Краткое руководство по переменным в CSS (причины использования, синтаксис и примеры) - 1

Я уже достаточно давно экспериментирую с CSS-переменными. Если вы к ним еще не подступались, вы можете воспользоваться этим кратким руководством, чтобы быстро во всем сориентироваться и приступить к работе.
Читать полностью »

Dracula Theme

Введение

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

Читать полностью »

Алексей Бородкин, product lead и глава Гильдии вольных проектировщиков, рассказал на открытом занятии Нетологии, как разобраться в дизайнерских направлениях и распределить роли в дизайн-команде.

Дизайнерские тусовки

Когда-то — в буйные 90-е — никаких веб-дизайнеров не было, и сайты создавали вебмастера — отважные люди с программистским бэкграундом, которые все делали сами: собирали требования, кодили, рисовали, делали контент и развивали сайт.

В конце 90-х появилась профессия веб-дизайнера, которую более корректно называть «визуальным дизайнером». Эти ребята занимались эстетической частью цифровых продуктов, не заморачивались, что у сайта находится под техническим капотом, и воспринимали свою работу, как средство для самовыражения. В основном их интересовала только красота, чувство удовлетворения, а также мнение других визуальных дизайнеров. Читать полностью »

Даладнааа!

Скажете вы, но да, слухи верны и Фестиваль 404 возвращается и прогремит уже в этом октябре. А мы-то как рады!

image

Уже в восьмой раз Заец Несудьбы соберет всех в Самаре на мощнейшем фестивале интернет-деятелей. В этом году организация фестиваля во главе с Денисом Кортуновым серьезно усилена командой Mercury Development, а это поможет нам выстрелить до неба! Так мы с вами еще не фестивалили!

Из того что останется неизменным — два плотненько расписанных дня, 10 тематических потоков лекций, из которых можно выбрать самые интересные именно вам. Только самые неземные спикеры, которых можно будет потрогать руками, только самые актуальные вопросы и самое безудержное веселье!

Мы очень ценим личное отношение, поэтому секции на Фестивале 404 будут традиционно авторские. Вот список секций, которые будут идти в 5 потоков:

  • Фронтенд и бэкенд (Максим Сальников, Вадим Макеев)
  • Мобильные приложения (Руслан Демьяненко)
  • Дизайн (Артем Геллер)
  • UX (Платон Днепровский)
  • Управление продуктами (Юрий Агеев)
  • PR и маркетинг (Мари Глазкова, Юрий Марин)
  • Менеджмент и предпринимательство (Сергей Котырев)
  • Стартапы (Сергей Богданов, Павел Веселовский)
  • Информационное общество (Денис Кортунов)
  • Технологии будущего (Денис Афанасьев)

Читать полностью »

В последнее время JavaScript развивается очень быстро, но и языки-помощники веб-разработчика не стоят на месте.

CSS тоже развивается, и хотя Houdini в скором времени, возможно, сделает прорыв в CSS-разработке, до широкого применения, к сожалению, еще далеко. Так что, как и прежде, созываются экспертные совещания, на которых составляют новые спецификации и так далее. Прогресс не такой стремительный, как у TC39, но это лучше, чем ничего.

В этой статье мы поговорим о возможностях CSS, о которых вы, скорее всего, не слышали, а если и слышали, то вряд ли использовали — о единицах измерения. И нет, говорить будем не о «старых» единицах vw и vh (хотя мне все еще приходится их объяснять людям, которые не очень хорошо разбираются в CSS).

Новые (и старые) единицы измерения в CSS, о которых вы вряд ли слышали - 1

Ниже приведены новые единицы измерения в CSS, которые будут указаны в документе CSS Values and Units Module Level 4.
Читать полностью »


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js