X
CSSで見た目が美しく使い易い日本のサイト
■ このスレッドは過去ログ倉庫に格納されています
0001Name_Not_Found
垢版 |
2006/01/06(金) 16:29:36ID:???
1.見た目が美しければ少々の文法違反は気にしない（指摘は可だが、論争に持ち込まない）。
　
2.海外サイトは紹介しない事。日本のみ。

3.strict房はお断り。
0004Name_Not_Found
垢版 |
2006/01/06(金) 16:33:46ID:???
てことはかぶる可能性あるよね？
0005Name_Not_Found
垢版 |
2006/01/06(金) 16:34:16ID:???
かぶらない可能性もある。
0006Name_Not_Found
垢版 |
2006/01/06(金) 16:39:12ID:???
むしろ向こうに含まれるぞ
0007Name_Not_Found
垢版 |
2006/01/06(金) 16:39:24ID:???
Strict厨はお断りな人が使うスレ
0008Name_Not_Found
垢版 |
2006/01/06(金) 16:40:20ID:???
ttp://version510.com/
このレベルも日本では少ないだろうから張ってみた。
アイコンなどの細かいところの作りが丁寧。
0010Name_Not_Found
垢版 |
2006/01/06(金) 16:42:35ID:???
>>8
firefox？
固定背景だとスクロールが重くなるね。
0011Name_Not_Found
垢版 |
2006/01/06(金) 16:46:00ID:???
あれ？おかしいな。何でこんなに重いんだろう。
IEとOperaでもスクロールが重い。
普通固定背景で重いのってfirefoxだけですよね？
0012Name_Not_Found
垢版 |
2006/01/06(金) 16:47:12ID:???
>>11
むしろ今のFxよりIEのほうが固定に弱いよ
001311
垢版 |
2006/01/06(金) 16:50:07ID:???
>>12
あ、そうなんですか。
ありがとうございます。

と言うことで自分も
ttp://coco.vivian.jp/top.html
メニューとかテキスト中心だけど、写真で上手くまとめていると思う。
ワンポイントのクリップもあると無いとで結構印象が違う。
0014Name_Not_Found
垢版 |
2006/01/06(金) 16:56:07ID:???
>>13
そのサイト、最小フォントを大きめに設定してると被って辛いわ。
0015Name_Not_Found
垢版 |
2006/01/06(金) 16:57:00ID:???
結局、こっちのスレではユーザビリティはどうなの？
00161
垢版 |
2006/01/06(金) 16:59:56ID:???
>>15
タイトルに使い易いって書いてしまったからなぁ。
まぁ、使いやすいに越したことは無い程度に捉えてもらえれば。
ただでさえ日本のサイト限定なのに、更に条件を厳しくすると全然サイトが上がらないだろうから。
0017Name_Not_Found
垢版 |
2006/01/06(金) 17:29:04ID:???
>>13
色遣いとかはそんな悪くないけど、使いにくいなあ・・・とくにリンク。
本文と色が同じだからどこがリンクか非常にわかりにくい。
0018Name_Not_Found
垢版 |
2006/01/06(金) 19:52:30ID:???
正確にはハイブリッドデザインだけど。
http://tabi2.jp/index_hotel.php

