Google Search Consoleに追加された新たな指標値 Google Search Consoleに新たな指標が追加されました。すべて、ウェブに関する主な指標レポートに記載の通りです。必ずしも早急な対処が必要なものではありません。ただし、これらの指標に対応することで、必然的にUI/UXの向上が期待できます。 LCP (Largest Contentful Paint) FID (Fist Input Delay) CLS (Cumulative Layout Shift) LCP (Largest Contentful...
CSSフレームワークの「Bulma: Free, open source, and modern CSS framework based on Flexbox」のcolumnsクラスの挙動がおかしい、というお話です。 Columns responsivenessは、Flexboxをベースとしたレスポンシブなレイアウトを簡単に定義できます。ところが、以下のシンプルなコードをみてください。 <html> <body> <div class="columns is-desktop"> <div class="column">1</div> <div class="column">2</div>...
静的サイトの悩みの種、サイト内検索をNetlify Functions+Hugoで実装してみました。ポイントは、以下の通りです。 クライアントであるブラウザにとって負荷の低い実装方法とする 記事の更新の都度、インデックス等の更新にかかる運用が発生しないようにする(自動的に行う) Hugoの機能、ある程度の月...
HugoのMarkdownで数式組版ライブラリであるKaTeXをサポートするで、Hugoに$\KaTeX$を組み込みました。$\KaTeX$は、MathJaxより高速にレンダリングできる、ブラウザで動作する数式組版ライブラリです。 今回は、Netlify CMSのプレビューで、リアルタイムで$\KaTe...
Hugoで、KaTeXというブラウザで数式を表現するためのライブラリをサポートする方法です。Hugo 0.70.0(Extended)で正常に表示されることを確認していますが、今後のバージョンアップ等により、以下の方法がサポートされなくなる可能性がありますので、ご注意ください。特に、Markdownパ...
英語のニュースや記事がスラスラ読めるようになると、知識の幅が広まります。英語の読解能力を身に着ける時間が無い、でも海外の論文をスラスラ読めるようになりたい、と言う壮大な夢を描いている人にオススメな方法があります。 iPhone Google Chromeには、デフォルトで「翻訳」機能が付いています。英語のみならず、多言語を日...
PythonのパッケージをPyPIからインストールする際に用いるpipコマンドで、よくある警告を抑止する方法です。 例えば、現在アクティブな環境にインストールされているパッケージ一覧を表示した際にも表示されます。pip listを実行してみます。 Package Version ---------- ------- pip 19.2.3 setuptools 41.2.0 WARNING: You are using pip version 19.2.3, however version 20.1 is available. You should consider upgrading via the 'pip install --upgrade...
Parallels Desktop、およびWindows 10 Home Editionで確認しています。また、Windows 10のバージョンは以下の通りです。なお、ここでご紹介する設定は一例です。あくまでご参考までにご覧いただけると助かります。 オススメの設定 すべて「設定」アプリから実施します。 システム 通知とアクション 「ロック画面...
python - Docker Hubで公開されているコンテナイメージをベースとして、MeCab + IPADIC + NEologdを使用するためのDockerfileを公開します。NEologdは、IPAが公開する辞書であるIPADICとの併用が推奨されています。今回は、IPADIC + NEologdを、MeCabのシステム辞書として使用し...
VS Codeで、Rubyで書かれたプログラムをデバッグする方法です。単一のRubyファイルをデバッグするためのものであり、RSpec、およびRuby on Railsなどのフレームワークを用いたプログラムは対象外です。 rbenvによる環境構築 環境の確認です。Macで確認していますが、Windows 10でも同...
VS CodeでPython - Visual Studio Marketplaceの拡張機能を使用すると、Pythonで記述されたプログラムのデバッグや、Jupyter Notebook環境をVS Codeで実行できて大変重宝します。たまに、このJupyter Notebookが、以下のエラーにより起動しなくなったことがあったため、そ...
Netlify上でのデプロイ結果を、Discordへ通知する方法をご紹介します。Slack連携とほぼやり方は同一ですが、GitHub同様に1点のみ注意点があります。 Discordのウェブフックを準備 チャンネルの編集画面から、ウェブフックを追加します。ウェブフック作成時に生成されるURLをコピーしてお...
VS Codeのチュートリアルを試してみました。事前に、Python、Dockerの拡張機能をインストールしておく必要があります。なお、Django、Flaskに関する説明は本記事にはありません。 Python - Visual Studio Marketplace Docker - Visual Studio Marketplace 環境 試した環境は以下の通りです。 $ sw_vers ProductName: Mac OS X ProductVersion: 10.15.3 BuildVersion: 19D76 また、pythonはHomebrew...
Slackであれば、AppディレクトリからGitHubアプリをインストールすれば、GitHubと簡単に連携できます。Discordでも同様の連携ができないかどうか試してみたところ、一癖ありましたが連携可能でした。以下で使用している画像は、Mac版のDiscordアプリ(0.0.256)のスクリーンシ...
Ansibleで環境構築を自動化しようかどうか悩みつつ、一から少しずつ手を加えていくことが好きな自分のためのメモを残しておきます。 ProductName: Mac OS X ProductVersion: 10.15.4 BuildVersion: 19E266 システム環境設定 一般 「外観モード」→「ダーク」 Dock 「拡大」のチェックを外す 「ウインドウタイトルバーのダブルクリックで」→「しまう」 使用頻度は低いですが、El...
macOS Catalinaに搭載されているPythonの実行環境を3.x.xへ変更する方法です。ただ、pythonコマンドで、3.x.xを実行したいだけの記事です。Pythonの開発環境についてどうこう議論する場でないことは最初に申し上げておきます。次期のmacOSでは、Python 2.x.x系は駆逐されて...
スクリーンショットを撮影した際に右下に表示される、サムネールを非表示にする方法をご紹介します。スクリーンショットを保存する前に、注釈やテキストを付け加えてマークアップしたり、誰かに共有するには便利な機能ですが、即座に保存したい場合には少し邪魔な機能です。 「スクリーンショット.app」のオプションで変...
撮影したスクリーンショットを、ブログ等の用途で掲載したいことがあります。取得したスクリーンショットをそのままアップロードするとサイズが大きく、閲覧者の負担やWebページの表示に時間がかかります。アップロードの事前に、画像を圧縮してファイルサイズを小さくしておくことが推奨されます。 多数の画像圧縮ツール...
Hugo | Netlify CMS | Open-Source Content Management Systemに沿って構築した、Netlify CMSのテンプレートを、Page Bundles | Hugoに対応させる方法です。 最終的なディレクトリ構成は以下の通りです。Page Bundlesに無関係な項目は割愛、一部名称の変更を行っています。 . ├── archetypes ├── assets ├── config.yml ├── content │ ├── posts │ │ └── 2020 │...
zplugは、zshのプラグインマネージャ、preztoは軽量なフレームワークです。zplug以外に、zinitなどがありますが、乗り換えるのが面倒であるため、現在はzplugで落ち着いています。また、下記の使い方であれば、preztoを入れる必要性をそこまで感じませんが、preztoに同梱されてい...