静岡のHP屋コラム

Web制作

2018.06.06

ホームページの状況把握、されていますか?~WEB解析~

ホームページ(以下、HP)を持たれている企業の割合はすでに90%を越え、またインターネットを使用する企業の割合は、ほぼ100%に近くなっているそうです。数十年前までは想像もしていませんでしたが…、今この瞬間もWEBの進歩が止まりません。
WEBを使って広告を出稿したり、WEB通販で商品を販売したりと展開方法は多岐にわたります。
そのような環境の中で、現在注目されているのが…HPの状況を把握し、運用をし、売上をアップさせるための『WEB解析』です。

そもそもホームページは必要なのか?

WEB解析の話にはいる前に、そもそも「HPは本当に必要なのだろうか?」と考えたことをある人も多くいらっしゃるのではないでしょうか。チラシを出している・CMを流している・DMを発送している…等、多くの広告を出しているのに、なぜHPが必要なのか。現在の消費者(エンドユーザー)は、自分の知りたい情報を自分から能動的に調べて得るからなのです。
それは広告を見た際も同じで、直接来店をする前に、HPを能動的に見に・調べに行くのです。また企業側もそのような人たちに対して、信頼感を得る場所として、また自社の宣伝や広告ツールとして情報発信のできる場所として重要性が高いのです。

WEB解析で分かることとは?

WEB解析で分かることは多々あるのですが、その中でも重要性が高いのは「ユーザー情報(性別・年齢・地域・関心)」「HPのどのページが見られているか」「どこのサイトから訪問したか」「最後に見たページ」「CV(コンバージョン)の数値 ※最終的な結果」が挙げられます。
このような情報を活用すれば、例えば「静岡県の20代女性」が「どこのサイトから来たか」などクロスで解析することができます。また「問い合せ件数」をCVにした際に、静岡県の20代女性が訪問数に対してどれだけの割合がいるかなどの詳しい解析も可能なのです。
このように想像ではなく、実際の数値で客観的にデータを集め、WEBサイトの修正・改善、広告展開の指標としても活用できるのです。またPCで見ているか・スマホで見ているかの数値は今後のHP修正・リニューアルに必須の情報になってきますね。

Google analytics ~グーグルアナリティクス~

HPの解析を行うためには、解析サービスを使う必要がります。
サービスやソフトは多々ありますが、主力とされているのは、グーグルアナリティクスです。
このサービスの良い点は…
①無料!②高性能!③メジャーの三拍子そろっているところです。
特にメジャーであることは非常に重要で、関連書籍はもちろん、使い方セミナーなども多数行われている、さらには外部に解析を委ねる場合も多くはGoogle analyticsのデータを元にして解析を行っていることです。
HPを作った際にサービスでついてくる解析サービスは簡単に利用・簡単に把握できるものも多いですが、さらに一歩前進するときに使えるグーグルアナリティクスは導入することをオススメします!

こんな方はHPの解析をおすすめします♪

HPを持っているが、何をして良いか分からない。

HPのリニューアルを考えている。

広告の効果を測定したい。

CVを上げたい。

訪問数を増やしたい。

売上を上げたい。

2017.06.30

キャッシュてなんだ?Webサイトを最新の状態するスーパーリロード!!

みなさんキャッシュってご存知ですか?
「卵とクリームを使って作るフランス、アルザス=ロレーヌ地方の郷土料理」のことだと思った方は違います。それはキャッシュではなくてキッシュです。

キャッシュとは、一度アクセスしたWebサイトのデータを各端末(PC、スマホ)に一時的に保存する機能です。

なぜこんなことをするかというと

同じWEBサイトを何度も見た場合に、毎回全てのデータを見に行くのではなく、最初に閲覧時に保存したキャッシュを使うことで、Webページの表示速度を速くするためです。

よくホームページを更新したのに、お客様から「ホームページが更新されていない」とお問い合わせ頂くことがあります。

このような場合の多くはこのキャッシュという機能が原因でPCやスマホに保存された過去のデータを見てしまっています。

更新を反映される場合はどうしたらいいの?

上記のようにキャッシュにより、ホームページの更新が反映されていない場合は、「スーパーリロード」という機能で、キャッシュを忘れたうえで再度確認します。

では、具体的な「スーパーリロード」の方法をお伝えします。

それは「Ctrl + F5」です。

単一のF5キーはリロード(再読み込み)ですが、「Ctrl」と同時押しすることで「スーパーリロード」という機能に代わります。この「スーパーリロード」を行うことで、キャッシュではなく再度最新のデータを取り直してくれます。

