元WEBデザイナーのブログ

元WEBデザイナーのブログ

元WEBデザイナーのブログ

Amebaでブログを始めよう!
こんにちは、Webデザイナーの梨沙です。


久しぶりのブログ更新となります。

細かなお仕事をこなしつつ、自分と向き合う日々を送っていたのですが

少しずつ、自分の歩みたい方向性などが見えてきたため

ブログにてご報告させていただきます。


まず、今回の記事タイトルの

「アメブロカスタマイズの受付停止について」です。


現在、私の中でブログのデザインよりも

HP制作を行いたい、という気持ちが大きくなりつつあり、

今回、受付を停止させていただくことに致しました。


元々、学生の頃からHPを作るのが好きだったため

HPを作る時間を多くしたいという思いが強くなりました。


「いつかブログカスタマイズをお願いしたいと思っていたんだけど・・・」

という方がおられたら、大変申し訳ないのですが

今後、またブログのデザインを行いたい、という気持ちが湧いて来たら

受付を再開したいと考えております。 

(現段階では、受付再開時期は未定となります。ご了承くださいませ。)


また、私がブログをカスタマイズさせていただいたお客様につきましては

デザインの編集・修正などこれまで通り

行ってまいりますので、安心してご連絡くださいませ。



* * * * * * * * * * *


そしてもう一つのお知らせです。

現在進行中なのですが、このアメーバブログから

wordpressのブログに移る予定です。

お仕事でだいぶwordpressに慣れたのもあり、

これからは、HPの中に作成したwordpressのブログで

情報発信をしていきたいと考えています。


ただ、このアメーバブログの

「lisa-navigator」というアカウントが気に入っているため

お仕事以外の内容のブログとして使用出来たらなテレ・・・と考えています。


それでは、よろしくお願いいたします。


こんにちは、Webデザイナーの梨沙です


aタグとは


aタグとは、リンクを貼るためのタグです。
他のページを見てもらいたいとき、このaタグを使うことで
「ページとページを繋げる=リンクを貼る」ことが出来ます。

リンクを貼るためには、貼りたいサイトのURLを調べる必要があります。
URLとは、ネットを開いた時に上のほうの窓に出てくる

URLとは
http://~ から始まるサイトの住所のことです。


aタグの書き方


<a href="リンクしたいURL">リンクしたい文字(サイト名など)</a>

a href= のあとにURLを貼りつけます。
URLの前後にダブルクォーテーション「"」を付け忘れないようにしましょう


新規ウィンドウで開く、同じウィンドウで開くの違い


リンクは、新しい窓(新しいタブ)を開いて表示する場合と
新しい窓(タブ)は作らず、今の画面のままページを切り替えて表示する場合があります。

実際に、以下のリンクをクリックしてその違いを体験してみてください。

<例>

新規ウィンドウで開く

同じウィンドウで開く

「新規ウィンドウで開く」のときは新しい窓(タブ)が開き、
「同じウィンドウで開く」のときは同じ画面のままページが切り替わったでしょうか?

ウィンドウの開き方は、使う場面に合わせて設定したほうが
サイトを見ている人にとって使いやすいため、
どのような場面でどちらを使ったらいいのかをお伝えしていきます。


他サイトへリンクを貼るときは「新規ウィンドウで開く」を設定する


友達のサイトや、紹介したいサイトなど
“自分のサイト以外の他サイト”を見てもらいたい場合は、

「新規ウィンドウで開く」を設定しましょう。


なぜかというと、新規ウィンドウで開くことで

「このサイトから他のサイトへ移動しますよ」と
読者に伝えることが出来るから
です。


あと、記事を読んでいてリンクが気になったものの
まだ記事は読み進めていきたいから、

とりあえずリンクは開いておいて、記事を読み終わったあとに
リンク先の記事を読みにいく、という読み方をしたい人も多いからです。


アメブロでは、リンクのアイコンをクリックした後に出てくる
「リンク先の表示方法」を「新しいウィンドウ」に設定します。

新規ウィンドウで開く

htmlタグで表す時は、target="_blank"を付け足します。
<a href="ここにURL" target="_blank">ここに文字</a>



自分のサイト内のページへリンクを貼るときは「同じウィンドウで開く」を設定する


ブログ内の他の記事を読んでもらいたいときや
サイト内の他のページを見てもらいたいときは、

「同じウィンドウ」を設定しましょう。


なぜかというと、同じウィンドウで開くことで

「このサイトの違うページへ移動しますよ」と
読者に伝えることが出来るから
です。


あと、自分のサイトのページを「新規ウィンドウ」で開いてしまうと
読者さんが「このサイトの記事、全部読みたい!」と思ったとき、
リンクを開く度に新ウィンドウが増えていってしまいます。

読み終わったときに、ウィンドウを閉じるのが手間になってしまうのです

なので、同じサイト内の違うページに移動するときは、
「同じウィンドウで開く」に設定することをオススメします。


