レスポンシブコーディングのスニペットいろいろ - やっぱりWebが好き - Writing Mode
コーディングを自身でやることは少なくなってきたけれど、勘が廃れないように今でも時々デザインしたり、コーディングしたりってのも大事にしてます。たまにデザインやコーディングをするのは気分転換にもなるし、新しいテクニックを知っておくことだってまだまだ大切だと思うし。 今の僕は、作る仕事はできる限り任せる立場だと思うので、あくまでもやり過ぎない程度に、って考えてますけど。というわけで、最近覚えたスニペットまとめ。 レスポンシブでサイトを作ることが増えています。 予算やスケジュール、または技術的な問題など、レスポンシブで構築するのが難しいケースもありますが、今の僕はできる限りレスポンシブ優先で考えたいと思っています。 ワンソースで考えたほうが運用は効率的だと思うから。 Writing Modeは僕にとってレスポンシブデビューだったサイトで、今思うと「こうしておけばよかった」ってところはいっぱいありま
パンくずリストのマークアップが何が正しいのか分からなくなってきた件ｗｗｗ | 日常ぴよぴよ
昨日に引き続きSEOネタです。 先日、構造化テストツールが刷新されて、とてもスタイリッシュな見た目になったり、JSON-LDに対応したりしました。 JSON-LDって何？って思う方もいるかも知れませんが、ぼくもよく知りません。 マークアップ界のJavascriptみたいなもんくらいに思ってます（笑） と言うのも、ぼくはいつもmicrodata方式って方法でマークアップしているので触ったことがないんですよねー。 ワードプレスユーザーの多くがこの方式でマークアップしているはずです。 まあ、そんなことは置いといて、今回はこの新しくなった構造化テストツールでパンくずの構造化テストしたら予想外の結果が出たので、え？どっちなの？ってなった話をさせて頂きます。 現在いるページもリンクさせた方がいいの？ SEOの神様こと辻さんが手をかけたサイト、nanapiをご存知でしょうか？ このサイトは記事をとことん
Googleなどの検索エンジンに好かれるパンくずリストの実装の仕方 | KA Partner
こんにちは、金田です。台風が心配ですね。 地元の香川県は、台風があまり直撃しない地域なのでドキドキします。 さて、「パンくずリスト」をご存知でしょうか？ コーダーの方ならご存知の方も多いと思います。 では、SEOに最適なmicrodataを用いたマークアップをご存知でしょうか？ この記事でご紹介させていただきます。 それではまずパンくずリストにいて、wikiで確認してみましょう。 パンくずリスト（breadcrumb list）は、ウェブサイト内におけるウェブページの位置をツリー構造を持ったハイパーリンクの一覧として示すもの。パンくずナビ、トピックパス、フットパスとも言う。 日本語では「パンくずリスト（breadcrumb list）」だが、英語では単に“breadcrumbs”または“breadcrumb navigation”というのが一般的。「パンくずリスト」という名前は、童話『ヘン
Googleの検索結果ページでパンくずリストを表示するmicrodataの使い方 | 初代編集長ブログ―安田英久
どちらのほうが検索ユーザーの目に留まってクリックされやすいと思いますか？ 確かなデータはありませんが、パンくずリストのほうがクリックされやすそうですよね（特にWeb担のような無機質なURLの場合は）。 最近の検索エンジンは、サイト上でふつうにパンくずリストを出していれば、自動的に検索結果でパンくずリストを表示するようにしてくれるようです（「リッチスニペット」と呼ばれるもの）。しかし、Web担のように、おかしなこだわりでパンくずリストの区切り文字をふつうの「>」ではなく「«」にしていると、自動認識されずにさみしいことになります。 そこで、ページのHTMLに「microdata」という仕組みで手を加えて、グーグルに「ここがパンくずリストだよ」と教え、検索結果ページで使ってもらえるようにする方法を紹介しましょう。 ふつう、パンくずリスト部分のHTMLは次のような感じになっていると思います。 <a
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