ホームページの更新が反映されないという場合はぜひ一度試してみてください。

また、この「スーパーリロード」でもキャッシュが残ってしまう場合があります。
そのような場合は、ブラウザのキャッシュのクリア(手順はブラウザにより異なります)を行うことでキャッシュを意図的に消すことも可能です。手順的には複雑になり、多少面倒ですが、「スーパーリロード」がきかない場合はこちらも試してみてください。

2017.02.27

WordPress 4.7または4.7.1を使用している場合はすぐにアップデートを!

知っている人が多いと思いますが、WordPressとはブログやWebサイトを作ることができるオープンソースのCMSです。

2015年の年末には全世界のWebサイトのうち25%はWordPressで作られていると言われていましたので今はもっと多いかもしれません。体感的にも自社のWebサイトにWordPressを使用しているという方はここ数年ですごく増えたように感じています。

普段WordPressのバージョンなんてあまり気にしないかもしれませんが、WordPress使用中の人はぜひバージョンを確かめてみてください。

4.7.2以降だった人は安心してください。現在(2017年2月27日)は4.7.2が最新です。

もし、自社やご自身のWebサイトが4.7または4.7.1のWordPressを使っていた場合はすぐにアップデートしましょう。

WordPressの4.7または4.7.1は危険?

数週間前(2017年2月上旬)に大学や公的機関などの多くのサイトが攻撃を受けて内容を改ざんされているというニュースがテレビに取り上げられました。

2月1日にWordPressの4.7または4.7.1には致命的な脆弱性(バグ)があるという情報が公開されました。今回のニュースはこの脆弱性を利用して多くのWordPressを使って運用していたサイトが攻撃を受けたという内容です。

サイトを攻撃や改ざんするというとものすごく難しいことに聞こえますがが、今回見つかった脆弱性を利用すれば少し知識がある人なら簡単にWebサイトを改ざんできてしまうというような脆弱性のため、数多くの被害者がでるという結果になりました。

Wordpressのバージョンはどうやって確認する?

標準のWordpressではログイン後のダッシュボードにバージョンが表示されます。
もし、ダッシュボードに表示されていない場合はFTPでWordpressのインストールディレクトリに接続して、「wp-includes」内の「version.php」をテキストエディタで開いてみてください。

「$wp_version = '4.7.2';」

のような記載が見つかると思います。この記載の4.7.2の部分がバージョンになります。

もし、FTPへの接続情報をもっていない場合、よくわからないという人は詳しい人に問い合せてみてください。また、サイト保守を業者に依頼しているような場合でも、Wordpressでサイト構築しているのであれば念のため業者に問い合わせた方がよいかもしれません。

まとめ Wordpressに限らずソフトウェアは常に最新を保とう

Webサイトの乗っ取り、攻撃、改ざんなどというと、自分の運営しているサイトは小さいから関係ないという人がいますが、サイトの大きい小さいは関係ありません。

また、サイトを改ざんされた場合は自分(自社)だけでなくサイトを閲覧する第三者にも迷惑をかけるという認識を持つことが大事です。

Wordpress4.7または4.7.1の問題についてはニュースにも取り上げられたため、ご存知の人も多いかもしれません。しかし、普段から使用するソフトウェアは最新に保つことがセキュリティ的には非常に重要です。

Wordpressを使っている人はもちろんですが、その他にも自分が使っているソフトのバージョンについて確認して、日頃から最新状態を保つように意識しましょう。

2017.02.26

今さら聞けない? ホームページ制作に使用する画像の種類

みなさんはホームページにどんな種類の画像を使用しているか気にしたことはありますか?
特に気にしていない方も多いかもしれませんが、一口に画像といっても様々な形式があります。

今回はホームページに使用できる画像形式(ファイルフォーマット)とその特徴について解説したいと思います。

どんな形式の画像がホームページ制作に使用できるのか?

画像ファイルというとよく名前があがるのが、BMP(ビットマップ)、JPEG(ジェイペグ)、GIF(ジフ)、PNG(ピング)、TIFF(ティフ)などです。
しかし、このうちホームページ制作に使用できるのはJPEG、GIF、PNGの3種類であり、BMPとTIFFは使用できません。

パソコンに入っている画像が上記のどの画像形式にあたるかは拡張子を見ることで判断できます。拡張子とはファイル名の一番最後にある「.jpg」のようなドット以降の文字列のことです。Windowsの設定によってはパソコンでは拡張子が表示されない場合がありますので、その場合は設定を変更しましょう。

