Share

Web Monsters

レイアウトを崩すモンスター「カラムオチーン」が現れた！

1 suki suki
読み込み中...

プレビューしたらカラム落ち。マークアップ初心者を悩ます「カラムオチーン」

日々忙殺されるWEB制作者の間で存在が囁かれる「WEBモンスター」を皆様はご存知だろうか。懸命に働く労働者に突如として襲いかかる者もいれば、そっと手を差し伸べてくれるありがたいヤツもいるといわれている。
「WEBモンスター」ではそんなモンスターたちの攻略方法を考えるぞ。

カラムオチーン

「カラムオチーン」

ガタガタレベル：★★★★★

サイトのレイアウトを崩す「カラムオチーン」は、プレビュー画面でレイアウトを崩し、経験の浅いコーダーを悩ませる。
適切なコードを記述するまでは、いくらリロードを繰り返しても決して消えてくれない。コーダーの実装や計算ミスにより現れるらしく、今見ているブラウザで大丈夫だったからと油断していると危ないぞ！

おすすめ攻略方法

「しっかり計算」
カラムオチーンはしっかり計算がされていないと出現する。要素の幅、マージン、パディング、ボーダーを全てきちんと計算すれば退治できる！リキッドデザインの場合、%単位での計算になるので注意が必要だ！レスポンシブサイトの場合は各サイズでの設計が求められる。レガシーブラウザの対策も怠るな！

おすすめ武器

「.resizr」
スマホやタブレットなどさまざまなスクリーンサイズをエミュレートし、Webページを表示してくれるオンラインツール。カラムオチーンのサーチに役立つ！
.resizr

経験値

HTML、CSSをしっかりと理解できていれば、カラムオチーンを倒す事は難しくないだろう。
そもそも「カラムオチーン」を出現させないために、実装前に対象のデバイス、ブラウザ毎にしっかりと計算をする事が重要だ！

Monstarlabで一緒に働きませんか。

採用情報を見る

UI/UXデザインに関するご相談や、
案件のご依頼はこちら

お問い合わせ

by Monstarlab Design Journal

Monstarlab Design Journal 編集部です。 モンスターラボデザインチームのデザインナレッジとカルチャーを発信していきます。

View articles

  • Share this article:

Series　Web Monsters

Recommended

View all articles

Tags

How can we help?

お悩みのことがあれば、お気軽にお問い合わせください。

お問い合わせ