今回のリリースは4件のセキュリティ修正を含む『Security and Maintenance』リリースです。

皆さん、こんにちは。

業務改善を行うIT・業務コンサルタント、高橋です。

日本時間の今日、『WordPress』の更新版『WordPress 5.3.1』が公開されました。

今日はそのニュースをお伝えします。

WordPress 5.3.1セキュリティ&メンテ

さて、今回のリリースは『WordPress 5.3以前のバージョン』で影響を受けるとされるセキュリティ修正、バグ修正、機能強化となります。

『更新を強く推奨する』といったコメントではなく、『アップグレードする必要がある』というコメントが掲載されているため、アップデートすべきでしょう。

以下、アップデートの内容です。

＜セキュリティアップデート＞

・非特権ユーザーがREST APIを介して投稿をスティッキーにする可能性のある問題を修正

・クロスサイトスクリプティング（XSS）が巧妙に作成されたリンクに保存される可能性のある問題を修正

・wp_kses_bad_protocol（）を強化して、名前付きコロン属性を認識できるようにするための修正

・ブロックエディターのコンテンツを使用して、保存されたクロスサイトスクリプティング（XSS）の脆弱性を修正

＜メンテナンスアップデート＞

・管理：管理フォームコントロールの高さおよびアライメントの標準化の改善、ダッシュボードウィジェットリンクのアクセシビリティ、および代替カラースキームの読みやすさの問題を改善

・ブロックエディター：Edgeのスクロールの問題と断続的なJavaScriptの問題を修正

・バンドルテーマ：作成者の略歴を表示/非表示にするカスタマイザーオプションを追加し、JSベースのスムーズスクロールをCSSに置き換え、Instagram埋め込みCSSを修正

・日付/時刻：非GMT日付の計算を改善し、特定の言語での日付形式の出力を修正し、get_permalink（）をPHPタイムゾーンの変更に対してより回復力のあるものにする

・埋め込み：サービスが存在しないため、CollegeHumor oEmbedプロバイダーを削除する

・外部ライブラリ：sodium_compatを更新する

・サイトの正常性：管理者の電子メール検証のリマインド間隔をフィルタリングできる

・アップロード：ファイル名が一致する場合、サムネイルが他のアップロードを上書きしないようにし、アップロード後にPNG画像をスケーリングから除外する

・ユーザー：管理メールの確認で、サイトロケールではなくユーザーのロケールが使用されていることを確認する

・その他

以上のようになっています。

例によって早めの段階で『WordPress 5.3.1』へアップデートされることがお勧めです。

さて、何故このようなことが起こるのでしょうか？

皆さん、こんにちは。

業務改善を行うIT・業務コンサルタント、高橋です。

冒頭に書いた『Web画像』が抜けてしまう現象、これは単に画像が置かれている先のパスを間違えたからではありません。

Web画像が抜け落ちてしまった理由

Web画像は訪問者であるユーザーにイメージを伝える重要なファクターです。

それが抜け落ちてしまうと非常に困ります。

指定している画像のパスを確認しても問題なく、ファイル名も間違っていない。

あらゆるキャッシュをクリアしても現象は変わらない。

いったい何が問題なのか？

可能性の一つとして、『CDN（Content Delivery Network / コンテンツデリバリーネットワーク）』が考えられます。

最近ではWebの高速化を図る手段としてよく用いられるもので、html、css、JavaScript、jpg・png・gifなどのWebサイトを構成している要素をキャッシュしてくれるため非常に便利なものです。

では、それを使っていると何故『Web画像』が抜け落ちてしまうことがあるのか？

もう一つ要因があります。

Web画像に『WebP（ウェッピー）』を使っている場合です。

『WebP（ウェッピー）』というのはGoogle（グーグル）が開発した画像を軽量化してくれるフォーマットで、jpgを非可逆圧縮した場合には25～34%程度小さくなり、PNGの場合は28%程度小さくなるとされています。

これは、『CDN（Content Delivery Network / コンテンツデリバリーネットワーク）』側において『WebP（ウェッピー）』に対応していない場合に起こり得ます。

