choco -10ページ目

choco

Design,Photo

=====

CSS3

=====

IE6が終わればCSS3が使いやすくなる!
角丸、透過が話題。
カラムの仕組みが便利といわれている。
ブラウザのチェックはしっかりやるべき!!

対応ブラウザが少ないので、カラムレイアウトは当分使わない方がいいかも。
JSを上手く使っていったほうが良い。

角丸シャドウは正直CSS3は使わなくて良い。
画像にしちゃったほうが良い。
(基礎で一応勉強はしておこう。)

ページの外枠の角丸が便利。


=====

HTML5

=====

http://www.html5.jp/


ブロック、インラインの意味が無くなる。
HTML5を使う人は・・・
・自己満足サイト(ほとんどがこれ。)
・アップル系
・宣言文だけHTML5

マイナスにならないように!!!

必ずクロスブラウザ

人に教えられるくらい理解してから使おう。


=====

使用しているサイト

=====


http://www.ecstudio.jp/

http://www.studioespace.co.jp/
どちらも1ページで完結できる、ナビゲーションがついている。


=====

メモ

=====

IE6,7の検証は、IEチェッカーを使用しよう。
operaも気にしないと仕事にならない。
とことんこだわるべき。


IE6では見れないとき、DLさせてあげたりする仕組みを入れるのも手。


とにかく、ストックしよう!!!
最初は時間がかかっても良い。

YouTube API とツールを使用して、

YouTube の動画コンテンツと機能をウェブサイト、

ソフトウェア アプリケーション、デバイスに組み込むことができます。

いつでもどこでも YouTube を再生できます。

http://code.google.com/intl/ja/apis/youtube/overview.html



★デベロッパーズガイド

http://code.google.com/intl/ja/apis/youtube/developers_guide_protocol.html


★動画の検索

http://code.google.com/intl/ja/apis/youtube/developers_guide_protocol.html#Searching_for_Videos


★動画のフィードとエントリの説明(XML形式)

http://code.google.com/intl/ja/apis/youtube/developers_guide_protocol.html#Understanding_Video_Entries



動画情報の表示

次のスクリーンショットは、YouTube で個別の動画の情報がどのように表示されるかを示しています。

動画リストを表示しているスクリーンショットでは 1 つの API リクエストの情報のみを表示していますが、このページでは、いくつかの API レスポンスを 1 ページにまとめています。

スクリーンショットの次に、スクリーンショット中で番号を付けた表示要素と、

コンテンツを含む API レスポンスとの対応を説明します。

このページを表示するには、先にその動画エントリのフィードを取得します。

動画エントリ フィードの XML は、

フィードまたは検索結果セットでその動画に対して表示されるコンテンツと同一です。

スクリーンショットには次の情報が示されています:


セクション1には動画のタイトルが表示されます。

APIレスポンスでは、<media:title> タグに動画のタイトルが含まれています。

 

セクション 2 には動画本体が表示されます。

次のコード スニペットを使って自分のページに

YouTube 動画を表示することができます。

MEDIA_CONTENT_URL 変数と MEDIA_CONTENT_TYPE 変数には、

XML フィードから該当する値を代入します。


ウェブページ上で動画を再生するには、MEDIA_CONTENT_URL 変数を、yt:format
属性値が 5 である <media:content> タグの url 属性値に置き換えます。


同じく、MEDIA_CONTENT_TYPE 変数を、

同じ <media:content> タグの type 属性値に置き換えます。

モバイル デバイス上で動画を再生するには、yt:format
属性の値に基づいて、該当する <media:content>
タグの値を選択します。MEDIA_CONTENT_URL 変数を、

そのタグの url 属性値に置き換えます。

同じく、MEDIA_CONTENT_URL 変数を、そのタグの url 属性値に置き換えます。

<object width="425" height="350">
  <param name="movie" value="MEDIA_CONTENT_URL"></param>
  <embed src="MEDIA_CONTENT_URL" 
    type="MEDIA_CONTENT_TYPE" width="425" height="350">
  </embed>
</object>

FireFoxで、画像と画像の間などに謎の隙間ができてしまう問題について。


↓CSSにこちらを記入すると、問題が解消されます。


/*liの隙間をスコッと埋める設定*/
li{line-height:0;}
li{vertical-align:bottom;}