タグ

ブックマーク / www.u-ziq.com (4)

  • jQuery Mobileを利用したスマートフォンサイト作成手順 | ユージック

    jQuery Mobileを利用したスマートフォンサイト作成手順 2010年11月6日 jQuery Mobileを利用してスマートフォンサイト作成してみたので、手順を覚書として書いておきます。 ちなみにまだ正式版ではなく、アルファ版となります。※2010年11月現在 現在のバージョンなどは下記の家サイトよりご確認ください。 jQuery Mobile jQuery Mobileを利用したページ作成概要 家のデモ作成画面を和訳してくれている下記ページがわかりやすいです。 http://dev.screw-axis.com/doc/jquery_mobile/ 読み込みファイル <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="http://c

    jQuery Mobileを利用したスマートフォンサイト作成手順 | ユージック
  • スマートフォン向けサイトの作り方 | ユージック

    スマートフォン向けサイトの作り方 2011年1月22日 iPhoneAndroid両方に対応するスマートフォン向けサイトの作り方をまとめてみました。 スマートフォン向けサイト作成にあたっての基概要 まず最初にスマートフォン向けサイトを作成する際に気になる点は画像の扱いだったりすると思います。 横幅ですが、解像度は機種によって様々ですが、縦向きで320px~640px、横向きで480px~960pxが主流となります。 標準となるものを設けるとなると、320px(横)/480px(縦)を標準として良いかなと思います。 ※iPhone4、4Sは640px/960pxの解像度ですが、内部解像度で320px/480pxと解釈してくれるため。 ですので、クライアントに見せるデザインカンプなどを作成する際も縦を標準とする際は320px(横)で作成すれば問題ないといえますが、iPhone4、4SやAn

    スマートフォン向けサイトの作り方 | ユージック
  • CSSのコンポーネント化 | ユージック

    CSSのコンポーネント化 2007年4月12日 (X)HTML+CSSでコーディングを行っていると同じようなCSSを繰り返し書き込んでいることに気づくと思います。 普段よく使うグローバルナビゲーションや商品一覧や商品詳細などをコーディングしていると(X)HTMLはもちろんCSSも数値は違えど大体同じ記述を繰り返ししていますよね。 そういった普段よく使うCSSはコンポーネント化するほうが圧倒的に作業効率は高まります。 しかし、CSSをコンポーネント化する目的としては、このレイアウトにはこのCSSとかあのレイアウトにはこのCSSといったようなデザインの変化を考慮した目的でのコンポーネント作成になってしまいます。 しかし、CSSの正しい概念として、id、class付けはレイアウト(デザイン)を想定して設定するのではなく役割を想定して決めるほうが良いとされているのでコンポーネント化はダメなんじゃな

    CSSのコンポーネント化 | ユージック
    ysk_lucky-star
    ysk_lucky-star 2007/04/16
    んん?
  • 画像置換によるアクセシビリティーの低下 | ユージック

    画像置換によるアクセシビリティーの低下 2007年1月31日 Fsikiさんのエントリー「text-indent: -xxxxemの弊害」で紹介されている内容ですが、現在のCSSテクニックの常套手段である画像置換をするとFirefoxではクリックした時に画面外に飛ばした範囲にまで点線が生じてしまうので、対策として a { outline: none; } 上記のような対策をしてきましたが、なんとこれに致命的なアクセシビリティーの欠如があることを知りました。 というのはリンクをタブキーでたどる際にフォーカスされないという問題です。 僕は日頃あまりノートPCを使わないので、タブキーでのリンクの移動などをしないという事もありまして、まったくもって気づきませんでした。 解決策は以下の通り a { overflow: hidden; } MacIEではリンクが消失してしまうらしいのでMacIE用のハ

    画像置換によるアクセシビリティーの低下 | ユージック
    ysk_lucky-star
    ysk_lucky-star 2007/02/05
    :focus で解決はできる。もっとも、画像置換自体が問題でもあるわけだが
  • 1