メニュー
文字サイズの変更
標準
背景色の変更
標準
音声読上げ版

スマートフォン・携帯版サイト自動作成システム


スマートフォン版ホームページ作成について

スマートフォン所有率の急速な増加により、今後、スマートフォン版のホームページががますます重要となるため、@PAGE/@WEBでは、パソコン版の全ての機能をスマートフォンでも動作することを基本として簡単に作成できるようになっています。
独自のスマートフォン版の機能や技術も数多く利用しており、スライドアニメーションや検索機能など、スマートフォンサイトでは欠かせない機能も取り入れております。
以下のイメージは、パソコンの管理画面でスマートフォン版を表示したイメージです。

スマートフォンサイト 表紙イメージ

スマートフォン版ホームページの表示と特殊機能

@PAGE及び@WEBの管理画面において、スマートフォン版ページを有効にしてメニューを設定すると、スマートフォンでQRコードを読み取った場合、又は、サイトのURLを直接入力した場合に、自動的にスマートフォン版のホームページが表示されるようになっています。

スマートフォンホームページ トップページサンプル

(1)最新情報と映像ニュースの表示方法について

上記の左上が表紙イメージです。メニューは、下に長く表示されスクロールで閲覧します。上記イメージのように、最新情報に写真を入れた場合、及びYouTube映像投稿においては、自動的にサムネイル(縮小写真)が表示されます。

(2)サイト内検索とパソコン版表示について

「検索」ボタンを押すと別途検索画面が表示されサイト内検索が可能となります。
また、「PC版」のボタンを押すとパソコンで見たときのホームページが縮小表示されます。

(3)スライドアニメーション(簡易版)表示について

上記のイメージは、メニューを押したときのイメージですが、本ページにはスライドアニメーションの簡易版が利用されており、自動的に縮小して表示されます。の部分の画像は、スライドで動きますが、画面上ののサムネイルをタッチするとパソコン用と同様に上のの画像が切り替わります。


スマートフォン版ホームページ事例2の表示と特殊機能

@PAGE/@WEBには、特別なメニュー機能として、「営業状況表示(@更新用)機能」と「スライドアニメーション機能」があり、本ページの3件の表示イメージは、この2つの機能をスマートフォン版の表紙で稼働させている場合の事例です。

(1)営業状況表示(@更新用)機能の稼働
QRコードが入力された場合、左のようにページの上部に営業状況表示で入力した情報が表示され、この枠内の利用者のタッチ操作か、設定した表示時間で消えます。

(2)スライドアニメーション(プロフェッショナル版)の表示
上記の表紙下において、スライドアニメーションが稼働しています。以下のイメージは、最初と最後のスライドイメージですが、実際には4件のスライドで構成されており、プロフェッショナル版の場合、スライド上で画像やテキストがアニメーションされます。
ヘアーサロンイサミ スマホトップページ
スライドアニメーションの背景画像変化イメージ

スマートフォン版ホームページ制作事例3の表示と特殊機能

関農産 パソコン版トップページイメージ

(1)トピックスの表示機能
PC版のトピックスシステムは、画像だけ又は画像と文章の入力が可能となっており、画像と文章を入力する場合、文章の位置を画像に対して上下・左右を選択して入れられます。
スマートフォン版の場合には、画像の下に文章が出る方式に統一されており、複数のトピックスの入力は縦並びで表示されます。

(2)ピックアップの表示機能
ピックアップシステムは、横幅220ピクセルのスライドショー形式で表示されます。
PC版では表紙の中央部でサムネイル画像として複数のメニュー項目を設定したい場合の機能です。
関農産 スマホ版トップページイメージ

スマートフォン版ではPC版で表示されている数のサムネイルによるスライドアニメーションとして自動的に表示されるため、数が多い場合にはアニメーションに時間がかかります。
数が多い場合やアニメーションさせたくない場合には、「表示しない」を選択し、ピックアップシステムに利用しているメニューをスマートフォン版の個別のメニュー項目として設定することをお勧めします。



(3)ライブカメラ映像の表示
右のイメージは、ライブカメラのスマートフォン版の表示イメージです。
@PAGE/@WEBでは、オプション設定でライブカメラのウェブ表示が可能です。
オプション設定のライブカメラ表示の場合、スマートフォン版では、自動縮小され、ライブ映像上の操作ボタンでパン(横操作)、チルト(縦操作)、ズームイン・ズームアウト(拡大・縮小)の操作をすることができます。
関農産 ライブカメラ映像イメージ