非同期スニペット

「html5」タグのブログアーカイブ

無料 ご相談承ってます!

電話 078-955-7461(平日 -)お気軽にご連絡ください!
打合せなどで電話に出れない場合がございます。その場合は、フォームもしくは 070-5503-3830までお手数をおかけしますがご連絡ください。

私たちの実績
(→ 実績一覧へ

Webデザインやグラフィックデザインの実績をご紹介しております。

お知らせ

ブログ最新の10件
(→ 記事一覧へ

事務所案内

  • ワサビ株式会社
  • マーケティング部(東京オフィス)
  • 〒142-0041
    東京都品川区戸越1-21-15 創建ビル4F
  • 本社
  • 〒658-0065
    兵庫県神戸市東灘区御影山手4-10-21
  •    
  • マーケティング部・デザイン室・開発室
  • 〒657-0864
    兵庫県神戸市灘区新在家南町1-1
  • TEL. 078-955-7461
  • 受付時間: 平日 -
  • マーケティング部(福岡オフィス)
  • 〒812-0053
    福岡県福岡市東区箱崎2-10
会社の詳細情報は、こちら

Work with us!

私たちのビジネスの成功は、社会に貢献できると確信してます。

ワサビは、才能や情熱を持った方との出会いを待ってます。

インターネットで出来る事、その可能性を仕事にしたい方は、ご連絡ください!

採用の詳細は、こちら

ソーシャルメディア

「rel=”nofollow”」とは?

投稿日:

nofollowとは?

nofollow」とは、検索エンジンのクローラー(検索ロボット)がウェブページを巡回した際に、ページ中にある外部リンクを追跡しないように指定するHTMLタグの記述の事です。

当初、「nofollow」はページの情報を定義する「meta」タグに記入して使われているものでした。
そのため、クローラーにそのページから張られた全てのリンクを辿らないように指示していました。

例:<meta name=”robots” content=”nofollow” />

つまり、スパムコメントなどの対策の為に、メタタグに「nofollow」を設定してしまうと、クローラーは価値のあるリンク先や内部リンクまでも辿らなくなってしまいます。

そのため、価値のあるリンク先や内部リンクを残し、ページにある個々のリンクをクローラに辿られないようにする為に、robots.txt でブロックされる URL にリンクをリダイレクトするなどを行うという
多大な労力が必要でした。

この様な理由から「rel=”nofollow”」というタグが作られました。

このタグにより、リンクそれぞれにに対してクローラーに指定していくことができます。

例:<a href=””http://sample.com”” rel=””nofollow””>辿ってほしくないリンク先</a>

nofollowを使用する場所

①信頼できないコンテンツ
リンクを貼るということは、そのリンク先を評価するとクローラーは認識してしまいます。ですので、リンク先が信頼できないサイトやコンテンツを仕方なく設定する場合(有料広告・悪質なサイトの注意喚起など)にnofollowに指定するに推奨されています。

②有料リンク
有料リンクとは、ページランクや検索順位を意図的に操作することを目的としたリンクを金銭で購入することです。有料リンクはGoogleから禁止されており、SEO目的の相互リンクや低品質のディレクトリ登録等があげられます。もし、宣伝・広告用に有料リンクを設定する際、もしくは既に設定している際はnofollowに指定することが推奨されます。

③クロールさせる必要がないページ
クローラーはIDやパスワードを用いてログインすることは出来ません。このため、「登録はこちら」や「ログイン」のリンクを辿る必要性はありません。nofollowに指定することによりこの様なページを辿らず、その他の検索エンジンに表示させたいページをクローラーが辿るようになります。

外部リンクにnofollowを使用するのは、不正なサイト排除するために創られたものです。
通常のサイト運営する際には、nofollow属性を使う必要は限られています。
安心してサイトを運営するために必要な事になりますので、一度見直してみてはいかがでしょうか。

参考:「Googleガイドライン

Adobe モバイルブラウザ向け Flash の開発を終了。HTML5へ注力。

投稿日:

先日Adobeがモバイルブラウザ向け Flash の開発を終了する事を発表しました。

今後モバイルブラウザ向け Flashに関してはサポートのみの対応になります。

ご存知の方も多いと思いますがアップル社が提供するiOS(iPhone、iPod、iPad)は発表の段階からFlashは対応していません。

理由としてはApple社はWebに関連する全ての標準はオープンであるべきと言う考えがあり、FlashAdobeが価格や機能強化などをコントロールしているのでAdobe単独の製品である事や、開発のスピードをどちらかに合わせないといけない点、動画をソフトウエアでデコードすると消費電力が大きくなるのでモバイル端末には適していない事などが挙げられます。

一方、iPhoneには見れないFlashを見れるスマートフォンと言う事で注目が集まったAndroidはどうなるのか?

やはりiOSと同じくAdobe AIRとHTML5へ注力していくことになりそうです。

こうなるとiPhoneとAndroidの差別化が難しくなってきます。

HTML5は今までのHTMLとは違い、専用のソフトウェアを使わずにビデオやオーディオの再生が可能になり、HTML5の対応しているブラウザであればプレーヤーなどをインストールせずに動画や音楽を楽しむ事ができます。

今後PC向けのFlashの開発は続けられるとの事ですが、モバイルブラウザ向けFlashの開発を終了した事から見てもFlashからHTML5への移行は避けられません。

HTML5自体まだ対応しているブラウザが少ないので今すぐFlashが無くなる事はないですが、開発が進むにつれ世の中からFlashが無くなることも近い将来あるかもしれません。

これからのHTML5の開発に注目します。

ソースは、こちらのAdobeのサイトから。

Posted by Date

HTML5時代のhoverの使い方

投稿日:

HTML5の盛り上がりよりも、WPの方が盛り上がる社内ですが個人的に最近ちょっと気になる事がありました。

ソース元は、「Web Design Trends in 2011」です。

2011年のWEBデザインのトレンド!というタイトルの今年の初めに書かれた記事です。

その中の5番目「5. Designing for Touch Screens, Not Mice」です。

hoverを使いメニューがちょっとした挙動を起こしすのをCSSで組んだりしていますが、ここで指摘がある通り

However, there’s no hovering in touchscreen.

タッチスクリーンには、hoverの概念が無いんです。

要するにiphoneの様なやつですよね。

わたし自身、スマートフォンは「電話ではない!あれは小型のPCに電話機能がついたものだ!」と日々言っているほどCPUなどに関しては日々進化し続けている。

もちろん、通信会社にとってはキラーコンテンツになるのですが今後私たちの様な制作会社は、IEやらchromeやらのブラウザチェックの他にスマートフォンも必ず視野に入れなければならないと思っております。

で、hoverにもどりますが、これって今後は力を入れていく所ではない。むしろ、クリック出来るならクリック出来るぞ!と分かりやすいデザイニングをしなければならないという事です。

HTML5 hr

投稿日:


要素は、水平線を引いてセクションとセクションを分ける意味合いをHTML4まで持っていました。

HTML5では、section要素が出来た為実質上


要素は無くなります。

今まで活用されていた人は、水平線を表示する方法は複数あるのでそれで対応していくという事です。

ページトップへ