max-widthで画像のサイズを縮小、拡大する。

最近、PCのみならずスマフォでもコーディングする機会があります。

PC用のサイズに合わせて画像のサイズを指定するとスマフォのサイズでは、ズレてしまうことがあります。

こういうときは、

img{
    max-width: 100%;
    height: auto;
}

と指定することで解決します。

max-widht:100%と指定すると、親要素の幅を超える大きさの画像を自動的に縮小してくれます。  

height: auto;を指定することで、画像を縮小した時に、高さも自動的に調整してくれます。

サイズの違うサイトを作るときに便利な方法でした。

影響されやすい

以前の自分は、かなり影響されやすい人だった。

人の話を聞いた時、自己啓発本を読んだとき、Web記事を読むたぶに自分の考えがコロコロ変わってしまう。本来は、たとえ、成功した方の言葉であっても、自分の意見と違っていても簡単には変わらない。こういう考え方もあるんだと思う程度だ。

自分の考えがコロコロ変わっていたのは、軸がなかったからだと思う。

去年は、改善するためにできることをした。

以前は、自己啓発本をほとんど読むことをやめ、毎週通っていた本屋にも行かなくなった。

facebook,twitter等のSNSを見るのをやめた。twitterは、朝から晩までタイムラインを見て、投稿も毎日のようにしていたが、全く更新しなくなった。

人と会うことをできるだけ少なくした。これは必要だったのか分からないが、人と会うと意見をコロコロ変えてしまうこともあって決めた。人と話すことが好きな自分にはなかなか大変だった。

好奇心が高めの自分がインプットをできるだけ避けてWebの勉強だけを続けた。
インプットを減らした代わりに日記を書いて、出来るだけ自分の頭で考える時間を増やした。

2年前と比べると考えがコロコロ変わったり、影響されやすい自分ではなくなった。 しかし、意見を全く変えないというのはどうかと思うので、バランスが大事だと思うが、かなり難しい。

場所に依存しないセレクタを書く

セレクタを書くときに、場所に依存したセレクタを書いてしまい、他の場所で書けないことがある。違う場所に書くときは、同じコードを書く必要が出てくる。

.header .logo{
    width:200px;
}

.header .footer{
    width:200px;
}

コードを減らすという意味でも、.logoとしてセレクタを書いていくほうが管理もしやすい。

.logo{
    width:200px;
}

ポートフォリオ作成中

進みが遅いですが、ポートフォリオサイトを作っています。
途中ですが、ひとまず公開しました。

Gabu Design

まだサイト自体見せられるような状態になっていませし、ポートフォリオなのにのせられる作品が一つもありません。

今月末にさらに作り直した物が公開することを目標にしています。

3月末には、作った作品を置いていきます。

日記を書くということ

日記というのはわりと昔からいい習慣だと思っていたが、blogを立ち上げては書かなくなってしまうというのを何年も続けている。

考えていることを未来の自分のために記録することを目的にしていたが、人に伝えるということを意識していなかったので、当時の自分が何が伝えたかったのかわからない文章になっている。

自分の認識では、日記は当時の自分が何をして何を考えていたかを知れるものだ。

個人的には考え方に関して、昔と比較してどれだけ成長できたかを知れるようにしたいので、日記は、誰が読んでも伝わり、論理的に書かれた物にします。

Javascript(関数)

Javascriptの関数について簡単にまとめます。

function 関数名(引数){
    関数で実行される動作
}

Javascriptではまずfunctionの後に関数名を定義します。
関数名の後ろの()に引数を指定することができます。

複数引数を指定することもでき、その場合はカンマ(,)で区切ります。

関数は定義しただけは実行されず、呼び出す必要があります。

function aaa(){
    alert('aaa');
}
aaa();

イベントハンドラとしてinputタグに指定することもできます。

<input type="btn" value="ボタン" onclick="aaa()">

遅延評価勉強法

コーディングを初めて何ヶ月かたったので、こういう時は力がついているな、こういう時は力がついていないなというのが感覚的に分かってきました。

遅延評価勉強法という学習法があります。

[参考]
延評価的勉強法
勉強が苦手な人向けの「遅延評価勉強法」
私の言語遅延学習法 - 三つのルール+1

学ぶ必要がでてききたら、その分野について学ぶという学習法です。

私にとってはこの学習法でコーディングをするのが一番力がつきました。
今絶対に学ぶ必要があるというわけではないが、話題になっているからとSass、Javascriptなどを勉強していても学んだ知識の定着はあまり良くなかったです..

その技術で自分のしたいことが実現できたときに一番頭にすっと入ってきましたし、実践でも使えるようにもなりました。

必要になる機会は仕事が一番多いと思いますが、仕事で学ぶことにも限界が来ると思います。最初に比べて仕事に慣れてくると、慣れで仕事をしてしまい、新しい技術の必要性に出会う機会が減ってきてしまう。

そういう時は、出来るだけ新しい技術を積極的に使うというルールを設けて、どんどんWebサイトを作るということが重要だと思います。

まさに今作っているところですが、その中でもともと必要性がなかなか感じられなかったレスポンシブデザイン、Sassなどの技術の必要性を感じ始め、再び勉強しているところです。

私の最近の勉強方法の紹介でした。