タグ

HTMLとDesignに関するsatrexのブックマーク (8)

  • IE7でpage-break-beforeが効かない : 開発メモ

    2009年09月02日 Permalink Comments(1) TrackBack(0) Windows IE7でpage-break-beforeが効かない IE6では改ページされるのに、IE7でpage-break-beforを指定しているのに改ページされないときがある。 いろいろ試した結果、page-break-beforeを指定しているブロックがページをまたいでいるときに改ページされないようである。 改ページできるパターン(ブロックBにpage-break-before) 改ページ処理前 改ページ結果 ┏━━━━━┓┏━━━━━┓ ┃┌A─┐ ┃┃┌A─┐ ┃ ┃└──┘ ┃┃└──┘ ┃ ┃┌B─┐ ┃┃     ┃ ┃└──┘ ┃┃     ┃ ┗━━━━━┛┗━━━━━┛ ┏━━━━━┓ ┃┌B─┐ ┃ ┃└──┘ ┃ ┃     ┃ ┃     ┃ ┗━━━━━┛ 改ペ

    IE7でpage-break-beforeが効かない : 開発メモ
  • はじめてHTML5でコーディングする時に注意したいアウトラインとかいろいろ

    先日このブログを HTML5 で作り直しました。その時に思った、HTML5 でコーディングするときの基的な注意書きです。なので、HTML5 をこれからやってみようかなーという人向けです。canvas、video、audio などには触れていません。もっと基の文章構造、アウトラインについての記事です。また、後半は実際に HTML5 でコーディングする時の tips になってます。 先日このブログ – Webデザインレシピを、HTML5で作り直しました。HTML5 … クライアントさんのページでは、まだ一度も使ったことがないし、勉強のためのサンプルはいくつも作ってみたんですけど、実際に運営しているページで試したいなーと思い、思い切って HTML5 にしました。 とりあえず作ってはみたものの、まだまだ分からないことだらけ。これから HTML5 でコーディングをする時に、とても大事だなーと思っ

  • HTML5の可能性を示唆してくれる『HTML5 WOW!』は必見ではなかろうか | 100SHIKI

    ちょいと技術的ではあるが、HTML5の可能性を感じられる良いプレゼンテーションだったのでご紹介。 HTML5 WOWを見るには最新のChromeが必要だが、次世代のウェブで何ができるかを知りたい人は必見だろう。 ファイル管理やグラフィックス、オーディオなどなど、「もうウェブでそんなことまで出来ちゃうの?」ということがわかって刺激的だ。 またこのプレゼン自体もトランジションをうまいこと使っていたりしてブラウザプレゼンの可能性を広げてくれるだろう。 コードなども出てくるのでマニアックではあるが、ウェブの近未来を知りたい人は是非どうぞ。

    HTML5の可能性を示唆してくれる『HTML5 WOW!』は必見ではなかろうか | 100SHIKI
  • フリーで新しめのXHTML/CSSで書かれたサイトテンプレート45:phpspot開発日誌

    45 High Quality CSS/XHTML New Web Templates(Free Download ) | Nerd Treasure フリーで新しめのXHTML/CSSで書かれたサイトテンプレート45 ほとんどが初めてみるデザインの新しいテンプレートがフリーでダウンロード可能です。 是非活用させていただきましょう 関連エントリ ハイクオリティでフリーなXHTMLテンプレート61 プロレベルでハイクオリティなXHTML/CSSテンプレート集 34のフリーで綺麗なXHTML/CSSテンプレート シンプルだけど使いやすそうなフリーのXHTML/CSSテンプレート集「Mantis-a templates」 ほんとにフリー?というクオリティのXHTML/CSSテンプレート20

  • Facebookのウォールでちょっとアピールする方法(OGP) - EC studio デザインブログ

    サイトに設置した「いいね!」を押したとき、 タイトルとテキストだけではちょっと物足りない感じがしませんか? OGP(Open Graph protocol)の対応をおこなうだけで、 ウォールが少し華やかになります。 弊社サービスサイト「チャットワーク」で対応した時におこなった対応方法を紹介したいと思います。 弊社サービスサイトのOGP対応後 OGPを使うとどうなるの? OGP(Open Graph protocol)を使うと、 「いいね!」を押してウォールに投稿するときに、 タイトルや概要、表示する画像を指定することができます。 通常はFacebookが自動で表示してくれます。 OGPに対応する前のデフォルトはこのように表示されていました。 OGP対応方法 htmlタグの記述 まず、htmlタグにOGP用の記述を追記します。 「xmlns:og="http://ogp.me/ns#" xm

  • クールで多機能なHTML5オーディオプレイヤー「Speakker」:phpspot開発日誌

    Speakker | The new way of クールで多機能なHTML5オーディオプレイヤー「Speakker」のご紹介です。 標準の再生機能に加え、プレイリスト機能や、カバー画像表示、facebook/twitterにシェアしたりダウンロードボタンなんかも付けられます。 jQueryベースで動作。使い方も超簡単です。 更に、Flashによるフォールバック機能付きです。 関連エントリ HTML5のオーディオプレイヤーを作るチュートリアル HTML5で実装するプレイリスト付きオーディオプレイヤー「AAP」 HTML5+CSS3でクールなオーディオプレイヤー「ZEN」

  • HTML5ベースの動画プレイヤー11:phpspot開発日誌

    11 Efficient HTML5 Video Players | blueblots.com HTML5ベースの動画プレイヤーが11種類まとまったエントリのご紹介です。 UIがそれぞれ個性を持っているので好みに合わせて選ぶことができそう Flashを使うことなく、既存のWEB技術でデザインを調整できるのはいいですね。 関連エントリ HTML5のDesktop Notificationを簡単に実現するjQueryプラグイン「jwNotify」 HTML5ビデオの内容に併せて他コンテンツを連動させて切り替えられるフレームワーク「Popcorn.js」 これは見ておくべきHTML5のCanvasを使ったデモ集 HTML5のキャンバスと連動させて音声をビジュアライズしたデモ

  • HTML5の波

    Internet Explorer(IE)9、Firefox(FF)4と最もメジャーなWebブラウザーがこの3月、相次ぎバージョンアップした(注1)。いずれもウリは、軽量化・高速化および「HTML5」をはじめとする次世代Web技術への対応である。米マイクロソフトはそのすごさをアピールするために、Internet Explorer Test DriveというWebサイト上でIE9に最適化した次世代のWebサイトをデモしている。それらを眺め、操作してみると、なるほど、これからのWebサイトとはこういうふうになるのかというのがよく分かる。 注1 IE9のリリースは3月15日。ただし日語版については、東日大震災の影響により延期されており、3月末時点で正式にはリリースされていない。日語版以外については予定通り提供されている。 現在のWebサイトの大半は、業界標準として使われている「HTML4.

    HTML5の波
  • 1