皆さん、こんにちは。

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

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

WordPress 5.5 “エクスタイン”について

今回リリースされた『WordPress 5.5 “エクスタイン”』では、スピード、SEO、セキュリティの3つを中心に改善・向上が行われています。

＜スピード＞

画像の遅延読み込みのおかげで、投稿と固定ページがより高速に感じられます。

画像はストーリーに大きなインパクトを与えますが、サイトを遅く見せることもあります。

WordPress 5.5では、画像がスクロールして表示されるまで画像の読み込みを待機させます。技術用語では「遅延読み込み (lazy loading)」といいます。

モバイルでは、遅延読み込み機能がブラウザーが他の端末向けに用意されたファイルを読み込まないようにすることもできます。これによって読者のデータ費用を節約し、バッテリーの寿命を延ばすことができます。

＜SEO＞

新しいサイトマップが登場しました。

WordPress サイトは検索エンジンとうまく連携します。

WordPress 5.5ではデフォルトで XML サイトマップが含まれるようになり、サイトが公開されたらすぐに検索エンジンが最も重要なページを発見できるようになります。

これで、より多くの人がより早くあなたのサイトを見つけられます。そして、訪問者のエンゲージメント向上、維持、購読者や顧客へのコンバージョンなど、設定した定義に合った成功に向かうための時間をもっと確保できます。

＜セキュリティ＞

プラグインとテーマの自動更新

プラグインやテーマを自動的に更新するか、もしくはしないかを、WordPress の管理画面から設定できます。これで、サイトが常に最新のコードを実行していないというようなことはなくなります。

また、いつも見慣れた画面上で、インストールしたプラグインやテーマごとに自動更新のオンとオフを切り替えることもできます。

ZIP ファイルをアップロードして更新

プラグインやテーマを手動で更新したい方にとっても、作業がより簡単になりました。ZIP ファイルをアップロードするだけです。

＜ブロックエディターのハイライト＞

ブロックパターン

新しいブロックパターンを使えば、テキストとメディアを組み合わせて、ストーリーに合った複雑で美しいレイアウトを簡単かつ楽しく作ることができます。

必要なブロックを見つけるのがこれまでになく簡単になりました。新しいブロックディレクトリはブロックエディターに直接組み込まれているため、エディターを離れることなく、新しいブロックタイプをサイトにインストールできます。

新しいブロックライブラリ

簡単に必要なブロックを見つけることができるようになりました。新しいブロックディレクトリはブロックエディターに組み込まれているので、エディターから離れることなく新しいブロックタイプをサイトにインストールすることができます。

インライン画像編集

画像ブロックから直接、写真を切り抜き、回転、ズームできます。画像に多くの時間を費やしていた方は、これでかなり時間を節約できます。

＜アクセシビリティ＞

すべてのリリースでパブリッシングエクスペリエンスのアクセシビリティを改良してきましたが WordPress 5.5も例外ではありません。

メディア画面とモーダルダイアログのリンクをボタンでコピーできるようになりました。テキスト行をハイライトする必要はありません。

また、キーボードでメタボックスを動かしたり、画像エディターで指示を読み上げられるので、支援デバイスを使ってWordPressで画像を編集することもできます。

以上の内容となります。

（開発者向け情報は割愛しました。)

ご参考までに。

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

皆さん、こんにちは。

業務改善を行う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・業務コンサルタント、高橋です。

ウェブサイトを管理している方、特にWordPressで構築されたウェブサイトの管理者なら『パーミッション』という言葉を聞いたことがあるかと思います。

これは、ファイルやディレクトリごとに対するアクセス権になりますので、設定次第では危険にさらされた状態であったりします。

では、どのように設定しておくのが良いのでしょうか？

パーミッションとは

まず、パーミッションは3つのユーザーと3つの権限の組み合わせになります。

ユーザーには、

１．所有者（ファイル・ディレクトリのオーナー）

