タグ

webデザインに関するk_k1のブックマーク (4)

  • sichoru.net

    sichoru.net このドメインを購入する。 2018 Copyright. All Rights Reserved. The Sponsored Listings displayed above are served automatically by a third party. Neither the service provider nor the domain owner maintain any relationship with the advertisers. In case of trademark issues please contact the domain owner directly (contact information can be found in whois). Privacy Policy

  • ウェブページを見る目の動きは「F」パターン - GIGAZINE

    つまり人間はページを見る場合、「F」の字を描きながらページ全体を見ているというわけ。 これは232人の被験者を対象に行われたもので、大体1ページから重要なコンテンツを見つけるために2秒から3秒というものすごい短時間に驚異的な速度でページを見ていくそうで。 で、その視線の経路をビジュアル化したのがこの画像。全部で3段階のステップを踏んでおり、各段階を踏んでいった結果、「F」の字を描くというわけ。大体どのユーザーも一貫してこのパターンを踏んでいるらしい。以下がその全3段階の説明。どういうレイアウトが効果的なのかが分かります。 F-Shaped Pattern For Reading Web Content (Jakob Nielsen's Alertbox) http://www.useit.com/alertbox/reading_pattern.html 第1段階: 訪問者は最初にページの

    ウェブページを見る目の動きは「F」パターン - GIGAZINE
  • CSSとButtonタグを使ったクールなボタンサンプル集:phpspot開発日誌

    Digital Web Magazine - Push my button If there’s one element I think doesn’t get enough respect, it’s gotta be button. It’s played second fiddle to input in tutorials and form examples for as long as I can remember. CSSとButtonタグを使ったクールなボタンサンプル集。 Formのsubmit ボタンを作る場合、<input type="submit" value="送信"> の形式が最も使われていますが、 <button type="submit"></button> タグを使い、その内部にHTMLを入れこんでCSSでデザインすることでリッチなボタンが作れる実例。 <in

  • 第7回 ページ構造を確認する方法

    XHTML+CSSでは、ページ構造を意識して制作することが大切。Firefoxの拡張ツール「Web Developer Toolbar」を利用して、テーブルレイアウトの構造、フルCSSのページ構造、見出し構造、非推奨要素を確認する方法を説明しよう。 Firefoxの拡張ツール「Web Developer Toolbar」 Firefoxでは「Web Developer Toolbar」(以下、WDT)という高機能な拡張ツールが利用できる。名前のとおり、Web開発者向けのツールバーであり、CSSJavaScriptの無効化、画像表示の無効化、ソースのバリデーションなどをツールバーから直接実行することができる。 まず、インフォアクシアで公開されているWDT日語版をインストールしよう(http://www.infoaxia.com/tools/webdeveloper/)。Firefox(ま

    第7回 ページ構造を確認する方法
  • 1