見習いSEの脳内見える化ブログ -10ページ目

見習いSEの脳内見える化ブログ

本ブログは変動の激しいIT業界に足を突っ込んでしまった
しがない見習いSEの脳内見える化ブログです。
基本的には己の知識整理ため、
たまには私と同じく道に迷える同志のためになればと思ってます。

【1tsシーズン】htmlとりあえず触ってみてた編【完】
(第7回)思いつきで手を動かす私がCSSとHTMLを書いてみた。

【2ndシーズン】新しく作成するWebページのイメージを描いてアウトプットしてみた
(第8回)イメージ先行の私がWebページの構成を考えてみた。 

前回までの挑戦

(第14回)HTML・CSSを使いまわしてコンテンツをパパッと作ってみた

今回:http://sysgole.web.fc2.com/design/index9.html

 

遊びのつもりでやったらマジになってたってのは

良くあることです。

これ、面白い。

 

ふむふむ。

4日前の私はこんな事意気込みを語ってましたね。

 

「第3シーズンは、ページに動きを付けるのと、便利機能の勉強にしようと思います。

第8回のイメージでページ遷移的な所をイメージしてましたよね。

ちょっとそこに手を付けていこうかなぁと。

後は、メールフォームやら何やらWebページを構成するパーツを

少しずつ増やしてこうかと思います。」

 

その前は仕事で使うからって、

別カテゴリのブログではこんな事をテーマにしてましたね。

ゆる~~く理解する仮想化~リソースの有効活用って?その1~

ゆる~~く理解する仮想化~リソースの有効活用って?その2~

 

この鳥頭野郎めが!

 

ってとこですね。

まぁ、マイペースでいいんじゃないでしょうか笑

結構、脳みそ働いてるので、別の事やってた方が案外

仕事スムーズにいきそうな気がしてまして・・・。

 

通勤前と通勤後になんかいいイメージ浮かぶかも・・・と

いつもより3駅ほど前で乗り降りして歩きながらアイディアを頭の中で練ってます。

結構ワクワクしながら自宅のPC起動してカチャカチャやってます。

こういうの本職にした方がこの先幸せなんじゃないか俺(; ・`д・´)

 

いや、案外仕事にすると息詰まる可能性もあるのでまだ様子見しましょう。

 

写真は北海道旅行した時に撮影したものですね。

ここのペンションのオーナーが凄くいい人で…と言うのは

別の機会に紹介記事書きましょう・・・。

 

少し今風の形になりましたかね?

そしてCSSで動きが付けられるようになりました。

ただ、中身を完全に理解しているわけではなく、

ここは、何をしている程度しかわかってません。

知識は後々ついてくるでしょう(希望的観測)

 

ここに至るまでの過程は、index変更するときに更新します。

少し気を抜いてお遊びしてたらflexboxにハマった。

 

恐らく、これがどんな画面サイズでもある程度整って見える一番シンプルな構成と思う。

http://sysgole.web.fc2.com/design/index.html

 

最初余計なもの付けすぎて思い通りにいかなかったけど少しずつそぎ落としてみた。

さて、2ndシーズン閉めにかかりますか。
 
 
前々回のスクラップ&ビルドである程度TOPの形が決まり、
前回はそれを利用して、コンテンツの枠だけ作りました。
 
もうあとは、それに従って内容変えてくだけです。
 
とりあえずコンテンツ作ってみた。
 
なんか枠に張り付いてる感じの文字が気になったので、
Paddingしてみた。
 
<p>タグで区切った時の見え方の違いを確認。
 
昔GUIでやたらと使ってたtableもタグだけで作ってみました。
 
後は特に目新しい事はしてません。
しいて言うと、metaタグ追加しました。
 
なんか検索エンジンに見つけてもらったりするために必要なんだって。
まぁ自分のトライ&エラーを積極的に検索エンジンに拾って貰おうとは思わないですが、
多くの人に見てもらった方があーだこーだ色々意見がうかがえそうなので…。
 
第2シーズンここまで。
そうしないと、キリがなくなるので・・・。
 
第3シーズンは、ページに動きを付けるのと、便利機能の勉強にしようと思います。
第8回のイメージでページ遷移的な所をイメージしてましたよね。
ちょっとそこに手を付けていこうかなぁと。
後は、メールフォームやら何やらWebページを構成するパーツを
少しずつ増やしてこうかと思います。
 
※現在、TOPは01100.htmを採用しています。