1read 100read
2013年17Web制作133: CSSデザインのサイトを評価するスレ (623) TOP カテ一覧 スレ一覧 2ch元 削除依頼
Canvasについて語ろう (243)
フォレストページ管理人 その2 (824)
公開メアドにウイルスを送信して来るどアホへ (196)
■この素材屋イイ(・∀・)!マターリ紹介しあうスッドレ4■ (590)
SOHO総合 (488)
インターネットの作りかたを一からおしえて (526)

CSSデザインのサイトを評価するスレ


1 :2007/08/19 〜 最終レス :2013/07/27
※評価するスレなので、各話題(文法など)は該当スレへ!

◆評価するサイトについて
・自薦他薦どちらでもよい(基本は1レスに1サイト)
・CSSでデザインされているサイト(tableを使ったデザインは×)
・ブログなどのテンプレートは配布元サイトのテンプレートを
◆評価する内容
・見た目は良いか悪いか
・サイトデザインと内容(ターゲット層)が合っているかどうか
・ユーザビリティ(使いやすさ)は良いか悪いか
・アクセシビリティ(利用のしやすさ)は良いか悪いか
・(X)HTMLとCSSの文法は正しいかどうか
・ソースは読みやすいかどうか
・各ブラウザでの表示の誤差があるかどうか
◆評価する基準
・見た目は個人の判断
・明確な基準(文法やブラウザの表示など)があるものはそれを使う

>>2-10テンプレ続き

2 :
■補足
・評価者はブラクラやフィッシングなどの悪質サイトには注意してください
・評価する内容は様々ありますが、なるべく沢山の項目を総合的に評価してください。
・文法だけしか評価しないなどはスレ違いです。該当のスレへ

■よくある話題
・文法めちゃくちゃだけど見た目はいいよ
→見た目は個人の判断だけど、その他の「評価する内容」はダメだね
・デザイン良すぎ
→そのデザインは見た目のこと?見た目以外のデザインはダメかもよ
・文法完璧(100点)だよ
→文法は完璧だけど、その他の「評価する内容」はダメかもね
・文法チェッカで100点取れないサイトはダメ、評価する必要なし
→文法だけしかチェックしないのはスレ違い。該当スレへ
・横幅固定は〜、フォントサイズは〜、色使いは〜、の方がいいな
→評価するスレなので、ユーザビリティなど詳細な話題は該当スレへ
・IE5とかブラウザにも対応していないから他が良くてもダメ
→評価するスレなので、対応するブラウザの基準などの話題は該当スレへ
・そのサイト既出しすぎ、このスレだけで何レスあるよ
→アボーンまたは削除依頼しましょう
・荒れてるよね
→スルー or ネタ(評価するサイト)を書き込みましょう

3 :
■関連スレ
◆文法などの話題は該当スレへ
Strict-HTML スレッド 40
http://pc11.2ch.net/test/read.cgi/hp/1172418901/
CSS/DHTMLバグ辞典スレッド【第5版】
http://pc11.2ch.net/test/read.cgi/hp/1144494359/

