レスポンシブWebデザイン、CSSフレームワークなど、Webフロントエンド開発に関するBLOGです。
※SYMMETRIC公式BLOGと統合し、ブログ名称を変更しました

2019年

1/2ページ

Datepickerを日本語化/祝日対応/スマホ対応する

 jQuery UIのDatepickerは、日付をカレンダー表示できるウィジェットです。フォームで日付を入力するときに大活躍するのですが、いざ使ってみると「日本語化」「祝日表示」「スマホ対応」をどうすればよいか、悩むことになります。 そこで今回は、jQuery UI の DatePicker ウィジ …

スマホのCookieを特定サイトだけ削除する方法

NO IMAGE

 Cookieを使うWebサイトをテストするとき、特定サイトのCookieだけクリアしたいときがあります。 「すべてのCookieをクリアする」という手順はすぐにわかるのですが、特定サイトのCookieを削除する方法、特にスマホブラウザで行う方法についての情報は多くありません。 そこで、今回はスマホの …

レスポンシブデザインのレイアウトパターンと実装方法

 こんにちは、レスポンシブデザインに代わる開発手法を提供する「GeneCode」開発チームの田中です。 Webサイトをレスポンシブで制作する際に参考になるレイアウトの考え方や参考サイトをまとめました。 レスポンシブデザインについてあまり知らない方やレスポンシブの実装パターンを増やしたい方は是非参考にし …

LP制作会社を比較するための4つのポイント

NO IMAGE

 新たな商品、新たなサービスを立ち上げて、これから集客を行う時に必ずといって良いほど用意するのがランディングページ(LP)です。しかしながら、ランディングページ(LP)をどこの制作会社に依頼するかは迷うところです。そこで、今回は数ある制作会社から自分に適した制作会社を決めるために注意すべきポイントにつ …

ランディングページのデザイン参考まとめサイト4選

 本記事では、スマホ向けのLPの制作を依頼する前に必要なデザイン調査の際に、参考にしたいまとめサイトを、4つ紹介します。 LPの制作を依頼する際に、イメージしているデザインを制作側に共有することで、依頼側と制作側のギャップを少なくすることができるので、制作依頼前のデザイン調査はとても大事です。 スマホ …

スマホのランディングページの基本構成

 ランディングページは通常のWebサイトのトップページとは異なります。ランディングページは1ページ内で集客したユーザーを特定のアクションへ導くために作り込まれたページになります。これからランディングページを作成する時にどのような構成にすると良いか迷った時に抑えたい基本構成をここにまとめます。 しかも、 …

レスポンシブ対応するためのCSSの書き方

NO IMAGE

 こんにちは、開発チームの宇都宮です。普段はレスポンシブと同様のマルチデバイス対応を実現する「GeneCode」に携わっています。 今回はレスポンシブデザインでWebページを作る際の基本テクニックをご紹介したいと思います。レスポンシブデザインというのは、スマートフォンやPC、タブレットといった異なる画 …

レスポンシブサイト用ブレイクポイント考察!時代に適するサイズとは?

NO IMAGE

 こんにちは、開発チームの青木です。普段はレスポンシブと同様のマルチデバイス対応を実現する「GeneCode(ジーンコード)」に携わっています。今回は、レスポンシブサイト用のブレイクポイントについてお話していきます。 2019年発売のスマホ端末の状況も鑑みて、今年の適切なブレイクポイントは480px/ …

レスポンシブデザインの確認が簡単に出来るChromeのデベロッパーツールの使い方

 こんにちは、開発チームの田中です。普段はレスポンシブと同様のマルチデバイス対応を実現する「GeneCode(ジーンコード)」に携わっています。 今回は、レスポンシブデザインの確認が簡単に出来る、Chromeのデベロッパーツールの使い方についてお話していきます。 レスポンシブデザインでWebサイトを制 …

レスポンシブ対応ページの簡単な作り方!導入部分を解説します。

NO IMAGE

 こんにちは、開発チームの青木です。普段はレスポンシブと同様のマルチデバイス対応を実現する「GeneCode(ジーンコード)」に携わっています。 今回は、レスポンシブ対応ページの簡単な作り方についてお話していきます。 ウェブページをどう手を加えればレスポンシブ対応したことになるのでしょうか。これにはい …

Page Top