タグ

webdesignに関するnemotatsuのブックマーク (134)

  • ウェブデザインに黄金比やフィボナッチ数列など数学的な要素を取り入れる方法

    黄金比、フィボナッチ数列、ファイブエレメンツ、サインウェーブなど数学的な要素を巧みにウェブデザインに取り入れる方法をSmashing Magazineから紹介します。 Applying Mathematics To Web Design 下記は各ポイントを意訳したものです。 また、当サイトでも黄金比をウェブデザインに取り入れる簡単な方法を紹介していますので、あわせてどうぞ。 黄金比をサイトのデザインに取り入れる簡単な3つの方法 はじめに 1. 黄金比(黄金四角形) 2. フィボナッチ数列 3. ファイブエレメンツ 4. サインウェーブ [ad#ad-2] はじめに 「数学は美です。」 数字嫌いの人には、ばかばかしく聞こえるかもしれません。けれども、自然や宇宙にある美しいもの、最も小さい貝殻から最も大きい銀河まで、数学的な要素を持っています。 数学ははるか昔から今日まで芸術や建築のデザインに

  • IDEA * IDEA

    ドットインストール代表のライフハックブログ

    IDEA * IDEA
  • Pattern Tap : Interface Collection for Design Inspiration

    A collection of interface design solutions from all over the web, where users can mark patterns they like, and learn from other's design solutionsPattern Tap is here to satisfy and encourage the inspiration needs of my interface design peers and peeps. We aspire to be the one stop pattern shop for your next inspiration need.

  • ソーシャルメディア活用 TIP#4: Retweetリンクの作り方|Sphinn Japan Blog

    今回は、自分のサイトやその他コンテンツを読者にTwitterで紹介したもらうためのちょっとしたテクニックを紹介します。 上手に使えばバズマーケティングに有効です。 ちなみにこのテクニックは、先日Mass Controll2.0 を販売したフランク・カーンさんのブログ記事で解説されていたものです。フランクさんのブログ記事では、実例としてマイク・フィルセイムさんのButterfly Marketing 2.0の販売ページで使用されていたテクニックとして紹介しています。 フランクさんも、マイクさんもバズマーケティングを得意とするマーケッターですので説得力があります。 テクニックといっても非常に単純なことで、以下のようなリンクをつくるだけです。 このブログ記事をTwitterでみんなに教える。 ためしに上のリンクをクリックしてみて下さい。Twitterにログインした状態でクリックした場合以下の画像

  • 新着記事

    『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年3月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材/配色やWeb制作といった最新トレンドも公開中。

    新着記事
  • パーツごとのデザインが盛り沢山で参考にできる「Pattern Tap」:phpspot開発日誌

    Pattern Tap : Organized Web Design Collection of User Interfaces for Inspiration and Ideas. The CSS Gallery Alternative - Pattern Tap パーツごとのデザインが盛り沢山で参考にできる「Pattern Tap」。 結構前に話題になっていたようですが知らない方もいるようなのでご紹介。 アーティクルカテゴリに入ったデザインのパターン(188種類) ページネーションのパターン(102種類) コメント・コメント欄のパターン(45種類) これらの他にも、ページフッター、404ページ、ポートフォリオといったカテゴリが全部で45種類あります。 パーツごとのデザインに迷った際に参考にするとよいですね。

  • フッターやヘッダー、ナビゲーションなど、パーツ別のデザイン例のまとめ

    Webデザインパーツごとのデザイン例 ヘッダーだけ、フッターだけみたい、 というように、部分的にデザインの 例を見たいことが多いのでそんな 記事をまとめました。 ヘッダーだけ、フッターだけみたい、 というように、部分的にデザインの 例を見たいことが多いのでそんな 記事をまとめました。まとめのまとめ です。少し重いかもしれません。 主にブログデザインになってしまいますが、ヘッダー、フッター、ナビゲーション、フォームデザインなどなど部分的なデザインを参考にしたいとこに役立つまとめ記事を備忘録としてまとめています。 ヘッダーデザインユーザーにインパクトを与えるヘッダー。派手なデザインが多めです。 30 Creative Website Headers クリエイティブなヘッダーのデザインを30個ほど。凄いのばっかり。 30 Creative Website Headers 27 Stunning

    フッターやヘッダー、ナビゲーションなど、パーツ別のデザイン例のまとめ
  • ユーザーにクリックされやすいボタンデザインの5つのポイント

    ユーザーの行動への呼びかけを促す「ダウンロード」や「サインアップ」などのボタンをデザインする際に気をつけたい5つのポイントをLee Munroeから紹介します。 Web Design Trends: Call To Action Buttons 先日とりあげた「ハイパーテキストリンクのスタイル大全」の5. ボタンスタイルで紹介されているものです。 以下は、各ポイントを意訳したものです。 はじめに サインアップやダウンロードなど、ユーザーの行動への呼びかけを促すボタンのデザインはウェブデザインにおいて重要なものです。 ボタンはそのページのゴールの一つであり、その目的のためにそれぞれのページをデザインするといっても過言ではありません。 行動を呼びかけるボタン(Call to Action Button)はユーザーの注意を引く必要があります。以下に、そのボタンのデザインの5つの特長をあげます。

  • フォームのinput入力の背景画像を、photoshopで作成:Goodpic

    This shop will be powered by Are you the store owner? Log in here

  • ハイパーテキストリンクのスタイル大全

    ハイパーテキストリンクをデザインする上で知っておきたい基礎知識から、実用的なチップス、やってはいけない間違いなど、すぐに役立つテクニックをSmashing Magazineから紹介します。 The Definitive Guide To Styling Web Links 以下は、各ポイントを意訳したものです。 はじめに ハイパーテキストリンク(リンク)はウェブページをつなぎます。Web Standardistasによると「ハイパーテキストリンク無しではウェブはウェブではなく、それはただ別個の、無関係なページのコレクションでしょう」と言っています。 我々はページにたどり着いたら、ある種のリンクをクリックする必然性があります。 1. CSSのセレクタと擬似クラス リンクをスタイルする時には、ユーザーはページを流し読みすることを忘れないでください。そのため、リンク箇所はしっかりと明示すべきです

  • 全てのIT・Web関係者に見つめなおして欲しい「Don’t Make Me Think」 - Feel Like A Fallinstar

    ”Don't Make Me Think” 訳すと、「いちいち私に考えさせるな!ボケ!」といったところでしょうか。 これは、2001年にSteve Krugが出した書籍の名前なのですが、この「ユーザにいちいち考えさせない」ことを忘れているか、いないかがソフトウェア・Webサイトの勝負を分ける最も大きな分岐点の1つです。 人間は日々の生活の中で、いちいち物を操作したり情報を見るたびにあれこれ考えたくなんてありません。 ユーザをつまらない操作やナビゲーションで考えされればさせるほどストレスは増大し、企業への信用は急激に失われます。 今日は、この”Don't Make Me Think”について、 如何にユーザが考えることを嫌うか 「考えさせない」とはどういうことか を、これまで見てきたユーザ検証の結果なども交えて、少しばかり書いてみようと思います。 あらゆる「無駄な」思考が、ユーザを苛立たせ、

  • RoundedCornr: Rounded Corner and Gradient Generator

    Howdy! Welcome to our vaping tribe. We are a group of American Indians who take a keek interest in vaping. For many years, our people have suffered under the harmful health effects of tobacco cigarettes. We are now pushing for everyone to start vaping, as some studies have shown that it is slightly less dangerous than tobacco itself. Our tribe recognizes that not all vaping manufacturers are creat

  • cssの情報・まとめ - かちびと.net

    cssの情報まとめです。ローカル 環境にストックしていた情報を 開放してみますのでシェアして 頂ければ幸いです。内容は 結構偏っていると思いますので 参考程度になさってください。 全てのcss情報が有るわけではありません。主観でストックしていたリンク集です。ツールとかメニュー関連とかハックとかいろいろ188の情報です。 ツール オンラインのcssツール。 CSS Validation Service / W3C検証サービス日語版 RoundedCornr / 角丸のHTMLCSSコードを生成してくれる CSS Type Set / ファミリー、色、単語間、行間等をプレビューで確認 CSS Text Wrapper / 様々な形のテキストの回りこみを簡単に実現できる CSS Builder / オンラインでスタイルを生成可能 Spiffy Box / cssによる角丸を簡単に生成 The

    cssの情報・まとめ - かちびと.net
  • 4096 Color Wheel Version 2.1

    4096 Color Wheel · 4096 Color Wheel · 4096 Color Wheel · 4096 Color Wheel · 4096 Color Wheel · 4096 Color Wheel · 4096 Color Wheel · 4096 Color Wheel · 4096 Color Wheel · 4096 Color Wheel · 4096 Color Wheel Hover over the wheel to view colors. Click to choose a web-smart color. Reload to clear. about | en français | links