これぐらいのアイコンの作り込みができるようになると、印象が変わるなぁ。
ページトップに戻るリンクのスクロールは心地よいが、js切ると使えないのはマイナス。
0019Name_Not_Found
垢版 |
2006/01/06(金) 20:03:24ID:???
http://heteml.jp/
ここもハイブリッド。
作り込みは結構良いんだが、コーポレートカラーの扱いが難しいな。
上段背景が白で、下段背景が黒だから対比で目が疲れる。
でも、代替案は浮かばない。これはこれでいいかな。
0020Name_Not_Found
垢版 |
2006/01/06(金) 20:11:08ID:???
自演の臭いがプンプン･･･
0021Name_Not_Found
垢版 |
2006/01/06(金) 20:14:15ID:???
ん？ハイブリッド（というかレイアウト用テーブル）を認めてもいいのか？
>>1の「少々の文法違反」とは問題が異なると思うんだが、
lintで100点じゃなくてもいいって意味ではなくて？
0022Name_Not_Found
垢版 |
2006/01/06(金) 20:14:42ID:???
こんなところまで来て自演するデザイナーなんて居ないだろ。
と言うか、マジで自演じゃないよ。
0023Name_Not_Found
垢版 |
2006/01/06(金) 20:20:38ID:???
>>21
dat落ち防止の狙いもあったんだけどね。
基準があいまいになるから、やっぱり止めた方が良かったな。
0024Name_Not_Found
垢版 |
2006/01/06(金) 20:22:31ID:???
テーブルとCSSを両方レイアウトに使って
ハイブリッドデザイン！かっこいいなあ(棒読み)
0025Name_Not_Found
垢版 |
2006/01/06(金) 20:25:19ID:???
http://www.michaelsoft.jp/wiz2/
ゲームのサイトだけど、雰囲気を良く出していると思う。
js使ってflash呼び出したり閲覧者への配慮も伺える。
動作が重いのは多分サーバーのせい。
個人的にはゲーム系では一番。
0026Name_Not_Found
垢版 |
2006/01/06(金) 20:34:40ID:???
http://www.kawashimaai.com/
タイトル周りや、それぞれのページの背景は結構凝っている。
メニューは日本語でも良いと思うが、雰囲気が崩れるのかな。
0027Name_Not_Found
垢版 |
2006/01/06(金) 20:59:49ID:???
http://doc-r.net/
divがやや多いが、h2の装飾が少し凝ってる。
ユーザビリティもまあまあ。
サイドバーは左の方が良いかも。
全体的にこざっぱりして綺麗な印象。
002827
垢版 |
2006/01/06(金) 21:02:43ID:???
あと、メインの幅は狭いけど、文章量が少ないからこれはこれでOKなのかも。
0029Name_Not_Found
垢版 |
2006/01/06(金) 21:08:17ID:???
>>25
まったくスレチガイだがWizardryってこうなってしまったのか
時代の変化だろうかorz
0030Name_Not_Found
垢版 |
2006/01/06(金) 21:18:16ID:???
めちゃくちゃなのあがるかと思えば割とまともなデザイン紹介されてる。
この調子でどんどん紹介してください。
0031Name_Not_Found
垢版 |
2006/01/06(金) 21:48:34ID:jndk286X
>>27
うをーーーーかっこえー
0032Name_Not_Found
垢版 |
2006/01/06(金) 22:21:15ID:???
http://www.wwjpn.com/
まぁ、それなりの美しさ。
トップは色数がちょっと多すぎてうるさいかも。
他のページはシンプルだけど手抜きとは違うだろう。
メニューはhoverで変化を付けたほうが良いと思うな。
0033Name_Not_Found
垢版 |
2006/01/06(金) 22:25:42ID:???
http://www.abn-tv.co.jp/
配色がばらついた印象があるが、ユーザビリティはOKだと思う。
アイコンをもう少し使えば見栄えは良くなるかと。
0034Name_Not_Found
垢版 |
2006/01/06(金) 22:45:49ID:???
http://www.kaikaikiki.co.jp/
それぞれのコンテンツ毎の色使いを上手くまとめている。
やや画像が多すぎる印象。テキストをもっと使った方が良いかも。
画像リンクのhoverがピンク色なのは個人的に嫌。
0035Name_Not_Found
垢版 |
2006/01/06(金) 22:57:20ID:???
http://www.hidesigns.co.jp/index.php
擦れ系クールなデザイン。
雰囲気が好きな人と嫌いな人で分かれそう。
メニューのhover処理が薄くなるのは個人的には嫌い。
でも、これはなかなか真似出来ないんじゃないかと。