JPEG(ジェイペグ)の特徴

JPEGとはJoint Photograph Experts Groupの略で、拡張子は「.jpg」※です。
デジカメでは基本的に写真をJPEG形式で保存するので、デジカメを使う人はなじみのある形式かもしれません。

特徴としては
最大1670万色まで扱うことができる
・ファイルを不可逆圧縮している
などがあります。

写真の保存に適したファイル形式ですが、不可逆圧縮という方式でファイルを圧縮しているため、何度もファイルを保存しなおすと画質が悪くなっていくという特徴があります。
そのため、画像加工を行う際は注意が必要です。

※JPEGの拡張子は「.jpeg」、「.jpe」、「.jfif」と表記される場合もありますが「.jpg」または「.jpeg」を使うのが一般的で無難でしょう。

GIF(ジフ)の特徴

GIFとはGraphics Interchange Formatの略で、拡張子は「.gif」です。
GIFはJPEGとは異なり、最大256色までしか扱うことができません。

しかし、JPEGにはない特徴として
・画像に透過(透明色)を使用できる
可逆圧縮のため、保存を繰り返しても劣化しない
・パラパラ漫画のようなアニメーションを扱える
といったものがあります。

上記のような特徴からGIFはアイコンやイラストといった単色・ベタ面が多い画像、またはアニメーションを取り入れた画像に適しています。

PNG(ピング)の特徴

PNGとはPortable Network Graphicの略で、拡張子は「.png」です。
PNGはJPEGやGIFよりは後発のフォーマットで、Web上での使用を目的に開発されたフォーマットです。

特徴としては
最大1670万色まで扱うことができる
可逆圧縮のため、保存を繰り返しても劣化しない
・画像に透過(透明色)を使用できる
というようにJPEGとGIFのいいとこどりをしたような形式です。

しかし、その分JPEGと比べるとファイルサイズは大きくなってしまうため、容量に関しては注意が必要です。


以上簡単ですが、ホームページに使用できるJPEG、GIF、PNGについていかがでしたでしょうか。

私個人的には
・写真をそのまま使う場合はJPEG
・アニメーションを使う場合はGIF
・上記に当てはまらない場合はPNG
というように画像形式を使いわけています。

何が正解はありませんが、みなさんもこれを機に一度ホームページに使う画像について考えてみてください。

2017.01.31

Whoisに登録されている情報を見直して正しい情報に更新(変更)しよう

あまり聞きなれない方も多いかもしれませんが、今回はWhoisについて簡単に解説します。

Whoisとは

ご自身でドメイン管理などを行っている人には、なじみのある言葉かもしれませんが簡単に言うとWhoisとは、ドメインの所有者情報だと思ってもらえれば大丈夫です。
(正確にはDNSの情報など他にもありますが、今回は人の情報に絞って記載します)

また、Whoisの情報は全世界に一般公開されているため、Whoisを使えばこのドメインは誰が所有者なのかを調べたりできます。

基本的にドメインは匿名で取得することができず、取得するには所有者などの情報を登録する必要があります。(今回は割愛しますが、自分の情報の代わりにドメインの管理会社(お名前.comなど)の情報を公開する「Whois情報公開代行サービス」と呼ばれるサービスもあります)

Whoisで管理されている人に関す情報は以下の4種類です。

  • 登録者情報(Registrant)
  • 管理担当者情報(Admin)
  • 経理担当者情報(Billing)
  • 技術担当者情報(Tech)

※それぞれにメールアドレス、名前、組織名、住所、電話、FAXの情報が登録されます。

Whois情報はなぜ入力する必要があるの?

Whois情報は違法なサイトやスパムメールなど、インターネットユーザに被害を出すような行為をした場合の連絡先として使用されます。

その性質上、ICANN(ドメイン関係の最高権力者だと思って下さい)からよりレジストラ(ドメインの管理会社)に対して正しい情報の登録が義務付けられており、レジストラは登録情報が不正なドメインに対してドメインを削除する権利を持っています。

レジストラはドメインの登録者情報(Registrant)に登録されているメールアドレスに対して確認のメールを送っており、メールに記載されたリンクから処理を行わないと不正なドメインとしてドメインが利用できなくなります。

Whois情報はどうやって更新するの?

Whois情報の変更は、ドメインをどの会社(お名前.com、バリュードメイン、さくらインターネット、ムームードメインなど)を使用しているかによって異なりますが、今回は一般的な流れだけ説明します。

