年末年始にWebデザインを学び直すための3つのステップ
この記事は、以下のような方を対象にしています。 現在Webデザインを仕事にしていて、さらにデザイン力をつけたい方 今はプログラマー、ディレクター、コーダーなどデザイン以外の仕事をしていて、来年はデザインも手がけたい方 ※この記事は、2010年末に公開したものを、文章と参考サイトなどのリンク先を修正し、2019年末に再公開したものです。 私は元々Webデザイナーなのですが、デザイン以外の仕事が連続したときなどデザインスキルの低下が心配になってくるので、年末年始など時間があるときは自己流のWebデザイン勉強法をしています。 もしかしたら他の方にも役立つかなと思い、公開しました。 今回は、主にWebデザインの中でも「レイアウト」について書いています。 まずは「知る」こと 私がWebデザインについて基礎からきっちり勉強したいと思い、Webデザインスクールに見学に行ったり「Webデザイン」と名の付く
[Webデザイン] 文字組みについて本気出して考えてみた | Stocker.jp / diary
これはもう何年も前から気になってることなのですが。 何故、昔からずっと見出し画像などの文字組みや文字詰めの甘いWebサイトが多いのでしょうか。 私はデザインについて偉そうに言える立場でないのは分かっていますが、折角全体的なデザインや背景、写真、Flashなどの動きはとても美しく、文章構成のしっかりしたサイトなのに、ただ一点文字詰めだけが甘いというサイトがあまりにも多くて、そういうサイトが減る様子もないのがずっと気になっています。 私は以前、ファッション雑誌やビジネス誌の組版（MacのInDesignやQuarkXPressを使って印刷用のデータを作る仕事。DTPとも言う）の仕事をしていて、見出しは言うまでもなく、本文の文字詰めが少し甘いだけでもものすごく怒られたものですが、Webデザインの世界ではそういうのはあまり怒られることがないのでしょうか。 私は、見出しやタイトル画像における文字組み
![[Webデザイン] 文字組みについて本気出して考えてみた | Stocker.jp / diary](https://cdn-ak-scissors.b.st-hatena.com/image/square/e6e22153e1233d79c8da8733fc112f935fe5ee4a/height=288;version=1;width=512/https%3A%2F%2Fi0.wp.com%2Fstocker.jp%2Fdiary%2Fwp-content%2Fuploads%2Ftypographic-1-1.png%3Ffit%3D500%252C250%26ssl%3D1)
世界を変えるデザイン展
世界を変えるデザイン展 2010-05-26-1 [TokyoMidtown][Museum][Design] 昼休み、東京ミッドタウンのデザインハブで開催されている「世界を変えるデザイン展」をみてきました。 書籍「世界を変えるデザイン」に連動した展覧会みたい。 この本に出て来る世界を変える製品が展示されています。 ■シンシア スミス / 世界を変えるデザイン - ものづくりには夢がある 写真もOK。手で触れてもOK。 6月13日までやっています。 - 世界を変えるデザイン展 http://exhibition.bop-design.com/ - TAB イベント - 「世界を変えるデザイン展」 http://www.tokyoartbeat.com/event/2010/213D 展示品をいくつか紹介。 これは浄水ストロー「LifeStraw」。 泥水を吸うときれいな水になって口に入りま
配色の作法
配色の作法 このページでは、さまざまな配色について扱います まずはコンセプト 配色の名前や、配色のきまりごとに入る前に、配色を行うもの（対象物）のことを考えてみましょう。実は、それを考えることがとても大切なんです。もっとも身近な衣服を例にとってみましょう。あなたが行動する場面、場所、合う人などの違いによって、きっと着る服を変えていませんか？衣服を変えるときに考えることは何ですか？ 1.今日は、結婚式のパーティに出席するので、気合いを入れてオシャレをしよう 2.これから、掃除をするので、動きやすく汚れてもいい服にしよう 3.これから眠るので、パジャマに着替えよう 4.今日は一日家にいるので、気軽な服でいいや などなど・・・・たくさんの考えがありますよね。こうしたことを含めて、よく物のＴＰＯという事が言われます。 ＴＰＯ（ティーピーオー）とは、Time Place Occasionの略で、訳せ
sipec-square.net - このウェブサイトは販売用です！ - 青山学院大学 国際政治経済学部 リソースおよび情報
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
困った時のカラーイメージ＿WEBデザイナーのすすめ
サイトのイメージを左右する配色決めに悩んだ事ありませんか？クライアントに企業のイメージカラーがある場合も、どういった配色をすればもっともイメージカラーを生かせるか・・・また、イメージカラーがない場合、サイトに対する「思い」や「イメージ」に近い色使いにするためには・・・？そんな時のちょっとしたヒントになれば嬉しく思います。
WEB制作・ファッション・インテリア・デザインに役立つカラー配色事典
・天然石ｱｸｾｻﾘｰｼｮｯﾌﾟ ・FKM Search ・ネットショップノウハウ ・FKM.WEB(WEB制作) ・ふくみみ猫と戯るる ・FKM PHOTO DL ﾌﾘｰ写真 ・猫まち！-携帯待受- ・猫ふり！-写真素材- ・猫と晩酌 ・NO! Scales計量ｶｯﾌﾟﾚｼﾋﾟ ・西の猫はキャンプ好き ・ドリーマンのスピニング・トーホールド 【PR】 国内最大エリアのインターネット回線。「フレッツ」 【PR】 【PR】 プライベートキャンプ場 始めました！ 九州の里山で プライベートキャンプ場 始めました！ 川あり山あり民家なしの 完璧な環境！ YouTubeチャンネルにて 公開中！ 【YouTubeチャンネル】 WEB制作 をする上で、避けて通れないのが「サイトデザイン」です。サイトの内容は決まっていても、どのようなイメージで、何色を基調にサイトを作るか。これが決まらないと先に進めません
自分のページやサイトが各ブラウザでどのように見えるか確認できる便利なサイトいろいろ - GIGAZINE
サイトのレイアウトを変更したり、新しくデザインする際に使えるのがこのクロスブラウザテスト、要するに「それぞれのOSのそれぞれのブラウザで自サイトは正しく見えているのか？」をチェックするサイトです。予算と時間が潤沢であれば、自分で各種OSを揃え、各種ブラウザを導入してチェックできるのですが、あまりにも非現実的な場合が多いため、この手のテストサイトは非常に重宝します。 というわけで、デザインやレイアウトのチェックに使えるクロスブラウザテストのサイト一覧は以下から。 10 Helpful Resources for Cross Browser Testing Browsershots http://browsershots.org/ 見てのとおり、現時点ではほぼ最強に最も近い定番クロスブラウザテストサイトが「Browsershots」です。Linux・Windows・Mac OS・BSDの各種ブ
moyu at himote.org - ゲバ文字フォント
このページはなんのために存在するの？ ゲバ文字フォントは共産趣味者によって制作され、配布されました。オリジナルの配布ページはUG系（アンダーグラウンド系の略）に存在していました。諸般の事情から、同志作者は配布ページを閉鎖することに決め、その際、再配布サイトをつのりました。moyu at himote.orgが名乗りをあげ、今に至っています。ここには怨念があります。しかし、ここにある怨念は通りいっぺんの共産主義者どものそれと、まったく隔絶したものです（そして奴らを笑いとばすためのものです）。同志作者が、なぜ「ラブひな有理」とゲバ文字フォントで書かなければならなかったのかを考えれば、答えはおのずから明らかです。 ゲバ文字フォントの権利は（改変を行った部分も含めて）、政治結社エコノミスト（作者）が保持しています。また、「商用サイトへの使用・商業誌等への使用はご一報願います。金取ったりしませんので
すこしズルしてリアルなアイコンを作る方法 | バシャログ。
猫も杓子も Web 2.0 的な表現がもてはやされた頃、 ツヤツヤでリアルなアイコンの作成を迫られて嫌な汗をかきました。 質のよいイラストを描くことが要求される上、小さく細かい作業がてんこ盛り。 時間もスキルも足りない！ [1] まずフリー写真を探します。 アイコン作るのに何故写真が必要なの？とお思いかもしれませんが何故ならすこしズルいからです。 今回はこの本の写真を、アイコンっぽくしてみます。 [2] 必要なサイズにぎゅっと縮小し、背景を切り落とします。 [フィルタ]→[カラー調節]→[トーンカーブ]で、強めに調節します。 さらに[フィルタ]→[カラー調節]→[明るさ・コントラスト]でかなり思い切ってコントラストを上げます。 写真が縮小された上、強く補正をかけたことで、イラストに近いテイストになってきました。 [3] ここまでくればあとは簡単。 輪郭線を書き足したり、グラデーションを上か
プログラマでも出来るWebデザイン - Blog.37to.net
home blog labs about contact プログラミング・開発 > プログラマでも出来るWebデザイン (X)HTML CSS テンプレート デザイン 画像 作成： 2007-01-08T01:58:41+09:00 更新： 2009-04-29T09:48:31+09:00 年始早々に大幅リニューアルした当ブログですが、リニューアルのお知らせでも書いた通り、 今回のデザインリニューアルに当たっての作成過程や、使ったツールを書いていきます。 デザインセンスの無い私にとって、今回のリニューアルは良く出来たと自負しているので、 お題はプログラマでも出来るWebデザイン。 前提として、CSSでコーディングが出来て、ある程度HTMLは設計出来る、でもデザインは・・・orz な人を対象にしています。 使用したツール・サイト一覧 作成過程は後半に書くとして、今回使用したサイト・ツールで
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
配色事典
黄金比グラデーション・白銀比グラデーション - DesignWalker
アルファベットを使ってロゴを作るときの10のTips - DesignWalker
ソシオメディア | UIデザインパターン
フロップデザイン｜FLOP DESIGN｜フォント｜グラフィック素材集｜シルエット｜写真背景アイコン