動画をブログに埋め込んでみた
最近すっかりプログラミングにハマっているわたくしKZです。
フロントページを中心にサイトのカスタマイズを色々行っています。
ハマりすぎてなかなかブログの更新も出来ていなかったのですが、更新していないと、いくらサイト自体の更新を行っていても訪問者は日に日に少なくなるものなのですね。
「そろそろブログの更新をしなければ!」と思っていた矢先(”やさき”と読むそうです)のことです、先日Amazonで購入したhtml(プログラミング的なやつ)の本に、
YouTube動画をブログに埋め込む方法
という項目があったのです。
なんとなく「動画自体の埋め込みは著作権の侵害にあたるのかな」とか思いこれまで行っていなかったのですが、HP制作のマニュアル本に載っているということは大丈夫ということなのでしょう。
ブログ更新とhtml実践の一石二鳥ではないか!
と思い試してみることにしたわけです。
URLを掲載しただけの場合と、画像を埋め込んだ場合の訴求力の違い
「今さら!?」と言われそうですが、やってみました。
僕はこれまで(YouTube)動画をブログに埋め込む方法を知らなかったので、過去に動画紹介をしたときも、単に動画のURLを貼り付けるだけで、おおよそ訴求力の無いページになってしまっていました。
下記の投稿内に動画のURLが掲載されています。いちいち開いていただくのも恐縮なので投稿サムネイルの下にURLも添付してみました。
ザッカーバーグのアシスタントロボット
ーリンク元:English Centralー
嘘偽りのない自分でいる
ーリンク元:English Centralー
ニコラ・テスラ:天才で発明家
ーリンク元:English Centralー
失敗とはつまり生きること
ーリンク元:English Centralー
adidus CM 何かをして覚えられよう
ーリンク元:English Centralー
スティーブン・キング:「博識でなければならない」
ーリンク元:English Centralー
残念ながらこれではあまり「リンクを開いて動画を見てみよう!」という気持ちにはならないですよね。
『Engilish Central』さん自体は魅力的な英語学習動画を提供しているのですが、それらを紹介する方法としてURLを貼っているだけではやはりちょっと訴求力に欠けてしまいます。
※残念ながら『English Central』さんの動画の画像については僕のサイトに埋め込むことはできませんでしたを(おそらくEnglish Centralさんでそのような設定にされているのだと思います)。
当ブログ初の埋め込み動画
そこで今回は、YouTube動画から、僕が日本プロ野球史上最高のプレイヤーだと僕が思う、大谷翔平選手の動画を埋め込んでみました。
次に僕がニューヨークに行くきっかけとなった、日本プロ野球界でも屈指の人格者だと言われた松井秀喜氏の全ホームランを収録した動画です。
うーん。やっぱブロガーよりもYouTuberが全盛の時代、URLよりも動画のサムネイルがあるとブログの魅力も増しますよね。
簡単ですが、今回はこのように新たなブログ投稿設定が出来るようになったのが嬉しく、紹介させて戴きました。
設置方法はYouTube画面右下の『埋め込み』ボタンをクリックするとコードが表示されるので、それを表示させたいページのHTMLに埋め込むだけです。簡単ですよね!
今回の紹介商品
今回紹介する本は、WEBデザイン初心者には超お勧めです!
WEBページ作成方法について1から書かれているのですが(HTMLとCSS)とくにかく判りやすく、すごく参考になりました。
コードを書くときも逐一エディター上の行番号と拡大コードが表記されており、誤って記述したときも気づきやすい作りとなっています。
単純に「このようにコードを書くとこのように表示される」と書いてあるだけのマニュアル本が多い中、それぞれのコードの意味や概念なども説明されており、HTMLやCSSについての理解が深まります。というか、改めて「そういうことだったのか!」と気づかされることが多々ありました。
Amazonで色々なマニュアル本が紹介されている中でも、比較的出版時期が新しく、レビュー評価も高かった為購入したのですが、正解だったと思っています。
唯一短所を挙げるとすると本が大きく分厚いので重い、ということでしょうか。
HTML&CSSとWebデザインが 1冊できちんと身につく本
Kindle(電子書籍)も発売されていなかったと思いますので、『持ち運びが不便』というのが唯一の欠点かと思います。