すべてが完全に抜け落ちてしまうわけでもなく、不安定な状態いなるといった方が正しいかもしれません。

ケースによってはデスクトップ上では問題が起きず、スマートフォンなどのモバイル上だけで現象が発生する場合もあります。

もし何をやっても解決しない場合で前述の条件に当てはまっているのであればこれを疑ってみるのも一つです。

皆さん、こんにちは。

業務改善を行うIT・業務コンサルタント、高橋です。

最近流行り？の『ダークモード』、これに批判的な方もいるようですが個人的には気に入っています。

単純な話で、少しでも目の負担を軽減したい、見やすくしたいということからです。

（私はブルーライト軽減のために昼間でもiPhoneは『ナイトシフト』を使っています。）

しかし、ベースとなるOSや一部のアプリケーションはそれに対応しているものの、Webサイトに関してはほとんど対応していないように思えます。

今日はそんな『ダークモード』の話題です。

Webサイトをダークモードに対応させる

Webサイトを『ダークモード』に対応させるためには『prefers-color-scheme』というものを使います。

この『prefers-color-scheme』を使って『ダーク（黒）』の場合の条件をCSSに記述すれば対応できます。

@media (prefers-color-scheme: dark) {
body {
background-color: #000;
color: #fff;
}
}

といった感じです。

変更箇所が複数に渡る場合は『var(–変数)』で対応すると便利です。

:root {
–main-bg: #fff;
–main-text: #333;
}
@media (prefers-color-scheme: dark) {
:root {
–main-bg: #000;
–main-text: #fff;
}
}

body {
background-color: var(–main-bg);
color: var(–main-text);
}

といった感じです。

さて、どれくらいのWebサイトが『ダークモード』に対応していくのでしょうか．．．

皆さん、こんにちは。

業務改善を行うIT・業務コンサルタント、高橋です。

さて、今日はメジャーバージョンアップ版の『WordPress 5.2 “ジャコ”』がリリースされましたので、それについてお伝えします。

WordPress 5.2 “ジャコ”の新機能

今回リリースされた『WordPress 5.2 “ジャコ”』は、『WordPress 5.1 “ベティ”』から始まった『より高速で安全なWordPress』の続きになります。

＜サイトヘルスチェック＞

5.1で導入されたサイトヘルス機能に加え、このリリースではよくある設定問題のデバッグに役立つ2つの新しいページが追加されました。また、開発者がサイト管理者のためにデバッグ情報を含められるスペースも追加しています。

＜PHP エラープロテクション＞

この管理者向けのアップデートにより、開発者の時間を損なわずに致命的なエラーを安全に修正もしくは管理できるようになります。いわゆる「死のホワイトスクリーン」のより優れた処理と、エラーを引き起こしているプラグインもしくはテーマを停止させるリカバリーモードへの移行が特徴です。

＜改善＞

（アクセシビリティの向上）

スクリーンリーダーやその他の支援技術を利用する方々のため、状況認識とキーボードナビゲーションのフローを改善するための多くの変更が連携して施されました。

（新しいダッシュボードアイコン）
Instagram、BuddyPress 用のアイコンセット、そしてグローバルな多様性を受け入れるための回転する地球を含む13個の新しいアイコンが備わりました。ダッシュボードで見つけてお楽しみください !

（プラグイン互換性チェック）
インストールされているプラグインがサイトの PHP のバージョンと互換性があるかを WordPress が自動的に検知するようになりました。もしそのプラグインが現在使用中の PHP のバージョンよりも上のバージョンを必要とする場合、潜在的な互換性エラーを回避するため、WordPress はそのプラグインを有効化しません。

＜開発者向け＞

（PHPバージョンの引き上げ）

サポートされる PHP の最低バージョンが5.6.20になりました。WordPress 5.2から、テーマとプラグインは名前空間、無名関数、そしてもっとたくさんのことを安全に活用できるようになりました !

※　PHP の古いバージョン(5.6.20未満)でサイトが動いている場合は、5.2をインストールする前に PHP をアップデートしてください。

