601works主催 Evolve#3に参加しました！
601works主催 Evolve#3に参加しました！
Evolve #3 -webクリエイターのための情報交換所 スペシャル-
に参加しました！
601works主催のEvovleというセミナーが、森のコミュニティルーム「風の森」にて行われました。
今回はFacebookグループ『webクリエイターのための情報交換所』を運営されている、後藤賢司さん、前川昌幸さん、阿部正幸さんの3人が2017年の気になるトピックスなどを振り返りながらのトークセッション、さらに3人各々のミニセッションもありました。
ミニセッションの内容は
- ・「低予算でも通用する！コードを書かずに出来るWordPressサイトの最速構築の手法」 よつばデザイン 後藤賢司さん
- ・「Web表示速度改善について」 KDDIウェブコミュニケーションズ 阿部正幸さん
- ・「非IT業界のお客さんへの”SSL”の説明どうしてる！？」 株式会社イー・ネットワークス 前川昌幸さん
でした。
今回はミニセッションを聞いてなるほど！と思ったことや聞いていたのメモなどを書きたいと思います。
「低予算でも通用する！コードを書かずに出来るWordPressサイトの最速構築の手法」
よつばデザイン 後藤賢司さん
このミニセッションのタイトルにある「コードを書かずに出来る」というところをどうやってやるのだろう？と思っていました。
いつも自分がWordPressを制作する場合は少なくともコードを書いているからです。
コードを書かない理由は大きく２点ありました。
- ・テーマを使用する（なるべく有料）
- ・「beaver builder」というプラグインを使用する
まずはテーマを使用するというところから。
テーマを使用すると、そもそもほぼ全て揃っている状態なので画像の差し替えや文言変更のみでホームページを制作することが出来ます。
後藤さんいわく、テーマテンプレートが高品質化してきているという話がありました。
１つのテーマで様々なジャンルのサイトが作れるテーマは数年前から主流になってきているそうで、カスタマイズ性の高いテーマが多いそうです。
例えば、ブログであったり、ECサイトであったり、コーポレートサイトであったり。
次に、「beaver builder」ですが、これは何ができるプラグインかというと、公式ページのデモを触ってもらうと一番いいと思うのですが、簡単に言うと直感的にドラッグアンドドロップでサイトを構築することが出来る、ページビルダーのようなプラグインです。
実際にどのような感じなのか、手を動かしながら解説してくれました。
解説しながらどんどん出来ていくのを見ていたのですが、それはもう「圧巻」の一言でした。
複雑な機能を求めなければページビルダーを使って制作すると効率もよく、もし納品後にクライアント側が新しくページを作成する際でも、QuickTimeを使ってスクリーンレコードを作成しておけば動画マニュアルの作成も出来るので説明に時間が裂かれることも無いとのこと。
クライアント側も低予算でホームページを持つことが出来ますし、制作側も制作スピードが上がるので工数も少なくて済みます。
最初の取り組み時に安く制作しておいて、うまくいった場合に予算を取り本格的に作る。
というところもなるほどと思いました。
今回このミニセッションを聞いて、クライアントに対して色々な提案が出来るなと思いました。
そして、本当にWordPressサイトをコードを書かずに出来るということも知りました。
「Web表示速度改善について」
KDDIウェブコミュニケーションズ 阿部正幸さん
Web表示速度について、制作しているときにもちろん気にする部分なのでどのような話が聞けるか楽しみにしていました。
まずページ表示速度がどのような影響をもたらすかの話がありました。
CV（コンバージョン）やSEO、サイト回遊率に影響するということ。
amazonは100msページ速度が落ちると1%CVが落ちると言われているそうです。
Webページを表示させるのに、どこが遅くしている原因かを知る必要があるということで、どのように調べるかの話がありました。
- ・Gtmetrix
- ・Test My Site
- ・WebPageTest
- ・Web担当者フォーラム「【これは便利】あなたのWebサイト表示のどこが遅いかを一発で調べるブックマークレット」
- ・Chrome Developer tool
上記のサイト、そしてGoogle Chromeのデベロッパーツールで検証するとのことでした。
もし、サーバー側に原因がある場合はサーバーのスペックをアップさせること、そして
- ・OPcache
- ・Bchahe
- ・fcache
これらを入れるとよいとのことでした。
ただし、レンタルサーバーの場合多くは上記の設定などをすることが出来ないのでサーバーの移転も一つの手だということです。
フロントで出来ることは限られていて、
・HTMLやCSS、JavaScriptなどの圧縮
・Google独自の画像拡張子「WebP」を使用する（ただし、Google独自のためChrome以外非対応）
・Resource Hintsを使用する
・Lazy loading（遅延読み込み）
・サブリソースの非同期読み込み
などが挙げられていました。
先ほど上記に列挙した速度判定ツールなどを用いて、自分のサイトをお持ちの方はチェックしてみると良いかもしれません。
これに関連することとして、１年振り返りの中でも
ページの読み込み速度をモバイル検索のランキング要素に使用します
というGoogleのウェブマスター向けブログの話も出てきました。
このブログにはモバイルのユーザーが探しているものが見つけやすくなると書いています。
ページの表示速度も、評価の対象になると明言はしていませんが、少なくともそうなっていくのではないかと思います。
このミニセッションを通じて、改めてここはWebに関わる人はもちろんクライアント側も押さえておかなければいけないところだと思いました。
「非IT業界のお客さんへの”SSL”の説明どうしてる！？」
株式会社イー・ネットワークス 前川昌幸さん
まずはHTTPSとはという話がありました。
みなさんの今みているブラウザのURLのところに保護された通信や緑色になっている、https://〜となっていればそれはHTTPS通信になっています。
前川さんより、セミナー中にどこからどこまでがセキュアな通信になっているかどうかわかりますか？という質問がありました。
ユーザーエージェント → Wi-Fi → インターネット → サーバー
Q.上記のうち、どこからどこまででしょう？
A.ユーザーエージェントとサーバーの間の暗号通信
以外に、知らない人は多かったのではないでしょうか？
HTTPでありうるケースとして、ユーザーエージェントからサーバーの間、インターネット上で改ざんが行われるケースがありうるケースとして紹介されていました。
HTTPSにするために、SSL証明書というのを発行しなければいけません。
サーバー証明書とは認証局が審査し、発行した電子署名をサーバーが保持することで正当性が証明される
ということでした。
認証局の正当性はブラウザメーカーが判断するとのこと。
証明書には種類があるそうです。
- ドメイン認証(DV)
- 組織認証(OV)
- Extended Validation(EV)
上から順それぞれにアドレスバーに名前が出てくる、他にも信用度や、取得までの時間のかかり具合などのメリット・デメリットがあるそうなのですが、その中でも一番気になったのが…
3つありますが、サーバ証明書の暗号強度に違いはあるのか？
ということ。
気になる答えは…なんと差はないということでした。
これは知らなかったです。
あくまでもサーバーの所有者を証明するものなので、暗号化の強度などに関係はないということでした。
今、よく聞くLet’s Encryptについての話もありました。
私のブログはこれを利用して、HTTPSにしています。
無料でサーバー証明書を発行しています。ドメイン認証です。
国内のホスティング業界もこのLet’sEncryptに対応しています。
自分のレンタルサーバーが対応しているかどうかはヘルプページなどを参考にするとよいかと思います。
よくある質問でお問い合わせフォームだけしておけば良いのか？という質問があるそうなのですが、それは今から銀行にお金をおろしに行ってきます！と言って、銀行に行ってきました！今お金持ってます！というのを見せているのと同じ状態だそうです。
一部分だけではなく、全てのページをHTTPSにしておく方が良いとのことでした。
Let’sEncryptは無料ですが、無料に振り回されずにビジネスオーナーの視点で対応することが大切だそうです。
振り返りの中にもあったのですが、今年の7月からHTTPSではないと警告が出るという話がありました。
どのように警告が出るかまでは公表されていませんが、対応しておくことに越したことはないと思います。
Evolve #3まとめ
最後にみなさんと記念撮影
今後絶対に覚えておいた方が良い情報が満載でした。
１年振り返りのセッションを聞いていて、これだけWebや関することに動いていたり、進化しているということは制作のスタイルも進化させていかなければならないと思いました。
SSLやページ表示速度改善についてインターネットで調べたら出てきたりもしますが、これほどわかりやすく説明してくれることは無いというくらいわかりやすく説明していただけました。
今回学んだことをこれから活かしていきたいと思います。