レスポンシブレイアウトのカテゴリアーカイブ

bliskio.jpgBLISKというWEBブラウザを使い始めた。なにが便利かというと、スマホ画面とPC画面の両方が同時に表示されて、上下のスクロールも同期するので、PCとスマホの画面チェックにはとても便利なのである。
利用にはダウンロードしてインストールする必要があるが、GoogleChromeと同じエンジンを使っているようなので、Chromeを使っているPCだと問題なく利用できる。基本的には無料で利用できる。ログインして有料版にして使うとスクリーンショットのクラウド保存など種々の高度な機能が付加されるが、とりあえずは無料版で十分。なので、ログインを求められてもログインせずに使うとよい。

のブログ記事の詳細を読む

スマホの検索結果に「スマホ対応」が表示されるかどうかスマホの検索結果に「スマホ対応」という文字が表示されてるだろうか?
Googleは2014年12月からスマートフォンの検索結果でスマートホン対応ができているWEBサイトには「スマホ対応」という文字を表示するようになった。スマホ対応できていないWEBサイトはなにも表示されずに従来どおりである。この変化には検索結果でもスマホを優先する姿勢が現れている。
この措置はこれから数年の過渡的なもの。いずれ、「スマホ対応」が当たり前になればこのような表示されなくなるだろう。そしてそのときはスマホ対応されていないWEBサイトは「スマホ不適正」などという表示になり、そしてそのようなサイトは検索結果の順位が低下し、事実上検索結果から消えていくことになるのかもしれない。スマホ対応が遅れている企業は対応を急ごう。

のブログ記事の詳細を読む

レスポンシブレイアウトをチェックするWEBサイトのレスポンシブデザインをチェックする便利なツールがあった。WEBサイトをパソコンやタブレット、スマフォで閲覧した場合にどのように見えるのかを一度に調べることができる「WebDeveloper」というアドオンである。これまでファイヤーフォックスでは使ったことはある。しかし、今はメインのブラウザがクロームになっているのでしばらく使っていなかった。それが、クロームのアドオン(拡張機能)に「WebDeveloper」があり、「WebDeveloper」で「view-responsive-layouts」というボタンをクリックするだけで、今閲覧しているWEBサイトのPC画面やスマフォ画面の一覧を表示してくれるという優れた機能があった。

のブログ記事の詳細を読む

マメジンのWEBサイトリニューアルマメジン「http://www.mamejin.com/」のWEBサイトリニューアルを実施した。これまでのWEBサイトはMovableType4で構築されていたが、急増するスマートフォン(スマホ)での閲覧には最適化されていなかった。今後スマホでの閲覧はパソコンでの閲覧数を逆転すると見込まれるので、スマホ対応は必須だった。そこでスマホでもパソコンでも可変幅で表示されるレスポンシブデザインのテーマで運用することとした。選択肢としてはMovableType5.2xかWordPressだったが、レスポンシブデザインテーマが豊富なWordPressにすることにした。

のブログ記事の詳細を読む

movabletype6スマフォの画面一部movabletype6はレスポンシブデザインに対応したブログシステムである。レスポンシブのデザインテーマを選択しておけば、スマフォで閲覧したときの画面表示が可変幅なので、サイズが最適化表示してくれるのがメリットだ。実は管理画面もスマフォに最適化されていた。スマフォでブラウザを開きログインしてみると、いつもパソコンの画面で見慣れたMovableType6の管理画面がスマフォ用で表示された。WordPressではスマフォ用のアプリを使うので、MovableType6用のアプリを探していてもないわけである。movabletype6の管理画面はスマフォでもアプリなしで使えそうだ。

のブログ記事の詳細を読む

レスポンシブデザインのメールフォーム問い合わせメールフォームを入れ替えた。これまでのメールフォームはパソコンからの送信を前提にしていたため、スマフォや携帯からだと画面が小さくて送信しにくかった。WEBサイト自体をスマフォでも閲覧しやすいようレスポンシブデザインに変更しているので、メールフォームもレスポンシブデザインに変更したかったのだが、あまりよいメールフォームが見つからなかった。今回実装したのは無料提供されているうえ、設定もわりと楽で一旦インストールすると後の変更はWEB管理画面からできるという親切な設計のCGIである。

のブログ記事の詳細を読む

リアルタイムアクセスこの画像は「tohdamikio.com」のリアルタイム検索。グーグルアナリティクスでは今どれくらいのアクセスがあるかがリアルタイム検索でわかる。その内容はモバイルの増加を示している。現在10名がこのブログを閲覧していて、その内訳は、パソコンからのアクセスが5名、携帯やスマートフォンからのアクセスが4名、タブレットが1名ということである。半数が携帯やスマフォかタブレットからのモバイルアクセスだということだ。この状況はすでに特別なことではない。昨年からモバイルアクセスが増加しており、いくつものWEBサイトではPCよりもモバイルアクセスのほうが多いという状況になっている。

のブログ記事の詳細を読む

レスポンシブデザインレスポンシブWEBデザインとは、1つのhtmlでパソコンでもタブレットでもスマートフォンでも最適表示をしてくれる可変幅対応のデザインCSSである。エージェントで切り替えてパソコン用やスマートフォン用に作成された別々のhtmlを見せる方式は複数のhtmlが存在してしまうため管理がややこしい。これからはレスポンシブ対応を主にしていきたい。
アクセス解析を見ていると、今年に入ってから急激にスマートフォンユーザーのアクセスが増加しており、すでにパソコンユーザーの閲覧数を超えているWEBサイトが多い。この急激な変化にネットショップやブログなどのWEBサイトがまだ対応できていないという例も多い。レスポンシブ対応の近道として、WordPressやMovableTypeなどのブログで、レスポンシブ対応のデザインテーマを選択することである。

のブログ記事の詳細を読む

ドモドモコーポレーション公式サイトリニューアルドモドモコーポレーション公式サイトとPRサイトをリニューアルしてMovableType6で再構成した。今年はパソコンからスマートフォンやタブレットへとデバイスが本格的に移転した節目の年である。いつまでもパソコン表示に照準を合わすのではなく、スマフォやタブレットでの表示でも対応可能な可変幅(レスポンシブデザイン)に転換する必要を感じていた。当ブログは9月にMovableType6のベータ版でテスト後に正式にMovableType6に移行した。そして、本日、株式会社ドモドモコーポレーション公式サイト「dm2.co.jp」ドモドモコーポレーションPRサイト「domo-domo.com」もMovableType6に移行した。

のブログ記事の詳細を読む
このページはTwitter、はてな、Google+、FacebookなどのSNSで以下のような反響があります。
なお、コメントはFacebookにログインしている状態でのみ受け付けております。セキュリティ上の観点からこのようにしております。ご了承願います。
このエントリーをはてなブックマークに追加