WEBデザインの学習の記録

本

主にパソコンスクールで学んでいるWEBデザインの学習の記録を綴っています。

運営しているクリエイター: tommy/tom2f

【WEBデザイン勉強の記録40】jQueryを学んでCSSを思い出す

久しぶりにWEBデザイン勉強の記録の記事を更新します。5月半ばから体調不良が続き、転職活動もしていたためにパソコン教室へいくことができませんでした。 5月はWEBデザイン、プログラミング用のパソコンを購入し、adobeのコンプリートプランも購入したので家でも気兼ねなく自習できる環境になりました！！んー、正直関数が難しかったけどエクセルのsum関数に置き換えて考えると書き方自体はわかりやすかったですね。今回の受講はじつに一か月ぶりなので家で復習・予習していましたが、してなか

【WEBデザイン勉強の記録39】Java Script（プログラミング）は頭の体操

別の記事で詳しく書いたのですが、現在大幅に学習の進捗が遅れておりJava Scriptを学ぶにあたり、出来る範囲で自宅でオンラインテキストを読み自習しました。自習して、復習がてらもう一回教室でテキストを読んだので用語など基本的なことは身についたと思います。でもプログラミングって考えるっていうのがとっても大事ですね。テキストを読んだら理解できる。…でも理解できるのと実際につかえるかは別って感じで練習問題をいくつか間違えてしまいました。間違えたのですが間違え方が「深く考えすぎ

【WEBデザイン勉強の記録36】Code Pen大活躍！

今回もホームページ制作の応用編。応用編だけあってデザインがこだわっていて見た目はオシャレですがコーディングが複雑そうなかんじでした。でも実際やってみるとそうでもなかったです。今回主に入れたエフェクトはアニメーション、マウスホーバーしたときに画像が動く仕組み、グリッドレイアウト。グリッドレイアウトとはマス目にそって画像をいくつか配置する…と言えばいいんでしょうか？説明が難しいですが複数の画像をおしゃれに配置する…みたいな感じです。実際にWEBサイトのページをつくるま

【WEBデザイン勉強の記録35】復習を兼ねつつ応用編の学習。

前回くらいからホームページ制作の応用編に入っています。おしゃれなカフェのホームページです。応用編とはいっても前に学習した内容と被るところも多く復習もしつつ、新しいことも学ぶみたいな感じです。今日も「うまく表示されないなー」ということが何回かありました。原因は「・」を「/」で打っていたり…綴りのミスだったりということばかりでした((+_+))ですが、それ以外は上手くいってて、一つのセレクタに対しての指示を打ったあとは、すぐブラウザで確認するという感じで進めていったので、自分

【WEBデザイン勉強の記録34】スマホサイトの構築

最近は仕事行く前の午前中にスクールで勉強しています。帰宅してからnoteを書いていますが昨日は更新を忘れてました。なので今日のこの記事は2日分の内容を書こうと思いますが、どちらもスマホサイトの構築についてです。コメントをつけて（コメントアウト）どこに何があるかわかりやすくすること（こういう認識で合ってるのかな？？）、スマホのサイズに適用させることなどなど…。スマホ用にWEBページをつくるのって今の時代はめちゃくちゃ大事だと思います。若い人とかパソコン持ってない人多いですし

【WEBデザイン勉強の記録33】emmetを使いこなせれば時短になる…！

今まではトップページをつくっていましたが今回の途中で完成したので、次は下層ページをつくりました。基本的に今までやったことの復習ですがCSSを読み込ませる必要があります。新しいページをつくるに当たり、HTMLも触らなければいけなかったのですが、親の入院があって期間が空いてるためか、かなーり忘れてます。っていうか親が入院してなくても復習を大してしてなかったので忘れてても仕方ない（自分がわるい）。今回はとても役立つこと、emmetという機能を講師のかたに教えていただきました

【WEBデザイン勉強の記録32】疑似クラス、疑似要素を理解してればSEO対策にもなる？？

