ウェブの画面設計に使えるまとめ - DesignWalker
ウノウラボ Unoh Labs: CSSによるデザインワークと相性のよいHTMLって？
yamazakiです。最近だいぶあたたかくなってきましたね。おかげで日中眠くて仕方ないわけですがいかがお過ごしでしょうか。 ウノウに入る以前も含めてそれなりに長いことHTMLとCSSを書いてきたわけですが、今回は試みに、「だいたいこういうところに気を使われたHTMLだと、CSSでのデザイン適用やレイアウトがやりやすいな」というこれまでの経験則を簡単ですがまとめてみたいと思います。 まあ、このあたりはCSS書く人とHTML書く人の間でちゃんとルールを決めておけばいいだけの話なので、そもそも何の役に立つのか疑問といえば疑問ですが（笑 たとえばユーザがCSSを書いてスキンを作れるようなサービスを作る際、どういったHTMLにするかを決める、みたいな時には少し参考になる、かもしれません。 ID、クラスを適切に割り振って、要素がCSS側から一意に特定できるように たとえばグローバルナビゲーションとカ
プログラマー的デザイン勉強法：UX ～ユーザーエクスペリエンス～：オルタナティブ・ブログ
プログラム言語であればどの言語でも習得出来、どんなOSでも使いこなし、データベースだって勉強すればマニアックに最適化出来るプログラマーですがいざデザインとなると「いやぁセンスないから」って感じだと思います。 プログラムは感性で書く物では無いので（私は感性で書いてますがw）いざ右脳を利用する作業になると途端に受け付けなくなってしまいます。 ですがサイト全体ではなくとも、一部にキラリと光るデザインがあるとお客さんに喜ばれる物です。少し位のバグも許してくれるでしょう（もちろん自己責任でお願いします。） デザインの主にわけて、構成、色使い、動きに分けられると思いますが、それぞれどのようにしてテクを研くか私の方法を書いてみます。 1.構成 デザインが良いとされているサイトをとにかく沢山見る。沢山見ることによって目が越えてくるのでアイデアも思い浮かびやすくなります。自分の気に入ったデザインを見つけたら
聴く耳を持たない(片方しか) - 2007-08-01
はじめに 私はイラスト作成過程の動画を見るのが好きで、サブアカウントのブックマークを利用して、そういった類のものを集めています。 Rimo用にイラスト作成過程動画を収集しているよ コンセプトとしては、ブックマークしたものをあとで Rimoでダラ見するためのもの、ですので基本的には YouTube にある動画を中心にブックマークしています。 ただ、世界的にはシェアが大きい YouTube ですが、国内で最もホットな動画共有サービスというとやはり ニコニコ動画 なわけです。私もよく利用していますし、面白い動画もたくさん投稿されているので、Rimoで見ることはできませんけれども、同じようにブックマークしています。 ……で、話は変わりますが、最近 個人的にマイブームなのがドット絵です。 こんな感じで、ちょこちょこと作っています。 ただ、制作していてもなかなか巧くいかないなー、とか、もっと上手に描き
Tartan Designer - Tartan Maker - Tartan Background pattern generator
Warning: Undefined array key "page" in /home/mhd-01/www.tartanmaker.com/htdocs/modules/functions.php on line 5 Fatal error: Uncaught Error: Undefined constant "INACTIVE_USER" in /home/mhd-01/www.tartanmaker.com/htdocs/modules/authentication.php:5 Stack trace: #0 /home/mhd-01/www.tartanmaker.com/htdocs/sg_require.php(9): require_once() #1 /home/mhd-01/www.tartanmaker.com/htdocs/modules/user.php(5):
ウェブ製作に便利な９のFirefox拡張機能 | Google Mania - グーグルの便利な使い方
ウェブ製作に便利な９のFirefox拡張機能 管理人 @ 7月 5日 08:51am Firefox Deziner Folioの9 Essential Firefox Extensions for all Web Developersというエントリーで、ウェブ製作者向けのFirefox拡張機能が紹介されていたので、自分のためにも簡単に訳してみました。 1. Firebug Firebugを使えば、あらゆる Web ページの CSS、HTML、および JavaScript をリアルタイムに編集、デバッグ、モニタすることができます。また、発見したバグを知らせてくれるので、自分でエラーコードを探す手間が省けます。限定したサイトのみにfirebugを動作させるようにカスタマイズし、プレビューしたサイトに対して、on the flyでＣＳＳを編集することもできます。 2. MeasureIt ウェ
正しく、早く、美しいコーディングを実現するために踏むべき5つのステップ::::::STOPN' LISTEN::::::to the silence:::::::
免責事項：本サイトに含まれる情報は、一般的な情報提供のみを目的としています。情報はスペシャルベストによって提供され、当社は情報を最新かつ正確に保つよう努力しますが、いかなる目的においても、ウェブサイトまたはウェブサイトに含まれる情報、製品、サービス、関連グラフィックスに関する完全性、正確性、信頼性、適合性、利用可能性について、明示または黙示を問わずいかなる表明または保証も行いません。従って、これらの情報に依拠することは、あくまでもお客様ご自身の責任において行われるものとします。 当社は、当ウェブサイトのご利用に起因するいかなる損害についても責任を負いません。 本ウェブサイトから、スペシャルベストの管理下にない他のウェブサイトへリンクすることができます。当社は、それらのサイトの性質、内容および利用可能性を管理することはできません。リンクは必ずしも推奨するものではありませんし、リンク先で述べら
デザイナの仕事の進め方について（非デザイナ向け） (ZEROBASE BLOG)
日々「デザインという仕事への理解」を啓蒙している。今日はデザイナーでない方々に参考になりそうな記事を見つけたので紹介する。→あるデザイナーが一つのロゴを作り上げるまでのデザインプロセス | P O P * P O P このデザイナーさんは「デザインの仕事は2時間で終わるか5日かかるかわからない」と言っていますがそのとおりなのでしょう。クリエイティブな仕事ではありますが、なかなか大変そうです・・・。 やり方の個人差はかなり大きいと思うが、「デザインの仕事は2時間で終わるか5日かかるかわからない」は共通だと思う。 ゼロベース社の場合は、後述のように時間をかけているので、時間軸が違うが。「デザインの仕事は1週間で終わるか3ヶ月かかるかわからない」といったところだ。 例えばゼロベースでは「ロゴをデザインしてもらいたいんだけど」という依頼が来た時点（オリエン）で、「なぜ、するのか？」「なぜ、いまな
「実践 Web Standards Design」という本を書きました - lucky bag
お知らせというか宣伝。九天社より出版される「実践 Web Standards Design - Web 標準の基本と CSS レイアウト &Tips」の執筆をさせて頂きました。3ping.org の wu さんと hxxk.jp の真琴さんとの共著です。2007 年 2 月 23 日頃 から書店に並び始めるみたいです。Amazon にはまだ載っていないようです。ちなみに、カバーデザインを見せて頂いた瞬間から執筆者の間では通称「ホップ本」（真琴さん命名）ということになってます。たぶん。 書籍名 : 実践 Web Standards Design - Web 標準の基本と CSS レイアウト &Tips ページ数 : 436 ページ 定価 : 3,200 円 最初に wu さんから共著のお誘いを頂いたのが 2006 年の 5 月頃。6 月に行った打ち合わせ後の著者 3 人での飲みは、気のせいか
CSSレイアウトが崩れている時に試す10の処方箋::::::STOPN' LISTEN::::::to the silence:::::::
お探しのページは「すでに削除されている」、「アクセスしたアドレスが異なっている」などの理由で見つかりませんでした。以下でキーワードやカテゴリーから記事を探すことができます。
ツール＆ダウンロード：Web Developer 1.0.2 日本語版 - インフォアクシア
Web Developer 日本語版サポート移管のお知らせ これまで当サイトにて、日本語版のダウンロード配布およびサポートを行ってきた『Web Developer』ですが、2008年3月より開発担当エンジニアの個人サイトへ全てを移管させていただくことになりました。新しいサイトのURLは、以下の通りです。 ミナトラボ：Web Developer 日本語版 『Web Developer』は、開発者である米国のChris Pederick氏に協力しながら、これからも上記サイトにて日本語版へのローカライズおよびユーザーサポートを継続していきます。今後とも『Web Developer 日本語版』をよろしくお願いいたします。
人力検索はてな - 入力フォームのデザインがすばらしいページを教えてください。 派手さや装飾ではなく、使いやすさ、見やすさなど機能美優先でお願いします。 海外のサイトでも結構で
入力フォームのデザインがすばらしいページを教えてください。 派手さや装飾ではなく、使いやすさ、見やすさなど機能美優先でお願いします。 海外のサイトでも結構です。
窓の杜 - 【NEWS】透明感のある水晶のような美しいボタン画像を手軽に作成できる「AquaMaker」
透明感のある水晶のような美しいボタン画像を手軽に作成できるソフト「AquaMaker」v1.03が、9月24日に公開された。Windows 98/Me/2000/XPに対応するフリーソフトで、現在作者のホームページからダウンロードできる。 「AquaMaker」は、任意の文字や画像入りのボタン画像を作成できるソフト。ボタン内の文字や画像には、それ自体を水面に投影したかのような影のエフェクトをつけることが可能で、ボタン本体がもつ透明感のあるデザインや、水晶のような光沢感とあいまって美しい。たとえば、ホームページのタイトルロゴやリンクボタンなどを作成したい人にお勧め。 本ソフトの画面は2ペイン構成で、左ペインでボタン画像の設定を行う。入力・変更した設定は、そのつど右側のプレビュー画面に反映される仕組み。 まずはボタン画像の形状を、円形・四角形・楕円形から選択し、次に縦横のピクセルサイズを指定し
成分解析 - 「コトバ」から「色」、調合します。
原色大辞典とは 原色大辞典は1997年にオープンしたネットの色見本サイトです。 9種類の色見本と色に関する各種サービスから構成されています。 色見本コンテンツは ブラウザで定義されているHTMLカラーネーム、 日本の伝統色、 世界の伝統色、 Webセーフカラー、 パステルカラー、 ビビッドカラー、 モノトーン、 地下鉄のシンボルカラー、 国鉄制定の塗装色 の9つから構成され、特に日本の伝統色は古来伝わる先人の色彩感覚を現代に伝えるものとして多くの方々から支持をいただいています。 文字列と背景色の組み合わせを試せる配色大辞典、 規則性のある組み合わせから色を選べる配色パターン。 色見本の他にも、今日のラッキーカラー、 コトバから色を解析して調合する成分解析、 ストライプを生成するストライプメーカー、 グラデーションを生成するグラデーションメーカー、 あなたの好きな色と色を調合する色調合、 サ
日本語ちまちまボタンの作り方すなわちボタンメーカーの使い方を手取り足取り説明するよ - シナトラ千代子
『成城トランスカレッジ』のchikiさん（id:seijotcp）に紹介していただいたボタン（上に並んでるもの）はベースをここで作りました。 ○ちまちまボタンメーカー(クローン) :: UnderDone （http://underdone.net/btmaker/） たしか「みかちゃんフォント」を使ったと思いますが、字数が多くてうまくおさまらなくてあとでグラフィックソフトで調整してます。たぶん右左でフォントが違います。 というわけで、今回はちまちまボタンの作り方＆ボタンメーカーの簡単な説明を。 「ボタンていったいなんじゃあぁあぁ！」 というひとに説明しますと、このサイトの、バナーの下に並んでる四角いアイコンみたいなのがボタンです。 （←自由に配布してかまいません*1。） 画像ファイルでできてます。いろんな日記＆ブログで見かけたことがあると思いますが、「ボタンメーカー」を使うと、Webサイ
あずきフォント
あずきフォント /サンプル /縦書きサンプル オリジナルの手書きフォントです。 「マジメすぎず、可愛すぎないフォント」 という地味な仕上がりになりました。 アンチエイリアス推奨です。 細い字なのでロゴ等には向いてないかもしれませんが、 気に入りましたら、”利用の約束”に沿ってご使用下さい。 収録内容 英数字/記号/ひらがな/カタカナ ギリシャ文字/ロシア文字/各種記号等 JIS第一水準漢字/JIS第二水準漢字/IBM拡張漢字 罫線部分には絵文字+αが入っています。 *n e w !* 07/02/21「あずきフォントLP」ver 1.00 あずきフォントL（絵文字なし版）のプロポーショナル版です。 07/01/04「あずきフォントP」ver 1.00 あずきフォントのプロポーショナル版です。（サンプル） 古いバージョンがいいという方はこちら。 06/03/1
窓の杜 - 【NEWS】文字を1字ずつ四角い枠で囲んだシンプルなロゴ画像を作成「爆割」
文字を1字ずつ四角い枠で囲んだシンプルなロゴ画像を作成できるソフト「爆割」v1.00が、4日に公開された。Windows 98以降に対応するフリーソフトで、編集部にてWindows XPで動作を確認した。現在作者のホームページからダウンロードできる。 「爆割」は、文字を1字ずつ四角い枠で囲んだロゴ画像を作成し、BMP形式で保存できるソフト。ロゴの文字は横書きで、枠と文字の大きさは1文字ごとに変えられるうえ、枠の内側を塗りつぶし、文字を白抜きにすることも可能。シンプルでかっこいいロゴやボタンを素早く作成できて便利。 ロゴを作成するには、まずロゴ全体で使うフォントの種類や色、背景色、枠の太さ、文字と枠の間隔を指定しよう。次に、ロゴとして表示したい文字を1枠分入力し、その枠のサイズを数値指定する。このとき、文字入力欄に文字列を入れれば、2文字以上を1つの枠で囲むことも可能。また、枠内を塗りつぶし
フリーで使えるミニピクセルアイコン集 - ネタフル
Free mini pixel iconsというエントリーより。 Vitaly Friedman has a round-up of places you can get free mini pixel icons. Lifehackerで、フリーで使える小さいピクセルのアイコン集を集めているサイトが紹介されていました。 Vitaly Friedman’s Notebook: Icons Round-Up: Free Mini Pixel Iconsがそれです。 以下のようなサイトが紹介されています。 ・Mini Pixel Icons ・Sweetie Icons ・FamFamFam ・The Iconfactory ・Iconbuffet.com ・Symbole, Buttons und Icons zum Download ・graphicPUSH Blog Icon Pack
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://texturez.com/
M+ と IPAフォントの合成フォント配布 - きりんシステム ダイアリー(2006-03-15)