昨今のWebデザインのトレンドのひとつが、「フラットデザイン」というものです。Honesty的Bestじゃね?って感じらしいです。参考サイト:【@IT】5分で分かるフラットデザインで、このフラットデザインが流行ったことで「Webサイトの形状」に変化が起こりました。したら、この変化こそがフラットデザインがトレンドである理由なのでは?と思った事件があったので、記事ネタにしてみました。Menuデザイナーに「川の字型サイト」を提出された想定すべき画面サイズってこんなにあったのか...背景がウィンドウいっぱいに広がるフラットデザインデザイナーの方には「何を今更」な記事の気がする。デザイナーに「川の字型サイト」を提出された僕の働いている会社にはちゃんとデザイナーがいるのですが、お客様が外部のデザイナーの方と直接契約することもあります。ある日そんな顔も知らないデザイナーに提出されたデザインが...なんというか、2000年台前半を思い出すデザインでして...端的に言えばこういう。́・ω・`)個人的に、こういうサイトデザインを「川の字型」と読んでいます。非常に古めかしいですが、まぁやれと言われたら従わなければならないのが雇われの悲嘆。気を取り直してコーディングしてみたところ、こうなりました。\(^o^)/僕が仕事で使ってるPCのブラウザwidthは2000px弱。サイトコンテンツの幅が1000px程度。約1000pxが背景画像(ド派手)。想定すべき画面サイズってこんなにあったのか...まず、昨今のデスクトップPCはSサイズのテレビぐらいには画面幅があります。最長2000pxくらいは想定すべき。持ち運び性が重要なノートPCのサイズは従来と然程違わないでしょう。伝統の数字、1024pxや1280px。スマホサイトを作らない(レスポンシブサイトでない)場合、それらのデフォルトの倍率、980pxも想定しなければなりません。レスポンシブの場合は、レスポンシブの仕方によりますがiPadを縦長にしたときの横幅、768pxも無視できません。スマホサイズの現実的な最小widthは320px。これを抑え損なうと痛い目を見ます。...画面サイズってこんなに想定すべきだったのか。背景がウィンドウいっぱいに広がるフラットデザインそこで、昨今のトレンドであるフラットデザインに目を向けてみます。フラットデザインは、セクションごとに大きく色分けをするのが特徴ですが、そうするとコンテンツの内外で背景色を変えるのは厳しいです。よって、フラットデザインでは実際のコンテンツの幅関係なく、セクションごとの背景をウィンドウいっぱいに引くのが普通。デザイン上の副次的産物だと思われるのですが、こうすることで2000px、1280px、1024px、980px、どのwidthで見ても背景が目に痛いことはなくなるわけです。現在、日本において生み出される新しい全てのWebデザインがフラットデザインではありません。グラデーションも影も、使う方は使っていますし、何事においてもフラットが良いというわけでもないでしょう(企業イメージ優先)。背景に関してはこういった風に引くデザインが増えたように思います。いった「フラットデザイン風」が流行している背景はこれなのでは?と思いました。デザイナーの方には「何を今更」な記事の気がする。コーディングだけしていると見えてこない流行の裏側を垣間見た気がしました。(0)FacebookTwitterLINEGoogle+←前の記事数値を割ったり掛けたりして照合したいときにご注意。Other)[MySQL]複数列を条件付きUPDATE[MySQL]SUMしてUPDATE[MySQL]親ごとに枝番をAUTO_INCREMENTPHPやJSやMySQLの対偶とか補集合とか[MySQL]複数行のUPDATEを1回のSQL実行で済ませたい。所用で東急ハンズに出掛けたついでに買い物をしていたところ、健康器具コーナーの骨盤矯正ソファが物凄く座り心地が良くて。人をダメにするクッションなんて目じゃないくらいのフィット感。思わず値段を見てみれば、驚きの7万円。3000円くらいのバランスボールを椅子にしている貧乏人には...ちょっと手が出ない。これの一回り大きいやつだったと思う。闘うfilter:drop-shadow()を複数適用するOfiice2010画像挿入時に「このファイルのインポート中にエラーが発生しました」Amazon商品のProductTypeを調べたい話。jsの連想配列をソートしたかった話。RPGの「敵組織」って大別すると4パターンくらいな話。創作ど素人考察WP5.2.3でquery_posts()やwp_reset_query()が本格的に死んだんだね。脱プラグイン?ぱんくず関数を作ってみる。maxlength属性みたいにinputでバイト数制限するselectタグ、中身が半角と全角の場合で位置がズレる問題。●お問い合わせ○d66をいっぱい振ってくれるツール人気エントリー[Excel]ファイルの破損が深刻なので修復できません。ファイルが保存できないメモExcel慣れしてる人がハマる、googleスプレッドシートの「解析エラー」ブラウザバックしたらjs(jQuery)のイベントが起こってくれないとき、こうすると解決するかもしれない。YMMで作成したファイルをAviUtlにエクスポートするときの初歩的なトラブル対策SQLでJOINするカラムを条件分岐させようとした話inputに半角だけ入力させたいよく陥る「シンボルを見つけられません」の原因覚え書き[MySQL]複数行のUPDATEを1回のSQL実行で済ませたい。[MySQL]warning1292が出たので困ってたらすっごいケアレスミスだった話。昨今のトレンドは「フラットデザイン」なのか、ちょっとわかった話。厨二心を忘れられないプログラマー見習いのブログ。javaWebwebの話。過去記事はWordPress多め。この頃はPHPメイン。C++TRPGTRPGの話。充実させたい(切実)。Game,Taleゲームや漫画、小説などの感想や語り。更新頻度が非リアぶりを物語る。Otherその他の話題。どこに突っ込むか悩んだ記事が行き着く場所。