２．所有者と同じグループ（同一サーバーを利用できるユーザー）

３．その他のユーザー（その他の第三者）

があり、権限としては、

１．読み取り権限（読んで良いか？）：r

２．書き込み権限（書いて良いか？）：w

３．実行する権限（動かして良いか？）：x

があります。

これらをすべて並べると、rwxrwxrwx（777）となります。

パーミッションの設定

一般的なパーミッションの設定としては、

１．htmlファイルや画像ファイル：644（rw-r–r–）

２．ディレクトリ：755（rwxr-xr-x）

３．cgi実行ファイル：755（rwxr-xr-x）

４．cgiやJavaScriptのライブラリ：644（rw-r–r–）

といった感じに設定したりしますが、

１の場合、所有者であるオーナーは読むことも書くことも可能で、所有者と同じグループとその他の第三者は読むことだけの権限という設定になります。

また、３の場合はプログラムを動かす必要性があるため、すべてのユーザーに実行する権限が付与されています。

ただし、多くの事業者は共用のレンタルサーバーを使ってウェブサイトを公開していることが多いため、所有者と同じグループの権限を付与してしまうと、共用サーバー内の他者が操作をできてしまうことになってしまいます。

そのため、所有者と同じグループの部分は権限を付与しない方が良いです。

従って、644（rw-r–r–）であれば604（rw—r–）、755（rwxr-xr-x）であれば705（rwx—r-x）としておく方がお勧めです。

また、WordPressを使っている場合においては『wp-config.php』というファイルがありますが、これは所有者だけが読み込むことができる400（r——–）としておくことが最も安全な設定となります。

（共用サーバーで400が設定できない場合は600（rw——-）がお勧めです。）

皆さん、こんにちは。

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

今日は、今春から国内企業に相次いでいた新たな手口のサイバー攻撃に関してお話しします。

添付文書内でダブルクリックを促すもの

今春から国内企業に相次いだ新たな手口のサイバー攻撃とは、メールに添付された文書を開き、中に埋め込まれた画像をクリックさせてウイルス感染させるといったものです。

従来の手法では、ソフトウェアの脆弱性を突くものや、マクロ機能を悪用した手口などがありますが、実際の文書内の画像をクリックさせることでウイルス感染させる手口は初めてです。

具体的には、以下のような感じの文書になっているようです。

あなたが領収書を見たい場合は、文書をダブルクリックしてください。

Ｗドキュメント（画像）

以下、日本語の表現のおかしな文書

このＷドキュメント（画像）がアイコン画像のようになっており、そこのクリックを促すというものです。

このアイコン画像のようなものをダブルクリックすると次に警告ウインドウが表示され、そこで『OK』ボタンをクリックするとウイルスに感染します。

このようなウイルスに感染しないためには、いつも申し上げている通り、不審なメールの添付ファイルを開いたりリンクの貼られた部分などをクリックしないことです。

これを守らない限り、インターネットバンキングのIDやパスワードが盗み取られたり、その他の被害をもたらす危険性は間違いなくあります。

これは他人事のように思わないでください。

これらのウイルスメールは非常に多く報告されていますので、ぐれぐれもご注意ください。

皆さん、こんにちは。

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

今日は、ホームページ制作におけるお勧めできない事例として、『テンプレート』を用いたホームページ制作のお話しをします。

テンプレートを使うデメリット

ホームぺージを公開しようと思った時、多くの人は集客を目的とします。

（一部は割りきって名刺代わりと考える人もおられます。）

『テンプレート』を使ったホームページは、この集客を目的とする意味からすれば大きな間違いを犯すことになります。

理由は簡単で、テンプレート化されているということは、他のホームページでも同じものを使っているからです。

現在、検索の世界はGoogleに準拠することが絶対なわけですが、Googleの検索アルゴリズムはコピー物を嫌います。

