ソースが公開されているcss小技11エントリーまとめ - かちびと.net
この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。 cssを使った小技テクニックの エントリーが様々なブログで 公開されていますが、必要な時に 探すのが面倒なのでまとめます。 ソースコードを公開している記事に 絞ってまとめています。 CSSで実装する、ちょっと凝ったパンくずリスト cssでパンくずをデザインする方法とサンプル CSSで実装するちょっと凝ったパンくずリスト CSS（スタイルシート）でbodyに設定しておくと便利な5つのポイント ユーザービリティ（見易さ）を考慮したbodyに設定する。CSS HappyLifeさんも 記事を参考に別コードを公開。 CSS（スタイルシート）でbodyに設定しておくと便利な5つのポイント CSSだけでフレームを作るテクニック frameタグを使用しないで擬似フレームを作成。I
ミニマリズムから学ぶウェブデザインのセオリー
伝えるべきメッセージを明確に伝え、余分なものを取り除くミニマリズムから学ぶウェブデザインのセオリーを紹介します。 Minimalism in Web Design: A Guide [ad#ad-2] ミニマルなウェブデザインってどういうの？ という方には、下記の記事もおすすめです。 ミニマルなウェブデザインで使用される特徴的な12のエレメント 下記は各ポイントを意訳したものです。 はじめに 1. ミニマリズムの概念 2. 取り除く美学 3. よりスマートなカラー 4. タイポグラフィ 5. レイアウト構造 6. ネガティブスペース 7. バランス 何を学ぶべきか はじめに ミニマリズムは多くの異なるコンテクストで話し合われるワードです。それがライフスタイル、あるいは芸術スタイルにかかわらず、なにかがミニマリズムであるということはいろいろな意味をとることができます。 ウェブデザインにおいて
ユーザーの体験をデザインしていく――田中耕一郎の辣腕 | エキサイト ウェブアド タイムス
株式会社Projector 田中耕一郎さん：たなか・こういちろうさん 株式会社Projector代表 クリエイティブディレクター 1973年生まれ。慶應義塾大学環境情報学部卒。広告制作会社TYOを経て、2004年にProjectorを設立。CUPNOODLE FREEDOM PROJECT、BEYES表参道ヒルズ店インタラクティブインスタレーションなど、独創的なインタラクティブプロジェクトで広く注目を集める。カンヌ国際広告祭金賞、New York One Show銀賞、東京インタラクティブ・アド・アワードグランプリなど、国内外の広告賞受賞歴も多数。 インタビュー 佐々木正孝：ささき・まさたか 1972年秋田県生まれ。ライター/編集。『このブログがすごい！』（宝島社）2005、2006選考委員、『このWeb2.0がすごい！』（日経BP社）2007選考委員を務める。 構成 有限会社ノオト 2
case:MobileDesign! モバイルサイトのデザイン紹介ブログ
case:MobileDesign! モバイルサイトのデザイン紹介ブログ 引っ越ししました。 http://case-mobile-design.com/ case:MobileDesign! モバイルサイトのデザイン紹介ブログ > 2010-03-08 >
フッターやヘッダー、ナビゲーションなど、パーツ別のデザイン例のまとめ - かちびと.net
この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。 ヘッダーだけ、フッターだけみたい、 というように、部分的にデザインの 例を見たいことが多いのでそんな 記事をまとめました。まとめのまとめ です。少し重いかもしれません。 主にブログデザインになってしまいますが、ヘッダー、フッター、ナビゲーション、フォームデザインなどなど部分的なデザインを参考にしたいとこに役立つまとめ記事を備忘録としてまとめています。 ヘッダーデザイン ユーザーにインパクトを与えるヘッダー。派手なデザインが多めです。 30 Creative Website Headers クリエイティブなヘッダーのデザインを30個ほど。凄いのばっかり。 30 Creative Website Headers 27 Stunning Examples of Heade
index.php?search=flowers
Free PowerPoint templates to create outstanding presentations! Design elegant presentations with our free slides for Microsoft PowerPoint and Google Slides. Achieve the perfect design, every time with our exclusive templates, infographics, icons, charts, and diagrams. Charts and diagramsPresent your facts and figures effectively with our free charts and diagrams for PowerPoint and Google slides. Y
MdN Design｜総合情報サイト
第2回「Coming Soonページをデザインする」 2009年11月26日 翻訳元サイト：Smashing Magazine http://www.smashingmagazine.com/ 原文：Designing “Coming Soon” Pages http://www.smashingmagazine.com/2009/11/10/designing-coming-soon-pages/ 翻訳：中野恵美子 ※本記事は「Smashing Magazine」様より許可を得て翻訳、掲載しています ドメインを購入したが、まだWebサイトをローンチしていない時、何をすべきか決めるのは、いつでもちょっとした難問だ。ドメイン管理団体やWebホスティング会社のデフォルトページをそのまま表示させておくのは、プロらしいとは言えない。とはいえ、Webサイト制作に本格的に取り組むべき段階では、汎用的な
CSSの実装状況で変わるボックスのデザイン方法
Web制作において、対応しなくてはいけないブラウザの中には、未だしぶとくIE6が残っています。IE6が2001年に登場したことを考えると、もう8年もその時代の「縛り」を(健気に)守りながら作っていることになるんですね。 いま良く使われているCSSのテクニックも、ほとんどはこの「縛り」の範囲内で有効な手法なわけですから、突然2001年にタイムスリップしてサイトを作る事になったとしても、今も昔も変わらない１つの古文書に従えばいいので、きっと活躍できます。 しかしたまらん、流石に疲れた。 ボックスひとつができること CSSでは、文書を構成する各要素は、ボックスという矩形領域に置きかえられ、それらの持つプロパティを操作して装飾します。つまり、ボックスはページデザインを構成する最小単位と言えるわけですね。 そこで今回は、最小単位となる1つのボックスに対して、どのような装飾手法が有効かという点を、CS
誕生犬のしつけ
news 2024/08/30 興味があるフラッシュモブ宮崎 フラッシュモブ宮崎というのを見て、なるほどと思う事が多かったです。こういうサプライズがあるというのは何となくは知っていた…
携帯サイト（html）の制作に入る前に確認しておきたいチェック項目 │ これからゆっくり考L +α
「デザインは素敵なんだけど、携帯でこれはちょっとできないなー」とか、「無理ではないけどできれば避けておいた方がいいよなー」っていうデザインがあがってくることが多い今日この頃。 モバイルコーディングをやり慣れている人じゃないとモバイルでできることできないこと、cssを使わないと実現できないこと、table使わないと実現できないこと、などが分かりにくいと思うので当然だとは思うのですが。 ですが、知っているのと知らないのとでは工数がかなり違ってきます。 一旦デザインして、コーダーにそれを見せて「ココとココとココは実現不可能。やり直してください。」で差し戻され、デザインをやり直してってなると、デザインも2度手間、デザインをチェックして無理な項目を洗い出すコーダーにも余計な手間がかかります。 今回洗いだした項目は、なんせ自分がコーダーなので、コーダーがデザインファイルをもらった時にバーッと見てチェッ
ホントに助かるフリーのcssジェネレーターいろいろ - かちびと.net
この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。 使えるcssのオンラインサービスが 50個、Speckyboyで記事にされていた のでよさ気なものをいくつかご紹介します。 全部良さそうなので気になる方はぜひ 記事元を訪れてみてください。 日本語のテキストで作成できるｃｓｓメニュージェネレーターは本当に助かります。 Grid Designer 2 細かい設定を行えてすぐに反映されるグリッドシステム。 Grid Designer 2 nP: Grid Generator グリッドを作成すると、ｃｓｓのソースも出してくれます。 nP: Grid Generator Dynamic 4 Column Layout Generator これ面白い。4カラム専用のレイアウトジェネレーター。設定と同時に反映、 ｃｓｓもＤＬ（コ
たのしいchumby：第4回 chumbyのwidgetを作ってみよう｜gihyo.jp … 技術評論社
shibuya.chumbiesのoverlastです。お久しぶりです！ ようやく国内でのchumbyの販売が始まりますね！ これから発売されるchumbyはインターナショナル版と呼ばれるもので、アップデートを経て日本語フォントを利用できるようになるみたいです。 僕らが買ったchumbyでも日本語フォントを使えたら、さらにいろいろできて楽しいとはず。何とかなって欲しいです。 図1 今回のテーマは「最も簡単な方法でchumbyのwidgetを作ってみる」です。 前回は、簡単な操作を繰り返すことでchumbyをハックしましたが、いよいよwidgetを作ります。chumbyはユーザが作成したwidgetが動くのですから、試さないと損です。 widgetはActionScript 2.0で実装していきます。ActionScriptと聞いただけで難しそうに感じる知れませんが、その心配はいりません。こ
モバイルサイトを作るときに参考になるサイト – creamu
Mashableで、モバイルサイトを作るときに参考になるサイトが紹介されています。 いくつかご紹介しますね。 Mippin RSSを使ってサイトのモバイル版が作れるサービス WPtouch WordPressをiPhoneやAndroid携帯に対応させてくれるプラグイン Mobify デバイスごとの表示をリアルタイムに確認しながらCSSを編集できる。A List Apartがこれで作られた iPhone Compatible CSS Layouts iPhoneに対応したCSSレイアウトを配布 Smashing Magazines’s Mobile Design Showcase 9月にSmashing Magazineがまとめた、iPhoneデザインまとめ CSSiPhone iPhoneサイトのCSSギャラリー A List Apartの例はとてもいいですね。 一度見てみてください。
丸の内を楽しむ、今を届けるポータルサイト
ディズニーの物語をテーマにした、よろこびに満ちたホリデーシーズン！丸の内エリアで心ときめく特別な体験を『“MARUNOUCHI BRIGHT HOLIDAY 2025「Disney JOYFUL MOMENTS」”』
サイズの大きい画像を背景にする際のCSSテクニック:phpspot開発日誌
How to: CSS Large Background Since I posted the huge collection of Large Background Websites, I received several email requests on how to make a large background site with CSS. サイズの大きい画像を背景にする際のCSSテクニック。 大きい背景画像を使っても、解像度の高いディスプレイだと次のように画像が切れてしまいます。 ということで、次のように、解像度の高いディスプレイでもOKなように作ろうという話。 この際、適切なCSSを設定する必要があって、その例も紹介されています。 更に全体の背景を画像にするような例も紹介されてます。 デモ用の圧縮パッケージも一括でダウンロード可能みたい。 関連エントリ 巨大な背景画像を使って
単調なウェブサイトのデザインに手を加えてクオリティをアップするチュートリアル
ウェブサイトのデザインに、ビジュアルエレメントを追加したり、細部をブラッシュアップしたりしてクオリティをアップするPhotoshopのチュートリアルをPsdtuts+から紹介します。
ウェブデザインのエレメントを今風にデザインするPhotoshopのチュートリアル集
最近のウェブデザインでよく使用されているエレメントの制作方法を1ステップずつ分かりやすく解説しているPhotoshopのチュートリアルをCarsonifiedから紹介します。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
"design"と笑い男 - Keep Crazy;shi3zの日記
http://www.designwalker.com/2009/03/twitter-bg.html
ちょっとサイトをステキにするCSSの基本 (1/3)：いまさら聞けないCSS／スタイルシート入門（1） - ＠IT