Webデザイン エンジニアリング---目次：ITpro
この数年間で，（インターネットの総称としての）Webは私たちの生活に深く関係する身近なツールになりました。様々な情報を，この環境の上で閲覧や操作できることは，特別なものから，徐々に当たり前で，なくてはならないモノに変わろうとしていると言えるでしょう。 特別なものから日常のものへとシフトしていく中で，Web自体も大きく変わるべきところが見えてきています。様々なことが挙げられますが，利用者という立場からすれば，やはり「ユーザー・インタフェース（UI）」が一番の関心事です。 特定のITリテラシの高い人たちだけが使うものではない世界に突入する以上，作り手の側の意識も変化しなければ，ニーズに対応できません。そして，こうしたWebアプリケーションの大量生産の時代にも入っています。今あるWebアプリケーションは，私たちの生活を便利にしてくれていますが，これで十分ではないのです。もっと多くの分野で，もっと
プログラマでも出来る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 な人を対象にしています。 使用したツール・サイト一覧 作成過程は後半に書くとして、今回使用したサイト・ツールで
サイトのCSSを見たままリアルタイムに編集するツール色々:phpspot開発日誌
サイトのCSSを見たままリアルタイムに編集するツール色々。 WEBデザイン開発において、編集→リアルタイム反映というのはなかなか効率がよいですね。 ということで、各種、リアルタイムCSS編集ツールをピックアップします。 FireFox拡張 or スタンドアロンアプリ FireBug - リアルタイムに指定部分のCSSが切り替え可能(参考記事)。CSS以外にも便利機能満載。 EditCSS - FireFox拡張で、エディタがインストールされ、エディタ編集と同時に即座にCSSが反映される。 CSSVista - IEとFireFoxの画面で一括プレビューが可能。 Web Developer ToolBar - WEBデザイナー必須のFireFox拡張。CSSの直接編集も可能。 他にもCSSやアクセシビリティに関する便利機能満載。 ブラウザ上で動作するオンラインツール たぬきのしっぽ - CS
メールアドレス画像化ジェネレーター集 | *LOVE IS DESIGN*
スパム対策にメールアドレスを画像にしてくれる、便利なジェネレーターをまとめてみました。おしゃれなデザインなのでブログのワンポイントにもなりますよ。 きゃっとまーくめーる 可愛いネコのイラスト付き フォントもいろいろ選べます。 わたしが使用しているのは「みかちゃんFONT」です。 でざいんめーる フォントや背景色の変更・グラデーションなど 参考：でざいんめーるのサンプル一覧 E-Mail Icon Generator E-mail Sigs GMail・Hotmail・MSN・Yahoo!などに対応 Gmail Signature Generator Gmail用 Handmail 参考 HTMLエンティティ化 メールアドレス画像化以外のスパムメール対策は、エンティティコード（数値文字実体参照）に変換する方法もあります。 追加（2007/3/14） Faviconメール ファビコン＋メルアド
『ウェブ2.0 HOW-TO デザインガイド』がよくまとまっています | S i M P L E * S i M P L E
なんだか前にもこういうまとめを紹介しましたが、また良くまとまっているのがあったのでご紹介。 Web design scratchのサイトで「Web 2.0 how-to design guide」なるまとめがありました。 » Web 2.0 how-to design guide 15の項目でまとめられていますね。 Simplicity（とにかくシンプルに！） Central layout（真ん中に寄せるレイアウトで） Fewer columns（段組は少なめに） Separate top section（トップ部分は分けて目立たせよう！） Solid areas of screen real-estate（レイアウトにはメリハリをつけて） Simple nav（ナビゲーションはシンプルに！） Bold logos（ロゴは大きめに！） Bigger text（フォントも大きめに） Bold
2006年を彩った50の超美麗CSSデザインサイト集:phpspot開発日誌
50 Beautiful CSS-Based Web-Designs in 2006 | Smashing Magazine Let’s take a close look at some of the most beautiful designs we’ve seen in 2006.2006年を彩った50の超美麗CSSデザインサイト集。 どれも凄まじく凝ったサイト集で、1個1個が1つのクリエイターが精魂込めて作ったのが伺えます。 (Webデザイナーのためのリンク集) こういった美しいサイトを参考にサイトを作ったりすると自分のセンスも磨かれそうですね。 単に見るだけでも楽しめます。 2007年も素晴らしいサイトが出てくるんでしょうね。こういったデザインは数年前では見られなかったようなもののように感じます。 WEBデザインの面での進化についても今後が楽しみでしょうがないですね。 作成に使っ
WYSIWYGでCSSレイアウトを超簡単に作れる『CSS Grid Builder』 | p o p * p o p
なにかと便利なYahoo!のUIライブラリーに「Grids CSS」なるものがあります。自分でつくると面倒なCSSのレイアウトをテンプレートで提供してくれるものです。 この「Grids CSS」、ブラウザ対応がしっかりしていたり、ファイルサイズが軽量だったり、テンプレートが豊富だったりといいことづくめですが、いざ使うとなるとそれなりに説明を読み込んで（簡単だけど）手作業でレイアウトをつくっていく必要があります。 そこでその作業を簡単にできるようにWYSIWYGでジェネレーターを作った方がいます。こいつは便利です。 » YUI: CSS Grid Builder ↑ コントロールパネルはこんな感じ。 プレビューを見ながらカラムの数や横幅を指定していくと簡単にレイアウトができちゃいます。もちろんコードも瞬時に生成してくれます。 なお、これを使うには当然ですがYUIが必要になります。ダウンロード
sta la sta - 人の目を引くタイトルを作るための5つの方法
RSSリーダーやソーシャルブックマークを情報収集のツールとして使用していると、自分はタイトルを見て記事を読むかどうかを判断している場合が多いことに気付く。 溢れる情報の中でパッと目につくタイトルがあるととりあえず見てしまう。こういう人って意外と多いんじゃないかな。 こちらの記事では、そんな重要なタイトル作りのノウハウをいくつか紹介しています。 http://www.modernlifeisrubbish.co.uk/article/how-to-write-great-headlines 話題のキーワードやトレンドを記載する みんなの関心を引くには、みんなが今関心を持っている事柄をタイトルに入れよう。 基本といえば基本ですが、ちょっとした工夫でより人の目を引くタイトルになるかも。 悪い例：カタールのTV局が新しい機器を入手 (Qatar TV Channel aquires new har
Favicon.jp - ファビコンがなければ始まらない！
8年くらい前にファビコンを作る時にお世話になった「Favicon Japan!!」を久々に見ようとした所、 悲しい事に閉鎖されてしまったらしく、アクセスが出来なくなっていました。 時代の流れなのか、昔はホームページを作ろうとしたらまずFaviconにこだわるのが当たり前と言ったイメージでしたが、 モバイルサイトやタブレットサイトに移行しようとしている昨今ではファビコンは重視されないのか…と少し悲しくなりました。 しかし、毎月見ている期限切れドメインを取得出来るサイトを見ていたらfavicon.jpが販売されていたので購入。 以前「Favicon Japan!!」を運営されていた方に何の断りも無く始めるのは申し訳ないのですが(もし問題があればご一報下さい)、 faviconを登録できるサイトを作ろうかと思っています。 サービス開始は2013年6月ごろを予定しておりましたが、開発の遅れにより、
厳選10本！ブログで使えるスグレモノツールまとめ :: Love & Design ::
プロのWebデザイナーじゃないけど、ブログをもっとカッコよくしたい！もっとオシャレに見せたい！という方のために、これまで紹介したブログで使えるスグレモノツールをまとめてみました。 便利なフリーソフトはたくさんありますが、この中でお気に入りが見つかるとうれしいです。 名付けてsweetloveパック（livedoor風味） 画像系 ImageChef（日本語・携帯にも対応） ワンポイントや mixi のプロフィールにどうぞ 画像が簡単にできるジェネレーターいろいろ :: Love & Design :: Polaroid-o-nizer™ ポラロイド風や枠をつけてオシャレに演出 写真をオシャレに見せたい人のための便利なツール :: Love & Design :: デザイン系 Dynamic Drive CSS Library タブメニューなどが豊富に揃っています。 誰でも簡単にCSSカスタ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Webデザインとグラフィックの総合情報サイト - MdN Interactive - Webデザイン超基本のお作法50選
http://itpro.nikkeibp.co.jp/err/notlogin.jsp?URL=http%3A%2F%2Fitpro.nikkeibp.co.jp%2Fmembers%2Fbn%2Fmokuji.jsp%3FOFFSET%3D0%26MAXCNT%3D20%26TOP_ID%3D251023
http://itpro.nikkeibp.co.jp/err/notlogin.jsp?URL=http%3A%2F%2Fitpro.nikkeibp.co.jp%2Fmembers%2Fbn%2Fmokuji.jsp%3FOFFSET%3D0%26MAXCNT%3D20%26TOP_ID%3D252223%26ST%3Dswd-manage
新規でサイトを作る際に僕がいつも使ってるCSSのセットを公開するよ::::::STOPN' LISTEN::::::to the silence:::::::
日本語で読めるものを中心に - Webデザインのリンク集 | lush life*
:: Love & Design ::