本日の授業まとめとサイトレビュー
皆さんこんばんは（こんには）
Tomomiです。
昨日は忙しくサイトレビューできませんでした…
今日は授業も盛りだくさんだったので、
張り切ってまとめて行きたいと思います！
本日の授業まとめ
今日はHTMLの基礎、VScodeの使い方、タグ・要素・属性について学びました。覚えることが多く、授業中は理解できていると感じるのですが、
こうして書き出してみると、「あれ。これなんだっけ…」ってなってしまっているので、今日ここで書けなかったことで疑問に思ったことはメモして明日先生に伺おうと思います。(笑)
エディタについて
HTMLを使用するとき、エディタが必要になります。
代表例としては
Visual Studio code
Atom
Sublime Text
メモ帳／テキストエディット
Terapad（ほぼメモ帳
Adobe Dreamweaver
以上が代表的なものですが、
今回私はVisual Studio codeを学んでいます。
ですので、自宅PCでも早速VScodeを入れました。
今回設定はテキストを見ながら設定を行っていますが、
まだ初心者ということもあるので、
文字の大きさは14→18に変更をしています。
HTMLと用語について
ざっくりとしたHTMLの近年の振り返り
(Ver.4.1から5／ Standardへの変更についてな)を行いました。
それから初歩的な用語の確認と実際に触って練習を行いました。
本日学んだ用語
タグ
要素
属性
タグとは
タグ＝HTMLないのテキストにつけられる目印
例）<p>内容</p>
［ルール］
・すべて半角文字で記述
・大文字でも認識されるが、基本的に小文字で統一する
・開始タグと終了タグのセット（一部、終了タグのないものもある）
・タグ名を<と>で囲む
・終了タグはタグ名の前に/を入れる
要素とは
要素＝タグの内容物のセットのこと
例) <p>内容</p>←これ全体のこと
入れ子＝要素の中に別の要素を構成すること
例）<section>
<h1>見出し</h>
<p>内容</p>※入れ子を使うときは要インデント(Tab)
</section>
属性とは
属性＝タグに何らかの性質を与えるもの
例）<a href=”リンク先のパス” target=”_Blank”>リンク</a>
[ルール]
・開始タグのタグ名の後ろに半角スペースを開けて記述する
・属性の後に＝を記述し、値はその後” ”で囲んで記述する
・複数の属性を記述する場合は、そこから更に半角スペースを開けて記述する
本日のサイトレビュー
今月は最後まで地方自治体HPレビュー月間とし、
一日１都市選んでレビューしていきたいなと思います。
理由としては、不特定多数・老若男女見るサイトにもかかわらず
都市によって力の入れ方に大きな差があるのでは？と予想したためです。
さてさて、本日は我らが北海道から選んでいこうかなと思います。
今回は、北海道 網走市の公式サイトを見ていきます！
【概要】
良くも悪くも行政にありがちな配置に感じる
【ファーストインプレッション】
文字情報が多すぎるのか、見づらく感じる
【メインビジュアル】
画像やイラストがトップ部分と右サイドにしかなく、
それも広告のように敷き詰められているので、
魅力的に感じられる要素が少なく感じる
【レスポンシブ】
スマホを通してみると、情報量が少し減るので、見やすくは感じるものの
やはりそれでも文字が多く、必要な情報が見つけにくいように感じる。
しかし、下のほうにはアイコンから各リンクに飛ぶことはできるので、
その部分には使用者への配慮を感じた。
【あくまでも私見】
たくさん情報が載っているのは時として使用者にとって
あまりよくないことなのかもしれないと感じた。
必要だからこそ、簡素化して早くその情報にたどり着けるように
配慮が必要だし、お年寄りにはこういった形のHPは使いにくい
と感じる方も多いのでは、と予想した。
最後に…
今回はあえてオシャレ！行ってみたい！とはならなそうな
HPを探して選んでみました。
やはり、余白の使い方はデザインやそのWebページを利用する
人にとって見やすいと感じられるように配慮して作っていく
ことが必要なのだと感じました。
ただ、ビジュアルに寄りすぎてもページを開くときに時間がかかったり、
敷居の高さを感じてしまうこともあったりするのでは？とも思うので、
丁度いいところを探していくところにデザイナーとしての力量が
試されるのだな、と思いました。頑張りたいです…(笑)
本日もお疲れさまでした！
明日も楽しさを忘れずに貪欲に学んでいきたいと思います！
それでは～！
Tomomi
この記事が気に入ったらサポートをしてみませんか？