見出し画像

【WEBデザイン学習日記-102】 なかなか進まないレスポンシブ対応

2024/1/13(土)~の学習日記です。年始はずっと個人制作のコーディングにかかりっきりだったのですが、バランスよく色んなことをせねばと数か月ぶりにPhotoshopを使ってバナー模写をしたり、学習動画でhtml/cssのプロパティの使い方の復習などもし始めました。Photoshopの操作かなり忘れてる・・・

☆★☆ ☆★☆ ☆★☆

2024年1月13日(土) バナー模写1時間40分&個人制作のレスポンシブ対応1時間半

今日も寒いですね。
エアコンを長い間つけていると温風で目は乾くし気持ち悪くなってくるので、手がかじかみすぎて作業が進まないという限界に達するまでエアコンはつけていません。もこもこの上着を来て、ひざ掛けをかけて、お腹に貼るミニカイロをくっつけてWEBの学習をしています(笑)。

今朝は水曜日に依頼をいただいた市場調査のデスクリサーチを2時間半ぐらいかけて8割ぐらい進めました。以前は平日の夜はWEBデザインの学習に時間を割きたいので、市場調査は週末まで手をつけず週末に一気に調査をして納品という方法を取っていましたが、貴重な週末に何時間も時間が消えるのでこれも効率が悪いと毎日少しずつ調査を進めて仕上げる方法に変えました。市場調査のお仕事もコロナ禍の2020年7月から始めさせていただき3年半になりますが、WEBデザインで案件が取れるようになったら、そちらにシフトをしたいなと思っています。悩むところ。

夜は数日前から始めたバナー模写の続きでスクールのバナートレース30本ノックの21日目を完成させ、去年の5月から始めたバナートレースも残すところ9本となりました。模写だけでなくオリジナルの制作物も増やしていきたいところ。

以前はPhotoshopの操作に慣れるため&デザインの引き出しを増やすために毎月せっせとトレースをしていましたが、10月からポートフォリオ、個人制作にとりかかっていたためFigmaを使用してのデザインやコーディング中心でした。数か月Photoshopに触っていないとやはり操作をかなり忘れてしまうものですね(イラレはもっと忘れている)。グラデーションをかけたいのにやり方が分からず途中で泣く泣く断念。個人制作のレスポンシブ対応を進めながら同時進行でPhotoshopやイラレを触ろうと思いました。

寝る前は個人制作物の下層ページのレスポンシブ対応の続き。昨日学習動画でコーディングの基礎を復習している時に、Visual Studio Code(VSC)の拡張機能のMarkuplintの活用方法のことを再度学びました。VSCを入れた時に色々お勧めの拡張機能も入れたのですが、コーディング中に下記の赤の波線のエラーをあまり気にしていませんでした💦
ある程度コーディングが終わり、最後の仕上げ段階に入ったら赤の波線エラーが出ている所を一つ一つ訂正もしていきたいと思います。

赤の波線でエラー箇所が分かり、どのような訂正が必要なのか教えてくれます

☆★☆ ☆★☆ ☆★☆

2024年1月15日(月) 個人制作のレスポンシブ対応:1時間半

今日からまた新しい1週間のスタートです。今週は久々に有休を取り3連休にしたので、それを励みに頑張れそうです。

今日はWEBの学習にしっかり時間を割くために帰宅後すぐにお風呂に入ったにも関わらず、夕食後に暖かいこたつからなかなか抜け出せず、だらだらゲームしたりテレビを見て数時間過ごしてしまいました。。。今週中に制作物を完成させたいので意を決してこたつから何とか脱出し、明日が納期の市場調査の仕上げ&納品を済ませてからレスポンシブ対応の続きをしました。

最近こたつの誘惑のせいもあって(関係ないか💦)なかなか個人制作のレスポンシブ対応が進みません。モチベーションの維持が難しい中、やりたいこと、やらなくてはいけないことが沢山ありすぎて頭がいっぱいいっぱいになりかけますが、焦らずに優先順位をつけながら一つずつ片付けていこうと思います。

もう23時すぎなので明日の仕事に響かないようにそろそろ寝ます。おやすみなさい。

今日はscripの中の"defer"という存在を学びました

☆★☆ ☆★☆ ☆★☆

2024年1月16日(火) 個人制作のレスポンシブ対応:40分

今日は寒かった!
私が住んでいるところはめったに雪が降らないのですが、今朝は粉雪が舞っていました。朝、車のフロントガラスが凍るほど寒い日もあるので出勤前は余裕を持って早めに出かける準備をしなくては!

夜はなかなかモチベーションが上がりませんが、個人制作のレスポンシブ対応の続き。下層ページのレスポンシブ対応が全て終了し、これから各ページの微調整に入ります。

Markuplintでエラーの赤の波線が出ている箇所を綺麗に修正し、Chromeの拡張機能のHeadingsMapを使って各ページの構造チェック(H1がちゃんとあるか構造がおかしくないか)、アクセシビリティの確認、何度も伸縮させてデザイン、コードの再チェックをしていきます。下層ページでまだ可変がおかしな箇所があるので(Notionにメモ済み)、そこも引き続き調整をしていきます。

平日は帰宅後、夕飯を作って片付けして、洗濯して。。。。と色々やっているとあっという間に21時近くに。それからコーディングに没頭していると気付いたらすぐに23時です。なかなか進まないけど、毎日少しずつ進めます。週末まであと3日、頑張ろうー。

(3連休にやること)
◎ 大昔に撮りだめた写真のネガをレンタルスキャナーで全てスキャンしてSDHCカードに保存し、ネガの断捨離をする作業!(ずっとやりたかった)
◎ 個人制作物を完成させる
◎ 副業案件に応募してみる(ポートフォリオができたけどまだ未挑戦)
◎ 転職活動を本格的にスタート(そろそろスタートさせないと)

☆★☆ ☆★☆ ☆★☆

2024年1月17日(水) 個人制作のレスポンシブ対応:1時間半

このごろ寒さで首回りが痛いです。首元をもっと温めた方がいいのだろうか。先ほど調べたら、冬は寒さで方に力が入りやすくなり、血行が悪くなるので肩こりがひどくなりがちだろうです。温かいお風呂で筋肉をほぐしたり、適度な運動が解消法になるようです(→去年から宅トレサボり中)。

夜は早めにお風呂に入り、家事を済ませて21時から個人制作のレスポンシブ対応の続き。メインビジュアルの画像の可変がおかしな箇所、原因が分かり何とか修正できました。その他製品紹介の画像サイズがバラバラだった問題も解決できました。明日は残りの下層ページ3つの微調整をしたいと思います。3連休まであと2日、頑張るぞ。

Notionの修正箇所リストもかなり消込できました

☆★☆ ☆★☆ ☆★☆

<1/9(火)~1/14(日)の学習目標> 
・WEBデザインの副業案件に1つでも応募する
・個人制作物のレスポンシブ対応を完成させる
・座学(Html/CSSの復習)
・バナー模写1つ完成(Photoshopを思い出すため)

<今後の目標>
★ 2024年1月末までにWEBデザインでの副業案件を1つ取る! 
★ 2024年3月までに今までの経験を活かし、今後にもつなげられる仕事に転職する
★ WEBデザインの学習と制作活動は地道に続けながら少しずつ実績を積む
★ 1月28日のTOIEC試験で800点以上を取る

#転職
#海外
#オンライン
#Webデザイン
#主婦
#制作
#Photoshop
#未経験
#学習日記
#クリエーターズファクトリー
#デザイン
#Figma
#初心者
#コーディング
#ポートフォリオ
#TOEIC

この記事が気に入ったらサポートをしてみませんか?