ってか、さっきから自分ばっか紹介してるｗ
0036Name_Not_Found
垢版 |
2006/01/06(金) 23:00:13ID:???
日本のサイトのデザインも捨てたもんじゃないな。
やはり日本人をターゲットにしたサイトが一番デザインの参考になる。
海外は綺麗は綺麗だけど、何か違うんだよなぁ。
0038Name_Not_Found
垢版 |
2006/01/06(金) 23:21:50ID:???
http://idnagano.net/index.php
使い易さは多少犠牲になってるが、綺麗だと思う。
ロゴだけって気がしなくも無いが、配色もまぁまぁ。
ただ、黄緑とピンクはもうちょっと彩度を下げた方が良いと思う。
今のままだと目が痛い。
0039Name_Not_Found
垢版 |
2006/01/06(金) 23:34:46ID:???
いいよいいよ、どんどん紹介して〜
0040Name_Not_Found
垢版 |
2006/01/06(金) 23:38:28ID:???
http://www.j-cnet.co.jp/index.html
多分それなりの出来なんだけど、なんか見飽きちゃったのかな。
新鮮味は無いけど、しっかり作られている。
正統派デザインと言うべきか。
でも、リンクのhoverが眩しい。
0041Name_Not_Found
垢版 |
2006/01/06(金) 23:38:40ID:???
文字をIE中の100%程度より小さく指定しないでデザインがいいサイトってないかなぁ。
自分でサイト作るときに字が大きくても綺麗でまとまっているサイトみたいなのを参考にしたい…
カスイケスレで聞いたほうがいいだろうか
0042Name_Not_Found
垢版 |
2006/01/06(金) 23:42:55ID:???
そう思う。それにその条件だけならリンク集にあると思うよ
0043Name_Not_Found
垢版 |
2006/01/06(金) 23:46:13ID:???
>>1
なぜわざわざ日本限定に？　海外は別でやるってのも無駄じゃないか
0044Name_Not_Found
垢版 |
2006/01/06(金) 23:52:00ID:???
>>43
それは海外はポータルが沢山あるから日本限定にしたの。
日本のサイトをデザインするには、日本のサイトを見るのが一番参考になりそうだし。
0045Name_Not_Found
垢版 |
2006/01/06(金) 23:58:14ID:???
>>44
たくさんあがったほうがよりよいもの自分で選べてよくないか？
0046Name_Not_Found
垢版 |
2006/01/07(土) 00:02:34ID:???
てかもともと「見た目がよければユーザビリティはどうでもいい！」って主張と戦ってできたスレだからねぇ。
のわりには「使い易い」ってあるけど・・・。日本語とかも特に論議の対象にはなっていなかったのは事実。
0047Name_Not_Found
垢版 |
2006/01/07(土) 00:04:39ID:???
>>46
逆、「見た目がよければユーザビリティはどうでもいい！」と
主張して派生したスレだよ。
0048Name_Not_Found
垢版 |
2006/01/07(土) 00:04:59ID:???
>>45
まぁ、そうなんだけど、ポータル見たほうが早いと思うから。
あれだけ沢山あれば殆ど網羅されると思うし。

>>46
そこはミスった。<使い易い

