インターンシップ３回目
こんにちは。
ちえです。
もう年末になりました。一年が過ぎるのは本当にあっという間です。
冬休みはバイト頑張ります。。。( ;∀;)
先日年内最後のインターンシップがありました。
もうインターンシップも３回目！はやい～
今まで学んだことが自分の力へ昇華できていると信じたい…自学とタイピング頑張ります！
さて今回は
①画像について
②「美しい」は創れる！
③ＨＴＭＬ～遊び編～
の３本でお送りします。最後までお付き合いいただけたら幸いです(*'▽')
①画像について
今までの学習の中で、ＨＴＭＬでは
「<img src="./img/image(フォルダの名前).jpg(拡張子)">」で画像ファイルの表示ができると学びました。
今回はこの画像ファイルにもいくつか種類があると学びました。
〇jpg → 写真向き。圧縮すると画像が劣化する。容量軽め。
〇png → 幅広く使える。背景の透過が可能（ＷＥＢサイト向き）。
圧縮しても変化なし。
〇gif → 小さな画像向き。コマ画像の作成が可能（よくTwitterでみるやつ）。
とりあえずpngは優秀ということが分かりました！
使い分けに注意していきたいと思います～
②「美しい」は創れる！
これは「黄金比 （１×1.168）」と「白銀比（１×1.414）」を使えば、直感的に人が「美しい」と思うものが創れるということです。
黄金比が使われている例 → アンモナイト、Twitterのロゴデザイン
白銀比が使われている例 → 五重塔やスカイツリーなどの建築物、キティちゃん
個人的に「美しい」ことは、「なんかしっくりくる」「違和感がない」と似ていることだと思っているので、上記の例にとても納得しました。
さらに調べてみると黄金比は有名な絵画にも多く見られることが分かりました。
こうしてみると、人が「美しい」と思う気持ちは主観的でありながらも、ある一定の基準があるのではないかと思います。その基準を満たす一つの方法として「黄金比」や「白銀比」があり、その基準を満たすとさっき述べたような「なんかしっくりくる」や「違和感がない」につながるのだろうなと思いました。
もしくは単純に不快感がないのかなとも思いました。「見やすい」とも言い換えられるかもしれません。
デザインにも興味があるので、この辺のことももっと勉強していきたいと思います～
③ＨＴＭＬ～遊び編～
今回はインターンシップはＨＴＭＬを学ぶのも最後ということで、いろんなコードを使って遊びました。
今回学んだコードは
〇<img src="./img/image1.jpg" ←※半角空けて改行
onmouseover="this.src='./img/image2.jpg'" ←※半角空けて改行
onmouseout="this src='./img/image1.jpg'"> ⇒マウスを動かすと画像が変わる
〇<marquee>テキスト</marquee> ⇒文字を動かす
<marquee><img src="./img/image.png"></marquee> ⇒画像を動かす
〇<ol> 〇<ul>
<li>リンゴ <li>ビール
<li>なし <li>カクテル
</ol> </ul>
⇒リストを作る(1) ⇒リストを作る(2)
表示形式 表示形式
1.リンゴ ・ビール
2.なし ※番号付きで表示 ・カクテル ※中点で表示
〇表を作る
<table border="1"> ⇒テーブルの枠線の太さ（数字）
<tr> ⇒trはテーブルの行
<th>見出し1</th><th>見出し2</th>
</tr>
<td>セル３</td><td>セル４</td> ⇒tdはテーブルの列
</tr>
</table>
〇<!--（メモや説明の文章）--> ⇒コメントアウト
※ＷＥＢ上に表示はされないが、説明に便利
多い！ありすぎる…
活用できるように頑張りたいと思います！
今回のインターンシップで目からうろこだったのは、
ＷＥＢサイトの構造は基本的に入れ子構造ということです。
今まで学んできたコードはブロック要素とインライン要素の2つに分別できること、ブロックの中にブロックがあるマトリョーシカのような構造になっていること、この２つを頭に入れておきたいと思います！
今回はこの辺で終わります。
今後も自学とタイピングを頑張っていきたいと思います。
２０１９年お疲れさまでした！なかなかよい１年だった気がします。
では良いお年を！来年もよろしくお願いします(^^)/