これは掲載画像やテキストなどの内容に限らず、ホームページを構成しているレイアウトなどの書き方も同じで、他で利用されたものと同じものを使うということは、それだけ評価が下がるということになります。

そして、結果的には検索順位が上がらないものとなってしまうわけです。

安かろう悪かろうというのは正にこのことです。

結局のところ、ちゃんとしたコストを掛け、完全にオリジナルなホームページを作ることが第一歩であると考えた方が良いでしょう。

追伸：ホームページを作り、公開しただけでは検索結果の上位に表示はされません。

それなりのコストを掛け、ステップを踏んで成果があるのです。

皆さん、こんにちは。

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

以前の記事において、パフォーマンス向上やサイトのパフォーマンステストのスコア改善などを目的とした、あるテストとその結果を書きました。

それは、一部弊害をもたらすことがあります。

シンボリックリンクにおける問題

まず前提として、不要なCookieトラフィックを避けるために、画像ファイルなどの静的コンテンツを別ドメインから提供して解決するということを前提に行ったものです。

例えば、www.example.com/content/abc.jpg という画像があったとします。

これを、static.example.com/content/abc.jpg として提供する。

これは、static.example.com/content/ -> www.example.com/content/ と張られたシンボリックリンクを使って解決しようとしたものですが、これには少々弱点があります。

画像などの静的コンテンツの追加や変更があった場合、それが確実には反映されないという現象が出てしまうことがあるのです。

そのため、キャッシュされているものを一度パージ（クリア）する必要性が出てきてしまいます。

この弱点を克服するとなると、シンボリックリンクを張るというのではなく、リンクの張られていないURLとしてアクセスするしかありません。

しかし、その場合はウェブサイトの管理的に少々煩雑になってしまうなどの問題が出てきてしまうため、それでも問題のない方以外はお勧めいたしません。

皆さん、こんにちは。

業務改善を行う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のスコアが伸びるわけでもなく、実際のパフォーマンスに関しても気休め程度の話しにしかなりませんでした。

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

皆さん、こんにちは。

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

昨今、SNS利用者の増加とともに、SNSによる情報漏えいも増加しています。

このSNSによる情報漏えいは何故起こるのでしょうか？

画像による情報漏えい

SNSでは、スマートフォンなどで撮影した画像が簡単に投稿できる機能がありますが、実はここに情報漏えいにつながるものがあったのです。

Aさんが、オフィスのデスクにコンビニで購入した限定のドリンクを置き、それをスマートフォンで撮影してSNSに投稿しました。しかし、投稿された画像には、ドリンクと一緒に重要な書類の一部が写ってしまっていたのです。

このように、悪意があったわけではないですが、Aさんの不注意で重要情報が流出してしまったというような事例が増加しているのです。

位置情報による特定

SNSには、スマートフォンから位置情報を取得して場所を知らせる機能もあります。前述のAさんが位置情報を通知していた場合、その重要情報がどこの会社から漏れたものなのか？まで特定できてしまうことになります。

流出した情報に付随情報が加わることによって、情報漏えいがさらに悪化してしまう可能性もあり得ます。

社内での利用ルールが必要

誰でも気軽に投稿できてしまうSNSは、ちょっとした意識不足で非常に大きな事故につながってしまいます。

そういったことを避けるためにも、社内における利用ルールの明確化が必要になってきます。

例えば、社内での写真撮影を禁止するなどのルールを徹底すれば、前述のような情報漏えいは避けることができます。

SNSは便利なツールではありますが、利用者の意識によっては事故の起きやすいものでもあります。

そのような事故が起きる前に、社内でSNS利用に関するルールを策定されることをお勧めします。

皆さん、こんにちは。

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

この業務改善のためのコンサルティング情報ブログに掲載している画像は全て軽量化しているのですが、それは、このサイトがコンサルティング系のサイトだからです。

しかし、これが全てにおいて当てはまるわけではありません。それは何故なのか？まずは画像を軽量化することによってどうなるか？から見ていきましょう。