◆質問は質問スレへ
Webサイト制作初心者用質問スレ Part 187
http://pc11.2ch.net/test/read.cgi/hp/1187281010/
/* CSS・スタイルシート質問スレッド【67th】
http://pc11.2ch.net/test/read.cgi/hp/1185234189/

◆ユーザビリティなどの話題は該当スレへ
ユーザビリティ専用スレ その3
http://pc11.2ch.net/test/read.cgi/hp/1136275352/

4 :
■評価する基準の一つとして利用してください
◆(X)HTML文法チェッカー
・W3C Markup Validation Service(HTML, XHTML)
http://validator.w3.org/
・Another HTML-lint
http://openlab.ring.gr.jp/k16/htmllint/htmllint.html

◆CSS文法チェッカー
・W3C CSS 検証サービス
http://jigsaw.w3.org/css-validator/
・カスイケガイシュツチェッカー
http://www.wakaba.com/~hiji/2ch/cssike/

◆アクセシビリティについて
・ウェブコンテンツ・アクセシビリティ・ガイドライン 1.0
http://www.zspc.com/documents/wcag10/
・JIS X 8341-3(ウェブコンテンツJIS)
http://www.jisc.go.jp/app/pager?id=25449
・アクセシビリティ リソースセンター
http://www.adobe.com/jp/accessibility/

◆ユーザビリティについて
・黒須教授のUser Engineering Lecture
http://www.usability.gr.jp/lecture/index.html

5 :
>>1
css関係のスレは乱立してるから要らない
つーか何様?首つってシネヨ

6 :


−−−−−−−−−−− テンプレ終了 −−−−−−−−−−−


7 :
>>5
Web作成板LRより
扱う話題
-HTML、CSSなどのサイト制作の技術

8 :
>>7
Web作成板LRより
スレッドをたてる前に
-板違いではないか、既出ではないか、もう一度確認しましょう。

9 :
>>1
削除依頼してこい

10 :
>>1
早速よそで宣伝貼りされてたサイト
860 :Name_Not_Found :2007/08/19(日) 20:05:51 (p)ID:g40yZAXs(2)
ここどうですか?
ttp://www.udeken.com/green_support.html
お安いですね?
俺は高いと思うんだw

11 :
基本叩きスレだろ。悪意を感じる

12 :
叩きスレだったのはどう考えてもカスイケスレだよ。

13 :
その叩いてるやつらが自身のブログではスレを叩くという、あのスレのことですか?

14 :
そして叩かれた奴らはここでスレを罵倒する、とwww

15 :
ttp://note.openvista.jp/
なかなかよくね?
メインコンテンツを中央寄せできたらもっといいと思うけど

16 :
>15
ブラクラ注意
本当の意味でブラクラした
問題外だ馬鹿野郎

17 :
問題外なのは>>16の存在

18 :
>>15
さわやかでいい感じだね。ちょっと明るすぎて読むのが辛いかもしれないが。

19 :
>>15
というかコンテンツもいいね。

20 :
ファッション総合サイト - Yahoo! FASHION
ttp://fashion.yahoo.co.jp/

21 :
>>20
>1
◆評価するサイトについて
・CSSでデザインされているサイト(tableを使ったデザインは×)

22 :
yahooはテーブルすっきゃねん。

23 :
>>22
大手の場合は顧客に環境を合わせてくれよいうよりも
自分たちが顧客の環境にあわせるスタンスなんだろ
大手が最新のブラウザを使うように言ってくれたら
無駄なハックとかしなくて済むんだけどな〜

24 :
>>22
yahooもフルCSSの作ってデザイン調査してる最中

25 :
yahooはもうすぐリニューアルするっていうのはなんかで聞いたな。

26 :
>>25
こんなのになるんか?
http://www.yahoo.com/

27 :
>>26
それよりもっとピンクでファンシーだった

28 :
http://bb.watch.impress.co.jp/cda/news/18718.html

29 :
ユーザはカラムを必要としていない
固定幅で作るのは「お客様目線」に成っていない

30 :
>29みたいな主張出てくるけど
利用者の大半の画像解像度の横幅が1024か1280の状態だから横幅固定していてもたかがしれてるし
日本語の場合文章の読みやすさも一行あたり35から40文字の間が一番読みやすい
万人に対応したデザインにする必要より金を落としてくれる人向けに
合わせたデザインになっていくのは仕方ないんだがw

そもそもブラウザやHTMLの技術が様々な環境に対して
自在に可読性を高めてくれる仕様になってないからなw

31 :
>>30
横幅が狭くても嫌なもんだろう、
横スクロールバーよりはマシだったとしても。

32 :
俺未だに600px以下想定で作ってるw

33 :
俺は760pxだな
あと縦スクロールなしとかもトライしたが
個人環境によって、ブラウザのツールバー4段組・アイコン大+テキストとかあると無理なのもわかったw
ここ暫くは、xhtml+cssだな
 

34 :
やっぱMac使いのサイトは違うね〜
ttp://hmdt.jp/

35 :
http://hmdt.jp/ を XHTML1.0 Transitional としてチェックしました。
136個のエラーがありました。このHTMLは -99点です。タグが 25種類 309組使われています。文字コードは UTF-8 のようです。

36 :
重たい

37 :
>>34
本当に違うな、字が被って読めないし

38 :
>>34
<h3 class="date">
<span class="sep">Sep</span>
<strong class="day26">26</strong>
</h3>
日付けの class 指定が面白いね。
どうなってるんだろ。

39 :
>>38
それが理解できないの?
あんたが甚だしく疑問 

40 :
なんでいちいち煽るんだよ

41 :
クラス指定してあるんだから、あとは個別に対応した画像を表示させればいいだけでは

42 :
もっとこう、プロっぽくないっていうか、無難じゃないっていうか、
がんばりましたっ!っていう感じの個人サイトレベルの
「…イケ…てると思うよ…」ってサイト紹介plz

43 :
>>42
ttp://l6x6l.jp/
ここで探せ。

44 :
>>43
うわあ……

45 :
>>34
なんでテキスト選択できないんだって思ったら選択の色が背景と同色なのね
俺の環境だけだろうか(XP、Firefox)

46 :
>>45
IEだと大丈夫だった

47 :
>>34
about.htmlからトップへ戻れなくなった。
そのうちオレはそのサイトを閲覧するのをやめた。

48 :
mixi.jpがリニューアルされてxhtml+cssベースになったらしい
アカウント持ってる人評価プリーズ
2chのmixi関連スレではもっぱら改悪との評判

49 :
>>48
改悪の見本
まあ元の出来も最悪だったけどな

50 :
そうか?昔のmixiよりマシだと思ったが

51 :
>>50
お国はどちらで?

52 :
とりあえず、何を持って改悪だと思ったのか言えよ。
使い勝手は変わってないか向上しているように見えるんだけれども。

53 :
できればどこらへんが使い勝手向上してるのか書いてくれ。

54 :
http://news23.2ch.net/test/read.cgi/news/1191209147/
http://pc11.2ch.net/test/read.cgi/sns/1190716059/96-

55 :
mixiは閲覧者CSSで見た目を変えられるようになったらしいので、
その点では使い勝手は向上したのではないでしょうか。
いや、 使い勝手 (ユーザビリティ) というよりアクセシビリティかな?

56 :
>>55
面倒な思いをしてユーザCSSを書かないと使えない、てんじゃ改善とは言えないよね。

57 :
ユーザCSSを書いてもどうにもならないよりは改善だろう

58 :
以前は2ペインと3ペインをボタンで切り替えられた。
今は2ペインにするためにはユーザCSSを書かなければいけない。
部分的には改善といえるし、部分的には改悪といえる。
今回は改善ポイントの方が少ない。

59 :
何より今回のリニューアルの争点は「ユーザスタイルが使えるようになるかどうか?」ではないでしょ。
全面的な改装の付加価値としてユーザスタイル適応可能な状況になった、といういわばおまけで、
運営がそれを前面に押し出していないことからもそれが二次的な副産物だっていうのは明らかなこと。
そんで、mixiユーザの何割が自分の思い通りにユーザスタイルを書き上げて使用できるっていうの?

60 :
mixiユーザがどうのというより
ここの評価なんだから一般的なところは考える必要なくね?

61 :
じゃ「XHTML+CSSに移行できたので言うことなし」で終わり。
それで満足なの?

62 :
うん

63 :
>>61
君みたいなcssヲタと違って
基本のレイアウトさえきっちりcssで組めたら
あとはコンテンツつくらないとね

64 :
61はあれだが63は63で間違ってる

65 :
視野狭窄が間違いってんなら全員間違い

66 :
>>65
多分そういうこと言ってるんじゃなくて
レイアウト→コンテンツという流れをからかってるんじゃないか

67 :
>>66
それも間違い

68 :
おいおい・・・CSSデザインのサイトを評価するスレから
評価文を評価するスレになってるぞ・・・

69 :
IE7が非推奨ってのが一番笑えたけどな>Mixi

70 :
>>69
それは正しい

71 :
Mixi、色薄い薄いって言われまくってんな
そこらのサイトでも、もっともっと薄いサイトあるよな
作ってる奴はこの際に耳に入れておいて欲しい

72 :
ここってHP評価スレとどう違うの?
今後晒すかもしれないので参考に教えてくれ

73 :
CSSデザインのサイト、と書いてあるようだぞ

74 :
文盲がいるみたいだぞ

75 :
>>48
ホントだ。
イイじゃん。
どこが改悪?

76 :
あ、フォームの記述がまどろっこしいかな。
ul と dl の混在って珍しくない?

77 :
ttp://konatakanata.client.jp/
ttp://lom-remake11.com/
ttp://otg.jik.jp/
ttp://joykabu.michikusa.jp/
ttp://blueletter.jugem.jp/
ttp://djbar-on.com/
HP評価スレからマシそうなものを適当に選んでみた。

78 :
>>77
最初のサイトを見た時点で続きを見る気が失せた。

79 :
>>78
それは何で?
>>78にとって見る気がうせるデザインだったってこと?
俺は嫌いじゃないけど。
昔懐かしいCSSコミュニティ住人が好きそうなデザインって感じはするが。

80 :
みっつめのサイトはこなれてる感じでいい。ややごっちゃり
さいごのはまとまってるが全体的に惜しい。
一個目のは統一感はいいが、もうちょい飾りっ気がほしい

81 :
>>77
1つ目・・・文字が大きくシンプルな構成なので見やすい。
ただ印象に残らないという側面もあるのでシンプルさを壊さない程度の
イラスト等を1箇所入れると引き締まる気がする。1行が長いので35文字程度に
収まるように調整した方がいいかも。
2つ目・・・オレンジ背景でひと目みてインパクトはあるけど、文字が小さい印象を
受ける。少なくとも96%位にはした方がいいと思う。メニューの背景にも白系を
入れればメニュー文字が見やすい。メニューの茶色背景に黒系文字は駄目。
3つ目・・・色の関係で落ち着いた印象を受ける。文字サイズは見やすい。
ただし文字と背景とのコントラストが弱い所があるので見辛い文字がある。
style切り替えはいいがstyleの文字が半分隠れてしまっている。book styleにした時
サイトマップ内の文字が見えない。
4つ目・・・文字サイズ・見易さ共にいいが、通常メニューがある場所に
アドセンスがある為、設計としては優しくない。(クリックさせるためにあるのだろうが)
サイトとしての質は浅く広く情報を提供しているので、株初心者にはいいと思う。
パンくずリストは現在地が分かりやすいのでいいと思う。
5つ目・・・同性愛という切り口ながらデザインは親しみやすい印象。
上部のメニューは色分けされているのでぱっと見リンクと分からない人がいるかも。
?マークがついているので何となく分かるが下線か破線を入れる等した方が分かりやすい。
テーマカラーは蒼なのだろうがもう少し全体的に利用してもいいかも。
6つ目・・・テーマカラーが青系なので清潔感・清涼感は受けるが、冷めすぎて
逆に飲みに行くかといえば行かないかもしれない。どこかで反対色のオレンジ系を
うまく取り入れると締まるかも。文字色が薄いのでもう少し濃くした方がいい。
文字サイズも小さいので少し大きくした方がいい。飲み物のメニューは品名と料金を
羅列しているが、お勧めのものや人気の物は画像を使う等してアピール度を高めた方がいい。

82 :
>>81
一行の長さなんてブラウザで調節できるのが強みだろ・・・

83 :
>>82
完全固定って意味じゃないからね。最小側は画面サイズに応じて可変は
するけど、最大側は35文字〜40文字位が閲覧する時に読みやすいって事ね。
俺の画面解像度は1024×768だからIEで見たときお気に入りを左に出していると
丁度いいけどお気に入りを出していない環境の人が見ると長いかな?と思うと感じる。
FFでも見てみたけどお気に入りを出せばそんな感じかな。

84 :
>>83
それはおまえの読みやすさであって
そんな少ない文字数じゃイヤって人もいるだろう。
だったら何も指定しないほうが現実的だ。

85 :
>>84
何も指定しない?
じゃあ1600×1200の人とかは横に伸びまくるけどいいの?
1行が横に伸びすぎると読んでいる時に次の行の行頭を
見失いやすくなるのだが。
それに前出で書いた文字数は俺の読みやすさではなく、
一般的に言われている文字数なのだが。

86 :
>>84
日本語横書きは40字以上になると読みづらいってのは常識

87 :
>>85
ブラウザを最大化してる人間ばかりだというのか?w

88 :
>>87
最大化してなくたって、よっぽどでかい字にしてない限り40字超えるだろうが

89 :
青い本がでてから「読みやすいのは38字前後なのっ」って主張するやつが増えたけど
リキッドに作っておけば、閲覧者はブラウザのサイズ変えて適当に調節するよ

90 :
>>89
〜ある情報を探しているAさん。
サイト1
このサイトは50文字位で見難いからブラウザの横幅を縮めて・・・。
サイト2
このサイトは絶対値で文字数固定してやがる!さっき縮めたから
横スクロールが出やがった!今度は広げるのかよ!
サイト3
ふぅ・・・情報が足りないな・・・。次のページは・・・!!!
また文字が多くて見難いのかよ!!!!
こうして広げたり縮めたりしましたとさ。

91 :
>>90
噛みつく相手を間違えてるよ
俺は読みやすい字数は否定してない
調節できる余地があればいいってだけだ。

92 :
>>85
流れを読んでくれよ。
おまえの読みやすさと他人の読みやすさは違うんだから
自由に調節できるようにさせろ、という意味であって
最大化した状態が読みやすい人なら1600pxでもなんでもしてくれ、
10文字程度が読みやすい人なら幅を目一杯縮めてくれ。

93 :
>>92
>1
スレ違いだ

94 :
なんで92だけに言う?

95 :
フルCSSじゃないみたいだけど
http://www.kanack.co.jp/

96 :
フルCSSじゃないなら今時CSS使ってない方が少ないだろ・・・

97 :
>>89
身近には サイトにあわせてブラウザサイズ変えるやつなんて見たことも聞いたこともない

98 :
ナマケモノの類友ばかりか。

99 :
俺も見たことも聞いたことも無い

100read 1read
1read 100read
TOP カテ一覧 スレ一覧 2ch元 削除依頼
(´・ω・`)知らんがな  1がな目 (581)
【インクリメントP】ネットショップオーナー その3 (890)
ページランクが付くまでマターリするスレ13 (709)
こんなブラウザは嫌だ! (278)
HTMLタグ大文字か小文字かアンケートスレ (205)
PHPを使って何ができるか? (144)
--log9.info------------------
検索してはいけない言葉 (250)
GMAILが携帯認証必須になった件 (170)
【電波盗聴】脱Google総合★11【世界征服】 (904)
Google板で再び1000を目指すスレ (113)
IDにGoogleが出るまで頑張るスレ 2検索目 (929)
Picasa ウェブ アルバム (314)
Google Voice ってどうよ? (141)
なぜ日本からGoogleが生まれないのか (106)
【Youtube】WebM・WebPを見守るスレ【Chrome】 (671)
【初心者】Google Earth 質問・相談室【歓迎】01 (193)
google板の名無しを決めよう (544)
Googleを使い続けるスレ (105)
Google日本語入力 サジェスト9候補目 (132)
【贔屓】<# `Д´>アイゴー!【他タレ】Part491 (671)
☆キム・ナムギル☆ part53 金南佶 (304)
基地外大野智ヲタの悪行を語るスレ 202 (409)
--log55.com------------------
●●●●●チョンのバカ面のエラを鉋で削ろう!w
日中友好 乾杯
■■■ ネ ト ウ ヨ 無 職  (笑)  ■■■
■■ ネ ト ウ ヨ ゴ ミ 無 職  ■■
好きな中国文化
中国はこのままでいい?
中国人観光客
【在日中国人】 棚橋泰文 【障害者】