FLASHファイルのスマホ対策

既存のFlash(.swf)を改造して動画をタイトルに使う方法
　　　　　　　-- スマホ対策 --　　　安倍

Flashファイル( .SWF )は iPhone, Android には対応していないのでスマホ、iPadでは非表示になる。
その対策をいくつか紹介する。

ホームページでスマホ、iPad、Windows　どれでも見えるようにするにはいくつかの方法があるがいずれも簡単ではない。
簡単な対策として
・PCではFLASH動画、スマホで静止画表示にする。あるいは、
・SWF を MP4ファイルに変換してYouTubeに投稿し、このURLをHTMLファイルに埋め込む。
のいずれかの方法がよい。

PCはFLASH動画、スマホで静止画表示　
　下記方法 1, 2 とも従来のSWFを使う。

方法1：　ネット情報　http://www.tecblo.com/?p=295
　　(ただし、FireFoxでは全く表示せず。スマホは静止画表示)

　　この方法で試作
　　http://1939abe.web.fc2.com/pc/hp/title/dooga-title/net1.htm　

　この方法で意図的文法ミス(object → zzobject)を記述してFlashを非表示にした　
　スマホ疑似表示
　http://1939abe.web.fc2.com/pc/hp/title/dooga-title/net1damy.htm

　　　
方法2：　JavaScript　（swfobject.js）使用してスマホで静止画像にする。
　　※）コード編集にミスがあるとIE Ver.9で２重表示となることがあるのでチェックが必要。
　　　ネット情報　　http://1kb.jp/blog/archives/233

　　この方法で試作　→　　こちら　
　　
　　この方法で意図的文法ミス(object → zzobject)を記述してFlashを非表示にした　
　　スマホ疑似表示　　→　　　こちら

PC / スマホ両者で動画表示

1-1）.SWF を MP4ファイルに変換してYouTubeに投稿し、このURLをHTMLファイルに埋め込む。（自分のサーバを消費しないので推奨）
　タイトル画像用には、Autoplay およびYouTubeのロゴマーク非表示の設定が必要　→　こちら

1-2）上と同様にStorage のGoogleDriveに投稿し、このURLをHTMLファイルに埋め込む。（YouTubeと同様に自分のサーバを消費しない）
ただし、Autoplayは動作せず、スタート画面が乱れる場合があるのでタイトル画像には適していない。　→　こちら
OneDriveはAutoplayになるがスタートに遅れが生じる。DropBoxは埋め込みコードの提供がない。

2-1)SWF を MP4ファイルに変換してHTML5の
<video src="fujio.mp4" width="800" height="160" autoplay ></video>
のようにホームページに埋め込む。　
　ただし、この方法はスマホで動かず対応しない。　→　こちら

2-2）　同様にHTML4の<embed>タグで埋め込むと、→　こちら
　このように制御バーが最初に表示されるがまあまあ動く。
ただし、スマホではAutoplayは、そのタグを挿入しても動作しない。
HomePage Builderの場合、　挿入→ ファイル　でMP4ファイルを指定すると
この方式になり以下の<embed>タグが挿入される。
<embed src="fujio.mp4" type="video/mp4"width="800" height="160">

このコードに以下のように　autoplay=""　を追加してもスマホでは機能しない。→　こちら
<embed src="fujio.mp4" type="video/mp4" width="800" height="160" autoplay="">

PC / スマホ自動切り替えで動画表示　高度な手法

閲覧者の端末に応じてPC用動画ファイルか、スマホ用動画ファイルか、自動で振り分ける。
http://allabout.co.jp/gm/gc/386483/
この方法は、サーバ側の機能(.htaccessなど)を使う必要があり、その設定を利用できるサーバが必要がある。

その他、自動切り替えの手法

　　　http://digitalnomori.hatenablog.jp/entry/2014/03/15/184004
　　　http://se-suganuma.blogspot.jp/2011/12/html5-or-flashjavascript.html
　　 http://okwave.jp/qa/q1395440.html　

HTML5での動画制作アプリ
・Flashを一切使わず、ＰＣ／スマホ両者で動作。　ファイルは、CSS/JavaScript/HTML5で構成する。　VISTAでは動作せず。
http://bit.ly/2ssGJga

Google WebDesigner
http://www.google.com/webdesigner/
Edge Anime
http://ascii.jp/elem/000/000/779/779058/

※）　方法2 の操作　　

・swfobject.js と、代替静止画像を用意

・head内に下記２行挿入

<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript">swfobject.registerObject("title", "9.0.0", "seikei.swf");</script>

・本文flashの <object></object>（２ケ所）を入れ替え