画像は軽量化すると粗くなる

元の画像のサイズが100KBあったとします。これを50KBくらいにしたいと思った場合、画像の品質を落とすしかありません。つまり、画像がその分粗くなるということです。しかし、画像が軽くなった分、ウェブブラウザーで読み込まれる時のスピードはアップしますので、別の意味での効果はあります。

ただし、これに関しては、画像が多少粗くなってしまっても問題ない業種と、画像が粗くなってしまうことによって逆にマイナスになってしまう業種があります。

スピードを考慮する業種

私どものような業種の場合、訪問者がある程度イメージが付きやすくするために画像を用いていますが、イメージが付けば鮮明度はあまり重視されません。その代り、訪問者にストレスがないようスピードのことを考えます。その一つとして画像を軽量化しているわけです。

軽量化しない方が良いケース

我々のような業種とは異なり、これが料理屋さんであったりケーキ屋さんであった場合、そのサイトに掲載される画像は美味しそうに見えるものでなければなりません。そうなると、画像を軽量化したことで画像が粗くなってしまっては美味しそうに見えなくなってしまうわけです。それにより、本来は美味しい料理やケーキが、『ここは美味しくないだろう。。。』という、マイナスのイメージにもつながってしまいます。

こういった、画像でもアピールしなければいけない業種は画像が粗くなってしまう軽量化はしない方が良いでしょう。

今回は、前回告知しました通り、実際の改善策に関してご紹介します。

前回の記事はこちら⇒WEBの高速化を考慮すべき理由

皆さん、こんにちは。

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

WEBの高速化を考慮すべき理由に関しては前回の記事をご覧いただくとして、

早速、WEBを高速化するための改善策をご紹介していきます。

１．スタイルシート（CSS）の不要な部分を削除する

WEBを改修しているうちに、以前は使っていたが今は使用していないセレクタが

あったりします。それを見つけて該当箇所を削除します。

これを行うことによってCSSファイルのサイズを小さくしてあげます。

Chromeブラウザーを使っている方は、デベロッパーツールの中にAuditsという

タブがありますので、それを走らせることで確認できます。

２．画像のファイルサイズを小さくする

デザインなどのお仕事をされている方は別として、画像は少々品質を落としても

パッと見はわからないくらいであれば問題ないはずです。

であれば、少々画像のファイルサイズをコンパクトにしてあげれば良いです。

私は画像を使用する都度コンパクトにしています。

ちなみに、TinyPNGとういウェブツールを使わせてもらっています。

TinyPNG のサイトはこちら

３．CSSやJavaScriptのファイルを１つにする

例えば、style.css、common.cssなど、複数のスタイルシートを読み込ませている

場合、それぞれをロードしにいく分ロスがあります。

これはJavaScriptにも同じことが言えますので、JavaScriptも１つにまとめて

しまう方が良いです。

また、他のCSSを読み込むのに＠importを使うのは、スピードのことを考えると避けた方が

良いです。

＠importで指示されたところから別のファイルを参照しますので、それがロスです。

４．html・JavaScript・CSSを圧縮する

html・JavaScript・css、どれも余分なスペースや改行が入っていることが多いです。

それもファイルサイズが大きくなっている要因の１つ。

ですので、その余分なスペースや改行をなくしてしまうのが一番効率がいいわけです。

しかし、手動でやっていると大変手間がかかってしまうので、私は圧縮してくれる

ウェブツールを使って圧縮しています。

Online JavaScript/CSS CompressorやHTML Minifierというウェブサイトで、

貼り付けてボタンをクリックするだけで圧縮してくれます。

Online JavaScript/CSS Compressor のサイトはこちら

HTML Minifier のサイトはこちら

まずは第一段階として、各ファイルサイズをコンパクトにすることをお話ししました。

これだけでも違ってきますので、是非試してみてください。