1FrameWorks

モバイルファーストインデックス(MFI)対策済

2016-12-01 [記事URL]

モバイルファーストインデックス(MFI)の導入がGoogleから発表されています。
現在、Google側でテストしているようで早ければ3ヶ月後くらいに導入される可能性もあります。
AMP実装のときのようにもしかしたらかなり早いタイミングで導入されるかも知れませんね。

以前のサイトオーナーはPCサイトの運営だけしていれば良かったのですが
スマホが急速に普及したことでスマホユーザーへの情報提供の最適化を考える必要が出てきました。
スマホ用サイトを下層に作るケースも多かったと思います。

Google自身も、PCサイトを自動変換してスマホサイトを作るツールを公開したりと方向性を模索している時期がありましたが、その行き着いた先は「レスポンシブWebデザイン」でした。


AMP(Accelerated Mobile Pages)について

2016-11-28 [記事URL]

AMP(Accelerated Mobile Pages)とは
Googleが推し進めているプロジェクトで、モバイルユーザーに対して高速でコンテンツを提供する仕組みです。

「コンテンツの表示」に特化していて、余計な情報が表示されません(使えないHTMLタグがあります)。
Googleがコンテンツ情報の履歴を保持していることで余計な読み込みを無くし、検索結果をタップした瞬間にコンテンツ表示!となります。速いです。
ユーザー体験向上を目的としているんですね。

実際にどのくらい速いか見てみましょう。

下記の動画は、全く同じコンテンツで
Wi-FiはOFFにしていて、docomo系のモバイル回線を利用しています。
左側が通常のスマホページ、右側がAMPページです。

「えっ!!!」ってくらい速いですよね。ほんと一瞬!
体感速度で10倍くらいに感じます。いや20倍かも。

AMP対応しているかどうかは検索結果などで表示される雷マークです。
screenshot_20161026-131039

1FrameWorksでは日本Google検索が本格導入する前からAMP対応しています。
ユーザーの方は何も意識することなくGoogle検索にAMP対応済だったわけです。

「安心してください。Google検索に導入前から対応済ですよ。」

だから、AMPページのGoogleインデックス(検索データとしての登録)もすぐでした。

ただまだAMPは仕様変更も多いし、効果も微妙なところもありますし、これからの技術だと思います。

ユーザー体験は大きく向上することは間違いありませんが、サイトオーナー側のメリットが薄いとそれほど広まらないかも知れませんし。。。

最近、AMP関係のお問い合わせが増えてきましたので少し書いてみました。
AMPページの注意点や細かい設定方法などはサポートサイトで1FrameWorksユーザー様向けに情報提供していきます。


バージョン2.3.0公開

2016-11-24 [記事URL]

機能追加

背景動画を使う場合の背景画像(img)の入れ方を解説しています。
スマホ・タブレットでは動画再生されませんから、背景画像を入れておくことをオススメします。

実例、使い方は下記をご覧下さい。

ytplayerの使い方。背景にて動画(YouTube)を再生

ytplayerをメインバナーに配置してみた

Lazy Load

Lazy Load に対応しました。

画像を遅れて読み込むことで、ページ表示の体感速度を大幅に向上できます。
使い方、使用上の注意など下記にまとめています。

Lazy Load の使い方

ボタンレイアウト追加

btn-size90, btn-size100 を追加しました。
余白も調整済です。

ボタン作成の流れ

機能の微調整

LOGO横のオブジェクトを縦センターできるようにしました。

2016-11-24_10h58_50

下記のように、ロゴ画像に class=”img-m” をつけ、横にテキストまたは画像を配置してください。



バージョン2.2.2公開

2016-11-21 [記事URL]

機能追加

背景にYouTubeを流せるようになりました。
メインバナーの背景で動画を自動再生したり、特定のボックスの背景で再生したりと。
もちろん、重ねてテキストが画像やスライドバナーも配置できます。

ドロップメニュー追加。
カーソルオンで下にスラスラとメニューを開くことができます。

機能の微調整

TOPの横幅を 972px にしました。
ロゴ画像を配置したときの左の余白がなくなりました。

JPG画像の圧縮率を上げました。
JPG画像をメディアアップロードした際に、今までかなり小さく変換していましたが、圧縮率を上げることである程度のクオリティを確保しました。アップロードした写真もほとんど劣化しないようになります。

