Веб-дизайн

индекс
136,72
29 января в 17:01

Атомарный веб-дизайн из песочницы

Предлагаю читателям «Хабрахабра» перевод статьи Брэда Фроста (Brad Frost) «Atomic Web Design».



Мы не проектируем страницы, мы проектируем системы компонент. — Stephen Hay

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

Многое было сказано насчeт создания систем дизайна, и наибольший акцент делается, в основном, на установление цветов, типографии, сеток, текстур и т.п. Такой тип мышления, несомненно, важен, но я чуть меньше заинтересован в этих аспектах дизайна, потому что, по большому счeту, они всегда субъективны. В последнее время меня больше озадачил вопрос о том, из чего состоят наши интерфейсы, и как мы можем проектировать их более систематично.
14330
227
Naissur 15,5
29 января в 16:02

Введение в HTML импорты перевод tutorial

Template, Shadow DOM, и Custom Elements позволяют вам строить UI компоненты проще и быстрее. Однако, это не самый эффективный способ загрузки ресурсов HTML, CSS и JavaScript по отдельности.

Для загрузки библиотек типа jQuery UI или Bootstrap требуются отдельные тэги для JavaScript, CSS, и Web шрифтов. Все становится проще при использовании Web Components с несколькими зависимостями.
+4
4020
95
alexandfox 43,0
29 января в 08:40

У Вас все еще включен SSL3? Проверьте сервер и браузер на уязвимость POODLE

Уязвимость POODLE известна уже довольно давно. Ее описание встречалось на Хабре, однако проблема все еще остается актуальной, и SSL 3.0 все еще используется на многих веб серверах. ХостТрекер предлагает простой способ проверить, есть ли эта уязвимость на стороне Вашего браузера или же любого веб сервера.



+3
5064
20
smiHT 3,1
28 января в 20:14

Баг в CSS Chrome, разрушивший наш сайт перевод

Это реальная история, случившаяся с нашим сайтом во время празднования Дня Благодарения.

Сайт перестал работать внезапно, ничего не предвещало такого оборота.

Поначалу я подумал, что проблема в нашем провайдере хостинга, потому что с ним уже случались проблемы ранее. Наш сайт уже трижды успевал «падать» по разным причинам, и это выглядело как типичная проблема с их стороны.
+40
34351
84
alexandfox 43,0
28 января в 12:45

Создание MVPP: минимально жизнеспособного продукта, которым можно гордиться перевод

image

День 18 ноября 2014 года стал датой публичного релиза редактора Optimizely’s для iOS. Это было весьма значимым событием, так как релиз ознаменовал собой окончание многомесячного публичного бета-тестирования, на протяжении которого сотрудники компании получили массу пользовательских отзывов, в соответствии с которыми занимались внедрением множества недостающих функций (о том, как зарабатывать на продукте или сервисе до его запуска — здесь). Но до момента запуска приложения оставалась одна проблема, в процессе решения которой сплотилась вся команда: они не чувствовали гордости за свой продукт. Для исправления этой проблемы ребята и вышли за рамки концепции MVP (англ.: «Minimum Viable Product» — «Минимально жизнеспособный продукт»), расширив её до MVPP: «минимально жизнеспособный продукт, которым мы гордимся» (англ.: «Minimum Viable Product we’re Proud of»). Ниже — история о том, как все это было, чему сотрудники из Optimizely научились по ходу работы, а также — советы по разработке, которые должны помочь читателям создавать классные продукты. Советы с точки зрения тех, кто только что прошёл этот путь.
+5
5596
64
26 января в 19:12

Дайджест интересных материалов из мира веб-разработки и IT за последнюю неделю №144 (19 — 25 января 2015)

Мы никуда не пропали и все так же предлагаем вашему вниманию подборку с ссылками на полезные ресурсы, интересные материалы и IT-новости.


+31
22273
234
alexzfort 132,9
25 января в 18:55

Несколько интересностей и полезностей для веб-разработчика #37

Доброго времени суток, уважаемые хабравчане. За последнее время я увидел несколько интересных и полезных инструментов/библиотек/событий, которыми хочу поделиться с Хабром.

Buzz.js




В последнее время в интернете все чаще и чаще встречаются проекты, где различные интерфейсные элементы сопровождаются определенными звуками. Я бы даже сказал, что UX/UI в вебе переходит на новую ступень эволюции. А Buzz.js одним из первых готов помочь вам в озвучке вашего интерфейса. Это библиотека для работы с HTML5 Audio API с рядом подходящих обработчиков событий.

var mySound = new buzz.sound( "/sounds/myfile", {
    formats: [ "ogg", "mp3", "aac" ]
});

mySound.play()
    .fadeIn()
    .loop()
    .bind( "timeupdate", function() {
       var timer = buzz.toTimer( this.getTime() );
       document.getElementById( "timer" ).innerHTML = timer;
    });


+47
29551
430
22 января в 00:50

Рисуем анимированную сцену с помощью css tutorial

Передохнём от верстки всяких пользовательских интерфейсов и просто порисуем на CSS. Рисовать будем такую вот сцену:



Смотреть на jsfiddle.

В статье я попробую описать пошаговое создание этой сцены.
+37
23510
386
21 января в 15:11

8 сортов муды в твоей веб-студии

Муда, что по-японски означает «потери» — это любая деятельность, которая потребляет ресурсы, но не создает ценности для клиента. (Источник).



Эта короткая заметка для тех, кто системно ищет, где его студия теряет деньги. Похвальное занятие в наше весёлое время.

Хорошо систематизировали виды потерь ребята из Toyota. Тойотовцы выделяют 7-8 видов муды, потерь на производстве. Посмотрим, есть ли аналоги между потерями в автомобилестроении и работе студии.
+66
54778
515
21 января в 12:40

Божественный подход к аутентификации из песочницы

Я закончил курс в университете Вирджинии в 1992 году по теме “Компьютерные науки в упрощенном виде”. Причина, по которой я выбрал именно упрощенный курс, была в том, что обычный курс CS в университете Вирджинии требует прохождения инженерной школы и я был абсолютно не готов к такому количеству математики и физики. Красота упрощенного курса была в том, что я мог посетить все интересные мне предметы, пропустив остальные.

Одним из моих любимых предметов, по крайней мере он запомнился мне больше всего, был “Алгоритмы”. Я всегда говорю людям, которые меня спрашивают об этом, что этот предмет повлиял на мое становление, как программиста, больше всего. Я точно не знаю почему, но несколько лет назад у меня появилось странное предчувствие, и я почему-то перешел на страницу Рэнди Пауша (автор той самой книги). С удивлением для себя я обнаружил, что он набирает студентов к себе на курс. Время было идеальным: университет Вирджинии, осень 1991, CS461 Анализ алгоритмов и 50 студентов на курсе. Я был одним из них.

И без сомнений я был впечатлен этот курсом. Пауш был настолько блестящим и харизматичным учителем, что ты понимаешь смысл старой пословицы о том, что сначала нужно выбрать учителя, а потом уже то, что учить, если вы вообще должны будете делать этот выбор. Это настолько сильно отражает действительность.

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

И одна из самых крутых вещей, которой нас обучил Рэнди Пауш, была необходимость задать себе следующий вопрос перед выбором алгоритма:
А какой бы алгоритм выбрал Бог?



+17
16615
235
stp008 12,8