Whois情報は登録者情報(Registrant)を変更する場合と、それ以外の情報を更新する場合で手順が異なります。

登録者情報(Registrant)以外を更新する場合

多くの場合、管理会社のサイトからログインをするとWhois情報の変更フォームがあります。
管理担当者情報(Admin)、経理担当者情報(Billing)、技術担当者情報(Tech)につきましては上記のような変更フォームから情報を変更できます。

登録者情報(Registrant)を変更する場合

登録者情報(Registrant)の変更に関しても、変更フォームから情報を変更することは一緒なのですが、名前、組織名、メールアドレスのいずれかに変更が入る場合は、承認が必要となります。

具体的には、以下のような流れになります。

登録者情報(Registrant)の名前、組織名を変更する場合

①変更フォームから変更を行う
②登録者情報(Registrant)のメールアドレスに対して確認メールが送信される
③確認メールに記載された承認作業を行う
④Whois情報が変更される

登録者情報(Registrant)のメールアドレスを変更する場合

①変更フォームから変更を行う
②変更前の登録者情報(Registrant)または管理担当者情報(Admin)の
メールアドレスに対して確認メールが送信される
③変更後の登録者情報(Registrant)のメールアドレスに対して確認メールが送信される
④確認メールに記載された承認作業を行う(②③で送信された2通両方行う必要があります)
⑤Whois情報が変更される

登録者情報(Registrant)のメールアドレスが受信できない場合は?

登録者情報(Registrant)のメールアドレスが受信できないとWhois情報を変更することができません。そのため、その場合はまず管理担当者情報(Admin)のメールアドレスを変更し、その後に登録者情報(Registrant)を変更すれば変更することができます。

まとめ

  • Whois情報についてWhois情報とは、ドメインの所有者の情報で一般に公開されています。
  • Whois情報が間違っているとドメインが停止される恐れがあるので、必ず最新の情報を保つようにしましょう。

細かい操作などは利用している会社などによりさまざまですが、上記の2点は全ての会社において共通して言えることですのでドメインを管理する際は気に留めておくことをおすすめします。

2017.01.25

ローカル検索・ローカルSEOとは

スマホが普及したことにより、インターネットをつかった検索環境が大きく変化しています。お店や商品、サービスの情報や評判などを調べるとき、多くの方が手元にあるスマホやタブレットを使ってその場で調べるようになりました。

スマホが普及し、検索エンジンや地図アプリを通じて情報収集する人が増えた今、検索エンジンもその環境・行動動態に適応しはじめています。

ローカル検索とは

ネットで情報収集

ローカル検索とは、以下のような場合に、地図と連動した結果を出してくれる検索エンジンの機能です。

  • 「地名 + サービス名」のキーワード検索
  • Googleマップ等の地図でお店を検索
  • 端末の位置情報をONにした状態でお店・サービスを検索
ローカル検索PC
ローカル検索スマホ

上の画像は「沼津 干物」で検索した時の画面です。

弊社のお客様、沼津の干物屋ふなとさんもちゃんとローカル検索の上位に入っています。

スマホの普及で変わってきた検索スタイル

スマホが普及し、ローカル情報を地図アプリから取得する機会が増えました。
つまり、検索機能の使い方が「腰を据えてじっくり調べる」というスタイルから「その場で行き先を決める」スタイルに変わりつつあるということになります。

特に地域密着型の店舗やサービスの場合は、このローカル検索結果にサイトや店舗を表⽰し、上位表示させるための対策(ローカルSEO)行うことが重要になってきます。このローカル検索は、通常の検索エンジンのSEO対策とは異なったプロセスで検索結果が決められているので注意が必要です。

ローカルSEOで地域No.1を目指そう

検索エンジンは、ユーザーが何を検索したいかを判別して、最適であろう検索順位を表示するようになりました。ローカルSEOを上手く活用できれば、競合他社が多い言葉(ビッグワード)でも、大手サイトより上位表示されるチャンスがあります。

地域密着のお店や、サービスを提供されている方は是非、ローカルSEOを活用して地域No.1を目指しましょう!

ローカル検索・ローカルSEOに関するセミナーを開催します

私たちアーティスティックスでは、2017年2月にローカルSEOに関するセミナーを開催しています。詳しく聞いてみたい方は是非、お気軽にご参加ください。参加定員5名様の少人数制にしていますので、気軽に質問したり個別に相談したりできるセミナーです。

