skillup

技術ブログ

デザイン

pcサイトのコーディングに関しての注意点。

投稿日:

PCサイトのコーディングをしていて気づいたことなど。

最近スマホばっかりやっててPCサイトのコーディング自体ものすごい久しぶりでした・・・

  • 幅が縮むということを常に意識する。
  • 縮めた時にページが崩れたり、横に突き出さないかを要チェック。
  • 上記対策などはsectionブロックごとにmin-widthなどで最小幅を設定するのがおそらく良さげ。
  • 幅が足りない時の調整としてflex-shirnkは結構使える(基本1で設定すると思いますが・・)
  • キャッチ画像をどのように表現するかはかなり大切。
  • JavaScriptのアニメーションはかなり使う機会が多いので習熟しておくと良い。
  • 基本maring autoでセンタリングしているケースが多いと思うが、position abosoluteなどを使っているときはそこそこ面倒臭いので要注意。

思いついたものをとりあえず。

随時更新予定。

-デザイン
-

執筆者:


comment

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

関連記事

no image

compassについて

sassをベースにしたフレームワークがcompassです。 Contents1 compassとは?2 使用方法3 参考リンク compassとは? sassの記法をベースにCSSファイルの作成が可能 …

no image

画面系小ネタposition:sticky+datalist(プルダウン+自由入力)

画面系の小さい小ネタなど。 Contents1 position:sticky2 datalist(プルダウン+自由入力) position:sticky ヘッダーに関して画面をスクロールすると、付い …

no image

flexについて

CSSのflexをちょこちょこ使ってます。 以前下記リンクで超簡単なサンプルは動かしましたが、実践的なことは何もやっていませんでした。 css flexbxについてどんなことができるのか 使って思った …

no image

CSSで背景画像の出力

最近はやりのWEBデザインでよくある、大きな背景画像のなかにユーザー名とパスワードを入力させるような画面の作成方法について。

基本的な …

no image

共通CSSに必要な要素

簡単な業務アプリだとBootstrapなどのCSSフレームワークを使うことが多かったのですが、不必要な機能があることもあり、自作で非常に手軽なCSSを集めてこれを共通のCSSとして使うことが多いです。 …

アーカイブ