По следам интернетовских поисков замены самого культового и дефективного типа файлов

5 ноября 1999 года было объявлено «Днём сжигания всех гифок» [Burn All GIFs Day]. Если бы вы тогда зашли на домашнюю страницу этого проекта, вы бы увидели план его реализации, такой же простой, как его название: «В День сжигания всех GIF все пользователи GIF собираются в Unisys и сжигают все свои файлы GIF». Сопровождали всё это гордые антиподы GIF – файлы формата PNG.

Несмотря на шутку, связанную со сжиганием файлов, сопровождаемую забавной просьбой «потушить все гифки перед тем, как уйти», выражаемое недовольство было реальным, а миссия – настоящей: раз и навсегда избавить веб от его бича, формата GIF.

К тому моменту формату было уже больше десяти лет, он зародился лет за пять до самой сети, и он начинал устаревать. Он поддерживал жалкие 256 цветов. Его возможности анимации были хуже, чем у бумажного блокнота. Он явно был недоразвит по сравнению с любым более новым форматом файлов. И кроме всего прочего, держатели патентов уже пять лет угрожали судебными исками пользователям формата. Ко «Дню сжигания всех гифок» он уже находился на краю пропасти. Специалисты по форматам файлов и будущему сети обступили устаревший формат, вооружившись картинками с факелами и вилами в формате PNG.

И всё же, каким-то образом, мы с вами оказались в такой вот ситуации. Прошло 17 лет, а GIF не умер. Он правит интернетом.

Многим известно, что в мобильной версии Safari можно отсканировать свою банковскую карту. Но многие ли разработчики умеют создавать формы, поддерживающие эту возможность?

Готов поспорить, что немногие.

Дело осложняет полное отсутствие документации от Apple по работе этой функции. Но тут есть один момент. Функция сканирования банковских карт является подмножеством автозаполнения — браузерного функционала, давно игнорируемого веб-разработчиками. Понятно, почему они не уделяли ему должного внимания: когда регулярно заполняешь форму тестовыми данными, автозаполнение обычно мешает. Но для наших пользователей это важная функция. В Google выяснили, что при использовании автозаполнения пользователи на 30% быстрее заполняют формы. Так что давайте изучим работу автозаполнения, разберёмся, как создавать формы, поддерживающие кросс-браузерное автозаполнение, и воспользуемся преимуществами новых возможностей наподобие сканирования банковских карт.

Большинство создают внешние ссылки через target="_blank" и не знают одного интересного нюанса — страница, на которую мы попадем таким образом, получит частичный контроль над ссылающейся на нее страницей через js свойство window.opener.

Через window.opener.location мы сможем сделать редирект на, к примеру, фишинговую страницу. Это своего рода tabnabbing, только более продвинутый. Так как жертва меньше всего ожидает подмены страницы, в открытой ранее, доверенной вкладке браузера.

Привет! Я воплощаю интересные идеи на python и рассказываю о том, что из этого вышло. В прошлый раз я пробовал найти аномалии на карте цен недвижимости. Просто так. На этот раз идея была построить систему, которая смогла бы сама решать очень популярную ныне Google Recaptcha 2.0, основываясь на некоторых алгоритмах и большой базе обучающих примеров.
Google Recaptcha 2.0 представляет собой набор изображений (9 или 16 квадратных картинок под одной инструкцией), среди которых пользователю, для подтверждения своей разумности, нужно выбрать все изображения одной категории. Речь пойдет НЕ о построении системы машинного обучения — распознавать мы будем именно капчи!

Регулярно появляется какая-нибудь JS-библиотека, которую начинают шумно обсуждать на всевозможных форумах. Сначала постепенно нарастает энтузиазм, а затем сообщество быстро делится на противоборствующие лагери, по-разному относящиеся к новинке. Было бы просто невероятным подвигом рассмотреть все распространённые JS-фреймворки и библиотеки, поэтому хотим предложить вам список самых популярных и оказавших наибольшее влияние инструментов для фронтенд-разработки. А заодно дадим некоторые рекомендации по их использованию.

Но прежде чем перейти к делу, хотим уточнить:

• Не нужно ломать копий, если в этот список не попали какие-то из ваших любимых фреймворков или библиотек.
• Следите за обновлениями используемых вами инструментов. В последнее время начала активно внедряться кроссбраузерная и кроссаппаратная (cross-device) поддержка. Например, можно воспользоваться сканером, который подскажет, совместимы ли более старые версии с большинством устройств.

Вы PM. Как узнать – готова ли вёрстка к реальному использованию?
Вы заказчик. Как убедиться, что работа выполнена качественно?
Как оценить качество вёрстки?

