TRANS [hatena] - 印刷用CSSをまとめてみた。
以前、絵文禄のことのはさんのところで、サイトの横幅を640ピクセルにする理由――統計と現状に基づく結論というエントリーがあった。それから、ちょっと印刷用CSSに興味を持って、色々と調べてみたり、自分で書いてみたりした。そのまとめ。 ちなみに、#naviがグローバルナビゲーション、#primaryがメインコンテンツ、#secondaryがサブメニュー、#footerがフッター。 とりあえず、最低限やっておいたほうがよいこと。 body { font-size: 12pt; color: #000000; background-color: #FFFFFF; } a:link, a:visited { text-decoration: underline; color: #000000; } img { border: 0; } 印刷で読まれることを勘案するのなら、font-sizeはある程度
![TRANS [hatena] - 印刷用CSSをまとめてみた。](https://cdn-ak-scissors.b.st-hatena.com/image/square/860579fb9ea6fc896c86331cc2f3af60ddeb6ef1/height=288;version=1;width=512/https%3A%2F%2Fogimage.blog.st-hatena.com%2F6435988827676522384%2F6435988827676523499%2F1448268251)
デザインセンスがある人がwebサイトを作成する際に参考にしているサイト | i d e a * i d e a
ドットインストール代表のライフハックブログ
Web 2.0のデザインパターン | S i M P L E * S i M P L E
Web 2.0のデザインパターン November 24, 2006 12:15 PM written by Gen Taguchi メモ書きにてエントリー。訳しただけだけど。 Pixel Acresにて「The visual design of Web 2.0」という記事があがっています。Web 2.0っぽいサイトのデザインをパターン化したものです。見た目がすべてではありませんが、とっても重要なのは間違いないです（「見た目いけてないから他のサイト行こうっと」はよくありますよね・・・）。 さて、ではポイントをば。 ■ グレーの次はグリーンだ！ 明るいグリーンが流行です。下記サイトをみてもそうですよね。 ■ 角丸命！ Rounded Cornersは新しい標準す。 ■ 「無料！」印がキーワード まずはトライアルができるのがWeb 2.0の特徴。無料の文字もいれときましょう。 ■ は？素材集す
窓の杜 - 【NEWS】Windowsのビジュアルスタイルを黒基調の“Zune”風に「Zune Desktop Theme」
米Microsoft Corporationは、北米市場で11月14日に発売される同社製ポータブルプレイヤー“Zune”をモチーフにしたデザインのデスクトップテーマ「Zune Desktop Theme」を公開した。Windows XPに対応するフリーソフトで、現在“Zune”の専用ページからダウンロードできる。 「Zune Desktop Theme」は、メタリックブラックを基調としたロックを感じさせるデスクトップテーマ。インストールすると壁紙が野外ロックフェスの観客席を写した写真に変更されるほか、スタートメニューやタスクバー、ウィンドウのタイトルバーなどが光沢のある黒を基調としたデザインに変更される。 【著作権者】Microsoft Corporation 【対応OS】Windows XP 【ソフト種別】フリーソフト 【バージョン】- □Zune.net | Zune Home Pag
新しい千葉県ロゴの作成について
報道広報課トップページへ 新しい千葉県ロゴの作成について 平成１８年１１月２日 千葉県総合企画部報道広報課 電話. 043−223−2252 様々な魅力を持ちながらも、県全体としては垢抜けないなどと言われることもあった千葉県のイメージの一新を目指して、統一的に活用する新しいロゴを作成しました。 新しいロゴは、多様な魅力が集約した“ちば”の文字を使って「洗練」されたデザインとしました。 今後、ＰＲポスターや各種広報刊行物などにロゴを活用し、千葉県を全国に発信します。 ・基本パターンとして、「横書き」「縦書き」があり、 それぞれに「白地に色文字」「色地に白抜き文字」がある。 また、文字バリエーションとして、基本＋ローマ字（CHIBA）併記のものがある。 ・色文字・色地は、黒を基本とし、彩色も可。 ２．ロゴについて １）ロゴ制作の目的 千葉県は、首都圏に位置する利便性や先進
XPがなんとなくVista風になる隠しテーマ「Royale Noir」 - GIGAZINE
Windows XP Media Center Editionに搭載されているテーマは普通のXPと違っており、「Royale」と呼ばれている特殊仕様。ちょっとだけかっこよくなっていたりするわけですが、さらにそれらのテーマの中に隠しテーマ（一応マイクロソフトが作るには作ったが結局正式採用は取りやめたバージョン）というのが存在しており、今回の「Royale Noir」がまさにそれです。 ダウンロードは以下から。 どちらも同じです。 royale_noir.rar - Hidden XP Theme... RapidShare:You want to download royale_noir.rar ダウンロードして解凍後、Windowsフォルダ→Resourcesフォルダ→Themesフォルダと進み、中に解凍して出てくる「royalenoir」フォルダを放り込んで、中にある「luna.msst
いろいろな用途で使えるミニアイコンあれこれ - GIGAZINE
通常のアイコンよりも小さなサイズの使いやすいミニアイコンを集める必要性に迫られたので、いろいろとリストアップしてみました。 ブログやWiki、通常のサイト作成やFlash、PowerPointのプレゼンテーションやソフトウェアのボタンなどなど、いろいろな場面で役に立つはず。ボタンの画像を違うものにするだけでだけでも、割と雰囲気がガラリと変わるのでオススメです。 リスト一覧は以下の通り。 Mini Pixel Icons（ブログやCMS用のアイコン、ユーザーアイコンなどが多く、とてもカラフル） Mini Icons | urlgreyhot（12ピクセル四方という極めて小さなアイコンがいろいろあります。グレイスケールのアイコンは加工しやすいので、好みのアイコン素材にすることも可能） Bullet Madness - free bullets project at Stylegala（200個
リンク先のプレビューを吹き出し方式のポップアップでサムネイル表示「WebSnapr」:phpspot開発日誌
WebSnapr - Preview Bubble Javascript The WebSnapr Preview Bubble is a simple, unobtrusive script used to display an overlay bubble showing a hyperlink target thumbnail using WebSnapr. It's a snap to setup and works on all modern browsers. リンク先のプレビューを吹き出し方式のポップアップでサムネイル表示「WebSnapr」。 単純にポップアップするだけ、よりもちょっとオシャレな効果が得られますね。 使い方 previewbubble.zip をダウンロード previewbubble.js の var bubbleImagePath = '/images/
「OK」と「キャンセル」、どちらが有効か ― ＠IT
ユーザビリティのヒント（最終回） 「OK」と「キャンセル」、どちらが有効か 「情報表現の最適化」 ソシオメディア 上野 学 2006/10/20 デスクトップのメモ帳を新規に開いて、メモを書き、ウィンドウを閉じようとすると、「変更を保存しますか？」というメッセージダイアログが表示されます。ユーザーにしてみれば、「新しいメモをいま書いたところなのに、なぜ『変更』なんだ？」と思うでしょう（本文から） 英語や、日本語の横書きでは、情報は大きく上から下に、左から右に展開していきます。ユーザーは画面（ウィンドウ内）の左上から右下に向かって意識を推移させて、そこで表現されている情報を取得していきます。 実際にはユーザーは、まず画面中央付近に視線をやり、そして全体をざっと見渡してから、重要と思われる個所に注目していくようです。ひとたび内容を読もうとか、入力フィールドを埋めていこうと決めたら、当然、上から
スタイルシートを分けて管理する方法をまとめる - 2xup.org
comment 2006-10-17T21:15:00+09:00 お好みの言語が英語で無い場合は、日本語でどうぞ。 In this PDF file, the order of the set format rule and property's appearing was announced. This time, the method of separately managing the CSS file used on the site is announced. Why is CSS divided? I think that most reasons are the improvements of the work efficiency. The access to the revision part becomes early They are combined and co
CSSでクールなタブUIを作成するサンプル:phpspot開発日誌
OSResources - How to create CSS overlapping tabs? Sometimes simulating a real desktop interface for your web application can be a real challenge, especially when dealing with tabs. CSSでクールなタブUIを作成するサンプル。 次のようなタブUIを作ることが出来ます。 サンプルのCSSを定義しておけば、後は次のようにシンプルなHTMLをコーディングするだけで上記画像のようなタブUIが作れます。 HTMLもクリーン。 <ul class="obtabs"> <li class="first"><span><a href="#">Jack</a></span></li> <li><span><a class="new
Webデザイン エンジニアリング第24回 色コンプレックスを克服する方法：ITpro
実は多くの人が，「色」の扱い方――色の選び方，色の作り方，色の使い方など――を不得意に感じているようです。かくいう私も決して得意ではありません。そこで今回は，そういった色コンプレックスを克服する方法を取り上げてみましょう。 ▼原因を知る（自分に能力がないわけではないと知る） 全くの個人的意見ですが，多くの人が色にコンプレックスを持つ理由は，小学校教育にあるのではないかと疑っています。もう少し具体的に書くと，「12色の絵の具」です。 中でも「緑＝ビリジアン」が一番罪深い存在だと私は思っています。誰でも，野外の風景を描かされた記憶はあるでしょう。しかし，木々の緑や小さな野の花を描こうとしたときに，ある「壁」にぶつかったことはないでしょうか。 それは，自分の見ている「緑」と，パレットで作っている「緑」とのギャップです。ビリジアンに様々な色を混ぜ合わせて試してみるのですが，自然界の「緑」には程遠い
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://direct.motorola.com/hellomoto/colors/
企業ロゴに隠された秘密いろいろ | IDEA*IDEA
BMW (South Africa). Defining innovation.
i d e a * i d e a - 世界のクリエイティブな広告まとめ（続編）
サムネイルをCOOLにポップアップ表示 - Highslide JS | caramel*vanilla
80種類のフリーのテンプレート配布とチュートリアルサイト「Zymic」:phpspot開発日誌
ノキア aeon 全面ディスプレイコンセプト携帯 - Engadget Japanese
Color Palette Generator