サポート

背景でYouTube再生設定方法

ytplayerの使い方。背景にて動画(YouTube)を再生

ytplayerをメインバナーに配置するテスト

ドロップメニューの使い方

ドロップメニュー(dropmenu)


バージョン2.1.9公開

2016-11-07 [記事URL]

機能の微調整

リスト関係のの余白を再調整しました。
調整箇所は以下の通りです。
・パンくずリスト
・コメント欄
・listdate
・listrank2

ボタン小の余白を調整しました。
サポートサイト内にボタン例とコード例を掲載しました。

2016-11-07_06h01_28


バージョン2.1.8公開

2016-11-05 [記事URL]

機能の微調整

円型ボタンの余白を調整しました。

リストの余白を調整しました。

サポート

動画マニュアルを公開しています。

簡単な説明用の動画は一般公開されています。

サポートサイトにて
「アイコン」「ボタン」「写真エフェクト」「文字の装飾」など、
多くのページを公開しています。


バージョン2.1.7公開

2016-10-28 [記事URL]

機能追加

CSVで記事の管理ができるようになりました。
一括ダウンロード、アップロードが可能です。
機能利用したい方は管理までご相談ください。

機能の微調整

管理画面ダッシュボードの下部表記を変更しました。
サポートサイトへ直接リンクしています。

アイコンフォントを追加しました。


バージョン2.1.4公開

2016-10-25 [記事URL]

機能追加

写真エフェクトを追加しました。
スマホレイアウト時に中央を起点に大きく表示させることが出来ます。

例)
screenshot_20161025-052312

.pht-sptrim240、.pht-sptrim360、.pht-sptrim480、.pht-sptrim600
がそれぞれ使えます。
使い方は img タグを div で囲んで上記classを適用させるだけ。
末尾の3桁の数字は、ボックスの高さになります。スマホで大きく表示させる際には pht-sptrim480 などを使うと良いと思います。

機能の微調整

FNAVI内でもショートコードが使えるようにしました。

FNAVI内でリンクリストアイコンを簡単挿入できるようにしました。

1カラムページの段落(Pタグ、文章)の余白を調整しました。

引用(blockquote)のレイアウトを調整しました。
同様にコメント欄のレイアウトも調整しました。

不具合の修正

地図(GoogleMap)の表示の不具合が出ていたものが修正されました。


一般の方でもお申し込みできるようになりました。

2016-10-20 [記事URL]

いせきけんじ制作WordPressテーマ「1FrameWorks」が一般の方でもお申し込みできるようになりました。

1FrameWorksとは
どこでも簡単に更新ができ、プロ並みのWebサイトが作れるホームページ制作ツールです。

こんな方に向いています。

なるべく安く本格的なホームページを作りたい。
社内で簡単に更新したい。
レスポンシブウェブデザインでスマホ対応をしたい。
WordPressを安全に使いたい
キレイなホームページを作りたい
ホームページ・ウェブ関係で分からないことを相談したい
Google検索で検索上位表示を狙いたい
WordPressをカスタマイズして欲しい
面倒なバージョンアップ対応やセキュリティを任せたい
最新のいせきけんじテンプレートを使いたい

ぜひご覧になってくださいね。


バージョン2.1.2公開

2016-10-17 [記事URL]

機能追加

検索結果画面

検索結果画面を新しく使いやすくしました。

小さなボタン

btnレイアウトの、小さいボタン用レイアウトを追加しました。
以下のクラスを追加することで、ボタン内部の文言の余白が小さくなり小さなボタンでも使えます。
.btn-small

余白調整class追加

以下の余白調整用クラスを追加しました。
.mt06, .mb06

機能の微調整

スライドバナーのレイアウト・余白など再調整しました。
メインバナーの場合は、ページャーがバナー内部の下部に表示されるようになります。

1カラムページ(LP)の余白調整を行ないました。
また、タグボタンの動作で挿入されるコードもよりシンプルにしています。

他に、タグボタン挿入コードを最適化しました。


PAGE TOP



logo_1stneed
株式会社ファーストニード(1st-need Co,.Ltd.)

〒652-0897
神戸市兵庫区駅南通5-2-7
TEL:078-600-2891




MENU

SUPPORT

CONTACT
HOME