再スタート

しばらく沈滞していましたが、ようやくリスタートできそうです。
『何かを作りながらルールを使って作ってみて経験を積む』をしなければいけないのですが、『何を作ろう』という根本的な部分で、適当だと思える案が得られませんでした。もちろん、最終的に作りたいものがあってこの初歩の勉強から始めているのですが、それを作れるようになるのはもっと先の話です。
『1から新しいものを作る』というのがどうもハードルが高いです。そこで、『現在あるページを基にちょっとよいページへ変えて作ってみる』を考えてみることにしました。
「このページ、こういうレイアウトにしたらもっと映えるのに」という感覚を利用してみます。
このプランの良いところは、『コンテンツが既にあり、ある程度整理されている』というところです。
これから以下三点の視点でを作業していくつもりです。

 … マークアップで打ち出したものをどうレイアウトするかを書き出します。photoshopやillustlatorで書き出す能力もないため、ここもいずれ勉強しなければいけません。

 … 文書型宣言、head、body等を手打ちして、コンテンツに合わせて書き出せるようにします。

 … 現在あるコンテンツが別のレイアウトに合わせて組み替えられるまでを、一括りとします。

  • ソースは見ない

 … この作業全体で、元ページのソースは開かないことにします。他のサイトのソースは参考可とします。

現在、地元のスーパーのページを基に進めています。
マークアップへの書き出しは順調でした。
初めてテーブルタグを組みました。面倒に思えていましたが、やってみればなんとかなるものです。
ガンガンガンと組んでいましたが、CSSに突入してすぐに詰まります。ここからはチマチマやらないといけないと思います。
今日はここなどを見ながら作業していました。
#1: Converting a Photoshop Mockup (part 1 of 3) | CSS-Tricks