fc2ブログ
プログラミング開発日記やゲームレビューやPCの役立ち情報などのさまざまなことを紹介&ネタでお届けするサイトです

HTML色の見本

今回は管理人がよくHTML文章などでよく使う色の種類(#ffffff)は白などを
簡単に見比べながら色を選んだり作成することのできる

HTMLサイトをご紹介します。

今までbuleなどという風に色を表記していた人などはコレを機にたくさんの色を
見つけたりHTML色を作成したりして自分の
サイトをにわかりやすく彩ることができるようになります。
詳細は続きから



以下が管理人のオススメ色見本&HTML色作成サイトです



WEB色見本原色大辞典
現在の人気の色などの見本がたくさん置いてあるサイトです。
カテゴリ別に別れているのでとてもわかりやすいと思います。
HTML色を自分で簡単に表示することもできるためかなり便利です

使い方は上記サイトから
色調合タブをくりっくして色作成に行き
色を選択して値を取り込むと右にある比率でその色の混ぜる比率を決めると
HTML色を作成することができます。
グラフにて調合されたHTML色が作成されるためとても見やすいです。


色見本
圧倒的なHTMLの色の見本が置いてあるサイトです。
最初から色が表示されますし、背景で簡単に見比べることができるためとてもお勧めです。


HTML色一覧
コチラのサイトもHTML色の見本がたくさん置いてあります。
並べ方がおしゃれで、芸術的なところがあり見ていて気持ちがいいです。


とほほの色入門・色見本
デフォルトのウィンドウの枠などの色解説が初心者でもわかりやすく解説してある
とほほ色入門・色見本からです。
もともと初心者リファレンス(説明)サイトだけあってとてもわかりやすく
HTML色のデフォルトにて使われるさまざまな色の情報などのさまざまな便利な
情報が載っています。(この情報は~#1090~のきみきみさんからいただきました。(感謝)


HTML色のカラーネーム
コチラのサイトではWEBサイトのHTML色の”カラーネーム”といわれる
HTML文章そのものにコード(#ffffff)などではなく文字(redやblue)として色を指定できる
HTML色が見本としておいてあります。

ですがWEBで色を表示させる場合などは
このように(例・redやblue)などと表示させるよりはコード(#ffffff)と表示させるほうが
どのブラウザでも確実ですのでそちらをオススメします。
即席で使えるHTML色として覚えておくのであれば十分有用なはずです



さて、いかがでしたでしょうか?
HTML色の見本サイトは管理人が紹介した以外にもたくさんありますが
上記のサイトが管理人のオススメのHTML色の見本サイトです。

紹介した色付けのサイトにて、WEBページに色付けをしていき訪問者にわかりやすく
気持ちの良いデザインのサイトを目指しましょう。

コメント
No title
これはとても良いサイトですね。
私のブログは、配色にはあまり配慮してない面があります。これを見て、少し考え直そうかと思いましたが、やはり難しいのですよね・・・。

1つの色を変えると、もう1つも変えなくてはならないような場合も出てきますから、落ち着くまで時間がかかります。
2008/10/11(土) 19:09 | URL | AMA@ #-[ コメントの編集]
No title
私の場合はいつも

ttp://www.tohoho-web.com/wwwcolor.htm

こちらのサイトを参考にしているのですが、こちらの記事で紹介されているものも、すごく分かりやすくていいですね!
2008/10/11(土) 19:56 | URL | きみきみ #qiGSc6rc[ コメントの編集]
これは。。。
>AMA@さん

AMA@さんのサイトは今の配色が
とてもあっていると思いますよ?

自分のような真っ白なテンプレートの場合は
こういう風に色づけしたりして見やすくすると
いった工夫が必用ですけど

AMA@さんのサイトは雑誌系の配色を
使っているのでデフォルトでとても見やすいです。
そのうえトップページからすらすら読めます。

それに自分は雑誌系の配色はとてもよ読みやすく
非常に気に入っています。

ですので無理にHTML色づけをするよりは
今のままのデザインのほうが自分は見やすくて
好きですね^^



>きみきみさん

こ・これは!かの有名なとほほ入門!
なるほど~リファレンスサイトか~
こういうのも確かにありますね。

しかもわかりやすいです
うーん盲点でした。

ありがたく記事に追記させていただきます。
ありがとうございました^^

ちなみに自分は
ttp://park16.wakwak.com/~html-css/index.html
超初心者のためのホームページ作成講座で
いろいろ学びました。

割とこういう説明サイトってすきなんですよね自分^^

2008/10/11(土) 20:13 | URL | 暗黒の鬼神 #K0uxTMEc[ コメントの編集]
No title
ゆ、有名だったんですか(^_^;) 全然知らなかったw

ネトサでテキトーに見つけたサイトだったんで・・・まさか有名だったとはw

記事に追加していただき、感謝です アリガト!(´▽`)

ところで話は変わりますが、今しがた気がついたので報告しておきたいのですが、こちらのサイト「Sun Eternity」のトップのロゴなんですが、IE6で見た際に、綺麗に表示されていないようです。

正直、これはかなり重要な問題かもしれません。

自分のサイトのアクセス解析でも、IE6のユーザーは全体の3分の1ほどと、まだまだかなり多いですからね・・・。

アクセス数の多い人気サイトの条件として、まず「IE6でレイアウトが全く崩れない」ということが挙げられると私は思っていますのでw

XPが広く使われている現状では、やはり完全にIE7に移行されることは当分ないと思いますし、今のうちにIE6にも対応しておくのがベストだと思いますよ\(^o^)/

解決策として、IE7やFirefoxなど、きれいに表示されるブラウザを使ってキャプチャーをとり、「Sun Eternity」のロゴを背景ごと画像にして、現在の画像をそれに差し替えればいいのではないかと思います(^^)
2008/10/11(土) 21:48 | URL | きみきみ #-[ コメントの編集]
あっ。。。
とほほ入門はアクセスの理論や
HTML文法の理論で結構評価をえていますよ。

>ロゴに関して
こ。。。これは。。。。ひどい・・・

何ですか・・・
この背景色が灰色のロゴデザインは???

うわ。。。こんな風に表示されていたなんて・・・
ショック・・・

というか全然気づきませんでした。
前のスクロールスクリーンショットの記事で
灰色に背景色が表示されていたのですが
「多分バグだろ」と思っていたのですが。。これは。。。

それにしてもなんで背景色を透明にしていたのに
こんな風に表示されてしまったのだろう・・・

問題はIE5.5と6のみ
このように表示されてしまうようですね。


>きれいに表示されるブラウザを使ってキャプチャーをとり、「Sun Eternity」のロゴを背景ごと画像にして、現在の画像をそれに差し替えればいいと思います。

なるほど。。。そういう手もありますね、
早速試してみたいと思います。

ご報告のおかげで問題に気づくことができました
きみきみさん本当にありがとうございました。
早速対策をしたいと思います。
2008/10/11(土) 22:26 | URL | 暗黒の鬼神 #K0uxTMEc[ コメントの編集]
コメントの投稿
【Font & Icon】
管理者にだけ表示を許可する
ユニークアクセスカウンター

訪問してくれてアリガトウ!
ワーイヽ(゚∀゚)メ(゚∀゚)メ(゚∀゚)ノワーイ