Web Designing

バックナンバー

2011年2月号

特別定価 1,470円

Web Designing

購入する

  • サンプルデータのダウンロードには、当月号の目次に掲載しているIDとパスワードが必要です。
  • サンプルデータに関する詳しい注意点については、このページの下部に記載している「サンプルデータについて」をご覧ください。

特集・特別企画

  • 特集1:CSSサイトをクールにするためのナビゲーション20

    −技術やアイデアを駆使して一歩先の表現力を実現する−

    Webサイトの構築において、ナビゲーションは重要な要素の一つです。情報設計やサイトの使い勝手という観点ではもちろんのこと、どのページにも表示されるものであるため、デザイン面にも大きく影響してきます。現在のCSSは、CSS3の浸透やJavaScript、HTML5と組み合わせることなどで、格段に表現力を広げてきました。そういった技術やアイデアを駆使することで、日頃の案件ですぐに取り入れられそうな応用力のあるものから、サイトに新鮮さや遊び心を大きく付与するクリエイティビティや実験性にあふれたものまで、さまざまなタイプのナビゲーションを紹介していきます。

    • ロールオーバーで背景がアニメーションするナビゲーション
    • ボタン内でHTML5 videoが流れるナビゲーション
    • マウスオーバー時にふわっと色が変わるメニューボタン
    • ロールオーバーでモノクロからカラーに変わるナビゲーション
    • 選択したメニュー以外のメニューをぼかす演出
    • Web Fontsでテキストのナビゲーションを引き立たせる
    • ネオンサイン風メニューにWeb Fontsのアイコンを組み合わせる
    • 複合的なテクニックの組み合わせでFlashのようなナビゲーション
    • ドロップダウンとアニメーションによる動きのあるナビゲーション
    • マルチレベル対応のドロップダウンメニュー
    • スライドアニメーションで表示・非表示を切り替えるメニュー
    • CSS3でアニメーション効果をつけたナビゲーションいろいろ
    • マウスオーバー時にツールチップの吹き出しを表示するメニュー
    • サブキャッチが出現する、画像を使わない付箋メニュー
    • 切り替え時にフェードインするタブメニュー
    • CSS3のみで作る、キービジュアルにも使えるスライドショー
    • アニメーションで表現するポップなナビゲーション
    • アニメーションするリングメニュー
    • JavaScript でランダムに設定する、遷移図などに使えるナビゲーション
    • スマートフォン用に最適化したナビゲーション
    image

    サンプルコードをダウンロードする

  • 特集2:みんなの見積もり大研究!

    −Webサイト提案と見積もりに対する現状、徹底調査−

    仕事にいくらの対価を付けるのか。「見積もり」の立て方に頭を悩ませている人も多いのではないでしょうか。高いか、安いかをどう判断するのか。正解はあってないようなもの。今回の特集では、見積もりをテーマに、講義あり、アンケートの分析あり、読者のインタビューありと、さまざまな角度から考えてみたいと思います。見積もりの「正解」を求めるというよりは、見積もりの「考え方」に触れてほしいと思います。

    _見積もりはどうつくられるのか、いっしょに考えてみよう。
    アンティー・ファクトリーの中川直樹さんの見積もりをテーマにした講義を実況中継!
    _「この条件ならいくらで作りますか?」
    Webデザイナー白書のアンケートの結果から「見積もり」の現況を探ります!
    _見積もりの際によく使われるキーワードとは?
    「ページ数」「相手」「ざっくり」などなど、頻出ワードで見積もりの現状が見えてくる!
    _その金額の理由は何ですか?
    Web制作者の見積もりの仕方はどうなっているのか。読者へのインタビューで、その実態に迫ります!
    _橘さん、見積もり書ってどう書けばいいですか?
    Web Designingのご意見番、「橘塾」の橘守さんが見積もりに喝!
    image
  • 【OnClick】これがクリエイターの「年賀状」!

    期間限定の見逃せないコンテンツが勢ぞろい

    毎年、制作会社やクリエイターの方から届く年賀サイト・年賀状は、クライアントワークでは発揮できないような実験的なアイデアや、自由なクリエイティビティが詰め込まれた、ステキなものばかり。ですが、ほとんどが期間限定、そして大々的に制作実績として紹介されることもあまりありません。そこで、編集部に届いた年賀状の数々、話題のあの会社の年賀コンテンツなどなど、新年のご挨拶代わりに大公開!

    image

    紹介事例リンク集

  • コラボプロジェクト「チョコバナナ」

    Web Designingと吉本がまさかのコラボ、第1回イベント企画会議!

    このたびWeb Designingで実現したのは、一流のWeb クリエイターとお笑い芸人が一緒にイベントを開催するというまさかのコラボレーション。名付けて「チョコバナナ」プロジェクト。記念すべき第一回イベント「千原ジュニア(千原兄弟)×川田十夢(AR三兄弟)」の企画会議の様子を、余すところなく誌面でお伝えします。

    image

    チョコバナナプロジェクト by 吉D×WEB DESIGNING

  • デザインにできることDialogue

    スプツニ子!×永原康史「ラディカルの枠を壊すファンタジー」

    今回は、東京都現代美術館で開催中の展覧会「東京アートミーティング トランスフォーメーション」に作品を出展中のスプツニ子!さんをゲストに迎える。対談中は、アートの話はほぼないまま、永原康史氏とデザインの話が繰り広げられ、作曲も数学もプログラムもこなす彼女のデザイナーとしての一面に迫ることができたようだ。

    image

    Sptniko!

  • 言葉のデザイン 2010 パブリッシング プロジェクト

    岡部務(日本放送協会)×中村勇吾(tha)「運動する文字、反応する文字」

    image
  • WD Website Front_In-Depth Report

    ブラウザを通して参加・体験できる新型ミュージックビデオ「映し鏡」

    image

    SOUR / MIRROR

連載企画

お詫びと訂正
  • 2011年2月号「【OnClick】これがクリエイターの「年賀状」!」にて、誌面で紹介した内容に誤りがありました。お詫びするとともに、以下の通りに訂正させていただきます。

    「マトリョーシカ×コラール = マトリョラール」紹介記事内
    (誤)AID-DCC Inc. / katamari Inc.
    (正)AID-DCC Inc. / Katamari Inc.

    面白法人カヤック「お年賀プロジェクト2011」紹介記事内の画像が現在リリースされているものと異なります。
    (iPhoneアプリ自体はバージョンアップ時に改編されています)
    (誤)ダイアモンド富士
    (正)ダイヤモンド富士

  • 2010年11月号(Vol.112)から2011年2月号(Vol.115)にかけて、「ホスティングサービスインデックス」に掲載したKDDIウェブコミュニケーションズ(CPI)の「マネージドプラン」において月額費用に誤りがございました。正しい金額は、以下の表のようになります。ご迷惑をおかけしましたことを深くお詫び申し上げます。

    201102_img12

サンプルデータについて

  • サンプルデータのダウンロードには、当月号の目次に掲載しているIDとパスワードが必要です。
  • 各サンプルデータの著作権は、各データの作者に帰属します。
  • サンプルデータをご利用の際の利用条件や連絡先などについては、圧縮データに同梱しているテキスト「readme.txt」をご覧ください。
  • 各サンプルデータの内容に関しては間違いのないように十分注意しておりますが、もしこれらのデータを利用することによってトラブルや損失・損害が発生しても、各データの作者および毎日コミュニケーションズは一切責任を負いませんのでご了承ください。

購入する