今回のセミナーでは

  • 検索エンジンに好かれるためのポイント
  • ローカル検索で表示機会を増やす方法
  • ローカルSEOのランキング要因
  • ローカルSEOで上位表示するための3つのポイント

などをご紹介します。
セミナーへのご参加は無料です。是非、お気軽にご参加ください。

「地域+サービス名」で顧客をつかむ
最新SEO対策セミナー

地域情報を調べる見込み客がネットでローカル検索(地域名+調べたいことで検索)したとき、サイトや店舗の情報を上位表示させるためはどうすればいいのか、その具体的な方法をお伝えします。

2017.01.23

強調スニペットとは? Googleさんが知りたいことの答えをくれる?

強調スニペットって聞いたことありますでしょうか?
聞いたことがないという方が多いかもしれませんが、名称を知らないだけで見たことがある方は多いかもしれません。私も最初に知ったときは「ああ、あれのことそう呼ぶんだ」っと思いました。
前置きはそれぐらいにして本題の協調スニペットとは何かについて説明していきます。

強調スニペットとはなにか?

Google検索で質問をすると、通常であれば検索ワードに関連するページが表示されます。
しかし、検索ワードによっては以下のように検索ワードの意味が検索結果の画面に直接表示される場合があります。

これが強調スニペット(英語ではFeatured Snippet)です。
画像からわかる通り、強調スニペットとは、Googleの検索結果上部に表示される検索ワードに対する答えのブロックです。ここに載る内容は検索ワードに対する「回答の概要」、「画像(ない場合もある)」、「タイトル(ページへのリンク)」、「URL」です。

強調スニペットの特徴

Googleで検索を行うと、そのキーワードと関連性の高いページの1位~10位までが表示さます。(この検索結果を自然検索やオーガニック検索と呼びます。)しかし、検索ワードによっては自然検索の結果以外に以下のようなものが表示される場合があります。

  • 広告(有料検索)
  • Googleマップの検索結果
  • Googleショッピング検索結果
  • 画像検索の検索結果

これらの内容は自然検索の結果よりも上部に表示されることが多く、自然検索で1位になるよりも効果が期待できる場合もあります。また、上記の内容は自然検索の順位とは異なるルールで表示されるため、広告以外は狙って表示させるのは難しいと言われています。

強調スニペットは上記の内容と同じように、通常の自然検索の結果よりも上部に表示されるため、
自分のサイトが強調スニペットに表示されれば高い流入効果が見込めるでしょう。

強調スニペットに表示されたくない

あまり必要になることはないと思いますが、「自分のページは強調スニペットに表示されなくない」という場合は<head></head>内に以下のメタタグを設定することで強調スニペットの候補から除外(オプトアウト)することができます。

<meta name="googlebot" content="nosnippet">

※上記タグを設定すると通常のスニペットもオプトアウトされるので注意してください。

強調スニペットに自分のサイトを載せたい

現状では、強調スニペットに自分のサイトを狙って載せることはできません。

Googleは「ユーザーの質問に対する回答がページに含まれていることをプログラムで判断し、その結果を強調スニペットとして表示します。」と発表しています。

そのため、現段階では少しでも自分のサイトが選ばれやすくするように、以下の点に気を付けて記事を書くといいでしょう。

HTMLの構文を正しく記載する

当たり前だと思うかもしれませんが、大事なことなので気をつけましょう。プログラムがWebページの内容を適切に解読できるようにHTMLなどの構文は正しく記載する必要があります。
通常のSEO対策にも言えることですが、構造がわかりやすいように、適切なタイトルタグ、見出し(h1~h6)を心掛けましょう。文章以外の部分でも、クローラーが正しくページを巡回できるようにサイト内リンクなども適宜設定しておく必要があるでしょう。

質問に対する回答を明確に記載する

プログラムが質問・回答を判断しているので、画像で解説は控えて文章での解説するようにしましょう。(プログラムは画像の内容を判断できません。)
質問に対する回答もだらだらと長く書くのではなく、2~3行程度で端的に説明しましょう。
詳しいことを書くとどうしても長くなりがちですが、強調スニペットにはページから抽出された答えが表示されるため、抽出されやすい文章が好まれると予想されます。
端的な解説をまずは短めに記載し、その後詳しく説明するような構成がおすすめです。

まとめ

強調スニペットについて理解して頂けましたでしょうか?
検索結果の画面に答えがでるということはユーザのストレスを軽減させ、検索の時間短縮につながります。この機能はGoogle検索がユーザに役にたつ検索結果を作っていることからも自然な流れの機能なのかもしれません。

