SASSIENCE ～ 世界が嫉妬するCSSへSASSIENCE ～ 世界が嫉妬するCSSへ
え！Photoshop？って見間違うほどのUIを備えたCSSジェネレーター -LayerStyles
Photoshopのレイヤースタイルパネルを模したインターフェイスで、ドロップシャドウや角丸やグラデーションなどを生成できるCSSジェネレーターを紹介します。
WEBデザインに便利なCSSフレームワークのまとめ「Choosing The Best CSS Framework: A Complete Guide」
TOP > WebDesign > WEBデザインに便利なCSSフレームワークのまとめ「Choosing The Best CSS Framework: A Complete Guide」 WEBデザインと言えば、HTML5やCSS3が最近では話題を集めていますが、まだまだ現場ではXHTML+CSSという形が主流だと思います。今回紹介するのは、WEBデザインに便利なCSSフレームワークのまとめたエントリー「Choosing The Best CSS Framework: A Complete Guide」です。 52framework 様々なるCSSフレームワークが集められていますが、今日はその中からいくつかピックアップして紹介したいと思います。 詳しくは以下 ■YAML スタンダードなカラムを簡単に実現するCSSフレームワーク。 ■960 Grid System かなり有名なCS
－すぐに使えるCSSデザインテクニック 第1回 - MdN Design Interactive
CSSレイアウトを始める際、あらかじめ用意してある独自のテンプレートを利用したり、過去に作成したコードをコピー＆ペーストして流用しているユーザー は多いのではないだろうか。一般的なブログのようにページ構成が限定される場合は問題ないが、複雑なレイアウト向けのカスタマイズや各種ブラウザ向けの最適化は悩みの種だ。 そこで、今回はCSSフレームワークを利用し、段組みレイアウトを実践する方法について解説を行う。グループでコーディングする場合にもclass名など の命名則をある程度ルール化できることから、コードの可読性が高められる。コーディングのミスや表示上の不具合を軽減するだけでなく、作業を効率化して、 意図したデザインの実現に注力しよう。 制作・文＝國分 亨（こくぶん・とおる） Webサイト構築にかかわるディレクションやデザイン、コーディング、Flash制作など、福島県郡山市を拠点にフリーランスの
[CSS]初心者にも分かりやすいスタイルシートのチュートリアル
スタイルシートの初心者にも分かりやすく、各要素に的確なマークアップを行い、ワイヤーフレームをビジュアル化するチュートリアルをSoh Tanakaから紹介します。 Styling Post Headings That Stick Out demo 下記のチュートリアルでは、見出し、日付、カテゴリ、タグを含むブログのヘッダをステップに分けて実装していきます。 Step 1. Wireframe – HTML ワイヤーフレームに基づいて、「ヘッダ」と「コンテンツ」をdiv要素で配置します。 <textarea name="code" class="html" cols="60" rows="5"> <div class="post"> <div class="postheader"> <!--ヘッダ--> </div> <!--コンテンツ--> </div> </textarea>
cssのテクニックなどを学びたい時に見ておきたい12サイト - かちびと.net
cssが苦手で嫌いなので 好きになろうと思い、勉強に なりそうなサイトを国内外で 選んで絞ってみました。 同じ思いをしている方とシェア したいと思ったので記事にします。 リファレンスサイトは今回は割愛しました。勉強するなら抑えて当たり前ですしね。国内外合わせて11サイトとおまけが1サイトあります。まずは国内サイトから。 CSS HappyLife 個人的に国内でcssといえばCSS HappyLifeさん思い出します。基本から応用まで幅広く情報を配信。 CSS HappyLife CSS-EBLOG ほぼcss中心に情報を配信してくれています。こちらもかなり勉強になるサイト。サイト自体も見やすいですし、cssで困った時には必ず訪れたいサイトです。 CSS-EBLOG CSS Lecture cssで出来るテクニックを公開してくれています。デモページを用意してくれるのが凄く嬉しい。親切で分か
30分でできる！Webサイトを高速化する6大原則 (1/4)
Webサイトを制作するとき、「パフォーマンス」を気にしたことがあるだろうか？ もしまったく気にしたことがないなら、気をつけた方がいい。閲覧に時間のかかる“遅いWebサイト”はユーザーにフラストレーションを与え、閲覧をやめさせてしまう恐れがある。 下記のグラフは、「Simple-Talk」という海外のオンラインメディアで発表されたユーザー調査の結果だ。アンケートページの表示にかかる時間を意図的にコントロールし、表示時間によってユーザーが感じるフラストレーションの違いを調べたものだ。 縦軸がフラストレーション（10段階）、横軸が表示までの時間を表している。1～5秒以内にページが表示された人に比べ、ページ表示までに5秒以上かかった人は2倍以上もフラストレーションを感じている。フラストレーションがあまりに高ければ、せっかく何らかの目的を持って訪れてきたユーザーも待ち切れずにブラウザーを閉じてしまう
【全部無料】 Web制作に役立つオンラインサービスやツール300+ - かちびと.net
Web制作に使えるWebサービスやツールなどが様々なサイトでかなり 紹介されています。便利なものですが、多すぎて混乱するので、 備忘録的にローカルサーバーに入れたWPでリンク集を作っていました。 そろそろ数が落ち着いて来たので多くの方とシェアしたいと思い、公開してみます。 現在330ありますが、追加していく可能性があります。 リンク集は全て無料で使える事を条件に集めていました。英語が苦手な方もいらっしゃいますのでTwitterサービスのまとめ同様、日本語で使い方などを説明してくれているサイトにリンクしています。無い場合は海外サイトにリンクしていますが、その場合はアメリカの国旗をつけてあります。サイトがアメリカのものかは知りませぬ。分かりゃいいんだ、分かりゃ。 無料といえどもライセンスの縛りもありますので自己責任でご利用下さい。 使えるかどうかは個人差が生じますので何とも言えませんが、お役に
CSSの実装状況で変わるボックスのデザイン方法
Web制作において、対応しなくてはいけないブラウザの中には、未だしぶとくIE6が残っています。IE6が2001年に登場したことを考えると、もう8年もその時代の「縛り」を(健気に)守りながら作っていることになるんですね。 いま良く使われているCSSのテクニックも、ほとんどはこの「縛り」の範囲内で有効な手法なわけですから、突然2001年にタイムスリップしてサイトを作る事になったとしても、今も昔も変わらない１つの古文書に従えばいいので、きっと活躍できます。 しかしたまらん、流石に疲れた。 ボックスひとつができること CSSでは、文書を構成する各要素は、ボックスという矩形領域に置きかえられ、それらの持つプロパティを操作して装飾します。つまり、ボックスはページデザインを構成する最小単位と言えるわけですね。 そこで今回は、最小単位となる1つのボックスに対して、どのような装飾手法が有効かという点を、CS
ホントに助かるフリーのcssジェネレーターいろいろ
使えるcssのオンラインサービスが 50個、Speckyboyで記事にされていた のでよさ気なものをいくつかご紹介します。 全部良さそうなので気になる方はぜひ 記事元を訪れてみてください。 日本語のテキストで作成できるｃｓｓメニュージェネレーターは本当に助かります。 Grid Designer 2 細かい設定を行えてすぐに反映されるグリッドシステム。 Grid Designer 2 nP: Grid Generator グリッドを作成すると、ｃｓｓのソースも出してくれます。 nP: Grid Generator Dynamic 4 Column Layout Generator これ面白い。4カラム専用のレイアウトジェネレーター。設定と同時に反映、 ｃｓｓもＤＬ（コピペ）出来ます。 Dynamic 4 Column Layout Generator XHTML/CSS Markup Gen
The portfolio of Bryan Katzel | Design, illustration & stuff to make you smile
Webleed Design is the portfolio site of Bryan Katzel. As a professional designer, Bryan's world revolves around all things "print". His work includes package design, illustration, branding, toy, poster and advertising. Bryan holds a creative position focusing on design and developement for the toy & game market. The position has opened his eyes to package design and the retail toy market. Here are
1ピクセルのずれも許せないWebデザイナのためにResetting Again | エンタープライズ | マイコミジャーナル
CSSがWebページデザインの主要技術になってから、WebデザイナはCSSの振る舞いに頭を抱えなかったことはない。もっとも悩ましいのは、同じCSSでもWebブラウザごとに表示が異なるところにある。なるべく同じ表示を実現しようと、一見すると奇っ怪にみえる設定を加えたり、意味がないような行を加えたり、背景色と同じ色の画像を調整用に追加したり、涙ぐましい努力は後を断たない。 世界中のWebデザイナやフロントエンドデベロッパが同じ悩みを抱えているから、Webブラウザ間の互換性を実現するCSSライブラリがいくつも登場したり、ベストプラクティスをまとめたCSSリファレンスドキュメントが登場したり、CSS擬似クラスといったテクニックが紹介されたり、IEのCSS/HTML非準拠に対処するライブラリが登場するといったことが相次いで起こっているわけだ。 しかし、ほかのライブラリに依存せずにいちから自力でCSS
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
Online Inmate Search | Mugshots | Jails | Bluetrip Criminal Data
120以上生成できるCSSメニュー作成ジェネレータ『IzzyMenu』レビュー*ホームページを作る人のネタ帳
よく使われているCSSハック12選（＋おまけ） | IDEA*IDEA
CSSMENUMAKER.COM