|
|
<Number>: [00000295]
<Date>: 2022/07/22 06:32:06
<Title>:
<Name>: amanojaku@管理人
|
|
|
(メディアクエリは除き)pxなどの絶対単位を使っていると「特定の解像度に依存する」ので、SEO(Search Engine Optimization：検索エンジン最適化)的には当然 マイナスになるので ご注意ください。
もしも プロを目指すなら、(メディアクエリは除き)pxなどの絶対単位を使っていると「特定の解像度に依存する」ので、当然 プロとしては失格と言って良いでしょう。
なぜ SEO的にマイナスになるのか、なぜ プロとして失格なのかは、Chromeのデベロッパー･ツールのモバイル･エミュレーターで「PC、タブレット、スマホ」の各解像度をチェックしてみれば分かるでしょう。
(プロなら6k解像度ぐらいは使ってるかもしれませんが)一般的にはPCにおいては「1k～4k」解像度をチェックしておけば良いでしょう(なのでポートフォリオを作成するならPCにおいては「1k～6k」解像度ぐらいには対応すると良いでしょう、レスポンシブ･デザイン対応も必須です)。
Chromeモバイル･エミュレーターの操作法
http://ashtarte.pa.land.to/utf8/smt.cgi?r+sara/&bid+0000052B&tsn+0000052B&bts+2021/11/29%2015%3A52%3A51&
ピクセル・パーフェクト(所謂 イメージ・パーフェクト)なら、px→vwの換算は四則演算とパーセントの概念さえ理解できていれば特に難しいことはありません(パーセントの計算も単なる四則演算なので、結局のところ全て四則演算です)、アマチュアの勉強用なら1pxぐらいズレても、全然 気にしなくて良いです。
ただし、「@media：メディアクエリ」はプログラムで言うところの条件分岐になるので、初心者には少々 取っつきにくいかもしれませんが。
100vwは「bodyタグのデフォルトmargin、スクロールバーの幅」は一切 考慮されてないので、横幅が はみ出ます(つまり「bodyのデフォルトmargin、スクロールバーの幅」のサイズを引いて計算しなければなりません)。
ちなみにプロの場合はbodyのデフォルトmarginをゼロに設定するようです(その場合はスクロールバーの幅のサイズだけを引いて計算すれば良い)。
スクロールバーの幅を引きたい場合は、スクロールバーを自分でカスタマイズすれば、実際の表示領域を算出できるでしょう(又はJavaScriptで算出するか)。
なお モバイル(スマホ、タブレット)はブラウザの仕様が違うので、スクロールバーの幅はゼロと考えて良いです。
本当に自分の作りたいサイトを(勉強のために)実用的なWebページで作ってネットで公開してみると良いでしょう、自分が本気でネットで公開したい、と言うモチベーションが有った方が学習に圧倒的に有利です。
自分が本当にネットで公開したいコンテンツが有るか、どうかも重要な要素になるでしょう。
無料レンタルWebサーバーは基本的に広告が入るので、広告がウザくない所を探して下さい。
いきなり難しいことから始めずに、初めは簡単なレイアウト(デモ版、パイロット版)からトライしてみると良いでしょう。
実用的なWebページ：ユーザー･フレンドリー(レスポンシブ･デザイン)･Webページ作成の注意点
http://ashtarte.pa.land.to/utf8/smt.cgi?r+twilight/&bid+00000037&tsn+00000037&bts+2021/03/21%2013%3A55%3A19&
Webページにおける基本的な注意点
http://ashtarte.pa.land.to/utf8/smt.cgi?r+sara/&bid+00000231&tsn+00000231&bts+2019/08/12%2011%3A02%3A18&
スクールでは、一旦 pxでWebページを作らせてから、それをvwに換算させてWebページを作らせる授業をやってる所もあるようです。
Webデザイナーはpxでデザインカンプを作りますが、コーダーはpxをvwに換算しなければならないので、その練習として そのような授業をしていると思われます。
そのスクールのようにpxでWebページをコーディングしてモックアップを作った方がコーディグ･スキルとしては明らかに向上するでしょう(ただし凄く根性が必要ですが)。
なので、そのスクールのカリキュラムは、非常に考え抜かれたカリキュラムと言えます(根性派ならオススメ)。
(普通 そこまでの根性は無いでしょうから)pxでWebページをコーディングしなくても良いので、(Webデザイナーのように)pxでモックアップを作って、それをvwに換算してWebページを作成してみると良いでしょう(WYSIWYGエディタでWebページとしてモックアップを作ると分かりやすいでしょう)。
また、今まで自分が作ったWebページをモックアップに見立てて、それをvwに換算してWebページを作り直すのも良いでしょう。
既存のページならChromeの検証モードでサイズを確認できます。
初心者向け！Chromeの検証機能（デベロッパーツール）の使い方
https://saruwakakun.com/html-css/basic/chrome-dev-tool
検証モードにして、チェックしたい要素をクリックして、デベロッパーツールの右側のパネルの[Computed]タブを選択すると、その要素の全てのプロパティーと その値をpxで参照できます。
もし、フロントエンドを目指すなら、下記のコードを見ずに、CSSで その挙動を再現できるレベルを推奨します。
CSSデモ集(-)
http://ashtarte.pa.land.to/utf8/smt.cgi?r+twilight/&bid+0000025C&tsn+0000025C.&
コロナの影響でWebページ作成の案件数が減少し、コーダーなどが余っている状況で、(出来ない可能性の有る)未経験者に案件を出す必然性は全く無いので、この状況で「未経験者OK」と言う案件が有ったら違約金狙いのサギの可能性があります。
(違約金 狙いのサギで無くても)仕様に準拠してない、納期に間に合わないなどで、違約金のようなモノが請求される可能性はありますが。
|
|
|
掲示板に書き込む前に必ず この ”注意書き”を お読み下さい．
http://ashtarte.hotcom-web.com/utf8/smt.cgi?r+rpr/ を ご利用 下さい。
