Компьютерное

Иногда бывает нужно проверить, с какого устройства загружена страница: с мобильного или обычного компьютера. К сожалению, полностью надежных способов нет, поэтому приходится ограничиваться проверкой User Agent на наличие характерных для мобильных устройств строк с помощью регулярного выражения. В JavaScript это делается так: Читать далее…

Иногда возникает задача сделать на сайте бегущую строку. В свое время для этого существовал специальный тег marquee, однако официально он не был включен ни в одну из спецификаций HTML, поэтому пользоваться им нежелательно. Второй вариант — это сделать прокрутку средствами JavaScript, задав бегущей строке padding-left (или просто left, если контейнеру с ней выставлено свойство absolute) и регулярно уменьшая его с помощью setInterval. Главный недостаток этого варианта — большая нагрузка на процессор, кроме того, прокрутка получается не плавной, а рывками.
Но для современных броузеров есть еще один вариант, основанный на CSS animations. В отличие от варианта с JavaScript, он позволяет сделать прокрутку достаточно плавной и при этом дает больше возможностей. Самый простой вариант его реализации выглядит так. Читать далее…

Недавно  столкнулся с тем, что боты поумнели настолько, что начали обходить обычную CAPTCHA на одном из сайтов, поддержкой которых я занимаюсь. Пришлось искать альтернативные решения, и выбор пал на reCAPTCHA от Google. Как выяснилось, подключить ее достаточно просто. Нужно зарегистрировать свой сайт на странице ReCAPTCHA (нужно иметь учетную запись в Google) и получить пару ключей: публичный (он будет размещаться на сайте) и секретный, который будет храниться только на сервере.
Дальше в форму, для которой нужна проверка CAPTCHA вставляем код такого вида:

<script src='https://www.google.com/recaptcha/api.js'></script>

<div class="g-recaptcha" data-sitekey="ваш-публичный-ключ"></div>

Google рекомендует вставлять тег script после head, однако на самом деле это не обязательно, и можно вставить его и прямо в форму или вообще в конец страницы перед </body>. Последний вариант, пожалуй, даже предпочтительнее, так как в этом случае код будет загружаться в самом конце загрузки страницы и не будет ее замедлять.
Если вы все сделаете правильно, то в том месте сайта, куда вы вставили код, появится такой блок:

В нем же будет скрытое поле g-recaptcha-response, которое будет отправлено на сервер вместе с данными формы. Для проверки корректности прохождения CAPTCHA нам нужно сделать POST-запрос на сервер Google. Читать далее…

Недавно озаботился оптимизацией Windows 10 на старом стационарном компьютере и решил собрать в эту тему советы по этой теме.
Итак, начнем. Читать далее…

Сегодня опубликовал первый навык для Яндекс.Алисы — «Советник Сократ». Чтобы запустить навык, скажите Алисе «запусти чат с советником Сократом» и начните отвечать на вопросы. Навык реализует метод майевтики — задает вопросы, которые побуждают к размышлению и помогают самостоятельно найти решение той или иной стоящей перед вами проблемы. Этот метод был придуман почти две с половиной тысячи лет назад философом Сократом, но остается актуальным до сих пор.
Немного о том, как он был создан

Недавно потребовалось перенести все контакты с обычного кнопочного мобильника (Philips Xenium) на смартфон с Android. Сначала казалось, что задача предельно простая: и в том, и в другом устройстве есть Bluetooth, и можно переслать по нему. Вскоре выяснилось, что возможности отправить адресную книгу целиком в Xenium нет, можно только слать контакты поштучно. Контактов было около 500, поэтому такой вариант не подходил. Однако из настроек Xenium выяснилось, что к контактам можно обращаться по Bluetooth извне. Возникла мысль поискать приложение для Android, которое сможет подключиться и забрать необходимую информацию.
Как выяснилось, такие приложения действительно есть. Одно из них называется Bluetooth Contact Transfer, второе — Transfer Contacts. Я воспользовался первым. Оно без проблем подключилось, показало список контактов на Xenium с возможностью выбрать, какие переносить, и через пятнадцать секунд вся информация была уже на новом смартфоне. Единственный недостаток приложения — прогресс выполнения операции показывается как N/100, из-за чего можно ошибочно подумать, что перенесены только первые 100 контактов. Это не так, корректно импортируется все.
Для телефонов, у которых нет Bluetooth, придется использовать другие способы. Если контактов немного, то самый простой способ — перенести их на SIM-карту, и просто переставить ее в новый смартфон. Если этот вариант не подходит, то остаются еще два. Первый — поискать, нет ли способа сохранить всю адресную книгу в файл формата vcf или отправить ее по EMail в этом же формате. А затем полученный файл загрузить на смартфон и открыть там в файл-менеджере. Второй — это скачать с сайта производителя телефона программу для синхронизации с компьютером и выгрузить контакты туда (некоторые из таких программ также умеют делать экспорт в vcf, некоторые — только в адресную книгу Windows), а затем произвести синхронизацию с компьютера на смартфон.