アメブロでは、リンクのアイコンをクリックした後に出てくる
「リンク先の表示方法」を「同じウィンドウで開く」に設定します。
同じウィンドウで開く

htmlタグで表す時は、target="_self"を付け足します。
<a href="ここにURL" target="_self">ここに文字</a>


まとめ



リンクで飛ぶときのウィンドウの開き方は、
使う場面に合わせて設定したほうがサイトを見ている人にとって使いやすいため、

・他サイトへリンクを貼るときは「新規ウィンドウで開く」

・自分のサイト内のページへリンクを貼るときは「同じウィンドウで開く」


に設定しましょう。


ただ、自分のサイト内のページでも
「新規ウィンドウ」で開いたほうが親切かも・・・?と思うような場面があったら
新規ウィンドウに設定したほうが良いと思います。

どちらが、読んでいる人にとって見やすいか?
という視点で、ウィンドウの開き方を工夫しましょう

こんにちは、Webデザイナーの梨沙です


HPを作りたい!って思ったとき、
「でも、まず何からすればいいんだろううるるん?」と思う方が多いようなので

本日は「HPを作る前に準備しておくことリスト」をお伝えしていきます^^


HPに載せたい項目を決める


まずは、大項目のナビゲーションメニューに何を載せるかを決めましょう。

ナビゲーションメニューによく載せられる項目としては、以下のようなものがあります。


  • ・初めての方へ(プロフィール)

  • ・メニュー

  • ・商品一覧

  • ・料金

  • ・お客様の声

  • ・制作実績

  • ・地図(アクセス)

  • ・Q&A(よくあるご質問)

  • ・ブログ(更新情報)

  • ・お問い合わせ



ナビゲーションメニューは、4~6つくらいが適切です。

たくさんあるとなにが重要なのか分からなくなるので、多くても7つまでに絞りましょう。

ご自身のサービスに合わせて、組み合わせてみてください。


HPに載せたいメニューを絞り込む


メインとなるサービスメニューを決めましょう。

私の場合は、「HP制作」「ブログカスタマイズ」「名刺デザイン」の3つです。


3~4個くらいが適切です。

5個以上あると、どのサービスがおすすめなのかがわからなくなってしまうため、

「オプションサービス」や「その他」という項目を作り、

細かいものはそこにまとめるという手もあります。



サービス内容と料金を決める


HPを作ろうと思ったものの、実はまだサービスメニューが決まっていなかったり

料金が決まっていないという場合がよくあります。

HPを作る前に、ご自身のサービスメニューについてよく考え、整理しておくことが大切です。


また「料金は話を聞いてから見積りを出している」という場合

料金ページは必要ないという方もいらっしゃると思いますが、

「お見積りしますので、まずはお問い合わせください」というのは

依頼側からすると、かなりハードルが高いです



依頼者が、その業界の相場を知っていればよいかも知れませんが、

相場がわからないまま見積りをしてもらったら、想像以上に金額が高かったとなると

あまり良い気持ちはしません。

こういうケースで〇〇人だとこの料金、などの「見積り例」を出し

料金の参考にしていただくなどの工夫をしましょう。


サービスメニューの詳細文を作る


そのサービスが、どんなサービスなのかを伝えるための詳細文を作りましょう。

ブログで告知している方は、告知文が詳細文になります。


まだ告知文を書いたことがない方は、以下の質問に答えてみてください。

答えを組み合わせる形で、告知文・詳細文を書いてみましょう。


【サービス内容の詳細】
  • ・そのサービスでは、どんなことを提供してくれますか?


<講座やセミナーの場合>
  • ・その講座は、どんな内容ですか?(内容の目次など)

  • ・その講座の主旨、目的はなんですか?(〇〇が出来るようになる、など)



【サービスの対象となる方】
  • ・そのサービスは、どんな人に受けてもらいたいですか?

  • ・そのサービスは、どんな人が必要としていますか?

  • ・そのサービスを受けたいと思っている人は、どんなことに困っている人ですか?

  • ・そのサービスを受けたいと思っている人は、どんな人生にしたいと思っている人ですか?



【サービスの効果】
  • ・そのサービスを受けると、どんな効果がありますか?

  • ・そのサービスを受けると、どんなことが出来るようになりますか?

  • ・そのサービスを受けると、どんな風に人生が変わりますか?



【サービスを受けるにあたっての注意点】
  • ・そのサービスを受けられない人、参加を遠慮してもらいたい人はいますか?

  • ・そのサービスを受けるのに、必要なものはありますか?

  • ・そのサービスを受けるのに、守らなければならないことはありますか?



【その他】
  • ・期間や開催日

  • ・料金の先払い、後払い、分割について

  • ・キャンセル料について



プロフィール写真を用意する


自分の写真をHPのヘッダーに載せたい人、

プロフィール写真がまだない人は、HPを作る前に

プロのカメラマンに依頼して、お気に入りのプロフィール写真を撮ってもらいましょう。


撮ってもらう際には、「正面、右向き、左向き」とそれぞれの方向で撮ってもらうとベストです。