（プライバシーのアップデート）
新しいテーマページテンプレート、条件分岐関数、そしてプライバシーポリシーページのデザインとカスタマイズをより容易にする2つの CSS クラス。

（新しいボディタグのフック）
5.2 では wp_body_open フックが導入されました。テーマが、 要素の最初にコードを挿入できるようにします。

（JavaScript のビルド）
wordpress/scripts パッケージ内での webpack と Babel 設定の追加により、モダンな JavaScript を書くための複雑なビルドツールのセットアップに開発者は悩む必要がなくなりました。

以上の内容となります。

引用部分にもあります通り、予告されていた『PHPバージョンの引き上げ』が行われていますので、PHP 5.6.20未満の場合は先にPHPバージョンを上げる必要があります。

皆さん、こんにちは。

業務改善を行うIT・業務コンサルタント、高橋です。

システム開発業者やウェブ制作業者も、時には著作権トラブルを抱えることがあります。

では、制作物に対する著作権はどのように扱われるのでしょうか？

ITやWEBの制作物における著作権

業務システムなどのソフトウェアや自社のホームページにショッピングサイト、これらの制作物が著作権法上保護されるか？と言うと、基本的には保護されないと思うべきです。

例えば、業務システムにおいて他社（他者）が作ったものに類似しているであったり、ホームページのHTMLやCSSの内容が他社（他者）が作ったものに類似しているということなどは無数にあります。

業務システムで言えば、システム構成やその流れはどこのメーカーでも業務に沿った一般的なものがほとんどで、他に見ない独創的なものではありません。

また、ホームページのHTMLやCSSの記述においても、さまざまなところで見かけることのあるウェブの記述ルールに沿って書かれているもので、これも他に見ない独創的なものとは言えません。

ITやWEBの制作物におけるユーザーとの問題

これらの制作物においてユーザーが勝手に複製などを行い流用した場合、それは契約上、どのような内容で契約を締結していたかの問題になります。

従って、これらの制作物を他で使われないようにするには、制作物に対する複製や流用などを一切認めないことを契約書に盛り込み、それに合意してもらうことが権利を守ることになります。

皆さん、こんにちは。

業務改善を行うIT・業務コンサルタント、高橋です。

現在、ウェブブラウザはGoogleのChromeがシェアNo.1の座にあり、MicrosoftのEdgeも今一つ伸びない状況にあります。

そんな中、MozillaがFirefoxをリニューアルするようです。

Firefox Quantumは2倍速い

11月中旬にリリースされる予定のFirefox 57は、バージョン表記以外に名前が変わります。

『Firefox Quantum』という名前になります。

『Quantum』を付けたということは、量子コンピュータのように速いということを表現したかったのか？

Firefox Quantumをβ版で少し動かしてみましたが、確かに速いです。

Google Chromeの64bit版を初めて使った時にも速さを感じましたが、それを上回る速さを感じます。

実際のところ、1年程前のバージョン52と比べて2倍速くなっているとMozillaは言っており、その背景として、マルチプロセスの活用、速度とメモリー消費のバランス調整といった着実な進化のほか、マルチCPUコア環境を前提として開発されたRustと名付られた新規開発のCSSエンジンなどがある。さらに、現在開いているタブの表示を他のタブより優先して実行するなど、ユーザーが体感しやすい工夫を組み合わせることで、Chromeより30％メモリー消費を少なくして、高速化できたとしています。

Mozillaが投稿しているFirefoxチャンネル（YouTube動画）です。

閲覧するものなどによってはChromeの方がやや速いケースもあるようですが、『Firefox Quantum』、お勧めです。

皆さん、こんにちは。

業務改善を行うIT・業務コンサルタント、高橋です。

今日は、先日書かせていただいた記事の結果報告です。

Use cookie-free domainsのおさらい

まず少しおさらいですが、GTmtrixにて『Use cookie-free domains』という項目のスコアが悪いのは、不要なcookieトラフィックを避けるために別のドメインの静的コンテンツを提供すべきであることを意味していて、

