学び12mg 2019年2月の記録
1日 2日 3日 4日 6日 7日 11日 18日 19日 20日 24日 25日
2月25日「positionプロパティ」
えー、Galleryの拡大表示がおかしい問題、解決したった。
CSSのねー、positionっていうプロパティを弄ったらいい感じの表示になった。
positionプロパティについては索引にまとめて備忘録としておいた。
しかしまだまだ理解も知識も足りないわね。
昨日はツイのフォロワーさんにXHTMLについてチラっと教えてもらって、まだまだ覚えるべきことは多そうだと気を引き締めたぞい。
ちなみにこのHPの宣言は普通にHTML5に習いHTMLだけです。
「できる」に習ってそのまま作ったからheadの部分はモロ「できる」のシンプル仕様。
そのうち作ろうと思っているポートフォリオサイトはまた違う設定で作ってみようと思っているぞ。
ポートフォリオサイトはこのHPをカッコよく作れるようになってから作ろうと思っている。
アレコレ手を出してしまうと後から収拾付けられなくなってたーいへん！ってなっちゃいそうだからなぁ。
あとさりげなくh2のCSSを弄ったけどこれは思ったより合っていないからまた変えていくわぁ……。
今日はささやかな更新となったが、positionプロパティのことを知れて有益だったぞ。
やっぱり少しずつでも毎日勉強を重ねていくべきだ！
あと、とある人に「殺風景なHPね」と言われたから、もっとデザインのアンテナを高くしないといけない！！！
強いられているんだ！！！（古い）
あけみ
2月24日「Gallery改造」
Galleryをカードで表示できるようにした。
そんでクリックすると大きな画像を表示するという憧れシステムを導入！
だがまだ表示が変です！！！
後でまた微調整するよん……難しいね……。
もうね、『detail』のつづりを間違えてずぅ〜っとテキスト通り表示されなくて……といういつものアホをやらかして1時間は消費した。アホなんです。
でも頑張ってるんです！！！
あとはh1のフォントを変更したよ。
というわけで新しくなったけどまだ完全じゃないGalleryページ、よかったら見てみてね〜。
今日も頑張りました！！！ 乙！！！
ご飯食べよ。
あけみ
2月20日「微調整」
地味ではありますが、今日もアレコレ弄っていた。
ヘッダー上のグローバルナビを今までなんと簡単に背景色を授けられるからとh1属性で作っていたんだけどさ、それはまずいという声を頂いて急遽nav属性をCSSで作ってなんとかした。
仕組みが分かるとなんとかできるんだなぁ（大口叩いていますがテキストさまさまです）。
あとはそのグローバルナビのボタン作り直した。
やっとだよ！！！
お前これ作り直すって言って2週間経ってるからな！
しかも作り直してみたら案外簡単だったっていうね……この面倒臭がりさんめ。
それとサイドメニューのコンテンツボタンとh1の段差が気になってたからmarginのtopとbottomを弄ってスッキリさせた。
こういうこまごましたところをちゃんとしないといかん。
職業でやろうと思ってるわけだし、適当は許されんのです。
そんでヘッダー画像を差し替えた。
今までヘッダー内の文字が「学び12mg_study one two mg_」だったんですよ。
いやなんだそれってことですよ。
おめーそういうとこだぞ。
ちゃんと『twelve』に直しました！！！！！！
偉い！！！
本当はh1のフォントも変えたいし、ギャラリーページをカード式にしたいし、h2にも装飾を施したい。日記ページももっとかっこよくしたいしなんつーかもっとかっこよくしたい！！！マウスオーバーで動くボタンも作ってみたい！ページ上に戻るボタンも作りたい……もっと、もっとだぁ！！（強欲）
やりたいことが多すぎて時間が足りない！！！
これから本読む。
あけみ
2月19日「座学」
ヘッダー上のグローバルナビをどうするか考えながらテキストを読んでいたら、午後が終わった…。
やり方はわかっているけどイマイチそれが頭の中で組みあがらないというかー。
今日調子悪いっぽい。
なんとなくCSSとHTMLの関係性がわかってきた。
CSSで授けた変化を上手に組み合わせてHTMLに反映させる。
それがHPづくりの大まかな仕組みなんだなぁ〜ってやっと見えてきたよ。
遅いだろ！！！へへっ！！！
あけみ
2月18日「トップゥ！！」
いやー、満喫した。
一週間の休み、満喫したったわｗｗｗｗｗｗ
いや本当勘弁してくださいあけみさん。真面目になってください。
時間はあるようで無いんですよ！ ふざけないでください！
でも正直本当にこんな休んでいるようじゃダメだと思う……。
継続できないものに明日は無いんだぞ……。
今日はトップページがキズナ物語のままになっていたから、ちゃんとしたものに作り替えた。
これがやりたいけどやり方が分からなくて手間取っていたのはあった（言い訳）。
でもやろうと思ったら1日でできた。
な？？？？？ そんなもんだろう？？？？
これはKindle Unlimitedのレイアウトブックで作った。
出来上がったトップページはこんな感じ。
まだまだかっこよくしたい。
ていうかギャラリーページももう少しマシにしたいわ……。
まだまだやりたいことが尽きない。
ポートフォリオサイトを作ってみてはどうだろうというありがたい言葉も頂いたし、まだまだやりたいことが止まらないぜ！
明日ももっと見やすいサイト目指して頑張ろうっと。
ていうか今日ヘッダーのdivを挿入しようとして"header"を"haeder"と打っていつまでも間違いに気づかず頭をひねらせてたのヤバいよなぁ……。てへ。
あけみ
2月11日「三連休」
いやー、満喫した。
三連休、満喫したったわｗｗｗｗｗ
そりゃーもう勉強をぐんぐん頑張る所存ではあったんだけどね、こう見えてメンヘラな私は思いっきり体調を崩して養生せざるを得なくなっていたのであった……。
ボタンの修正くらい、はよせぇやって感じだ。
CSS3デザインブックをサラッと読んだくらいだったなぁこの三連休。
いやーでも久しぶりにエディタを開くと気が引き締まりますよ。
この気持ちを忘れないように明日からもバッチリガッツリ頑張ろうと思う
ただ、冷静に自分のセンスとか省みると「本当にwebデザイナーなんかなれるんだろうか」というネガティブを発動し始めた。
いや、未来を見て不安がるんじゃない。今目の前のやりたいことに全力を注ぐのだ。
それにね、センスって言うのはアレだよ、才能の類ではないそうだぞ。
センスは磨くもの！という言葉もある！
思ったんだけどさ、体調悪いからってやるべき勉強をせずにごろごろしてると尚の事精神衛生上よくないわ。
「勉強できない自分」に余計辛くなるから、多少のテンションをかけてでも毎日やると決めたことはやるべきだわ。
と、いうわけでエディタ開いたら元気になって来たしまた色々いじくりますかぁ！
今日はテキストが三段組レイアウトについてで、このサイトは三段にしようがないからサブとして残してあるKizuna'a Noteをいじくってみたぞ。
やっぱり読み込むのと自分で触ってみるのとじゃ理解の深さが違うなって思った。
あけみ
2月7日「子リスト」
とま、戸惑いが……私は戸惑いを感じている
なぜかって？ 遡ること昨日、私はCSS3デザインブックを読み始めたんだけど、初歩の初歩の内容からして「できる」と違うではないか！！！
今日はおったまげてそれを読み耽っていた。
いやーHPって奥深いな！？
記憶していたheadの情報記述のやり方からテキストによって違うわけよ。戸惑いだわ〜ていうかXHTMLって何…。
今一度このテキスト読みこんで出直してきますわ……。
やれることは、なんでもやる！
でも「できる」で学んだことは絶対無駄じゃないよ。
あのテキストが無かったら今のテキストの内容もこんなにスっと入ってこなかったと思うし。
と、いうわけで今日は「自分用の索引」にCSSに使われる言語を少し追加して、前々から気に入らなかった表の表示を変更したよ。
あとは索引の言葉が多くなってきたから、サイドバーに子リストを作った。
でもこの表示の仕方はあんまり気に入っていない……要修正。
HPのイメージに合わせてスタイリッシュにしてみたぜ！！！
このHPってスタイリッシュ路線だったっけ……
おっとこれ以上はいけない。
まだまだやってみたいことが多すぎて止まらないぜ！
あけみ
2月6日「索引の整理」
なんか今週忙しい！！
昨日は母親の病院の付き添いで、今日は健診の結果が悪かったから産業医のとこ行ってくる。
困ったね、明日は今日できなかった運動をしないといけないし、明後日も運動だし、勉強いつするのよ。
今日は時間が無かったから「できる」とかネットで見て覚えたタグを索引にまとめて終わりよ。
いや、それだけでもできてよかったと思おう。
昨日はそれすらできなかったわけだし。
索引を作ってみると、意外とHP作りはシンプルなんだなって思う。
「このファイルをここで挿入して、ここはこれを表示します」という指示出しですべてが作られている。
大事なのはそこに合う指示が出せるかで、そういう指示出しのルールを学ぶのが第一歩なんだな。
やっとわかってきました。はい。
その学んだルールをもとにいかにカッチョイイ使いやすいサイトを作れるかがwebデザインなんだなぁ。
楽しくなってきた。もっと色々なタグを覚えて、色々な表現でHPを彩ってみたい。
もっと時間を上手に捻出しなきゃ
あーあ、しんどいしここから離れたくないけど産業医のところに行かないと
明日以降も少しずつ勉強していこう！
あけみ
2月4日「ボタン作り」
FireAlpacaを駆使してボタンを量産していた。
その結果ヘッダ上にボタンを配置することに成功した。
今日はジムに通って時間が無い中だったけどなんとかボタン設置までいけてよかった。
いや18時までにすべて終わらせる予定だったんだけど、日記書いてる現在が17時55分だ。
こりゃー今日は索引の作成は無理そうだ。
社会人の一日は、パートタイマーとはいえ結構忙しかったりするのだ。
私は医師の指導の下ダイエットもしているので、中々運動時間に色々持っていかれる感じがある
頑張るけどね！！！
あぁ〜もう晩御飯作らなきゃ。
今日は結構タイトだったな……。
明日は運動無いからゆっくり勉強しよう。
あけみ
2月3日「フロート」
ワインは太らない説を提唱したい。どうも、順調にダイエットしてる私です。
日曜日の今日は予定通りボックスというか、カラムを分けてみた。
フロートというものを利用してカラムを分けたけど、実際のところフロートがなんなのか理解に至っていない阿呆。
多分隙間を空けてそこにフィットするサイズを指定したボックスがそこに浮かぶように表示されることからフロートと呼ばれているのではないかという予想。
当たっていたら褒めてください
Googleでフロートについて調べたら、「浮き輪、浮船」と出た。
もうちょっと突っ込んで調べようかと思ったけれど、もう疲れ果てた。
午後から絵を描く予定なのに、大丈夫だろうか…。
それにしてもタグをちゃんと閉じていないとか、divタグの指定を忘れてしまうとか、結構初歩的なミスが目立ってなんとも。
まだまだ基本がなっていない。
そもそもタグを打ち込むのがまだまだ、自分でもわかるくらいたどたどしい。
改善の余地とかそういう問題じゃなくて、もっと頑張らなきゃという感じである。
そういえばヘッダ画像に合わせて桜っぽいファビコンも作った。
かーわいいー（自画自賛）。
ていうか今プレビューしたら日記のタイトル見出しタグすら閉じるの忘れてたよ…。がんばれー！
今日の学習「フロートによるカラムわけ」はKindle Unlimitedにあった「HTML & CSS3 レイアウトブック」というテキストを参考にした。
Kindle Unlimitedさまさまだわぁー。
あけみ
2月2日「フォウ」
食えそうなもんなんでも食べちゃう癖、辞めたい。どうも私です。
今日は土曜でお休み。
そんでもって午後から予定が入っているから、午前に早めに勉強をしておいた。
今日の内容は、「できる」をもとにギャラリーページを作った。このサイトだとたいしたギャラリーは作れなかったけども…。
画像要素ほぼ無いもんね。
今日はコンパクトな勉強内容に収まった。
あとやったことといえばシェアボタンを設置したけれど、ここはこだわろうと思えばもっとカッコよくできそうだ。
現状コードをコピペしただけなんで……。
シェアボタンは各社で規定があるなんて聞いたりするから、良く調べてゆくゆくは自分でシェアボタンを作ってみたりしてみたいな。
いい感じにコンテンツが増えてきたから、そろそろ新しいテキストを導入して見た目のブラッシュアップとか機能美の追求とかを始めていきたいところ。
今のぺらーとしたサイトの状態だとアレなので、ボックスを利用してカラムを分けてみたりとかしてみたいなーとか。
やりたいことは尽きない。
まだまだ改良するところだけだ。精進！！！
あけみ
2月1日「盛り上がってまいりました」
いやお前いっつも盛り上がってるだろっていうコレね。いつもの私は私しか知らない罠ね。
始まり方がカオスすぎる……もっとまともに文章が書けないのか私は。
今日の勉強記録だよ！！！ 今日はヘッダーとフッター、ファビコンの追加をした。
更にh1を利用したサイトのタブみたいなのも作ったけど、コレはまだ改良の余地がありそうだよ。
いやブログを普段書いているからわかる、このサイト改良の余地だらけだよ！？
あとプロフィールページをやっと作った。
メールフォームも置いたけどまだこのサイトグーグルにインデックスしていないから無意味も無意味。
正直ねー、こういうサイトはこの世の中を探せばごまんとあると思うんだ。あれ涙が。
学びの中から何か新しさを、見ている人に提供できるようになっていきたいなって思う。
今後の予定としては、更新履歴を表示できるボックスを入れたりとか、サイトの内容をボックスで分けて見やすくしていったり、そういうところを勉強していきたい。
今日の学習で参考にしたサイトをまとめておこう。そういえば今日「できる」を開かなかったな。
ヘッダー、フッター、ファビコンづくり→ホームページ入門サイト様
テキストの中央寄せ→TECH ACADEMY magazine様
参考サイト様、本当にありがとうございます。
これからも精進するぞ！
あけみ
