Webデザイナーでブロガーな個人事業主”リンゴ”が、【個人事業主・起業家のブログとHPでの発信&集客】【Apple中心にPC&ガジェット】【ワークスタイル】の情報を発信するブログ

当ブログについて

筆者について

リンゴプロフィール

個人事業主・起業家の発信〜集客を月3万円でアシスト
Webデザイナーでブロガーな個人事業主 リンゴ

リンゴをSNSでフォローするならこちら


制作(Web/印刷物)

-

僕自身が携わっている制作物に関しての話題を届けます。

元々、Webデザイナーとして仕事をはじめましたが、Webサイト以外にも、ロゴ・名刺・パンフレット・メニュー表・看板・販促物・パッケージ等のデザインをしています。

「こんな事できる?」って話があれば、気軽にお声がけくださいね!

この記事は「制作(Web/印刷物)」カテゴリーの記事

2017/01/08

制作(Web/印刷物)

Post Title

同じサイトでも見る環境によって全然違う見え方だって知ってました?



制作時にMacで作業していると後で痛い目にあいます。

同じサイトでも見る環境によって 全然違う見え方だって知ってました?

Webデザイナー”Ringo”おはようございます。
美容サロンと一緒に働くWebデザイナー、Re:birth DesignのRingo(@rebirth_design)です!毎朝8時に、このブログをアップしています。

あなたは普段、何を使ってWebサイトを見ていますか?

WindowsPC?Mac?Linux?iPhone?Androidスマホ?iPad?Androidタブレット?ゲーム機?テレビ?Webブラウジングができる端末を上げればキリがありません。

本当に便利な時代になったものです。子供の頃には考えられないくらいネットが身近になりました。

少し話がそれましたが、今日Webブラウザや端末は多種多様ですよね。

その数あるそれぞれの環境によって、同じサイトでも見た目が大きく変わってしまうのはご存じでしょうか?

環境によって変わるサイトの見え方

同じデータを読んでいる全く同じサイトなら、環境が変わっても全く同じ表示になるはず。普通そう思いませんか?

僕もWeb制作に関わるまで、そう思ってました。

だって同じものなんだから。

けど、実際は差がすごく出ます。例として、先日公開したグループ内の美容サロン「BeautyFreak」のサイトで見比べて見ましょう。

2016-12-31-1埼玉の美容サロン「Beauty Freak」【http://beauty-freak.com/

まずはMacBookPro×Safari(OS X)での表示

2017-01-07-1

Macだとこんな感じ。Macのアンチエイリアスが効いた文字はもちろんキレイなんですが、画像もRetinaに対応させているので綺麗な表示ですね。

いつもは、この見た目の環境で制作を進めています。

次にWindoes10×EDGEでの表示

2017-01-07-2

Windows10です。うちの環境だと4Kモニタに出力しているので、解像度も高く画像はRetina同様にキレイな表示。(ただ、画像はキャプチャをする為に表示解像度を横1600px程度に下げています。)

ただ、WindowsだとMacに比べて、、画像下部分の文字が若干ギザギザしているのが気になるところ。(日本一の笑顔はここからはランダム表示の為別画像)

Webフォントという技術を使うことで、昔ほど差はなくなりましたが、デフォルト状態ではやはりMacに劣る印象。

Windows10でキレイになったとは言え、MSゴシックやメイリオと比べればマシになってきたレベルですよね。慣れもあるけど。

iPadだと?

2017-01-07-3

うちにあるiPad Proだとこんな感じ。

Apple製品だけあってMac同様にキレイな表示。ただ、サイトの設定上表示幅が若干狭い印象。余白が両サイドにもう少しあって良いかな?改善の余地ありですね…。苦笑

iPhoneは?

2017-01-07-4

iPhoneだと見え方が違うんじゃなくて、スマホ用の別表示に切り替えています。もはやサイトでは必須になっているスマホ対応。

「4」や「5」、「7」、「7Plus」とiPhoneだけでも端末のサイズがバラバラになってきて、ブラウザの表示域が違います。

これは、昔のガラケーサイトを作っていたときを彷彿とさせますね。あれ大変だったなぁ…。

Android 7インチタブレット?

2017-01-07-5

端末の名前を忘れてしまいましたが、検証用に持っているAndroidの7インチタブレット。

スマホ用の表示になっています。ただ、7インチだとPC用でも見られそうな感じ。フォントも画像も、まぁキレイですね。

なかなか良いですね。格安だったので侮っていました。笑

Androidスマホ…

今ちょっと手元になくて紹介できません…。本来用意するべきですよね。けど移り変わりが早くて用意してられないです…。

ガラケー時代もそうだったけど、多種多様なのはこうゆうところで困りますね。さすがに網羅しきれない。

制作・検証する為の環境を整えるのも一苦労です。笑

まとめ

身の回りにあった環境での表示をざっと紹介しました。紹介したものだけでもサイトの見え方って結構変わりますよね?

できるだけ差の無いように。とは思って制作していますが、古いOSやブラウザ(特にIE)に対応するには時間も手間もかかります。

なので、ご自分のサイトの閲覧者の層によってどこまで対応すべきなのか考えると良いかと思います。

 

例えば、美容サロンの場合は10〜30代までの女性が多いとします。となるとスマホユーザーが圧倒的に多いです。