Недавно столкнулся с такой задачей: требовалось в Javascript сформировать определенный HTML-код и вставить его сразу после тега script, из которого этот код вызывается. Возник вопрос: а как вообще узнать, какой скрипт сейчас выполняется?
Сделать это можно несколькими способами.

• воспользоваться свойством document.currentScript, которое содержит ссылку на тег. Но оно не работает в старых броузерах, в частности во всех версиях MSIE (но работает в Edge). Кроме того, не следует обращаться к этому свойству из callbacks, это может приводить к некорректным результатам.
• прописать id для тега и обращаться по нему: document.getElementById('идентификатор'). Это самый универсальный вариант, но с ним могут быть сложности, если скрипт подключается через механизмы, предусмотренные в CMS (там обычно не предусмотрено возможности указать id или иные атрибуты)
• если точно известен URL скрипта и он не будет менятся, то можно воспользоваться document.querySelector('script[src="путь"]'). Полезно для различных встраиваемых сервисов (типа онлайн-помощников), которые берут скрипт с одного и того же URL.
• наконец, самый надежный в плане обратной совместимости вариант — смотреть последний тег script:
  
  var s =  document.getElementsByTagName("script"); var attr = s[s.length-1].getAttribute("attr1");
  Однако работает он только в том случае, если скрипт подключается без async или defer.

Читать далее…

На SEO-форумах часто ругают Яндекс за то, что он игнорирует meta-тег description и вместо него выводит в сниппете произвольный кусок текста из страницы. Однако зачастую это результат того, что описание страницы составлено неправильно. Многие ошибочно воспринимают desciption как подзаголовок, своего рода дополнение, уточняющее тег TITLE, и пишут его в таком же стиле, составляя, в основном из существительных и прилагательных.
Каким же должно быть хорошее описание? Оно содержит одно или два полноценных предложения, в которых обязательно должны быть глаголы. В идеальном случае в них сосредоточена суть статьи, некий итог, который пользователь вынесет для себя после ее прочтения. Кроме того, следует помнить об ограничениях на длину: она не должна быть больше 160 символов. Кроме того, слишком короткие description (порядка 70—75 символов) также могут быть проигнорированы поисковыми системами. Читать далее…

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

• навигационное меню
• формы для поиска по сайту и комментариев
• рекламные блоки, виджеты соцсетей и кнопки «поделиться»
• различные всплывающие и накладывающиеся поверх основного контента элементы (например, на этом сайте это ссылка «Задать вопрос» справа)
• облако тегов
• «подвал» сайта

Но не переусердствуйте! Обязательно оставьте видимыми «хлебные крошки», название и логотип сайта, а также контактные телефоны и Email, если они есть на сайте.
Кроме того, следите, чтобы при печати использовалась вся ширина листа, то есть не было бы жестко заданной ширины в пикселях для сайта в целом или для основного блока с контентом.
Как это сделать технически? Некоторые CMS позволяют создавать отдельные страницы для печати. Но это плохое решение: с точки зрения поисковых систем получаются дубли страниц, причем иногда версия для печати индексируется лучше, чем основная, и пользователи из поисковых систем, попадая на нее, не могут понять, как перейти на основной сайт. Поэтому лучше использовать средства CSS — media-запрос print, переопределив с его помощью CSS-свойства элементов на основной странице. Читать далее…

Возможно, еще не всем известно, что на этой неделе Яндекс окончательно отменил ТИц и вместо него ввел новый показатель — индекс качества сайта (ИКС), который учитывает не только ссылочную массу, но и еще ряд факторов. Я собрал информацию по своим сайтам и получил следующие данные: Читать далее…