なぜリセットではなく Normalize.css を使うのか | Yomotsu net
まずは、歴史をみてみよう。 初期* { margin:0; padding:0; border:none; } table レイアウトから CSS レイアウトへの移行期に考案された。すべてゼロにするというコードで、実装者が書いたコードのみが適用できるという手法。弊害として input 要素の枠線など、本来、スタイルをゼロにする必要がない箇所までスタイルが消えてしまい、しょうがないので更に上から枠線を加えるなどが必要になっていた 中期今から 5 年ほど前の 2008 年、エリックメイヤー氏によるリセット CSS や YUI のリセット CSS が登場した。全称セレクター「*」 ではなく、要素セレクターそれぞれに対して CSS をゼロにするという手法。 ただし、p や見出し要素の上下マージンや li のリストスタイルまでも依然としてゼロになっていたため、次のような、本末転倒な HTML まで
ウェブデザインのインスピレーションを受けられそうなギャラリーサイト | バニデザノート
最近のウェブサイトのデザインってどんなの？と気になったり アイデアやインスピレーションを受けたいときに見たいサイトをいくつか紹介します。 ■日本語サイト S5-Style 検索したときに的確に抽出できる印象。キレイめからシンプルまで。RSSも読みやすい。 Web Design Clip 大手系、キレイ系が多い感じ。 WONDER BOOKMARKS シンプル系、かわいい系、工夫凝らし系がおおい感じ。 ■海外サイト Web Creme シンプルで、おしゃれなサイトが多いです。 Web Design File いわゆる「ザ☆海外サイト」なデザインをクリップ。 日本サイトではあまり見ないようなシンプルでダイナミックな工夫を凝らしたサイトがたくさんあります。 ■Pinterest Pinterest search results for web design Pinterestでweb+desig
Icon Deposit CSS3 UI Kit (PSD+CSS) - Icon Deposit
- Preview the Live Code Here Here is the long awaited Icon Deposit CSS3 UI Kit. This includes everything from GUI switches and buttons, to radio buttons and checkboxes. I also included the Photoshop PSD file for those who want to edit the design or make the images bigger. Keep in mind that this preview image is only for google chrome, so if you would like to see it in other browsers, you will need
全36種、紙やノートの端が少しめくれたPhotoshop用のPSD素材
商用でも無料で利用できる、端が少しめくれてカール状になっている紙やノートのPhotoshop用のPSD素材を紹介します。
WordPressでブログじゃないWebサイトを作るときのいろいろ（サンプル付き）
とても長い記事になってしまいましたが、WordPress を使って、コーポレートサイトのサンプルを作ってみました。WordPress はブログだけじゃなくて、色んな Webサイトが作れますよね！今回は、私が WordPress でサイトを作る時にやっていることをまとめてみました。 今までこのブログの中で、いろいろな WordPress の Tips を書いてきました。でも WordPress を使った Webサイトの作り方そのものは、今まで書いた事がありませんでした。そこで今回は、 WordPress を使ってブログじゃない Webサイトをまるごとひとつ作って、私なりの作り方をまとめてみました。 今回のサンプルサイトでは、WordPress の固定ページ機能はもちろん、カスタム投稿タイプやカスタムタクソノミー（カスタム分類）を使って作っています。 ページを表示する為に使っているテンプレート
レイアウト作りを簡単にしてくれるCSSグリッドシステム
CSS でのレイアウト、段組み作りがとっても簡単にできる、CSS グリッドシステムをご紹介。既に使っている人もたくさんいるとは思いますが、未体験の人はぜひ試してみてくださいね！ Web デザインに欠かせない、CSS でのレイアウト作り。コンテナ作って、ここにラッパー作って、メインが 600px で padding が 20px だから、サイドバーが、えーと … なんてことになりがちです。そんな面倒な作業がイヤだなーという人におすすめなのが、CSSグリッドシステム。全ての Web デザインに使える訳ではありませんが、結構重宝します。すでに使っている人もたくさんいると思いますが、こんな方法もあるんだよーということでご紹介します。 1. CSSグリッドシステムとは？ CSS グリッドシステムというのは、レイアウトを均等に分けて、マス目上に考えるレイアウト。何が便利かっていうと、この段は4等分にし
納期間近でIEで崩れてる！ そんな時にも慌てないCSS開発のワークフロー
まだまだIE7、そしてIE6のユーザーをターゲットに考えているウェブサイトは多くあると思います。 そんなIEユーザーをターゲットに含めたウェブサイトを制作する上で、より効率的にCSSの開発が行えるワークフローを紹介します。 Cross-Browser CSS Development Workflow [ad#ad-2] 下記は各ポイントを意訳したものです。 1. リセットかノーマライズか 2. 基本的なレイアウトはIEで 3. 最後の確認もIEで 4. 最後の手段：IEのみスタイル 5. 問題に取り組み続ける 6. おわりに 1. リセットかノーマライズか IE, Firefox, Chrome, Safari, Operaなどのブラウザには各要素ごとのデフォルトのスタイルが用意されており、制作する際にはこれらの相違を見出し、各要素を整える必要があります。 CSSリセットとは CSSリセッ
【配色 - デザイン ★★★★★】 - Color Scheme Designer 3
Paletton, the color scheme designer In love with colors, since 2002. Paletton application Colorpedia About Paletton About Paletton Paletton.com is a designer color tool designed for creating color combinations that work together well. It uses classical color theory with ancient artistic RYB color wheel to design color palettes of one to four hues, each of five different shades. Various preview sty
スマートフォン向けのサイトデザインでとっても大切な5つのポイント
J Taylor Design スマートフォンにおいて、スクリーン上のクリック（つまりタップ）無しに使うことは考えられません。ナビゲーションはユーザーが必要とすることが得られるように、明確な進路を与えるべきです。 ナビゲーションで重要なことは二つ。 まず、ナビゲーションが視覚的にタップ可能に見えるか確認してください。見た目をボタンやリストのようにしたり、矢印などを加えてもよいでしょう。ただし、スマートフォンではtitleのテキストをホバーで表示したり、ホバー時のエフェクトを適用できないので、それ無しでも押すことができるように見えることが大切なポイントです。 もう一つの重要なことは、ラベルです。 「戻る」というラベルがあれば、ユーザーは戻ることを期待します。これは当たり前のようですが、ユーザーにとってラベルが何を意味するか分かることを確認してください。 ラベルを有意義にするポイントは、シンプ
Responsive Web Design用のグリッドをさくっと作成できるオンラインサービス -Gridpak
スマートフォンをはじめ、タブレット、デスクトップなど、さまざまなデバイス用に最適なウェブデザインを提供するResponsive Web Design用のグリッドを作成し、実装に利用できるスタイルシートや確認用の画像などを生成するオンラインサービスを紹介します。 Gridpak - The Responsive grid generator [ad#ad-2] Gridpakの使い方は簡単です。 グリッド生成ツールによくある、グリッド全体のサイズ、カラム数、カラムのパディング、溝のサイズを設定すると、すぐに反映されます。
これからウェブデザイナーになりたいと思っている人へのお手紙 | バニデザノート
最近よくウェブデザイナーを目指しています！というプロフィールの twitterアカウントにフォローされることが多くなりました。 ウェブ系で働いている私としては、こうやって目指すひとが増えるのは とても嬉しいこと。 夢をみるだけでなく、会社に就職したり独立したりするまえに、 いまからできることを、書きだしてみました。 ●実際に働いているクリエイターさんのお話を聞く 本当はこれが一番早いんです。 本物のデザイナーさん、クリエイターさんに出会え、 本物だと気がつけたら、その人についていったらいいとおもいます。 何に興味があって、何を買って、いまどんな行動をするのか。 その理由は何なのか。 行動から考えてみると、答えに近づきやすいでしょう。 ただ、ウェブデザイナーの場合、会社でおつとめしている方でも会社員よりの人 クリエイター寄りの人、アルバイト寄りのひと 楽天などで商品登録をしているひと、マーケ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Peachy [ピーチィ]![Peachy [ピーチィ]](https://cdn-ak-scissors.b.st-hatena.com/image/square/38dccd78e66dbe64dde5f3411ab07b2629b51995/height=288;version=1;width=512/https%3A%2F%2Fnews.livedoor.com%2Fimg%2Ffb%2Fnews.png%3Fv%3D3.07)
Website Maker - Web Design Software - Blocs
https://miqata.com/t/14
web計。