Youtube動画 自分のHPに埋め込みではなくサムネイル画像でリンクする方法

ホームページを作っていてYoutubeの動画を
入れ込みたい用事ができた。

でも今回は埋め込みじゃなくて画像のリンクにしたい。
しかも、画像はYoutubeのものをサムネイル表示させて
クリックでYoutubeページへリンク。

下記サイトが参考になりました。
▼YouTubeのサムネイルのURL | masome.net
http://masome.net/?p=499

おかげさまで無事にサムネイルリンクがはれました。


メモとして残しておく

▼YouTubeの動画のサムネイル画像のURL
http://img.youtube.com/vi/動画ID/default.jpg

▼YouTubeの動画ID
http://www.youtube.com/watch?v=動画ID

みなさんのブラウザ表示サイズはいくつ？

ホームページを作るときに気にするのは
ファーストビューのサイズ。

それでも縦スクロールが基本のWebなので
縦サイズはいままで気にしていなかった。

こちらの記事を見て、サイズがわかった。

80%の人は
縦スクロールせずに見られる高さ：550px
スクロールバーなしに見られる幅：1000px以下

幅はYahoo!を見ているとよくわかる。

Yahoo！は今現在、950pxぐらいだったかな？


http://web-tan.forum.impressrd.jp/e/2011/06/07/10408

A/BテストをするにはGoogleウェブサイトオプティマイザー

初めてA/Bテストしてみようと思いました。
さて、どうやるの・・・？

下記、サイトが参考になりました。
A/BテストをするにはGoogleウェブサイトオプティマイザー
http://google.co.jp/websiteoptimizer
が、よろしいようです。

早速設定させていただきました。


http://3minweb.blogspot.com/2011/03/lpogoogleab.html

日本語 筆文字のフリーフォント 無料でご提供いただき感謝です

http://freefonts.web.fc2.com/page1.html

日本語で筆文字のフリーフォントで
良いものをみつけました。

早速利用させていただきました。

作成したデータ

申し込みのボタンの付け方がわかる

だいぶ古い記事だけど
大事な要素が報告されている


http://markezine.jp/article/detail/241

写真データを追加 ワークス内の各コンテンツ

http://www.habitat21.co.jp/works_ceremony.html


WORKS内の各コンテンツの写真データ
追加作業を行いました。

画像の回り込みをcssで指示する 参考サンプルサイト

画像の回り込みのやり方を教えてくれているサイト

以下が参考になりました。
クリアの仕方にそれぞれ、特徴がある。



http://www.w-frontier.com/stylesheet/image_float.html



http://www.tagindex.com/stylesheet/img/float.html


http://homepage.decoweb.jp/page/homepage/edit_including_turn



http://www.7key.jp/hp/_image/5.html

「フリー ボタン 素材」検索で見つけたボタン生成してくれる作成ツール

http://box.aflat.com/buttonmaker/

「フリー ボタン 素材」検索
で見つけたボタン生成してくれる作成ツール
「ボタン素材 自動生成サイト - ButtonMaker」

早速、利用させていただきました。

完成したのがコチラ



http://www.nagano-mizube.com/

３分程で出来上がりました。

お絵描きフリーソフト

http://www.gigafree.net/tool/paint/pixia.html

どこかのブログより
『Photoshop（フォトショップ）がビットマップ画像である写真素材の加工を得意としている一方、Illustrator（イラストレーター）はベクトル画像である絵や地図等の作成を得意としています。

この、ウェブ用の絵や地図素材を作成する場合、プロのウェブデザイナーはイラストレーターやビットマップ画像・ベクトル画像の両方を扱えるFireworks（ファイアーワークス）を利用します。しかし、両ソフトとも高価なのが難点。』

私、個人では「Fireworks（ファイアーワークス）」を利用させてもらっています。


ただ、お客様自体が、ほんのちょびっと画像を加工したい、そんな時
何か良いフリーソフトはないものか？

他のブログでの紹介や記事から良さそうなの２点をチョイス

・ペイントソフト「Pixia」
http://www.pixia.jp/download/win.htm
対応がXP/Vista/7と継続しているので、紹介しやすい


・軽量ペイントソフト「AzPainter2」
http://hp.vector.co.jp/authors/VA033749/soft/azpainter2.html
インストール不要、レジストリ不使用で軽そう


使ってみないと本当のところはわかりませんが、
とりあえずの引き出しとして、ブログに残しておく。

１ページ 起こしました

http://angelux.jp/lumiere.html

サイト内コンテンツ

1ページを起こしました。