Loading...
Webフォントを上手くWebデザインに取り入れたサイトを収集しているギャラリーサイト・the WEB FONTS gallery
ありそうでなかったWebデザインギャラリー だったのでご紹介。Googleでも提供して くれている、Webフォント。日本語では なかなか難しいですが、英語圏ではかなり 一般化してきている印象です。そんな Webフォントを上手く利用したWebサイト を収集しているギャラリーです。 Know The Font: 3 Typography Inspiration Sitesという記事の中で紹介されていたWebデザインギャラリーです。ありそうで無かったですね、このギャラリー。良いインスピレーションが得られそうです。 Webフォントを取り入れたWebサイトのデザイン例です。まだ数は少ないですけど使い方は参考にしたいので覚えておきたいギャラリーですね。SEO的にも画像よりテキストのほうが良さそうですしね。 個別ページです。使用してるWebフォントも書いてくれています。親切ですねー ブックマークレットで
Tips for Using Light Fonts in Web Design | Concept Dezain
Light fonts are thinner or slimmer than most fonts. Because they are thinner, they should be handled differently than you would other, bolder fonts. You will find some light fonts on the web, but not in large quantities. For those who know how to use light fonts, they can be very attractive. When light fonts are misused, however, they can look terrible. Here are some basic tips to help you avoid d
細部までしっかりこだわったヴィンテージデザインの6種類のエレメント
人気のデザイントレンドの一つに、ヴィンテージ・レトロスタイルがあります。デザインにこれらを取り入れるために使いこなしたい6種類のエレメントを紹介します。 The Elements of Retro Web Design [ad#ad-2] 下記は各ポイントを意訳したものです。 元記事にはサンプルやチュートリアルなど豊富に掲載されています。 はじめに 1. サークルを使った形状 2. ツートンカラー、限定されたカラースキーム 3. タイポグラフィエレメントとトレンド 4. ブレンディングスタイル 5. テクスチャとノイズ 6. イメージクロップとレイヤーマスク はじめに ヴィンテージ、レトロといったスタイルは今日のデジタルアートワークにおいて、日々人気が高くなっています。社会が完全にデジタル化した後、デザインにおけるヴィンテージ、レトロをテーマにしたものはトレンドの一つと言えるでしょう。 こ
2010年総まとめ：ウェブ制作に役立つエントリーBest 20
コリス [ad#ad-2] 当サイトの購読は、RSS Feedをご利用すると便利です。 コリスのRSS Feed Twitterでは、サイトに掲載していないウェブ関連の話題、クリエイティブなもの、面白いものを数多く紹介しています。 Twitter@colisscom 2010年、ブックマークが多かったエントリー 漢字も使える手書き風の日本語フォントのまとめ ウェブサイトのパフォーマンス改善やセキュリティに役立つ.htaccessの設定 2010年総まとめ：商用利用も無料、日本語・英語の高品質なフリーフォント集 jQueryの日本語の解説サイトと国産のプラグイン集 たった一行を追加するだけでIE6/7/8をCSS3対応にする -CSS3 PIE ウェブデザインに黄金比やフィボナッチ数列など数学的な要素を取り入れる方法 商用でも無料で利用できる高級感のある細字のフォント集 無駄なdiv要素やc
Webデザインでレタープレス（型押し）エフェクトを作るときのTips
レタープレスエフェクト大好きなんです ...。レタープレスエフェクトを使った Webデザインを観察していて気付いたことをまとめながら、Photoshop を使ったレタープレスの作り方をおさらいしてみました。 最近いろんな Webサイトを見ていると、レタープレス（型押し）を表現したデザインを、たくさん見かけるようになりました。私もきれいなレタープレスが大好きなので、このブログでもたくさん使いたいんですけど、なかなかきれいに表現できません …。レタープレスエフェクトは、黒や白の背景ではあまりきれいにならないし、色やテクスチャによって見え方がかなり変わってきます。レタープレスエフェクトを使った Webサイトを観察していて、こうしたらキレイにできるかも … という視点でまとめてみました。
デザインの要素と原則
2017年6月29日 Webデザイン 今回はデザインの基礎をお勉強しましょう！デザインは複数の要素（エレメント）と原則（プリンシプル）から成り立っています。それらを簡単に説明するとともに、要素と原則を生かしたWebサイトを一諸に紹介します。私は「デザインセンスは才能」とは考えていません。デザインセンスはそれらの要素をどう組み合わせるか、という閃きとその引き出しの多さによるものだと思います。ぜひ参考にしてみてください！ ↑私が10年以上利用している会計ソフト！ デザインの要素（エレメント）と原則（プリンシプル）は全てのビジュアルデザインの基礎と言われています。要素はデザインの「表現手段」を形成し、原則は「構造的特徴」を構成します。デザインにおける要素と原則の認識は、視覚構成をすることにおいての最初のステップ。Webデザイン、グラフィックデザイン、プロダクトデザインなど、すべてのビジュアルデザ
配色パターンからWebデザインを考える
2017年6月29日 Webデザイン, 色彩 ページを開いた瞬間にそのWebサイトのイメージを左右するほど重要な要素「色」。しかし色の組み合わせ、配色には無限のパターンがあり、正しい配色を見つけるのは簡単なことではありません。ここでは色彩の基礎と配色パターンの見つけ方の一例を紹介します。 ↑私が10年以上利用している会計ソフト！ まずは色彩の三属性について 色は彩度・明度・色相の三属性（三要素とも呼ぶ）から成り立っています。 彩度 色の鮮やかさの度合いを表します。彩度の高い色は派手・華やか・目立つ色といえます。子供服やキャラクターグッズ関連のサイトには彩度の高い色が使われることが多いです。逆に彩度の低い色は地味・おだやか・上品であるといえるでしょう。和食・ヴィンテージ風デザインのサイトには彩度の低い色がよく使われます。 明度 色の明るさの度合いを表します。明度が高い＝明るい色はさわやかで爽
ミニマリズムから学ぶウェブデザインのセオリー
伝えるべきメッセージを明確に伝え、余分なものを取り除くミニマリズムから学ぶウェブデザインのセオリーを紹介します。 Minimalism in Web Design: A Guide [ad#ad-2] ミニマルなウェブデザインってどういうの？ という方には、下記の記事もおすすめです。 ミニマルなウェブデザインで使用される特徴的な12のエレメント 下記は各ポイントを意訳したものです。 はじめに 1. ミニマリズムの概念 2. 取り除く美学 3. よりスマートなカラー 4. タイポグラフィ 5. レイアウト構造 6. ネガティブスペース 7. バランス 何を学ぶべきか はじめに ミニマリズムは多くの異なるコンテクストで話し合われるワードです。それがライフスタイル、あるいは芸術スタイルにかかわらず、なにかがミニマリズムであるということはいろいろな意味をとることができます。 ウェブデザインにおいて
3Dグラフィックデザインのまとめエントリ
Color Theory for Designers: Understanding the Psychology of Color
Webフォントをその場でウェブサイトに適用できるサイト「FontFonter」*二十歳街道まっしぐら（FC2ブログ時代）
「FontFonter」はWebフォントをその場で適用できるサイトです。 Webフォントについては、 「SafariやFirefoxも正式対応！CSS3のWebフォント(Webfonts)とは何か」を御覧ください。 「FontFonter」は、 Webフォントを公開している「Web FontFonts」内のフォントをその場で適用できるサイトになります。 以下に使ってみた様子を載せておきます。 まず「FontFonter」にアクセスしましょう。 フォントを適用したいサイトのURLを入力します。 日本語フォントは基本適用されないみたいなので、今回は海外サイト「Digg」で試してみます。 通常はこのとおり。Javascriptは無効になります。 上部でフォントを置き換えることができます。 お好みのフォントを選んで「FontFont it!」をクリック。 するとこのようにWebフォントがその場で適
縦書きを可能にするjavascriptライブラリ「竹取JS」
SEO的にも問題の無い縦書きのコンテンツを作りたい。そんな時に便利なのが、今回紹介するjavascriptライブラリ「竹取JS」です。javascriptで指定されたブロックを縦書きに変換してくれます。 HTMLのみで縦書きというのは非常に面倒でしたが、これなら気軽に縦書きコンテンツを作れそうです。 詳しくは以下 上記のように文字だけではなく、リストや、取り消し線、テーブルなど様々なHTMLで創られた基本要素を縦書き化してくれますので、従来のサイトの構造を保ったまま縦書きのコンテンツを制作することが可能です。また切り替えボタンやダブルクリックで横書きへ瞬時に切り替わる機能も実装されています。 対応ブラウザはInternetExplorer5.5+ / Firefox3.5+ / Safari3.2+ / Chrome3.0+ / Opera10.5+と幅広いブラウザで利用可能。ライセンスは
Apple 関連のフォントを手に入れよう | バシャログ。
シーブレインのマニュアル作成サービスチームから「スマートフォンで読めるマニュアル作成」を PR するページを作ってほしいとのご依頼があり、ページをデザインました。 せっかく iPhone を素材に使うのだから、フォントも Apple 風にしたいわあ、といろいろ探した際に知ったいくつかのフォント情報をメモします。 ひと目でフォント判別できる一流デザイナーにあこがれる！ 1. Apple 日本語サイトのフォントは「AXIS」 Apple 公式サイトの日本語や Apple store で手に入るパンフレットには「AXIS」というフォントが使われていることが多いそうです。 その「AXIS」試用版が、無料でダウンロードできます。登録さえすれば商用も OK という太っ腹ぶりです。 なだらかなラインがスマートな、きれいなフォントです。 Type Project｜試用版ダウンロード http://www.
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://raksul.com/magazine/wp-content/uploads/2015/02/150212_tokushu_lp_03.png
http://e0166nt.com/blog-entry-813.html
新着記事
新着記事
Photoshopでつくるタイポグラフィのチュートリアル -Part19
新着記事
新着記事