強調スニペットに表示されているサイトを見ると、大企業のサイトや知名度が高いサイトが選ばれるわけではなく、単純にわかりやすいページが表示されている印象を受けます。

狙って表示することは難しいですが、強調スニペットのことを理解してユーザ目線の記事を作成していればいつか強調スニペットに表示されることも夢ではありません。
ぜひこの機会に、自サイトのコンテンツの見直しなどしてみてはいかがでしょうか。

2016.12.30

JQueryで簡単にページに雪や落ち葉を降らせる方法

ブログの本題と全く関係ないですが、みなさんLINEって使っていますか?
先日ふとLINEのトーク画面を見ると雪が降っているではないですか。これを見て思いました。

そういえばホームページでも雪とか降ってるサイトを見かけるなぁ・・・
と思ったので今回はホームページに雪を降らせる方法をご紹介します。

jqueryを使用してホームページに雪を降らせる3ステップ

探せば他にもあると思いますが、今回は比較的に簡単に実装可能なjQueryのプラグイン「JQuerny-Snowfall」を使用した方法を解説していきます。

ステップ1 「JQuerny-Snowfall」の入手

「JQuerny-Snowfall」はGitHubでダウンロード可能です。
以下のリンクを開き、緑色の「Clone or download」→「Download ZIP」をクリックしてZIPファイルをダウンロードしてください。

https://github.com/loktar00/JQuery-Snowfall/

ダウンロードが完了したら、「dist」フォルダの中にある「snowfall.min.js」を使用します。

ステップ2 「JQuerny-Snowfall」の読み込み

ファイルの準備が完了したら次はプラグインの読み込みです。
以下のように<head></head>内に以下のタグを入力してjQuerny本体とプラグインを読み込んでください。

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="/js/snowfall.jquery.min.js"></script>

※パスは実際の環境に合わせて書き換えてください。(jQuery本体は1.8.3でなくても大丈夫です。)
上記タグは上がjQuery本体で下がプラグインの読み込みとなります。

ステップ3 実行するためのjavascriptを記載する

読み込みの後は実行するためのjavascriptを記載します。具体的にはステップ2で入力したタグの下に以下のタグを続けて入力すればOKです。

<script type='text/javascript'>
$(document).ready(function(){
    $(document).snowfall();
});
</script>

以上のたったの3ステップでページに雪を降らせることができました。

実際に雪を降らせたWebページのデモが以下のページです。

雪を降らせたWebページのデモ



おまけ 雪以外を降らせてみよう オプション紹介

雪を降らせるだけであればステップ3までの手順で完了ですが、今回使用したプラグイン「JQuerny-Snowfall」では雪以外のものを降らせたり、雪の量や速度を変更するオプションも組み込まれています。オプションは以下のような形式で記載します。

<script type='text/javascript'>
$(document).ready(function(){
    $(document).snowfall({
        option : value,
        option : value,
                :
        option : value
    });
});
</script>

上記optionには以下表のものが使用可能です。

オプション名(option) 値(value) 備考
flakeCount 数値 雪の量
flakeColor カラーコード(#000) 雪の色
flakeIndex 数値 雪の重なり方(z-index)
minSize 数値 雪の最小サイズ
maxSize 数値 雪の最大サイズ
minSpeed 数値 雪の最低速度
maxSpeed 数値 雪の最高速度
round boolean型(true または false) 雪の形を丸くする
shadow boolean型(true または false) 雪に影を付ける
collection 要素名(body) 雪を要素に積もらせる
image 画像パス オリジナル画像を降らせる

オプションを使用して、雪の代わりに落ち葉を降らせるデモページを作成しました。

落ち葉を降らせたWebページのデモ

まとめ

今回はjQueryのプラグイン「JQuerny-Snowfall」を使用して雪を降らせる方法をご紹介しましたが、いかがでしたでしょうか?

オプションを使用すれば雪を降らせる以外にもいろいろな演出を行うことが可能ですので、Webページに何か一工夫したいと思ったらこのプラグインを使ってみてはいかがでしょうか。

ホームページ応援隊 訪問対応エリア

静岡市・沼津市・三島市・駿東郡(清水町・長泉町・小山町)・富士市・富士宮市・裾野市・御殿場市・伊豆市・伊豆の国市・伊東市・熱海市・焼津市・藤枝市・函南町

その他の地域の場合でもご訪問可能な場合がございます。
ご希望の方は、お気軽にご相談ください。