タグ

ブックマーク / atmarkit.itmedia.co.jp (4)

  • ズルいデザインテクニックを生かして作る、汎用性のあるズルいボタンデザイン

    さて今回は、ズルいデザインテクニックの集大成ともいえる「ズルいボタン」です。これまでの連載で取り上げた数々のズルいデザインテクニック、「ズルいテキストシャドウ」「ズルいグラデーション」「ズルい角丸」、そして前回解説した「ズルいボックスシャドウ」を用いたズルいボタンの作り方を解説します。 今回のズルいボタンに関しては、以前にズルいデザインテクニックのスライドで紹介したものから大幅に改定を加えて、より汎用性があり、さまざまな場面で使い勝手の良いものに刷新しました。 改良のポイントは次の通りです。 文字サイズの変更、またそれに併せてボタンサイズの変更に対応しています iタグを使ったアイコン用のWebフォントに対応しました。今回はfont-awesomeを使って解説しています フラットデザインの流行に伴うデザイン傾向に合わせ、立体感やグラデーションをより控えめに、かつpaddingを大きめに取った

    ズルいデザインテクニックを生かして作る、汎用性のあるズルいボタンデザイン
    hr07jp
    hr07jp 2013/09/13
  • パララックスエフェクトの基本

    jQueryをメインにHTML5やCSS3を使ったリッチな表現のためのテクニックを紹介。まずはパララックスエフェクトの基から。 Webサイトの55%で利用されているjQuery はじめまして。クラスメソッドのフロントエンドエンジニア、山田です。「jQuery×HTMLCSS3を真面目に勉強」という連載をスタートします。 2005年2月にGoogle mapsが登場して以来、Web開発者の間でJavaScriptの株は上昇の一途をたどっています。その勢いはとどまることを知らず、リッチなWebコンテンツを作るには、Flashをはじめとしたプラグインに頼るという、それまでの常識をすっかり覆してしまいました。 さらに、HTML5やCSS3も登場し、各ベンダのブラウザがWeb標準の仕様に合わせて実装の足並みを揃え始めるなど、プラグインに頼らずともリッチなUIのWebコンテンツを少ない手間で作れ

    パララックスエフェクトの基本
    hr07jp
    hr07jp 2013/03/23
  • 連載インデックス「HTML5“とか”アプリ開発入門」 - @IT

    連載インデックス 「HTML5“とか”アプリ開発入門」 JavaScriptAPICSS3、SVGなどを含め、急速な広がりを見せつつある「HTML5」の基を学べる入門連載です。「HTML5を使うと、何ができるのか」「それを実現するには、どのようなプログラムを書いたらいいのか」をお届けします。 Webの3つの問題を解決する「HTML5」とは何なのか HTML5“とか”アプリ開発入門(1) 最近よく目にする「HTML5」という言葉。JavaScirptのAPICSS3、SVGなどを含め、全体的な概要と、その意義をお伝えします

    連載インデックス「HTML5“とか”アプリ開発入門」 - @IT
    hr07jp
    hr07jp 2012/09/18
    HTML5“とか”アプリ開発入門
  • 知らないと損するFacebookファンページの作り方(1/3)- @IT

    プロモーション活用で注目を集めるFacebookのファンページ。簡単に作れるので、この機会にファンページを開設してみよう!(2011年2月5日にファンページの名称がFacebookページに変更になりました) ビバ Facebook! 世界最大のユーザー数を誇るSNS(ソーシャル・ネットワーク・サービス)の「Facebook」。 2010年夏には「ユーザー数が5億人を突破」というニュースが流れましたが、日でもユーザー数を伸ばし、約180万人が利用しています。 また1月15日から日でも、Facebook創業者の自伝映画「ソーシャル・ネットワーク」が公開となり、注目度はさらに高まっています。 Facebookのプロモーション活用術! まずは、Facebookを使ったプロモーション事例をいくつか紹介しましょう。 ■ FacebookのAPIを活用 外部サイトとFacebookの情報を結び付けて

    hr07jp
    hr07jp 2011/02/09
    Facebookファンページの作り方
  • 1