Когда я стал тим-лидом, а позже PM, передо мной стала задача проверять вёрстку наших проектов. Нужно было выработать формальные, легкопроверяемые критерии, соответствие кода которым, должно было давать некую гарантию, что не будет факапов и ни клиент, ни программеры не сказажут потом “WTF?”.

Клиенту неважно насколько красив ваш код, но ему важен результат. Качественный код нужен фирме, т.к. он надёжней и в будущем его будет легче поддерживать.

Требования должны были быть такие, что соблюсти их легче, создавая качественную вёрстку, а не говнокод. Я составлял такой чек-лист в течении полутора лет. За последние полгода в него не добавилось ничего. Значит самое главное учтено.

Итак что же это за список?

Краткая версия теперь доступна на html5checklist.com (github), где можно вносить pull-request'ы.

История обновлений:

• 2015/08/11: Актуализировал рекомендации по оптимизации скорости загрузки. Добавил требование поддержки Retina. Дополнил «19. Мелочи» требованием что изображения должны масштабироваться в зависимости от размера окна.
• 2015/08/10: актуализирован список исключений для CSSLint
• 2015/07/29: актуализирован пункт №13 «плохо»/«хорошо»
• 2015/04/08: добавлено требование использования препроцессоров и рекомендация использования систем сборки
• 2013/04/25: добавлены анализаторами качества кода: CSSLint и JSHint, указан сайт подбора css font stack (спасибо @fliptheweb), мелкие уточнения (работу интерактивных элементов страницы, что не пропадает фон на высоких разрешениях, не должно быть пустых презентационных блоков, при проверках контента — пробовать удалять заголовки, менять местами блоки)
• 2013/04/24: добавил пункт об минимизации каскада (БЭМ-техники, MCSS, SMACSS), необходимости вписывания в экран моб. устройства, заменил ссылку на проверочный текст отображения стандартного html на код с normalize.css, поправил пример где в рекомендации встречался длинный каскад, упомянул про Opera на Presto и новый уровень семантики — в именах классов BEM.
• 2012/04/12: отсортировал пункты проверки в порядке важности, выделил главные, дополнил статью подробностями
• 2011/12/07: дополнил согласно доклада на WSD Минск'2011.
• 2011/07/19: добавлено про повышение надёжности вёрстки благодаря html5-тэгам, про необходимость favicon/apple-touch-icon, отсутствие багов при ресайзе textarea
• 2011/06/15: добавил пояснения какие ошибки валидации допустимы, рассказал про отсутствие официальной кнопки «HTML5 Valid» и про официальное лого HTML5 на сайте.

Доброго времени суток, %username%! Маленькое исследование на тему «какой же способ поставить функцию/метод на обработку в очередь эффективнее» и, как результат, сравнительный тест, и итоговая реализация схожей с setImmediate функции. Этот метод нужен тем, кто хочет разбивать выполнение скрипта, чтобы тот не «подвешивал» браузер, что бывает полезно при огромном скрипте инициализации, разборе большого массива данных, построения сложной структуры не прибегая к WebWorkers.

Для понимания: setImmediate это метод объекта window, который должен вызвать функцию, переданную в неё, асинхронно, эдакий setTimeout(fn, 0), где 0 реально 0, а не минимум 4. Для nodejs-программистов это process.nextTick. Т.к. сам метод (setImmediate) имеет чёткий стандарт с ошибками и дополнительными параметрами, рассмотрим абстрактную задачу асинхронного выполнения переданной функции/метода как можно быстрее.

Исследования исключительно в рамках сценариев браузера, при чём основных, т.к. в работниках (workers) не совсем понятно зачем такое дробление, хотя если нужно, можно попробовать обещания и сообщения.

Итак, давайте узнаем, что же лучше подходит: postMessage, MutationObserver или Promise?

Чуть меньше года назад я написал заметку о попытке создать инструмент нагрузочного тестирования на Node.js используя встроенные возможности (модули cluster и net). В комментариях справедливо указали на необходимость анализа RPS и сравнении с другими бенчмарками. В результате сравнения я пришел к естественному выводу, что многопроцессовый сервис никогда не сравнится по производительности с многопоточным из-за очень дорогих издержек на обмен данными (позже мы убедимся в этом на примере)

В далёком 1998 году, когда Google только начинал свой путь интернет поиска, сам по себе поиск в сети подразумевал стол, стул, компьютер (Pentium 2 в лучшем случае), dialup-соединение. Вы дважды задумывались, стоит ли нажимать на эту ссылку или не тратить время и читать поисковую выдачу дальше, в надежде найти нужное с первого раза?

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



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

