今日は、前回作成したHTMLのプロフィールページをさらに改良した。背景に画像を入れ、その上に黒い半透明のひし形を配置し、その中にプロフィール内容を書いたことで、以前よりも見た目がかっこよくなった。また、プロフィールページへ飛べるように、自分のサイトにもリンクを追加した。実際にサイトからプロフィールページへ移動できたので、公開までの流れを確認することができた。しかし、プロフィールページから前のサイト画面に戻るボタンやリンクがなく、不便に感じた。次回は、プロフィールページから自分のサイトへ戻れるようにリンクを追加し、より使いやすいサイトに改良したい。
この授業では、前回作成したプロフィールページにCSSを使って装飾を加える方法を学びました。最初はHTMLとCSSの関係がよく分からず、どこに何を書けばよいのか迷いました。しかし、HTMLは文章や表などの内容を作るもので、CSSは背景色や文字の位置、余白などの見た目を整えるものだと分かり、少しずつ理解できました。特に、CSSファイルを別に作成してHTMLのhead内でlinkタグを使って読み込む方法が重要だと思いました。また、画像を表示するときには、imgフォルダの場所やファイル名、拡張子を正しく指定しないと表示されないことも確認できました。相対パスの考え方は少し難しかったですが、Webページを作るうえで大切だと感じました。今回の授業を通して、CSSを使うことでHTMLだけのページよりも見やすくできることが分かりました。
今回HTML プロフィールを書きました。まだ作成過程ですが、少しずつかいていこうと思います。プロフィールの過程を写真で載せます。血液型はわからないので、別の項目にしています。
自分の作りたいサイトをイメージしてそれを実際に形にするのは結構楽しい。記事も少しづつ増えていく感じがまた書くたびにわくわくさせられてた。
オンラインでの取り組みはいろいろ焦ったり、エラーなどが起こったが、少しずつ丁寧に行ったことで取り組むことができた
スライドに沿って行くと、しっかりついていくことができたが、自宅でdrupalのインストールに苦戦しています。次の授業までには終わらせたいです。