一般労働者派遣:(般)13-302759 / 有料職業紹介:13-ユ-302233 ｜会社概要｜お問合せ｜法人のお客様へ｜就業中スタッフ専用｜ログイン│サイトマップ

職種からお仕事を探す　 Webディレクター│ Webデザイナー│ コーダー │ ネットショップ運営│モバイルサイト│ 事務 │ その他　 今週の特集

ネットショップでのPhotoshop活用術 バナーには枠線を引きましょう♪ 日々、暑さが身にしみる日々が続いております。。。 夏は暑くないと困る方も多いとは思いますが、 都内（のかなり端ですが）の暑さは、ナカナカ厳しいものがありますね。 1日PCの前で作業しているので、いつもはあまり意識しないですが、 外出したときには、水分の早めの補給（汗をかく前の補給が良いそうです） 心がけましょう♪ さてさて、 今回はバナーには枠線を引きましょうという点で、 お話したいと思います。 マツイがバナーを作成するときには、枠線を引くことを心がけております。 なぜか？？ 最近のホームページではあまり見かけませんが、 一昔前、リンクの付いた画像の周りには、 ボーダー（border）という通常、青い枠線があり、 ここをクリックすると他のページへリンクされていることがすぐに分かりました。 ※いまでも、携帯のPCサイトビューワーだと、ボーダーが表示されるものもあります。 「他のページへリンクされていること」と何気なく書きましたが、 非常に重要な点で、クリックされるためには、 「ここをクリックすると他のページに移動します」と 言うことを分かりやすく表示してあげることは、 「クリックされるためのバナー」には必須条件なのです。（※1） このページの下に作成過程を画像にしてありますが、 ボーダーを引いています。 つい、拡大すると思って、画像をクリックして見ませんでしたか？ 枠線は、条件反射でクリックしてしまう要素を思っているのです。 と、クリックされるためにも大切な枠線ですが、 作り方は人それぞれ、様々な方法がありますが、 マツイオススメの方法は、 バナーを作成する際に、枠線の作成は一番最後に追加する方式で 3ステップで出来る簡単な方法です。 1、バナーを構成する各レイヤーの一番上に新規レイヤーを追加する（Ctrl+Shift+N） 2、選択範囲＞全体を選択（Ctrl+A）で画像全体を選択 3、編集＞境界線を描く（ショートカットなし） これで、簡単に境界線を引くことが出来ます。 出来あがったバナーをレイヤーで立体的に分解してみると、 こんな感じになります。↓ 画像も小さく、ページでバナーが並んだ状態でないので解かり辛いですが、 枠線の「ある」方がバナーとして、 クリックしたらこの商品にリンクされていることが分かると思います。。 （いかにも、バナーですという画像なので、これだけでは解かり辛いですね） それでは〜 ※1 余談ですが、同様にリンクされているテキストには、 下線があったほうが、クリックされる率は高いと思います。 デザイン上、すっきり見せたいために、 CSSで下線をなくしているサイトもありますが、 特に、ネットショップは インターネット初心者が迷わずサイト内を巡回できるために、 リンクには下線があった方が良いですね。

松井�@和博 有限会社フューチャーワークス オンラインショップ様のパートナーとして、担当するオンラインショップ様の売上に応じて、成功報酬での運営、管理、コンサルティングを行う、有限会社フューチャーワークス在籍。 担当ショップ様、来店するお客様のイメージに合ったデザインを作る事を常に心掛け、WEB制作業界以外、過去5社での、製造、営業、小売での経験から商品の見せ方、デザインに限らず制作、広告、イベント等での工程管理も得意する。仕事は段取り8割がモットー。 現在、担当ショップ様2（8サイト） 過去の新規制作案件2社。 使用PhotoShopバージョン：PhotoShop6(Windows) ■連絡先 〒120-0034 東京都足立区千住3-35シルクビル3階 03-6912-8855 有限会社フューチャーワークス http://www.future-worx.net/ ベタだけどやってみよう〜♪ 教えて下さい〜（ズレを直す方法） スキャンしてみよう♪ アプローチの選択は簡単が一番♪ 写真の上に文字を配置するとき 同系色でまとめてみては？？ 基本のまとめカレンダー作り バナーには枠線を引きましょう♪ 文字を変形してみよう♪ スライスでGoGo! 文字の装飾イロイロ 大きなバナーを作るとき・・・ クイックマスクで選択範囲を作ってみよう♪（その2） 点線のイロイロ♪ グラデーションで合成♪ フォントの使い方（実践編） 画像を囲って、写真っぽくしてみよう〜 フィルター（そういえばシャープしか使っていない・・・） 管理しやすく画像を作るっ フォント選びは簡単に〜 ---------------------------------------------------- 全ての記事を見る とこみゆきの良新日記 大池めぐみブログ 佐藤麻衣子ブログ 笠原華子ブログ 橋和田智子ブログ 平岡典子ブログ 野崎朋子ブログ 高見英作ブログ 松本ひとみブログ 高橋理華ブログ 椎木美由紀ブログ 外薗聖子ブログ ちょっと耳より♪Web/Mobileコラム 　サポタントSTAFFが、現場で感じた 　スキルUP情報を交代でお届け♪ 今週のイチオシ企業様 　毎週、コーディネータの 　おすすめ企業様をご紹介します♪ 関東のイチオシ企業様 関西/中部のイチオシ企業様

東京｜神奈川｜埼玉｜千葉 大阪｜京都｜奈良｜兵庫 愛知｜静岡｜岐阜 非公開案件も多数あります。まずは、派遣スタッフエントリーより登録面接会にお越しください。 派遣スタッフエントリー 登録から契約までの流れ 派遣スタッフ登録特典

↑このページのトップへ

---

ウェブタント運営会社	サポタント株式会社　http://www.supotant.com/
	ネット業界で目標実現を目指すお客様を「おブッチギリ」に「愛」たっぷりにお手伝いする【サポート担当】の会社です。 IT業界で、就職・転職を目指している方、人材を募集されている企業の人事採用（雇用）担当者さま、ネットショップを立ち上げられたい方、ネット通販を運営されている経営者の方々のお手伝いをさせていただきます！
主な事業内容	■一般労働者派遣事業：(般)13-302759　　■有料職業紹介事業：13-ユ-302233
	WEBデザイナー、WEBディレクター、WEBプロデューサ、WEBマスター、ネットショップ店長・運営者、ブログ編集管理者、ソーシャルネットワーキングの制作・管理業務者、プログラマー・保守、マーケティング企画、メルマガライター、WEB系企業一般事務員など、即戦力スタッフを派遣・紹介いたします。未経験者には、技術研修を行い、スキルアップを図ります。（中途採用もあり）
	＜主な派遣先企業様実績　最寄り駅＞ 【関東】東京：銀座、新橋、有楽町、目黒、代官山、渋谷、神谷町、表参道、恵比寿、六本木、飯田橋、大森、　神奈川：横浜、新横浜、茅ヶ崎 【関西】大阪：梅田、本町、心斎橋、なんば、三ノ宮、神戸、京都
	■ECサイトセミナーの企画及び運営事務局
	サイト開設、売り上げUP、集客UP、SEO、SEM、PPCなど、EC業界の最新情報をお届けするセミナーを企画・運営しております。
参加団体	社団法人　日本人材派遣協会　会員 / 東京商工会議所 / Web広告研究会 / オンラインショップマスターズクラブ / NPO法人　キープラネット / 全国イーコマース協議会

トップページ｜ 会社概要・各拠点連絡先 ｜個人情報保護方針 ｜法人のお客様へ