На hh/gt не нашел ни единого упоминания о этом замечательном расширении для Google Chrome. Хочу поделиться им с сообществом, потому как в последнее время оно помогает мне каждодневно экономить минут 10 — уж очень много скриншотов из социальных сетей на разных языках которые с помощью этого плагина переводятся в два клика.

Встречайте — Project Naptha (Chrome webstore).



Список возможностей:

• копировать текст с картинки
• выделить весь текст
• гуглить выделенный текст
• переводить выделенное (бета)
• проговорить (TTS) выделенное

Предыстория

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

В то время, у нас, как у разработчиков, было два способа «расширить» Excel под нетиповые задачи:

• VBA (Visual Basic for Applications);
• VSTO (Visual Studio Tools for Office).

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

Один из моих читателей привёз мне пять ламп трёх российских производителей.

Недавно Роскомнадзор предпринял попытку блокировки доступа с территории РФ к Википедии. Попытка провалилась, и самое время перейти в контрнаступление. В статье под катом я покажу, что, если пользователь Х зашёл на сайт А, то сайт А может определить, заблокирован ли для пользователя другой сайт Б. А дальше, по намечающейся традиции, изложение пойдёт в вопросно-ответной форме.

Для чего это вообще нужно?

При обсуждении блокировки Википедии сообщество заметило два обстоятельства, которые весьма выгодны цензуре. Во-первых, Википедия использует HTTPS и, более того, HSTS. Это означает, что заблокирована энциклопедия может быть только целиком (с точностью до домена), но при этом перенаправить на пресловутую страницу с сообщением о блокировке нельзя. Вместо этого высвечивается сообщение об ошибке установления соединения. Это выглядит как внутренняя проблема Википедии и смягчает недовольство пользователя действиями Роскомнадзора; в то же время для развития правового государства необходима обратная связь. Во-вторых, даже если пользователи узнают о блокировке, многие из них просто не будут знать, что делать. Вешать перманентную плашку «Если заблокировали Википедию — качайте Tor Browser!» на неравнодушных сайтах как минимум странно; в то же время, оповещение пользователей о блокировке Википедии и способах её обхода необходимо. Решение поставленной проблемы и пытается дать настоящая статья.

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

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

Чем же платежные агрегаторы отличаются друг от друга, и на что стоит обратить внимание?

Каждую компанию было решено рассмотреть по десяти параметрам. Ниже приведено детальное описание параметра и почему на это стоит обратить внимание.

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

Инерционные устройства ввода — это такие устройства, как тачскрины, трекпады, magic mouse и пр., По своей работе трекпады и magic mouse напоминают тачскрины мобильных устройств, т.е. продолжают генерировать события мышинного колеса после того, как пользователь закончил жест. Но в отличие от оных у нас отсутствует нативное событие touchstart. Все, что мы имеем, это объект события wheel. Touchstart часто бывает необходим, чтоб комфортно реализовать работу так называемых fullpage-сайтов, где при скроллинге происходит переход между экранами. Примером такого сайта может послужить alfabank. На нем же присутствует проблема прокрутки двух экранов подряд при использовании magic mouse или трекпада (особенно на макбуках). Достаточно слабый жест скроллинга вниз прокручивает ко второму, а потом сразу к третьему экрану. Чтоб попасть на второй экран, приходится пользоваться скроллбаром. Именно такого рода проблемы мы попытались решить используя лишь объект события wheel.

Обновлено: 29 июня 2021 года

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

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

Привет, Хабр! Первая запись в корпоративном блоге не претендует на некую энциклопедическую значимость, поэтому просим не судить строго, это всего лишь знакомство с компанией и разрабатываемым продуктом.

И эта история о том, как мы разрабатывали систему автоматизации для ресторанов.

Позитивные стартапы в тренде.

… Я лихорадочно пытался найти хоть какое преимущество живого программиста перед искусственным интеллектом. Это было для меня как ушат холодной воды. Я понял, что меня можно заменить простым мобильным телефоном, который можно купить в каждом магазине. © Закат программистов.

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

Классическая схема включения услуг Интернет в многоквартирном жилом доме выглядит следующим образом: ТКД (точка коллективного доступа) — витая пара — роутер в квартире клиента, к которому подключены клиентские устройства по проводу и по Wi-Fi.

Характерные жалобы абонентов – скорость ниже тарифа, и возникают регулярные «замирания» при работе в интернете, что выражается долгим открыванием страниц в браузере, прерываниями видео, потерей связи с игровыми серверами и т.д. Данное поведение носит нерегулярный характер, а наиболее часто возникает в часы наибольшей пользовательской активности примерно с 18:00 до 23:00 в зависимости от города.

Есть несколько простых шагов, которые позволят определить возможную причину подобных проблем и решить 90% пользовательских ситуаций. Они ниже.