• ベストアンサー

現在ウェブデザイナーを目指して勉強しています。

現在ウェブデザイナーを目指して勉強しています。 ウェブのスクールには通っていますが、cssレイアウトの基本の部分にしか触れておらず、細かい設定がこれでいいのかどうか迷うことが多いです。 ブラウザ上では表示できても、見た目は同じでもスタイルの設定がかなり違うと思います。 プロの目から見て、このソースはどうなのだろうと悩むことばかりです。 htmlのソースはほかのページを参考にできてもスタイルの記述内容はみることができないので、悩みます。 スタイルのソースをチェックするのに、何かいいサイトやコミュニティーはないでしょうか? どなたか知っている方がいたら、教えてください。

質問者が選んだベストアンサー

  • ベストアンサー
  • abril
  • ベストアンサー率69% (388/560)
回答No.1

> htmlのソースはほかのページを参考にできてもスタイルの記述内容はみることができないので、悩みます。 ?勿論、CSSファイルも見れますよ。「htmlのソース」を見る方法を知っておられるなら、そのソース内の<head>~/head>内に参照しているCSSファイルの記述も必ずある筈ですので(下記の様な感じで)。 <link rel="stylesheet" media="screen" href="/common/css/hoge.css" /> これでCSSファイルのパスがわかりますから、あとはブラウザで直接表示させても、ダウンロードしてエディタで開いても。 JavaScriptでCSSファイルが振り分けられている仕様のものもありますが、それもJSファイルの内容を追っていけばわかります。 Firefoxを使用されてるなら、Firebugというかなり便利なアドオンがありますので、試してみられては。 【参考】https://addons.mozilla.org/ja/firefox/addon/1843/ > スタイルのソースをチェックするのに、何かいいサイトやコミュニティーはないでしょうか? この「チェック」というのが「CSSファイルの記述内容を見る」というのであれば上記の通りです。 HTMLの文法チェックの様なCSSが文法的に正しく記述されているかどうかをチェックしたいのであれば、W3C CSS Validatorというサービスがあります。 【参考】http://jigsaw.w3.org/css-validator/ 勿論、上記はあくまでCSSのルールに準拠した記述ができていいるかどうかのチェックしか行えませんので、「プロの目から見て、このソースはどうなのだろう」という事を採点してくれるわけではないです。 > ブラウザ上では表示できても、見た目は同じでもスタイルの設定がかなり違うと思います。 カラム・レイアウトのやり方一つとっても方法は一つではないので… とにかく色々なサイトのCSSを覗きまくって、解析して、引き出しを広げて行くしかないですね。

eriko123
質問者

お礼

回答ありがとうございます。 どうしていままでcssソースがみれないと思い込んでいたのか、、、、。 早速ためしてみました。みれました。 質問を投稿してみてよかったです。abrilさんのいうとおり、いろいろなサイトのソースやスタイルを参考にして、自分の表現の幅を広げていったり、引き出しを広げていくしかないですね、、、。

その他の回答 (1)

回答No.2

プロではないのですが・・・ コーディングコンテストというものがあったりします。 まずはソースを見るのではなく、フォントサイズを変えたり、ウィンドウサイズを変えたりしてどういう意図でそのスタイルが適用されているのかを見ると良いと思います。 レイアウトは崩れないが文字がはみ出したり、レイアウトが崩れても文字は読めたり、場合によってはレイアウトも崩れず文字も読めたりします。 特に2つめのリンクにある作品では、サイト内検索がそういうユーザビリティへの配慮が大きくでてくるので見てみると良いのではないでしょうか。 http://css-happylife.com/log/coding-contest/000153.shtml http://lp9cc.pxgrid.com/#受賞作品

関連するQ&A