新Web Painter (ウェブペインター)はホームページ制作を支援する、色彩情報サイトです。 オリジナルカラーチャート・配色サンプル・配色テクニック・web用素材をご提案いたします。
新Web Painter (ウェブペインター)はホームページ制作を支援する、色彩情報サイトです。 オリジナルカラーチャート・配色サンプル・配色テクニック・web用素材をご提案いたします。
様々な配色やレイアウトパターンから、お客様のWEBにマッチしたデザインを提案します。WEBデザインは、目的に合わせた意味づけを行うことで、意図した内容を正確に伝えることができます。 また、情報を見やすく整理し、インターネットユーザーの目線をストレス無く誘導してあげるためのナビゲーションとして、アイコン/ボタン/バナー も一緒にうまく活用していきましょう。 配色について 色には、人間の心理や感情をコントロールする作用がありますので、サイトの方向性に沿った配色が必要です。逆にサイトの方向性と異なるWEBデザインは、信頼性の低いWEBと見なされてしまうかもしれませんので注意が必要です。 例えばショッピングサイト/ECショップでは、暖色系(赤基調・オレンジ基調)の配色が向いています。特に赤は情熱の赤というぐらいですから、気分を高揚させる作用が最も高い色です。 これを例えば寒色系(青基調)のデザイン
TOP > Webデザイン制作編 > 上手にレイアウトして、目線をコントロール。 レイアウトの4つの原則 Webレイアウトを理解するためには、まず4つの基本の原則から。 法則1:近接の法則 関連のある情報は近くにまとめちゃうんです。それが近接の法則。関連のある情報ってなんでしょう? 法則2:整列の法則 このオシャレチップスでもこの法則にはだいぶ助けられています。この整列の法則とは・・・「見えない線」というのがヒントです。 法則3:対比の法則 関係のない情報はどうすればいいのかというと・・・まさにこの法則を利用します。実はこの法則、いろいろなことに応用することができちゃいます。 法則4:反復の法則 引っ込めるところは引っ込めて、出っ張るところは出っ張らせて。整列の法則とは反対のことを言っているかもしれませんけれど、そんなことはありません。この違いが秘訣なんです。 レイアウトのあれこれ 「揃
The requested URL was not found on this server. 您要找的内容已被删除
StackTraceとは フリーランスプログラマーいけまさの、プログラミングやシステム開発に関する雑多なStackの形跡です。 日々のプログラミングや、システム開発で得たことをまとめています。 もっと雑多な内容はブログに。 更新情報 2011/ 7/ 5 Sortable のrevertの説明を修正しました。 2010/11/14 jQuery API 1.4.4 日本語リファレンスに、jQuery.type(obj) を追加しました。 jQuery API 1.4.4 日本語リファレンスに、jQuery.isWindow(obj) を追加しました。 2010/11/13 jQuery API 1.4.4 日本語リファレンスに、jQuery.fx.interval を追加しました。 jQuery API 1.4.4 日本語リファレンスに、fadeToggle([duration], [ea
2010年に紹介したものを中心としたjQueryのプラグイン100+α選です。 今年は、アニメーションのエフェクトやレイアウト、後半は背景画像関連のプラグインが特に目立っていたように思います。 [ad#ad-2] コンテンツスライダー・カルーセル関連 ギャラリー・画像拡大関連 ナビゲーション関連 タブ関連 パネル・ボックス関連 ツールチップ関連 レイアウト関連 背景画像関連 その他UI関連 アニメーション関連 スクロール・ドラッグなど操作関連 テーブル・リスト・データ関連 フォーム関連 コンテンツ生成 その他 コンテンツスライダー・カルーセル関連
最近のトレンドの一つでもある背景画像をブラウザの枠いっぱいに表示する実装方法はたくさんあります。その中から、理にかなった最新のテクニックや、より多くのブラウザに対応させるテクニックを紹介します。 Perfect Full Page Background Image [ad#ad-2] 下記は各ポイントを意訳したものです。 各デモはページ下部のDownload Files」で、まとめてダウンロードできます。 背景画像をブラウザの枠いっぱいに表示するテクニックとは CSS3を使ったテクニック CSSだけで実装するテクニック:その1 CSSだけで実装するテクニック:その2 jQueryを使ったテクニック 背景画像をブラウザの枠いっぱいに表示するテクニックとは 前提として、下記のポイントが挙げられます。 画像でページをいっぱいにします。 空きは無いようにします。 画像のサイズは必要があれば調整しま
Keeping Curious As kids, we are inherently curious beings; we ask a lot of questions. Almost all of them are directed at our parents, who know everything about everything and are never wrong. The questions range from being slightly impressive to being slightly annoying. Everything from what is the meaning of life to just “why.” Kids ask the same questions over again and ask questions that they alr
Serious efforts are being made to get more typeface choices on the web to enhance web typography. Still, most of us prefer web-safe fonts like: Verdana, Georgia, Times New Roman and Arial. Though choices are limited, yet the number can be increased by exploring other pre-installed fonts.Serious efforts are being made to get more typeface choices on the web to enhance web typography. Still, most of
デザインエレメントの中でも最もシンプルな『ライン』をデザインに使う際、知っておきたい役立つチップスを紹介します。 6 Tips for Designing With Lines [ad#ad-2] 下記は各ポイントを意訳したものです。 はじめに 1. Use an Underline 2. Break Up the Line 3. Flank the Type 4. Go Vertical 5. Go Diagonal 6. Go Nuts はじめに ここでは最もシンプルなデザインエレメントである「ライン」について見てみます。 デザインにシンプルなラインをほんの少し加えるだけで、退屈なデザインに構造とグラフィカルなスタイルを与えることができます。ラインが効果的に使われた時にはシンプルなトリックではなくなり、素晴らしいデザインになるでしょう。 1. Use an Underline タイポグ
YUI、Blueprint、YAMLなどのCSSのフレームワークでも利用されているブラウザのスタイルを初期化するスタイルシートのサンプル集です。 Blueprint YAML YUI Tripoli meyerweb warpspire christianmontoya crucialwebhost 下記のスタイルシートは、記述スタイルを同様のスタイルに全て変更しています。また、コメントも削除しています。 Blueprint Blueprint Based:Reset Reloaded <textarea name="code" class="css" cols="60" rows="5"> html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym,
IE 7の自動アップデートに伴ってだと思うのですが、当サイトで紹介した「IE7とIE6の共存」シリーズのアクセスが増えているので、既存のエントリーをまとめました。 リンク先や手順などは以前紹介した方法ではなく、最新のものになっています。 IE7をベースに、IE6をスタンドアローンで起動する方法:その1 IE7をベースに、IE6をスタンドアローンで起動する方法:その2 IE6をベースに、IE7をスタンドアローンで起動する方法 Virtual PCを使用して、IE6 or 7を起動する方法 追記: スタンドアローンは、Windows XPが対象になります。 Vistaの場合は、Virtual PCを使用します。 IE7をベースに、IE6をスタンドアローンで起動する方法:その1 IE7をダウンロードして、インストールします。 日本語版「Internet Explorer 7」のダウンロード IE
Slider Kit スライドショー、コンテンツスライダー、タブコンテンツ、カルーセルなどさまざまなスライドコンテンツに対応。
Golden Spirals [ad#ad-2] そのままでは実用性はないと思いますが、いつか何かに使えるかなあ。 スタイルシートで黄金螺旋を作成:HTML スタイルシートで黄金螺旋を作成:準備編 スタイルシートで黄金螺旋を作成:完成編 スタイルシートで黄金螺旋を作成:HTML 元となるHTMLは、14個のdivを使った入れ子です。 HTML <body> <div id="container"> <div class="cycle"> <div> <div> <div> <div class="cycle"> <div> <div> <div> <div class="cycle"> <div> <div> <div> <div class="cycle"></div> </div> </div> </div> </div> </div> </div> </div> </div> </d
导航 招考信息 硕士招生 硕士公告 招生章程 博士招生 博士公告 招生章程 港澳台招生 信息公开 招生宣传 更多> 卓越工程师学院2023年推免生接收工作细则 卓越工程师学院中国商飞联培班硕士公海赌赌船710检测路线简介 卓越工程师学院产教融合人才培养基地(郑州)硕士公海赌赌船710检测路线简介 博士公告 更多> 关于我校2023年春季年博士公海赌赌船710检测路线录取通知书发...2023-01-04 关于我校2023年博士公海赌赌船710检测路线第一次“申请-...2022-09-03 公海赌赌船710检测路线2021级硕士公海赌赌船710检测路线硕博连读和推...2022-08-23 关于2022年秋季入学博士公海赌赌船710检测路线录取通知书发放...2022-06-16 关于2022年公海赌赌船710检测路线(校本部)组织关系转入、户口...2022-06-09 硕士公告 更多>
その調和された比率は、トランプカードなどの日常的なものから、ギリシアのパルテノン神殿、ミロのヴィーナス、モナリザなどの芸術分野まで、多数存在します。 黄金比を使ったデザイン テクニックついては、下記も参考にどうぞ。 黄金比とは、黄金比を使ったすごいデザインテクニックのまとめ -Webデザイン・紙デザインに 黄金比を矩形に使用する 黄金比をマージンに使用する 黄金比をパーツに使用する 黄金比を矩形に使用する サイトで使用する画像などの矩形に黄金比を適応します。 サンプルでは、144pxと233pxの組み合わせを使用していますが、「1:1.6」を利用して100pxと160pxなど簡易なものでも効果はあると思います。 黄金比を横長の矩形に使用 黄金比をマージンに使用する レイアウトにグリッドシステムを取り入れマージンを使用した場合、数種類のサイズが必要になる場合が多くあります。 その際、1つの値
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く