webデザイナー職業訓練校日記2022/4@16日目

2022年4月19日職業訓練校のウェブデザイナー科の16日目の授業があった。

その日のあったことを備忘録的に記載していく。

まずは自己紹介。

①自己紹介

・げんです。

・24歳

・男

・独身

・ニート

・ウェブデザイン未経験

・とにかくフリーランスになりたいです!!!!

webデザイナー科16日目の授業内容

・席替え

今日はまず席替えがあった。

まだ1ヶ月経ってないのにもう席替えなのかぁぁぁ。。

と、やや残念な気持ちになった。

今の席は出席番号順になっていて、自分の周りの人間は

そこまで陽キャっぽくないのでとても気が楽なので席はできればこのままでいいと思っていた

なのにもう席替えかよ。と思いながら今日を迎えた。

くじ引きを作るのには時間がかかるとかで、グダグダした挙句、結局、挙手制になった。

早めに決めたかったから最前列の左側ですぐに手を挙げた。

結果。今までと1席分前に移動しただけだった。

周りの席の人も同じ考えだったようで、前回とほぼ同じメンツが

自分の席周りに配置されたことでかなりホッとした。

全体的にこの3週間で自分に馬が合いそうな人同士で見つけて

その人達だけでパーチィーを組んで席を固めていっていたようだった。

なんだか高校や、中学のような席替えの時の雰囲気を思い出して

懐かしいような、気持ち悪いような独特な気持ちになった。

ただ、もうこの年で席替えのあの空気感をまた味わえるとは思っていな

かったのでエモい気持ちになった気がした。

・class属性について(div,id)など

授業は徐々に進んでいき、今日はかなり重要な要素である

class属性などについて学んだ。

「class」属性は、主に「CSS」や「Javascript」で指定した要素のスタイルを変更したり、何らかの動作を加えたりする際に利用されます。

<html>

<!DOCTYPE html>
<html lang="jp">
<head>
<meta charset="UTF-8">
<title>Class Sample</title>
<link rel="stylesheet" type="text/css" href="style.css">
<script type="text/javascript" src="sample.js"></script>
</head>
<body>
<div class="sample1-css">あいうえお</div>
<div class="sample2">かきくけこ</div>
<button type="button" onclick="changeButton()">テキスト変更</button>
</body>
</html>

<CSS>

.sample1-css {
color: red;
}

このような感じでcssでクラスで指定したところを一気に名前をつけて

変更しやすくなります。

サイトをコーディングする際に間違いなく多用されるポイントなので

頑張ってマスターしていきたいです。

・GoogleマップやYouTubeの埋め込みの方法について

続いて、カリキュラム外ですが先生に対して生徒から質問があったため

急遽サイト内にGoogleマップやYouTubeを埋め込む方法について

教えてくださることになりました。

Googleマップの埋め込み

以下が大まかな手順です。
1. Google マップで目的地を検索して表示
2「共有」をクリック
3「地図を埋め込む」をクリック
4「HTML をコピー」をクリック
5 コピーした HTML を表示したい位置にペースト(貼り付け)

たったこれだけで簡単にGoogleマップがhtml内に実装されました。

下記が実際のhtmlのコードになります。

これを貼り付ければGoogleマップが実装されます。

<iframe src="https://www.google.com/maps/embed?
pb=!1m18!1m12!1m3!1d3240.827853398542!2d139.76493611522864!3d35
.68124053757879!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2
!1s0x60188bfbd89f700b%3A0x277c49ba34ed38!2z5p2x5Lqs6aeF!5e0!3m2
!1sja!2sjp!4v1594286431753!5m2!1sja!2sjp"
width="600" height="450" frameborder="0"
style="border:0;" allowfullscreen="" aria-hidden="false"
tabindex="0"></iframe>

とても簡単にGoogleマップを埋め込むことができて非常に驚きました。

一気にサイト構築の幅が広がったような気がしました。!!


今日のランチタイムで食べたもの@16日目

今日のランチタイムは前から狙っている歩いて5分ほどのところにある

ラーメン屋が先週チラッとみたらようやく臨時休業が終わっていたため

今日行こうかなと思っていたら、まさかの今日も臨時休業でした!!

ガーン。。。。

なので仕方なく先日行った「品品香」という中華料理屋にいきました。

前回と同じくチャーハンを食べました。

注文から5分ほどでサッと出てきてパッと食べられるのがこの店の良いところ。

こちらのお店のチャーハンはしっとり系ですが味が本格的で中国に行った気に

なれるような美味さです。また、値段も500円で食べられるところが👍

今池に来た際はぜひ立ち寄ってみてくださいね^。

WEBデザイナー科16日目のまとめ

今日は授業開始から3週間ほどですがもうすでに席替えがありました!

自分は前とほぼ同じ場所に席替えしました。

すでにクラスではよく喋るグループとそうでないグループが完全に分たれています。

やっぱりいつの時代もどんな集団でも、陽と陰は交わることは無いんだなぁと確信しました。

自分はやっぱり人と話すのが苦手で、それは大人になったら治るだろうって勝手に信じていたけど、実際はそんなことなかった。

今24歳だけど全然人と話すのが得意じゃない。普通に苦痛に感じる、、。

改めて自分は”フリーランスにならなければいけない人間なんだ。”

という決意を再確認できた日でもありました。

hsp気質の僕にとってはいつの時代もどんな環境もきっと生きづらさを

抱えると思う。だからこそ自分で新しい生き方を模索し続ける必要があると思ってる。

そのための手段の一つとしてWebデザインを学ぶことにしたんだ。

だからどうにか、しがみついて折れずにフリーランスになりたい。

明日はどんな授業があるのだろうか?


そんな感じで職業訓練校についてリアルな授業風景を自分の備忘録的に記録していきますのでよろしくお願いいたします。

僕と同じように未経験からwebデザイナーを目指している方、すでにWEBデザイナーの方などもちろん何となくこのブログを見た方、ぜひお気軽にコメントください!

一緒にWebデザイナー目指しましょ〜

これから職業訓練でWEBデザイナー科を検討している人にとってこの拙い日記が何かの手がかりになれば幸いです。

こんにちは!「自分の好きな植物をカッコよく見せたい!」しかし園芸店やホームセンターにはありきたりな植木鉢ばかりで飽きてしまった方へ。ハンドメイドでオリジナリティあふれる植物雑貨を作っていきます!サポート費用は全額設備投資に充てて良いものを量産し、確実にお客様に還元致します!