webサイト制作の勉強|2019年10月クラス用ブログスマートフォン用の表示で見るwebサイト制作の勉強|2019年10月クラス用ブログファリカテクニカルアカデミーのwebサイト制作科の授業解説ブログです。フェリカテクニカルアカデミーは池袋にある求職者支援訓練の学校です。レスポンシブデザインレスポンシブデザイン2020-02-10スマートフォンでのナビメニューレスポンシブデザインナビゲーションメニューの押し易さ(使い易さ)というのはページ全体の使い易さに繋がる為、非常に大切です。PCレイアウトの場合は、ある程度大きい面積の中でホバーアクションと組み合わせる事で、ある程度の解り易さは確保出来ます。emは親要素のフォントサイズをそのまま継承します。次にremを使ったフォントサイズの指定を覚えましょう。今回トレースするサイトは非常にシンプルで今時な感じがする全画面を使ったグリッドデザインで出来たサイトです。今の段階で細かい部分の作りをするのは少し難しいので、まずはワイヤーフレームのようにレイアウトのみにしぼって作っていきましょう。レスポンシブデザインレスポンシブサイトでは、読み込み時だけで無く、ブラウザーをリサイズした時にもイベントが反応するようにしなければいけない場合があります。PC時では通常のナビゲーションボタンでスマホ時にはハンバーガーメニューの時などです。Retinaディスプレイの特徴は画面解像度の高さにある。3GSと同じ3.5インチのままであるが、Retinaディスプレイの搭載によって解像度は320×480ピクセルから640×960ピクセルに、つまり倍になってい...高解像度ディスプレイへの対応2019-11-18レスポンシブデザイン実践1レスポンシブデザイン今までの内容を踏まえて実際にレスポンシブサイトを制作していきましょう。シンプルな2カラムレイアウトをレスポンシブ化してみましょう。Module)はCSS3の新しいレイアウトモジュールで、複雑なレイアウトを今までより少ないコードでフレキシブルなボックスを組むことが出来ます。以前からあった技術ですが、各ブラウザーによって書き方が違ったり、仕様が変わった...Flexboxの使い方2019-11-15グリッドレイアウトレスポンシブデザイングリッドレイアウトとはグリッドとは「格子状の」という意味がありますが、画面をいくつかのサイズのブロックで組み合わせ、コンテンツを配置していく画面設計手法のひとつです。Design)とは、PC、タブレット、スマートフォンなど、あらゆるデバイスに最適化したWebサイトを、単一のHTMLで実現する制作手法です。ブラウザーのスクリーンサイズを基準にCSSでレイア...レスポンシブデザイン基礎プロフィールid:yachin29webサイト制作の勉強について解説しているブログです。ブログを報告するスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。