akira_maruのブックマーク - はてなブックマーク

[Web制作]iPhoneサイトで表示崩れが発生した時、実機とMacを繋いでWebインスペクタ機能でデバッグする方法
こんにちは、霙(@xxmiz0rexx)です。スマートフォンサイトを制作している時、たまーに困ることがあります。それは、実機でしか再現しない表示崩れ。 Macでみた時は大丈夫だったのに、何故かiPhoneでは謎の余白が…なんてことが先日もありまして、解決のためにSafariのWebインスペクタ機能を使ってみましたので使い方をメモしたいと思います。 Webインスペクタ機能とは iPhoneで見ているページのソースをMacで見ながらデバッグできる機能です。使うには双方へのちょっとした設定と、お互いをケーブルで繋ぐことが条件。みんなだいすきGoogle Chromeの開発者ツールと同じようなものですね。必要なもの 1.Mac 2.iPhone 3.ケーブル次の章で使い方を書いていきたいと思います。 Webインスペクタ機能を利用する手順 1：iPhoneとMacをケーブルで繋ぐまず
akira_maru 2015/05/21
iphone

webinspector
リンク
WordPress管理画面にオリジナルメニューを追加した時の手順メモ
前回もちらっとメモしたんですが、もっと具体的な内容も覚えておきたいので改めて実際のコードとともに手順をメモしたいと思います。オリジナルの管理画面を用意しておくと、クライアントさんがサイトの更新を行う場合に安心して更新をお任せできますｗゴールはこれ。不要なダッシュボードウィジェット、左メニューなどをすべて非表示にし、オリジナルで用意したヘッダー＆メニューを差し込みます。デフォルトの管理画面は高機能な分、メニューがずらーーーっと並んでおり WEBに詳しくない方にとっては何が何だか分からないものですからね。ここは一思いにばっさりと切り捨て、クライアント専用にやさしいシンプルな見た目の管理画面を用意してあげることで大幅に間違いが減りますし、説明の時間も短縮できると考えてます。ちなみに、上記キャプチャに表示されているメモは『Headache With Pictures』というプラグ
akira_maru 2012/09/07
customize

admin

wordpress
リンク
WEBシステムのデザインについて今の会社を退職する前に私が後輩に伝えたこと
このたび会社を退職することが決まり、デザインについてほとんど初心者である後輩に対して私の思考を託す時が来ました。私自身WEBシステムの制作を手がけたことはなく（ないのかよ！！と全力でつっこんでおｋ）今度のプロジェクトでうちのチーム初のWEBシステム制作案件があるそうなので、デザインする時のポイントなどを自分なりにまとめてみました。私は携われないんですけどね＼(^o^)／様々なWEBシステムのデザインよいデザインはデザインをする対象（今回はWEBシステム）のことを知らなければ出来ません。自分の考えだけでデザインをはじめると、思考の偏った使いにく～いものになってしまう恐れがありますので必ず調査をしましょう。そして、何故その要素がそこに配置されているのかを考えましょう。以下に様々なWEBシステムのキャプチャと超稚拙で言葉足らずな安易すぎる説明を掲載します。ですが、掲載されてい
akira_maru 2012/03/23
layout

webdesign
リンク
1