0050Name_Not_Found
垢版 |
2006/01/07(土) 00:08:53ID:???
>>48
それはこれからの書き込みの人次第だから、やっぱ限定する意味ないと思う。
限定しだすからおかしくなるんじゃないのかな。
0052Name_Not_Found
垢版 |
2006/01/07(土) 00:14:03ID:???
>>42
あると言えばあるけど、新しいのが見てみたいなと思って。
最近新しく紹介されてくるのって小さい文字が多いから、やっぱり文字は小さいほうが綺麗なのか…？とか思ったり。
なんか文章めちゃくちゃですね。ｽﾚ汚しｽﾏｿ。
先に配色とかレイアウトの基礎を勉強します
|ω･`)ﾉｼ
0053Name_Not_Found
垢版 |
2006/01/07(土) 00:47:47ID:???
>>50
やっぱり海外ありにしますかね。
そろそろ日本のサイトもネタ切れしそうなのでｗ
でも、なるべくポータルとの重複は避けて欲しい。

http://www.chukyo-u.ac.jp/
大学のサイトってcssでレイアウトされたの結構少ないね。
ここは文法はあまり良くないけど、学校らしく落ち着いた雰囲気を上手く出せてると思う。
色使いと写真のセレクトが良いと思う。
メニューの背景マークに何かあれば良かったなぁ。
0054Name_Not_Found
垢版 |
2006/01/07(土) 00:57:15ID:???
SONYで検索してみた。
どこもかしこもテーブルだったんだけど、CSSのもあった。
http://www.sony.fr/
パクリ防止策か無駄な改行ならHTMLはいいとはいえないけど
デザインは素人の個人サイトでは難しいな。
適当に検索したものだけど
残念ながらテーブルレイアウトのほうがデザインはイイ。
0056Name_Not_Found
垢版 |
2006/01/07(土) 01:10:30ID:???
>>54
その色使いは海外ならではって感じするね。
ただ、真ん中のコンテンツの枠の左と上が切れてて不自然。
あえてやってるんだろうけど、ちょっと気持ち悪いなぁ。
0057Name_Not_Found
垢版 |
2006/01/07(土) 10:59:27ID:???
玄人のやつもっと晒してください
0058Name_Not_Found
垢版 |
2006/01/07(土) 19:39:55ID:???
http://www.takayanagi-isu.jp/
少し和風。
色使いは良いと思うが、マージンとかリンクの色の配慮がちょっと足りない。
home以外のサイドバーが途中で切れてるのもダメ。
この辺直せばもっと良くなるかと。
0059Name_Not_Found
垢版 |
2006/01/07(土) 19:44:39ID:???
http://www.vision-two.com/
硬い内容だけど、見た目は結構頑張ってる方。
と言っても上の画像だけって気もするが。
リストの画像が一種類でしかも地味なので寂しい。
0060Name_Not_Found
垢版 |
2006/01/07(土) 19:49:21ID:???
http://www.vision-two.com/day/
ソースは結構問題ありだが、すぐ直せる範囲内。
意味の無い時計とかあるけど、クールで美しいのは確か。
トップ以外のページはフッターも多少だが凝っている。
ここまでやるならリストの画像もただの点だけじゃなく、もっと凝った方が良い。
問題を直せばかなりいけると思う。
0061Name_Not_Found
垢版 |
2006/01/07(土) 19:57:33ID:???
下の二つはオーソドックスすぎますね。悪くはないですけど。
0062Name_Not_Found
垢版 |
2006/01/07(土) 20:00:59ID:???
>>61
まぁ、読ませてナンボのブログだからね。
変に奇抜なレイアウトは本末転倒だし。
0063Name_Not_Found
垢版 |
2006/01/07(土) 20:02:44ID:???
そうだとしても新しいもの見たいですね。
0064Name_Not_Found
垢版 |
2006/01/07(土) 20:03:17ID:???
ちゃちゃいれてすまん。もっと頼む
0065Name_Not_Found
垢版 |
2006/01/07(土) 20:03:40ID:???
こりゃーがんばればこっちが本スレになるかもな
0066Name_Not_Found
垢版 |
2006/01/07(土) 20:06:47ID:???
>>63
探してるけどなかなか無いね。
自分的には>>35が一番独創性があると思った。

でまた、固定幅中央寄せ。
http://www.webhut.jp/index.html
てか、リキッド自体が少ないし、あっても糞デザインばっか。
ここは目新しさは無いけど、普通に作り込まれてる。
0067Name_Not_Found
垢版 |
2006/01/07(土) 20:11:01ID:???
このスレには期待してる。
0068Name_Not_Found
垢版 |
2006/01/07(土) 20:12:56ID:???
つーか結局、がんばってる一人の人がどっちのスレにいるか、でしかない気も…
0069Name_Not_Found
垢版 |
2006/01/07(土) 20:14:45ID:???
>>68
そうかもね。
その頑張ってる一人が言うんだから間違いないｗ

まぁ、荒れないだけ良いわ。
0070Name_Not_Found
垢版 |
2006/01/07(土) 20:20:33ID:???
くそ、見た目はいけてたのにハイブリッドだったorz
0071Name_Not_Found
垢版 |
2006/01/07(土) 20:28:43ID:???
もうCSSの時代だろうと思っても企業は未だにテーブルだな。意外と探すの大変
0072Name_Not_Found
垢版 |
2006/01/07(土) 20:36:50ID:???
>>66
リキッドじゃなくてソリッドでも、そのデザインを良いと思ってるならアレだ・・
0073Name_Not_Found
垢版 |
2006/01/07(土) 20:44:56ID:???
アレって何だ？はっきり言ってくれ。
007573
垢版 |
2006/01/07(土) 20:50:57ID:???
まあいいや。
荒れそうだから回答はいらない。
0076Name_Not_Found
垢版 |
2006/01/07(土) 22:46:06ID:???
http://semkim.net/
下段のvalidのリンクをあえて少し隠しているところが新鮮。
コンテンツとしてはそれほど重要では無いリンクなので、遊び心で許せるレベル。
全体的に重いのは海外だからか？
0079Name_Not_Found
垢版 |
2006/01/07(土) 23:01:25ID:???
>>78
スレタイにちょっと間違いがあるだけなので気にしないように。
0082Name_Not_Found
垢版 |
2006/01/07(土) 23:25:50ID:???
http://mikepiontek.com/
グラフィック系だけど、アクセシビリティを良く考えている。
カッコいいし美しい。
文字サイズ変更機能がlargeでもやや小さいのが気になる。
xhtml1.1で作られていた。
0083Name_Not_Found
垢版 |
2006/01/07(土) 23:28:39ID:???
参考になるサイトがたくさんありますね
0084Name_Not_Found
垢版 |
2006/01/07(土) 23:31:47ID:???
>>82
カコイイのは認めるが、そこまで小さくてアクセシビリティは誉めすぎ
0085Name_Not_Found
垢版 |
2006/01/07(土) 23:38:54ID:???
>>84
やっぱそうだよね。
書いてからしまったと思ったorz
気になったらどんどん突っ込んでください。

http://digg.com/
準リキッドデザイン。
メニュー下の広告ウゼーとか、右側の緑色サイドバーの配色が気になるけど
ギリギリOKにしておく。
フォントサイズ切り替えボタンが一つなのに、二回押せば元に戻るのは初めて見た。
もうちょっと作りこめばいけそう。
0086Name_Not_Found
垢版 |
2006/01/07(土) 23:59:50ID:???
http://www.w3cn.org/index.html
漢字も悪くないかも。
画像のめり込みで少し変化をつけている。
div病なのと一部の背景はマイナス。
zeldmanの「Design with Web Standards｣の中国語版の表紙にﾜﾛﾀ
0087Name_Not_Found
垢版 |
2006/01/15(日) 22:17:22ID:???
ttp://revway.jp/

肝心のgalleryがJavascriptなんで、offにしている人
（俺とか）は観れないのがうざいかな
0088Name_Not_Found
垢版 |
2006/01/16(月) 19:10:41ID:Sqzdj7h/
ブラウザの設定によってはフォントサイズが小さすぎて
つぶれてなにも読めないのばっかり…

Mac IE で
フォントサイズ 12
解像度　96dpi

なんだけどね。
Macromedia のサイトもコンテンツによっては
なにが書いてあるのかさっぱりわからんです。
0089Name_Not_Found
垢版 |
2006/01/16(月) 19:13:21ID:aPcIFQxB
Mac IE の設定を 72dpi すりゃぁいいジャマイカ
0090Name_Not_Found
垢版 |
2006/01/16(月) 20:17:37ID:???
Macは基準にできないよ。
多い方に、Macが合わせてくれ。
0091Name_Not_Found
垢版 |
2006/01/16(月) 20:35:35ID:aPcIFQxB
んまぁあれだ
Mac使いがIEを使うなよとｗ
0092Name_Not_Found
垢版 |
2006/01/16(月) 20:38:55ID:???
つらい世の中ですね…

なんか思いっきり<FONT size=2>とか
<TABLE>で思いっきりレイアウトとか…

もうダメなんですね…　w
0093Name_Not_Found
垢版 |
2006/01/16(月) 20:44:26ID:???
要素名が大文字
値をダブルクォーテーションで囲ってない

もうダメもクソも初めっからダメだろカスｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗ
0094Name_Not_Found
垢版 |
2006/01/16(月) 22:21:51ID:???
HTMLの構造は多少難ありだが
色遣いとかも綺麗でいいと思いました

ttp://www.twilightning.jp/
0095Name_Not_Found
垢版 |
2006/01/27(金) 21:31:18ID:MR9dY94e
ttp://www.teichiku.co.jp/artist/nakanomori/
0096Name_Not_Found
垢版 |
2006/01/27(金) 21:44:12ID:???
>>95
ほほぅ、POPで良いね。
Lintだと一部点引かれてるけどまぁ許容範囲（W3C ValitatorだとValidだし）。
0097Name_Not_Found
垢版 |
2006/01/29(日) 02:18:56ID:d69v/Er3
>>95
cssがすごく長い。IE5.x for Macとかまでサポートしてくれてるのがありがたいね。
0098Name_Not_Found
垢版 |
2006/01/30(月) 09:26:26ID:OW05PPdY
初歩的なことを聞いてすんません
>>95のサイトのcssで、

h1 {
position: absolute;
top: -9000px;
left: -9000px;
text-indent: -9000px;
}

としてるのは、特に問題なし？
だったら、漏れも真似しようかと...
0099Name_Not_Found
垢版 |
2006/01/30(月) 09:55:53ID:???
それってh1を表示させたくないだけ？
だったらdisplay: none;の方がいい
0100Name_Not_Found
垢版 |
2006/01/30(月) 10:06:54ID:???
>>98>>99
display: none;だとSEOスパムと判断されるとか
音声ブラウザで読んでくれないとかの問題があった気がする。
text-indentででかい数字入れて表示させない方法は最近の流行り？よく見かける。
■ このスレッドは過去ログ倉庫に格納されています
ニューススポーツなんでも実況