FlowlightTweetこんばんはFlowlightです。休日いかがお過ごしだったでしょうか?本日は、タイトルにもあるとおりHTML5のお話です。最初に、私はHTMLはほとんど読めません。一人で書けといわれたらまったく書けないと思います。最近は、ネットにすばらしいチュートリアルがたくさんあるので、それを参考にして少しずつ自分のところのHPを改装しております。最近、すごく気になっていたFlashの対応終了の問題が、いよいよ現実に障害になりだしたので、少しずつFlashをHTML5に置換していかなければなりません。数年前から、特にスマフォ上では気になっていたのですが、なかなか手がつかずそのままになっておりましたが、だいぶん参考のサイトも見つかったので、少しずつ進めてまいります。私のサイトで主に使っているのは、Flash音楽プレイヤーです。それをHTML5のプレイヤーに置き換えていく作業です。大量に使っているので、かなり大変な作業です。過去のものはそのままにして、これから作るものに適応していこうとも思っております。既存のFlash音楽プレイヤーです。これだとPCではまだ大丈夫だと思いますが、スマフォだともう表示できないですね。そこで、HTML5の<audio>タグで書いてやります!そうするとこうなります。これですべてのデバイスで再生できるようになったはずです。最近まで、このタグのエディットの仕方がいまひとつわからなくて、、、。style=ってのが理解できてなかったです。CSSをあんまり書かないので、こういう配置とか配色とかデフォルトでやってましたが、もう少しこだわっていこうかと思います。このタグはブラウザ毎で表示が違うので、そればまた悩ましいところです。MP3に対応していないものもあるようで、OGGファイルを別に用意しないといけなくなるので、また難しいですね。このような、基本的なソースはこの辺りに書いてありました。音声をプラグイン無しで組み込もう基本的なところはここで押さえて、ここからはJavaScriptを組み合わせてさらに見栄えをよくしたものです。なんだかいろいろと使えそうなものがあって助かりますね。「HTML5音楽プレイヤー」で検索したら結構出てきました。jQueryプラグイン「jPlayer」の使い方この辺りを使ってみるとほんとにFlashプラグインと変らないですね。HTML5でソースを書き換えていこうかと思います。こんな感じで自分メモ用にHP改装のヒントを書いておきます。詳しい方がいたらぜひ色々と教えてください!!HPの見栄えをもっとよくして行きたいです!また更新したら随時ブログでご報告していきたいと思います。今日はこの辺で失礼致します。コメントをキャンセルメールアドレスが公開されることはありません。*サイト上に表示された文字を入力してください。