タグ

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

  • [CSS]要素を横並びに配置できる display:table-cell の基本的な使い方と注意点|CSS|WEBデザインの小ネタとTIPSのまとめサイト「ウェブアンテナ」

    display:table-cell は以下のような使い方をします。 /*CSSの記述*/ <style> ul.nav { display:table; } ul.nav li{ display:table-cell; vertical-align:middle; text-align:center; } </style> /*HTMLの記述*/ <ul class="nav"> <li>リスト1</li> <li>リスト2</li> <li>リスト3</li> <li>リスト4</li> </ul> 親要素に display:table を指定し、テーブル扱いとする display:table-cell は display:table とセットで使う事が多いです。 親要素(ul.nav)に display:table を指定することで「表(<table>)」の扱いになりますので、子要素

    [CSS]要素を横並びに配置できる display:table-cell の基本的な使い方と注意点|CSS|WEBデザインの小ネタとTIPSのまとめサイト「ウェブアンテナ」
  • ウェブデザインをはじめるあなたへ - ウェブ雑記

    ウェブデザインについてまったくわからない頃によく見て勉強してた資料群です。+いくつかの自分で作った資料 SlideShare 色彩センスのいらない配色講座 色相、明度、彩度で色を説明できるようになる。 ベースカラー、メインカラー、アクセントカラーで配色を説明できるようになる。 その上で、あまり間違いのない色の選び方がわかるようになる。 ノンデザイナーのための配色理論 最後に紹介されているこのツールがベースカラー、メインカラー、アクセントカラーを決める上で便利。 ウェブサービスの企画とデザイン 僭越ながら明治学院大学で講義した時に作った資料。 なんとなくウェブサービスを作るときの流れとか感じてもらえたら幸いです。 かんたんキレイなウェブデザイン 僭越ながら勉強会 (UT Startup Gym) 用に作った資料。 なんとなく CSS フレームワーク、グリッドシステム、レスポンシブデザイン、ウ

    ウェブデザインをはじめるあなたへ - ウェブ雑記
  • CSSでレイアウトするなら絶対覚えておきたい配置のルール:フロートや絶対配置、z-index とかいろいろ

    最近改めて CSS の基、要素の配置、レイアウトについて学習しました。過去に CSS でのレイアウトなどの記事を書いた事があるんですけど、改めて勉強してみたら、いろいろ間違えて解釈していたなー ... っていうか、基が分かってなかったんだなーと反省 ...。今回は CSS の基中の基、視覚整形モデルについてまとめてみました。 Webデザインをする上で、必須とも言えるのが CSS …。このブログ – Webデザインレシピでも、過去に CSS について書いた記事がいくつかあります。最近 … でもないけど、以下のふたつは CSS でのレイアウトについて、いろいろと書いた記事でした。 CSSでレイアウトするなら絶対覚えておきたいブロックレベル要素のクセとかいろいろ – 2011年 6月17日 CSS:初心者の頃にハマったスタイルシートのあれこれ … IE7多め -2011年 4月21日 で

  • 言葉からウェブデザインを始めよう(翻訳) | Elle Kasai

    元の記事はJustin Jackson氏が書いたこちらの記事だ。原文はとてもシンプルなページに載せられていることがわかるだろう。一度ご覧になってから下記の和訳を読み進めることをおすすめする。 これはウェブページです。 たいしたページではありません。 あるのは言葉だけ。 それをあなたは読んでいます。 オシャレなデザインや、レスポンシブなレイアウト、魔法のようなスクリプトに私たちは魅了されてしまいました。 でも、ウェブで一番強力な道具は、今も昔も言葉です。 私が書いた言葉を、あなたが読んでいる。これこそ魔法です。 私はブリティッシュコロンビア州の小さな都市にいますが、あなたは別のどこかにいることでしょう。私は2013年6月20日の早朝にこれを書きましたが、あなたは違う日時にこれを読んでいることでしょう。私はノートパソコンでこれを書きましたが、あなたは携帯電話でこれを読んでいるかもしれないし、

  • 富士通らくらくホンに見る高齢者に使いやすいUIのあり方 - A Successful Failure

    2013年10月02日 富士通らくらくホンに見る高齢者に使いやすいUIのあり方 Tweet 高齢者にも使いやすい携帯電話といえば、富士通のらくらくホンシリーズが有名だが、総務省のICT超高齢社会構想会議の第4回WGにて、富士通研究所の石垣一司氏が高齢者のICT活用について 富士通(研究所)の取組ご紹介と題し、同社の取り組みの紹介を行っている。 非常に示唆に富んだ良い資料であるので、エントリでは同資料を引用して、高齢者に使いやすいUIの勘所について考えてみたい。エントリ内の図表は同資料からの引用である。 加齢に伴う身体機能の低下 加齢に伴い身体能力が低下することは誰もが体感することだが、具体的には次のような形として現れる(高齢者にとってのユーザビリティ)。 視覚機能の低下 老眼による近視力の低下 暗順応の低下 視野の狭まり 短い波長の色(青、緑)の感度低下 聴覚機能の低下 高い周波数帯の

  • 1