もし、HPのレイアウトがすでに決まっていて

「文字を右側に置く予定だから、顔は右向きで撮っておく」ということが決まっていれば

右向きの顔写真を撮っていただけば良いのですが、

まだなにも決まっていない場合は、それぞれの方向で撮っておいてもらえば

デザインする人もレイアウトしやすいのです。

また、デザインするときに背景の横幅が足りるように

背景を広めにして撮ってもらうようにすると編集しやすい
です^^(デザイナー談)


-----------------------------------------------

HPの目的は「サービス内容をわかりやすく伝えること」です。

わかりやすく伝えるには、事前に「まとめる」という準備が必要です。


誰に伝えたいのか。(対象者は誰なのか)

その人に伝えたいことは何か。

その人に伝わるように伝えるには、どうすればいいか。



を考えて文章や構成を練る必要があります


最初は、この「まとめる」ことが難しいと感じる方が多いみたいですが

自分がどうしたいのか見つめ直し、明確にしてまとめていく作業は

何度もやればやるほど身につき、洗練されていきます


なのでHPを作るという一大イベント時だけでなく、

事業の見直しをする感じで、定期的にまとめるのも良いと思います^^

こんにちは、Webデザイナーの梨沙です


前回の記事に引き続き、単語登録応用編です。
私が実際に登録してみて、とても便利だなと思ったものをご紹介していきます


ネットでよく入力する情報


ネットで買い物をするときや、申込みフォームでよく入力する情報を
単語登録しておくと便利です


【住所や電話番号など】

じゅうしょ; → ○○県○○市○-○-○

でんわ; → 01-2345-6789

けいたい; → 012-3456-7890、○○@ezweb.ne.jp


【アドレスなど】

めるあど; → ○○@gmail.com

さいと; → http://○○.com

ぶろぐ; → http://ameblo.jp/○○/


ブログやメールでよく使う文字装飾


せん; → ----------------------------------------------------

せん; → * * * * * * * * * * *

てん; → …

わらい; → (笑)



以下のものは、「とゆ空間」さんのブログ記事を読んでなるほど!と思ったものです↓

にち; → (日)

げつ; → (月)

かあ; → (火)

すい; → (水)

もく; → (木)

きん; → (金)

どお; → (土)


tr → └  (tr は treeの略)

「「 → 【

」」 → 】


----------------------------------------------------

単語登録、面倒な作業ではありますが一度やっておくと後がラクです

今まで単語登録を活用していた方も、改めて見直してみてはいかがでしょうか
こんにちは、Webデザイナーの梨沙です


お仕事をしていると、同じ文章を何度も打つことがあります。

「よろしくお願いいたします」
「ありがとうございます」 などなど。

しゃべるときも、たまに噛んでしまうくらい長いセリフですが
キーボードでも、打ち間違えてしまうことありませんか?

「ありがとございます。」みたいに
「う」が途中で1個抜けていたら、マズイですよね(^0^;)

文章の誤字脱字を減らしたい!という方には、「単語登録」がオススメです


単語登録とは?

単語登録という機能そのものを知らない方もいるかもしれないので、
画像入りで説明していきます

単語登録の方法1
単語登録ツールは、いつも画面下の方にある
文字入力バーの中にひっそりと隠れています。

単語登録の方法2
このアイコンをクリックすると、単語を登録することができます。
「よろしくお願いいたします。」を登録する場合は、次のようにします。

単語登録の方法3
"単語"の欄に、登録したい単語を入力します。
今回の場合、「よろしくお願いいたします。」を入力します。
"よみ"の欄には、短いひらがなを入れることをオススメします。

「よろしくお願いいたします。」だったら、
「よろ」を入れると変換がとても早いです^^

品詞などは、選択しても選択しなくてもOKです。
登録を押せば、単語登録完了です!


では、メール画面やメモ帳などで実際にやってみましょう。

単語登録の方法4
さっき、「よろ」で「よろしくお願いいたします。」を登録したので、
「よろ」と入力して変換キーを押してみます。

単語登録の方法5
そうすると、一番上に「よろしくお願いいたします。」が出ました!
単語登録した後の変換結果には、毎回ちょっとした感動があります・・・(笑)


他にも、

「おは」→「おはようございます」

「こん」→「こんにちは」

「おつ」→「お疲れ様です」

という感じで登録しておくと便利です


単語登録のコツ 文字の最後に「;(セミコロン)」をつける

ただ、「こん」だと他に変換候補が出て来てしまう可能性があります。
「根」とか「今」とか「紺」とか・・・。
せっかく登録したのですから、一発で出て来て欲しいものです

他の単語が出てこないようにするコツとして、
私は「こん;」という風に、最後に「;(セミコロン)」を入れるようにしています。

文章を打つ時、最初は慣れなかったのですが、今は慣れました(^0^)


他にも、こんな単語を登録すると便利だよ!というものがあるので
それは次回の記事にて紹介します^^

ここまでお読みくださりありがとうございました