例えば、例えば、www.example.com/content/abc.jpg という画像があったとするならば、

これは、static.example.com/content/abc.jpg として提供すべきだという意味であることを先日書きました。

そして、画像以外にもJavaScriptやcssも同様のことが言えます。

cookie対策として行ったこと

前提：メインで稼働しているのは『www.example.com/blog/』とします。

１．別途、『static.example.com』というドメインを設定

２．static.example.com/blog/wp-content -> www.example.com/blog/wp-content というシンボリックリンクを貼る

３．config.phpに次のものを追加

　　define(‘WP_CONTENT_URL’, ‘http://static.example.com/blog/wp-content’);

　　define(‘COOKIE_DOMAIN’, ‘www.example.com’);

　　define(‘WP_PLUGIN_URL’, ‘http://www.example.com/blog/wp-content/plugins’);

注：WP_CONTENT_URLはプラグインの部分も影響するため、WP_PLUGIN_URLを書く必要がある

４．画像、css、JavaScriptが書かれているurlを『WP_CONTENT_URL』を読み込むように修正

以上のことを行いました。

測定結果は？

結果として、パフォーマンスが落ちるところまではいかないまでも、パフォーマンスが向上することはありませんでした。

また、GTmtrixの『Use cookie-free domains』に変化はなく、スコアは悪いままで、調整次第ではGoogleのPageSpeed Insightsにおいても悪い結果となります。

ここで言えるのは、cssは通常通りに読み込ませた方が良いです。

レンダリングのスコアに影響します。

画像やJavaScriptに関してはブラウザーキャッシュが効いていれば大丈夫ですが、だからと言って特別パフォーマンスが向上するわけではありません。

結果として、対策を行ったとしてもGTmtrixのスコアが伸びるわけでもなく、実際のパフォーマンスに関しても気休め程度の話しにしかなりませんでした。

これはおそらく、シンボリックリンクを使わずに実ファイルを別ドメインに持たせたとしても同じ結果になると思われます。

それらを満たしているのであれば、高速化は他のことを考えるしかありません。

皆さん、こんにちは。

業務改善を行う業務コンサルタント、高橋です。

業務改善のためのコンサルティング情報ブログでも何度か取り上げさせていただいていますが、今後、スマートフォンサイトを含めたウェブサイトの表示スピード向上はある一定レベルにおいての課題となります。

それらを考え、Google社が提供しているPageSpeed Module、『mod_pagespeed』を使うことは非常に有効な手段となってきます。

mod_pagespeedとは

このmod_pagespeedとは、ウェブサーバであるApacheのモジュールとして動作してくれ、画像の最適化やキャッシュ、JavaScriptやCSSなどの最適化を自動的に行ってくれることで表示スピードが速くなる優れものです。

つまり、自身であれこれチューニングを施すことをほとんど必要としないのです。

例えば、WordPressを使っている人であればプラグインなどを使って高速化を図ったり、html、JavaScript、CSSなどをキャッシュさせる工夫をしたりしますが、このmod_pagespeedはそれを自動的に行ってくれるのです。

しかし、残念ながらApacheのモジュールとして動作するものですので当然ながらレンタルサーバの環境にインストールされていなければ使えません。

mod_pagespeedが使えるレンタルサーバ

私が把握している限り、比較的安価に利用できるレンタルサーバの中では唯一『XSERVER』だけがmod_pagespeedを利用することができます。

難しい設定は必要なく、ただスイッチをONにするだけです。

もちろん、PHP7.0.xのFastCGI版を使えます。

私はXSERVERのユーザーではないですから宣伝する必要性はないのですが、前述の通り私が把握している限りはここしかないのでご紹介しているわけです。

お試し環境でテストさせていただきましたが圧倒的なスピードですので、オートマチックに済ませたい方もそうでない方も是非お勧めです。

過ぎるとウェブサイトそのものに問題が発生する場合があります。

皆さん、こんにちは。

業務コンサルタントの高橋です。

WordPress（ワードプレス）などを使ってウェブサイトを構築する際、便利な

プラグインを使ったりするのはよくある話しです。

しかし、あまりそれにばかり頼り過ぎるとトラブルになってしまうケースも

あります。

例えば、ウェブサイトの表示スピードを速くするために、JavaScript・CSS・

htmlを圧縮して高速化を図るプラグインがありますが、これもそのまま使って

しまうことによって表示が崩れてしまったり、ウェブサイトの一部が表示

されないことがあったりします。

これは、プラグインそのものの問題であったり、ウェブサイトに組み込んでいる

コードの書き方の問題であったりしますが、そもそもこの程度のことくらいなら

最初から自分で圧縮したものを使った方が無難とも言えます。

また、プラグインが増えれば増えるほど、セキュリティ面でのリスクも増加

することになります。

理由は、それぞれのプラグインで脆弱性を含んでいる可能性があるからです。

更に、プラグインは使えば使うほど、そのウェブサイトは重たいものとなり、

表示スピードが遅くなる原因にもなります。

WordPressなどのツールを使ってウェブサイトの構築をする場合、プラグインは

最小限にとどめ、使っているプラグインはWordPress本体と同様に最新の状態を

保つことをお勧めします。

今回も引き続き、別の改善策をお話しします。

前回の記事はこちら⇒WEBを高速化するための改善策

また、前回の軽量化のお話しはhtmlベースでのお話しをさせていただきましたが、

WordPressを使っている方であればプラグインを探して使えば同じことができます。

皆さん、こんにちは。

業務コンサルタントの高橋です。

今回は、キャッシュを活用することによって高速化を図る改善策をお話しします。

ブラウザーのキャッシュを使う

ブラウザーには自分のマシンに画像データなどを蓄積しておくキャッシュ機能があります。

それを一定期間使う設定をしてあげることによってデータの転送量が減り、結果的には

表示されるスピードが速くなるというものです。

実際には下記のようにmod_expiresの設定を.htaccessなどにしてあげます。

<IfModule mod_headers.c>
<IfModule mod_expires.c>
ExpiresActive On
ExpiresDefault “access plus 1 seconds” // キャッシュの初期化
ExpiresByType text/html “access plus 1 seconds”
ExpiresByType image/gif “access plus 2419200 seconds” // 4週間での設定
ExpiresByType image/jpeg “access plus 2419200 seconds”
ExpiresByType image/png “access plus 2419200 seconds”
ExpiresByType text/css “access plus 2419200 seconds”
ExpiresByType text/javascript “access plus 2419200 seconds”
ExpiresByType application/x-javascript “access plus 2419200 seconds”
ExpiresByType application/javascript “access plus 2419200 seconds”
</IfModule>
</IfModule>

“access plus 2419200″の部分は、”access plus 4 weeks”でもかまいません。

これで、ブラウザーのキャッシュクリアを行うか、強制的なリロードが行われない

限りキャッシュデータが使われるということになります。

4週間というのは例ですので、それぞれのウェブサイトにあったキャッシュ期間

を設定されるのが良いでしょう。

更新比較のETagをオフにする

Etagは、ブラウザー側のキャッシュファイルとサーバ側にあるファイル内容や更新日

などが同じかを比較するものですが、この比較をその都度行っていてることによって

スピードのロスが生じます。

そこで、下記のようにEtagをオフにする設定を.htaccessなどにしておきます。
<ifModule mod_headers.c>
Header unset ETag
</ifModule>
FileETag None

このような感じです。

まだ他にも行えることはありますが、概ねこれくらいのことをしてあげれば

結構改善されるはずです。

（機会があれば、また書かせていただきます。）

前回、今回と、ウェブサイトの高速化改善策に関するお話しをしてきましたが、

まずはご自身のサイトの状況を把握されると良いです。

私の場合は、グーグル社が提供しているデベロッパーツールを使ったりしています。

PageSpeed Insights

一度お試しください。

注：.htaccess は設定ファイルですので、間違った記述をされるとウェブサイトが

表示されなくなります。ご注意ください。