前回の続きでフレックスボックスを設定…。時々なんだか上手くいかないなぁと思ったら文法が間違っていたり、余計なスペースが入力されていたりしました「20px」を「20（スペース）px」となっていたり単語の「s」が一つ多かったり…(-"-)あほか。今回新しく学んだのは疑似クラス、疑似要素です。文章として意味があまりなくデザインの要素の強い部分に「疑似として」設定することでSEO対策ができる…らしいです。 SEOは検索に引っかかりやすいかどうか…ってことですよね。こちらにつ

【WEBデザイン勉強の記録31】ひたすらフレックスボックスの設定

今日は新たなことを学ぶ…というよりは学んだフレックスボックスをつかってWEBページをより完成に近づける作業をひたすらしていました。講師の方がキービジュアルやメインの画像の配置などが書いてあるA4の用紙を印刷してくださったので、わかりやすかったです。どこに対して何を行っているかを確認しながらやっていけば理解度も早いような気がします。フレックスボックスをつかうことで大分一般のホームページの様式に近づいてきました。別のnoteでも書きましたが就活を始めていて、一件ポー

【WEBデザイン勉強の記録30】ボックスモデルの概要を覚えてればとりあえず大丈夫…？

母親が入院することになってバタバタしていて一週間以上も空いてしまいました。母親の体調がかなり回復して安定しているため、以前の頻度で通学できそうですが、今はもう転職活動を始めており、早く卒業したい気持ちもあるので仕事の日も勤務時間前に予約を入れています。ちなみに転職活動は基本的に「未経験OK」のものです。今回学んだことはボックスについてが主でした。 CSSでボックスを指定することでかなりホームページっぽい見た目になってきました。今回は久しぶりにコードを書いたので基本的な

【WEBデザイン勉強の記録29】外部サイト便利！！&しばらくこのシリーズはお休みします(..)

今回も引き続きCSS。見やすくするため、電話のアイコンなどをサイトに追加しました。アイコンは海外のサイトで簡単にダウンロードできました。電話のアイコンだけでもかなりたくさんあって見ていて面白かったです。画像をアイコン化するサイトについても学びました。アイコン化すればフォントと同じように簡単に色を変えられるので便利です。 Googleフォントもサイトにアクセスしてコピペするだけ！今回は簡単でした。ただCSSのセレクタの指示を、テキストを見ずに自分で考えてそれか

【WEBデザイン勉強の記録28】コーディングは些細な間違いがあとあと響く…。

今日もあいかわらずWEBサイト制作の学習。楽しい…楽しいけど、ケアレスミス多い…。今日したミス一覧・linkをlinlkと書いていた（打ち間違い）・フォルダの整理ができておらず画像が読み込めなかった・画像の指定する部分で「4」とすべきところを「3」と書いていた… などなど枚挙に暇がありません…。多分実際はもっとページ数も多かったりしてややこしいんだろうな…、と思わなくもないので、ある意味今ミスしててよかったかもです。っていうかアホなミスばっかりやんけ…。た

【WEBデザイン勉強の記録27】HTMLの理解を深める。

前回までは「今は意味がわからなくてもいいから、とりあえずコードを真似して書いてWEBページをつくってみよう」という内容、加えてWEBデザイナーの仕事の進め方について学びました。今回はタグの意味を理解したうえでコードを書いてみよう、というセクションでした。前に独学で学習してたこともあって<li>とかのタグもあったなぁ…とテキストと実践編で出てきたとき嬉しくなりました。忘れてるものとかもあったので真っ新な気持ちで受講してますが…。プログラミングとちがっておそらくコーデ

【WEBデザイン勉強の記録26】パソコン教室にて働き方を考える、フロントエンドエンジニア。

英語を入力していると「できるひと」になった気分でとても楽しいです。実際はわからないことのほうがまだ多いのですが、他の人がわたしがパソコンで英字の羅列を打ってるのを見たら「この人すごい！！」って思う人が大半なんだろうなと思います。一見すると難しく感じますがひとつひとつに意味があるので何とか理解できています。今日はHTMLとCSSをつかってWEBページを完成させることができました。ただ「今はまだ理解できなくてもいいから、サイトを完成させる体験をしてみよう」という感じだったの

【WEBデザイン勉強の記録25】ホームページ制作の学習楽しすぎる！！

今回はPhotoshopの残っている節を終わらせて、あとの時間はずーっとホームページ制作を学びました！めっちゃ楽しかったです！！今までillustratorとPhotoshopを学んでいて楽しいのは楽しかったのですがもともとはプログラマー志望で入学を希望してたのでホームページ制作のようなコードを書く作業が楽しくて仕方ありません。でもうっかりするとミスしてしまいますが…(-"-)たとえば「（）」の「）」、括弧のうしろの方だけ抜けてたり…とか。fontをfrontって打って