Портрет 4X_Pro
Был в Сети вчера, 23:58
Мультиблог
4X_Pro
Записки лишнего человека

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

Включаем кеширование DNS в Ubuntu

4X_Pro
Недавно подключил Интернет напрямую в ноутбук, без роутера, и обнаружил, что многие сайты стали открываться ощутимо медленнее. При этом по данным speedtest.net скорость соединения стала существенно больше. Стал разбираться, в чем дело. Выяснилось, что хотя в Lubuntu по умолчанию все запросы идут через локальный DNS-сервер dnsmasq, в нем по умолчанию отключено кеширование! Но его достаточно легко включить.

10 cервисов для оценки качества сайта

4X_Pro

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

Посмотреть весь список

Как проверить, загружен ли сайт с мобильного устройства

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

Бегущая строка с помощью CSS Animations

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

Как добавить ReCAPTCHA на свой сайт

4X_Pro
Недавно  столкнулся с тем, что боты поумнели настолько, что начали обходить обычную 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

4X_Pro
Недавно озаботился оптимизацией Windows 10 на старом стационарном компьютере и решил собрать в эту тему советы по этой теме.
Итак, начнем.
  1. Отключаем ненужную анимацию (то, с чего начиналась оптимизация со времен Windows 95). Идем в "Панель управления"/"Система"/"Дополнительные параметры системы", там выбираем вкладку "Быстродействие", и в появившемся списке отключаем все, что считаем ненужным (я обычно оставляю только сглаживание шрифтов, тень под курсором мыши, отображение окна при перетаскивании и прозрачный прямоугольник для выделения).
  2. Отключаем Lock Screen (экран блокировки). На мой взгляд, это одно из самых ненужных нововведений Win 10, только замедляющее загрузку и требующее лишнего щелчка мышью перед вводом пароля. Для этого запускаем regedit (редактор реестра), находим путь HKEY_LOCAL_MACHINE\SOFTWARE\Policies\Microsoft\Windows\Personalization и там создаем параметр типа DWORD (32 бита) с названием NoLockScreen и прописываем туда значение 1.
  3. Отключаем обои на экране входа в систему (чтобы ускорить загрузку): заходим в реестр и по адресу HKEY_LOCAL_MACHINE\SOFTWARE\Policies\Microsoft\Windows\System создаем параметр DisableLogonBackgroundImage типа DWORD (32 бита) со значением 1.
  4. Там же отключаем Activity Feed: в параметр EnableActivityFeed прописываем 0. Параметр имеет тип DWORD (32 бита)
  5. Из меню "Пуск" нужно удалить все неиспользуемые приложения-плитки, так как каждое из них тратит ресурсы на свою отрисовку. Кроме того, если вы вообще не пользуетесь такими приложениями, в реестре можно отключить их обновление полностью. Это снова реестр, раздел HKEY_CURRENT_USER\SOFTWARE\Microsoft\Windows\CurrentVersion\PushNotifications, там создаем параметр NoTileApplicationNotification (DWORD 32 бита) и прописываем значение 1
  6. Отключаем прозрачность меню Пуск и Панели задач (пользы от нее мало, а дополнительная нагрузка при отрисовке имеется). Снова идем в реестр, в раздел HKEY_CURRENT_USER\SOFTWARE\Microsoft\Windows\CurrentVersion\Themes\Personalize. Там есть параметр EnableTransparency, для которого прописываем значение 0. (Если параметра нет, создаем его с типом DWORD 32 бита).
  7. На большинстве домашних компьютеров можно включить асинхронное применение групповой политики в целях ускорения загрузки. Для этого нужно зайти в реестр HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Windows\CurrentVersion\Policies\System и там переключить там параметр SynchronousUserGroupPolicy в 0.
Тем, кому не нравятся изменения в меню "Пуск", появившиеся в Windows 10, можно предложить использовать программу Classic Shell. Она позволяет сделать вид этого меню таким же, как во времена любой из предыдущих версий Windows: 2000/XP/7. А кроме того, это меню отрисовывается гораздо быстрее, чем обычное.

Советник Сократ

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

Как перенести контакты с старого телефона на смартфон

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

Как вставить элемент после тега script из самого скрипта

4X_Pro
Недавно столкнулся с такой задачей: требовалось в 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.
Читать далее…

Как писать тег description для статей на информационных сайтах

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

Страницы:
Задать вопрос

Здесь можно задать мне вопрос или спросить совета по любой теме, затронутой в блогах или на форуме. После того, как я отвечу, вопрос и ответ появятся в соответствующем разделе. Но не забываем, что я — сторонник slow life, поэтому каких-либо сроков ответов не обещаю. Самые интересные вопросы станут основой для новых тем на форуме или записей в блоге.
Сразу предупреждаю: глупости, провокации, троллинг и тому подобное летит прямо в /dev/null.