レスポンシブの確認がこれで快適に！複数のスクリーンサイズで同時に確認できる無料ツール -Responsively App
レスポンシブの確認ツールやサービスをいろいろ紹介してきましたが、ついに本命とも言える無料ツールの登場です！ Windows, macOS, Linux対応で、しかもオープンソース、快適にレスポンシブの確認ができるResponsively Appを紹介します。5つのデバイスを同時にすれば、制作時間は5倍速くなります。 無料とは思えないほど高性能で、すべてのWeb制作者にお勧めです！ Responsively App Responsively App -GitHub Responsively Appの特徴 Responsively Appのダウンロード Responsively Appの使い方 Responsively Appの特徴 Responsively Appは、レスポンシブのWeb制作に役立つElectronで構築されたブラウザです。 ユーザーインタラクションは、すべてのデバイス間でミ
コーディング作業は無しで、デスクトップ・スマホ向けのテンプレートをすぐに構築できる次世代ツール -GrapesJS | コリス
HTMLやCSSのコーディング作業は無しで、デスクトップ・スマホ向けのさまざまな種類のテンプレートをすぐ簡単に構築できるフレームワークを紹介します。 ランディングページはもちろんのこと、CMSにも使用できるように設計されており、オープンソースとして利用できます。 普通のページビルダーのように見えますが、実際にはより多くの機能を備えています。 CMSもサポート テンプレートを簡単に作成できる Webサイト、スマホアプリ、HTMLメールなど、HTMLベースのテンプレートを素早く簡単に作成できます。 レスポンシブ対応 レイアウトのベースはFlexboxで、デスクトップ、タブレット、スマホに完全対応。 CMSをサポート 動的テンプレートの作成をスピードアップするためにCMS内部で使用できるように設計されています。 HTML, CSSのコーディング作業は無し コーディング作業は一切無しで、テンプレー
レスポンシブWebデザインで、PCとスマホ表示を切り替える方法 – LIQUID BLOG
一般的なレスポンシブWebデザインのサイトでは、画面サイズに合わせてレイアウトするため、 ユーザーがPC表示とスマートフォン表示を切り替えることはできませんが、 PC表示も選択出来た方がアクセシビリティが向上する場合もあると思います。 そこで、下記のようなリンクで表示切り替えできるようにしてみます。 追記：WordPressテーマとプラグインを作成しました。 仕組み ユーザーがスマートフォンなら切り替えリンクを表示 Viewportを変更して表示を切り替える 表示方法をCookieに保存する ちなみに、Bootstrapを利用している場合もこの方法で切り替えできます。 HTML viewport（一般的なレスポンシブの仕様） <meta name="viewport" content="width=device-width, initial-scale=1"> 表示切り替えリンク </p>
CSSのvw, calc()を使用した、レスポンシブ対応のフォントサイズを指定するこれからのテクニック
本文や見出しなどのフォントサイズをスマホ時やデスクトップ時で変える時、通常はMedia Queriesでスクリーンサイズごとに文字サイズを指定していると思います。 ここで紹介するフォントサイズの指定方法はちょっと新しいアプローチで、最初にベースとなるフォントサイズを設定し、スクリーンサイズが大きくなるにつれ、Viewport Unit（ビューポートの単位）で加算してサイズを大きくします。 Viewport Unit Based Typography 以下、各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。 Viewport Unit（ビューポートの単位）とは？ フォントのサイズ指定のためのビューポートの使い方 他の文字の要素をビューポートで指定 縦のリズムとモジュラースケールをビューポートで指定 フォントサイズの指定の精度をアップする さらに精
レスポンシブWebデザインチェックツール | LIQUID DESIGN
スマートフォン、タブレットなど様々な画面サイズのレスポンシブ表示確認が簡単にできるチェックツールです。拡大縮小や縦横回転も自由自在。
食品系ネットショップのデザインはこう作る！ハイクオリティECサイト10選 - ネットショップの壺
ネットショップにおいて、商品の情報や価格と同じくらい、その商品やお店全体の雰囲気を魅力として伝えるために大切なデザイン。 今回は食品を扱うおしゃれなネットショップを集めてみました！ EC-CUBEでつくられたショップもご紹介いたします。 1.小豆島商店 http://shodoshima-s.jp/ 小豆島の特産品を販売するネットショップ。 和テイストのパッケージが引き立つ大小のパネルレイアウトで、レスポンシブもきれいに作られています。 BGMの波の音とあいまって、おだやかな瀬戸内海の風に吹かれているような気分になれるサイトです。 2.Remy お腹の底から幸せになろう。 https://remy.jp/ 料理愛好家・平野レミさんの、アイデア料理やキッチンアイテムを紹介するサイト。 お料理しながらでもレシピを見やすいレスポンシブWebデザイン対応であったり、つくりかたの動画があったりと、細
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【超人気】WordPressのおすすめテーマ20選（有料12選＋無料8選）
レスポンシブ・ウェブデザイン基礎