concrete5 Ver.5.6系向けのAMP Add-onを作ってみた。

concrete5 Ver.5.6 Accelerated Mobile Pages
Share on Facebook
LINEで送る
Pocket

最近、AMP ( Accelerated Mobile Pages ) 対応ページって増えてきましたよね。
ますますPCからモバイルへとインターネット端末になっていくなか、軽快に閲覧できるこの機能はとても良いなぁと思っています。

WordPressはいち早く対応プラグインが公開されていましたが、concrete5用のAMP対応アドオンはVer.7系や8系のはhissyが作ったのが既にあるんですが、5.6系のは無かったので、作ってみました。

結構まだまだVer.5.6系使っている人多いんですよね。

AMP ( Accelerated Mobile Pages )とは?

そもそも、AMPってなんでしょう?

AMPとは、Accelerated Mobile Pagesの略で、Googleが提唱しているHTMLの仕様です。
インターネットへの接続端末のメインがスマホなどの携帯端末に変わってきたことにより、不安定な回線速度やPCに比べ非力なCPU等でも快適にWebサイトを閲覧できる様にするものです。

具体的な仕組みとしては、通常各ホームページのサーバでホストされているWebサイトの情報を、Googleが代わりに保存(キャッシュ)しておいてそれをユーザに見せます。
ここで、Googleが保存しやすく、かつモバイル端末でも快適に見れる様に専用のHTMLの仕様がAMP HTMLです。

その他にも、Googleのサイト高速表示のノウハウが詰まったAMP JSというJavascriptのライブラリも使います。

AMP HTMLとHTML5

AMP用のHTML、 AMP HTMLと通常のHTML5とはどこが違うのでしょう?
利用できるタグに制限があったりと色々違うのですが、大きいところだと外部のリソースを参照する系のタグ(imgタグやiframeタグ)が使えなかったり、style属性が使えなかったりとかでしょうか?

詳しくはこことかここに書いてありますので興味があったら参照してください。僕はちょっと見ただけで自力での変換を諦めましたw

AMPってSEOに効くの?

今のところSEO的には直接的に表示順位に影響があるかというと微妙なところです。複合的、間接的に影響があるといったところでしょうか?
ただ、Googleはモバイル向けに高速なWebブラウジングを提供することがユーザの大きな価値になると考えており、やっておいた方がSEO的にプラスな事にかわりは無いと思います。

また、schema.orgタグを使った構造化マークアップをする事により、検索結果のカルーセルに表示されたりと、通常の検索結果よりも目立つ事になるので、そういった事からトラフィックは増えそうです。

concrete5をカスタマイズ?いいえadd-onです。

さあ、ではconcrete5のページをAMP対応してみましょう。テーマやコアファイルをカスタマイズすると、バージョンアップの時に面倒なので、イベントを使ったAdd-on(Package)として作ります。

“concrete5 Ver.5.6系向けのAMP Add-onを作ってみた。” の続きを読む

Share on Facebook
LINEで送る
Pocket

concrete5の5.7βがリリース!

concrete5 Ver.5.7β
Share on Facebook
LINEで送る
Pocket

クロスキューブの山崎です。

日々のタスクに忙殺されていたこともあり前回の記事からだいぶ間が空いてしまいましたが、本日concrete5のメジャーアップデートである5.7のベータ版がリリースされたので、これはご紹介すべきと思い、書いております。

私も早速インストールを行ったのですが、まったく新しいconcrete5という感じでして、ひと通りの操作を試しているだけでも、驚くことが非常に多いアップデートだと思いました。

とりあえず動画で見てください

“concrete5の5.7βがリリース!” の続きを読む

Share on Facebook
LINEで送る
Pocket

concrete5の強みと弱みを振り返る

Wordpressロゴ
Share on Facebook
LINEで送る
Pocket

クロスキューブの山崎です。

最近、お客さんのところでconcrete5のことを話していると、前よりもconcrete5を既に知っているケース(名前だけ知ってるも含め)が増えてきて、いいことだなーと思っていたりしています。

ただ、ここ1、2年ほどで成熟してきて、これから日本国内に大きく広がってくるフェイズだと思うので、まだ知らないケースが多くて、あまり知らないお客さんにconcrete5がいったいどういうものか説明することが多いです。

コーポレートサイトなど発信ベースのサイト制作の場合には、「高機能な汎用的なCMS」という伝え方で問題ないのですが、通常スクラッチで開発するような独自性の高いサービスの制作というケースだと、大きな勘違いをされるケースが多くあります。

なので改めて強みと弱みを理解しておこうと思い、ここに残しておきます。

WordPressと比較されるケースが多い

どうしてもCMSという単語が出るとWordpressと比較したくなる気持ちになりますよね、僕もでした。まずここで明示しておくとWordpressとは全くもって別物です。触ればすぐに分かります。

“concrete5の強みと弱みを振り返る” の続きを読む

Share on Facebook
LINEで送る
Pocket

Webディレクターだけどconcrete5をインストールしてみる

concrete5インストール直後
Share on Facebook
LINEで送る
Pocket

クロスキューブの山崎です。

今日は改めてconcrete5の最初の導入、いわゆるインストール方法を書いていきます。私はディレクション回りを担当しているので、こういった技術的な話は厳密には畑違いですが、お客様に紹介したり実際案件と進める上で、導入方法から開発回りについても知っておくべき情報だとは思っています。

ということで、開発者の方以外も是非見てもらえればと思いますので、お付き合いください。

concrete5を入れるサーバーは・・・

入れるサーバーですが、選択肢は非常に広く、ニフティさんの提供するc4saについては、ブラウザ上から数クリックで環境が整ったりします。

またKDDIさんが提供するホスティングサービスのcpiでは、レンタルサーバマネージドプランでも、簡単に環境を作れるサービスが提供されていたりしますので、選択肢のひとつとして、考えてもらえればと思います。

ただ今回については、環境構築からインストールまでをご紹介したいというところもあるので、sakuraさんのVPS(CentOS)にインストールしたいと思います

まずはインストールできる環境にセットアップ

まずは準備ということで、ターミナルからsshでログインして、concrete5の日本語公式ページにある動作要件ページを参考に、サーバに必要なものをインストールしていきます。

“Webディレクターだけどconcrete5をインストールしてみる” の続きを読む

Share on Facebook
LINEで送る
Pocket