レスポンシブデザインのレイアウトパターンと実装方法
こんにちは、レスポンシブデザインに代わる開発手法を提供する「GeneCode」開発チームの田中です。 Webサイトをレスポンシブで制作する際に参考になるレイアウトの考え方や参考サイトをまとめました。 レスポンシブデザインについてあまり知らない方やレスポンシブの実装パターンを増やしたい方は是非参考にし …
レスポンシブWebデザイン、CSSフレームワークなど、Webフロントエンド開発に関するBLOGです。
※SYMMETRIC公式BLOGと統合し、ブログ名称を変更しました
※SYMMETRIC公式BLOGと統合し、ブログ名称を変更しました
LP制作会社を比較するための4つのポイント
新たな商品、新たなサービスを立ち上げて、これから集客を行う時に必ずといって良いほど用意するのがランディングページ（LP）です。しかしながら、ランディングページ（LP）をどこの制作会社に依頼するかは迷うところです。そこで、今回は数ある制作会社から自分に適した制作会社を決めるために注意すべきポイントにつ …
ランディングページのデザイン参考まとめサイト4選
本記事では、スマホ向けのLPの制作を依頼する前に必要なデザイン調査の際に、参考にしたいまとめサイトを、4つ紹介します。 LPの制作を依頼する際に、イメージしているデザインを制作側に共有することで、依頼側と制作側のギャップを少なくすることができるので、制作依頼前のデザイン調査はとても大事です。 スマホ …
スマホのランディングページの基本構成
ランディングページは通常のWebサイトのトップページとは異なります。ランディングページは１ページ内で集客したユーザーを特定のアクションへ導くために作り込まれたページになります。これからランディングページを作成する時にどのような構成にすると良いか迷った時に抑えたい基本構成をここにまとめます。 しかも、 …
レスポンシブ対応するためのCSSの書き方
こんにちは、開発チームの宇都宮です。普段はレスポンシブと同様のマルチデバイス対応を実現する「GeneCode」に携わっています。 今回はレスポンシブデザインでWebページを作る際の基本テクニックをご紹介したいと思います。レスポンシブデザインというのは、スマートフォンやPC、タブレットといった異なる画 …
レスポンシブサイト用ブレイクポイント考察！時代に適するサイズとは？
こんにちは、開発チームの青木です。普段はレスポンシブと同様のマルチデバイス対応を実現する「GeneCode（ジーンコード）」に携わっています。今回は、レスポンシブサイト用のブレイクポイントについてお話していきます。 2019年発売のスマホ端末の状況も鑑みて、今年の適切なブレイクポイントは480px/ …
レスポンシブデザインの確認が簡単に出来るChromeのデベロッパーツールの使い方
こんにちは、開発チームの田中です。普段はレスポンシブと同様のマルチデバイス対応を実現する「GeneCode（ジーンコード）」に携わっています。 今回は、レスポンシブデザインの確認が簡単に出来る、Chromeのデベロッパーツールの使い方についてお話していきます。 レスポンシブデザインでWebサイトを制 …
レスポンシブ対応ページの簡単な作り方！導入部分を解説します。
こんにちは、開発チームの青木です。普段はレスポンシブと同様のマルチデバイス対応を実現する「GeneCode（ジーンコード）」に携わっています。 今回は、レスポンシブ対応ページの簡単な作り方についてお話していきます。 ウェブページをどう手を加えればレスポンシブ対応したことになるのでしょうか。これにはい …
レスポンシブ対応のためのJavaScriptによる2つの切替手法
- 2019.07.17
- JavaScript
- レスポンシブ
こんにちは、開発チームの青木です。普段はレスポンシブと同様のマルチデバイス対応を実現する「GeneCode（ジーンコード）」に携わっています。 今回は、レスポンシブ対応のためのJavaScriptによる2つの切替手法についてお話していきます。 レスポンシブウェブデザインのページで、CSSではメディア …
モバイルファーストの意味とは？
- 2019.07.16
- コラム
こんにちは、開発チームの田中です。普段はレスポンシブと同様のマルチデバイス対応を実現する「スマホのサイト制作。PCは自動変換 | alter.js」に携わっています。 これまではPCからのアクセスが多かったサイトも、今ではスマートフォンからのアクセスの方が多くなっているサイトも増えてきています。 そ …