LIQUIDリキッドコーディング

デザインデータの横幅をブラウザ幅と捉え、ターゲットデバイスの大きさに合わせて、常に同じ縮尺で見えるよう制作するHTMLコーディング手法です。

リキッドコーディングの特長

横スクロールバーが出ず、常にコンテンツ全体を表示することが出来る
ブラウザ幅を100%と捉え各要素の大きさを調整するので、コンテンツが見切れることが無く、常に同じユーザ体験を提供できるHTMLコーディングです。
単に拡大／縮小するのではなく、各画面に「最適化」させます
リキッドレイアウトを拡大／縮小での表示と捉えるのではなく、フォントサイズや画像解像度、左右の要素数を画面サイズに応じて調整した、画面別の最適表示と考えることで、より見やすいページ制作を行います。
レスポンシブコーディングと併用して制作が可能
レスポンシブコーディングではメディアクエリを用いて画面サイズ別の表示要素の切り替えを行います。リキッドレイアウトと組み合わせることにより、より最適な画面レイアウト構成を行うことが出来ます。

※縦の長さが5,000pxまで。それ以上の場合は別途ご相談ください。
※休日、定休日は日数に含まれません。
※弊社は初期費用やCSS作成費用は一切頂戴せず、ページ単価でお見積もりしております。詳細は是非一度お問合せください。

ご利用の流れは５ステップ。の番号はお客様フローになります。

STEP
お見積り・ご注文
プロジェクトの詳細をお見積りフォームからお送りください。担当営業よりお見積りURLをお送りいたします。
ご注文はお見積りURLにあるご注文ボタンから簡単にできます。
またデザインからの制作も可能です。詳細はこちらをご覧ください。
STEP
データ入稿
デザインデータと当社フォーマットのサイトマップ、及びコーディング指示書（任意）をご入稿いただきます。
フォントサイズもリキッドにすることも可能ですので、その場合はサイトマップ内で明記ください。
STEP
コーディング
弊社にてHTMLコーディング制作を行います。
別途お渡しする管理シートにて、ページ毎の進捗状況を確認いただけます。
STEP
テスト確認
弊社で準備するテストサーバー上で確認いただきます。
調整等ございましたら別途お渡しする「課題管理表」からご連絡くださいませ。
STEP
調整・ご納品
「課題管理表」にご記載いただいた内容を対応しご連絡いたします。問題なければZIPファイルにてご納品いたします。
本番サーバへのアップロードをご希望の場合は、担当営業までお申し付けください。

どんな大きさの画面でもデザインと同じようになりますか？
基本的にはデザインと同じ大きさが等倍で縮尺されていくようになりますが、ブラウザやOSによっては表示できるフォントサイズに制限がある場合がありますので細かな差異が出る場合もあります。過去の制作経験より、最適なサイズとレイアウトに調整しながら、デザイナー様のご要望に最大限お答えするようしております。
レスポンシブコーディングと同時に依頼も可能ですか？
はい、可能です。その場合は各画面サイズにおいてどのように表示したいか、デザインデータ等でご指示ください。
フォントサイズは固定のまま、要素の幅だけをリキッドにすることは可能ですか？
はい、可能です。コーディング指示書にてご指定いただくことができますので、詳細は担当ディレクタまでお問い合わせください。

お急ぎのプロジェクトは、リソース確保をお早めに！リモート、遠方の方はオンライン相談が便利です。

お電話でお問合せ

03-6806-0354

CODING SAMPLE

弊社ではPUG、およびSASSを用いてコーディングを行い、必要に応じてWordPressテーマを独自開発いたします。
PUGやSASSのサンプルデータ、WordPressテーマデータ、またコーディングルールが必要な場合はこちらよりお問い合わせください。

OFFICE
弊社の営業拠点をご案内しております。
機密情報保護の観点から、ご来社の際は事前登録が必要です。まずはお問い合わせください。
TOKYO

〒101-0021 東京都千代田区外神田
6-11-16 GMビル5階　(GoogleMap)
OSAKA

〒541-0044 大阪市中央区伏見町
4-4-9 淀屋橋東洋ビル3階　(GoogleMap)
VIETNAM

VINA GIAY PLAZA,
180-182 Ly Chinh Thang, Phuong 9, Dist. 3, Ho Chi Minh city, Viet Nam.(GoogleMap)
FRANCE

24 Boulevard Gambetta, 62200 Boulogne-sur-Mer, France. (GoogleMap)