そんな中でWindows7のIE8(7で一番古いの8でしたっけ?)とか対応する必要ないです。切り捨てましょう!

逆に年配の方向けのサイトなら、古い端末に合わせた制作が良いでしょう。きっと僕らみたく頻繁には買い替えませんから。

「サイト制作」承ります。

というわけで、僕らRe:birth DesignはWebサイトの制作を承っております。

個人で経営されているお店にも自社サイトは必ず必要な時代です。

美容サロン様の場合、ホームページの制作・管理作業を初期費用無し、月額1万・3万・6万円のコース別で承っています。

まずは、お気軽にご相談頂ければと思います。ご予算やサイトのイメージに合わせて、上記以外の提案もさせて頂きます。

「info@rebirth-reverse.com」へメールを送信してください。確認後、ご返信を致します。


  • オススメ記事&スポンサーリンク


この記事が面白い・役に立ったと思ったら、今すぐSNSでシェアして下さい!記事を書くモチベーションが上がります!
  • 起業家・個人事業主の発信×集客はブログを使うべき理由は…↓

  • スポンサーリンク

こんな記事にも興味がありませんか?

リンゴから記事を読んでくれたアナタに

ブログや仕事、PCの事で困ったことはLINEで今スグ、Ringoに相談してください!

RingoのLINE@に登録して、いつでもどこでも何でも即相談

WebデザイナーRingoのLINE@アカウントを開設しました。

LINEから、友人や家族にメッセージを送るのと同じくらい気軽に相談をして頂けます!

これまでに「お店でブログを始めたいけど、どうすればいいの?」や「新しくMacBookを買おうと思うけど、このスペックで失敗しないかな?」等の相談を頂いています。

友だち50人(登録者50人)になるまでは、相談は無料で乗ります!(あと41人)

今スグに「友だち追加」ボタンを押して登録&相談をして下さい!

RingoのLINE@に登録

この記事を書いたのは「リンゴ」

筆者「リンゴ」について

リンゴプロフィール

リンゴをSNSでフォローするならこちら

個人事業主・起業家の発信〜集客を月3万円でアシスト
Webデザイナーでブロガーな個人事業主 リンゴ

Webデザイナーでブロガーな個人事業主のリンゴ(Ringo)です。

当ブログ『リンゴノマド』では【HPとブログの運営&集客】【PC&ガジェット】【ワークスタイル】【制作】に関する情報を毎日発信。

ブログを通してWebやガジェット等、デジタル関連の物が持っているワクワク感を伝えていきます!

仕事は【個人事業主・起業家のブログ発信×集客サポート】を中心に、【ブログ記事の執筆】【Webサイトや印刷物等のデザイン】をしています。

依頼・相談は問い合わせページ、もしくは各SNSにてお願いします。(返事が一番早いのでLINEがオススメです。写真下の『@』アイコンからメッセージ下さい。)

他にも、気になったことがあれば「ブログみた」と気軽に声をかけてください。

詳細プロフィールを見る

リンゴに仕事を依頼・相談する

  • 起業家・個人事業主の発信&集客は、ブログを使うべき理由は…↓

筆者について

リンゴプロフィール

個人事業主・起業家の発信〜集客を月3万円でアシスト
Webデザイナーでブロガーな個人事業主 リンゴ

リンゴをSNSでフォローするならこちら

ブログ全体の新着記事

Apple好きへ

6SからXSに機種変して気づいた日々イラッとさせられる最新iPh…

楽しく生活したい人へ

1・2・3!1・2・3!『プレイステーション クラシック』購入。…

楽しく生活したい人へ

純正GCコンより良い!?『ホリ クラシックコントローラー for…

Apple好きへ

泣きを見る前に!簡単だからMacのバックアップは必ず取れ!Tim…

Apple好きへ

iPadは量販店で買うべき!僕がAppleオンラインストアを使わ…

Apple好きへ

【2018年冬】MacBook vs MacBook Air。選…

新着投稿をもっと見る

制作(Web/印刷物)の新着記事

楽しく仕事したい人へ

SafariでWebサイトを閲覧していると『Webサイトは安全で…

楽しく仕事したい人へ

埼玉県川越のウエディングプランナー『Toi et Moi Wed…

No Image

楽しく仕事したい人へ

CSSを使って”縁取りされた文字”を作る方法は『text-str…

楽しく仕事したい人へ

ロゴ作成で大切にしたいことを踏まえて、自社ロゴを作り変えました。

No Image

楽しく仕事したい人へ

WordPressオリジナルブログテーマ「ググログ」を作成中。

No Image

楽しく仕事したい人へ

ブログテーマを試験的に変更しています。

「制作(Web/印刷物)」の一覧を見る

ブログ全体の人気記事

Apple好きへ

【追記有】Apple PencilとiPad Proの接続が出来…

Apple好きへ

【随時更新】Macで遊べるオススメのゲームをまとめて紹介!(iM…

Apple好きへ

iPadでもIllustratorを使いたい!そんなあなたにはコ…

楽しく生活したい人へ

MacはWindowsに比べて、ゲームに向いていない!?その通り…

Apple好きへ

【検証】MacBookをクラムシェルで使うと、本当にバッテリー劣…

楽しく仕事したい人へ

【追記】ニコちゃんマークこと「スマイリーフェイス」。皆よく使って…


▲最上部へ