Tyto Style[B!]新着記事・評価 - はてなブックマーク

AndroidのChromeでフォントサイズが大きくなってしまう不具合は「max-height」で解決するかも｜ SEOモード

35 users

AndroidでChromeを使ってサイトを閲覧したときに、一部の文字が非常に大きく表示されることがあります。 ※確認した限りでは、Androidの「標準ブラウザ」では大丈夫だったので、おそらくChromeに固有のバグなのだと思います。最初なぜこんなことが起こるのか分からなかったのですが、色々調べた結果、意外とあっさりと解決しましたので、メモしておきます。私の手元にある環境でしか調べられていないのですが、発生するのは、meta要素の「viewport」が設定されていないか、content属性の「width」が「width=760」のような数字になっている場合のようです。 <meta name="viewport" content="width=760">以下のキャプチャは、Google Chromeのエミュレータを使って、当ブログで再現したものですが、こんな風に非常に大きなフォントサ

テクノロジー
2014/09/22 17:16

ウェブ検索のインデックスにOGPメタタグは利用していない、とGoogleのMueller氏｜ SEOモード

6 users

www.tyto-style.com

「Webmasters Stack Exchange」に「OGP（Open Graph Protocol）のメタタグを利用すると、Webページをインデックスする際の助けになるのか」との質問があり、GoogleのJohn Mueller氏は「ウェブ検索には利用していない」と回答しました。投稿された質問の一部を抜粋します。これ（OGPメタタグ）がFacebook上でページをシェアする際に役に立つのは知っていますが、GoogleもまたどれかをWebページのSEOに利用するのでしょうか？これに対して、Mueller氏は次のように回答しています。 Googleはウェブ検索のインデックスにOpen Graphメタタグを利用していません。私の知っている限りでは、Google+のスニペットには利用していますが ( developers.google.com/+/web/snippet )。そこで試

テクノロジー
2014/05/28 23:28

SEO
Google

複数人で投稿するWordPressで記事毎に著者情報を表示する方法｜ SEOモード

3 users

www.tyto-style.com

複数人でWordPressに投稿しているときに、それぞれの記事ごとに著者情報を表示する方法について調べる必要があったのでメモしておきます。今回は基本テーマのひとつ「Twenty Twelve」みたいな感じでということでした。下の画像の個所ですね。ということで「Twenty Twelve」の「content.php」から該当する個所を見つけて、表示したいところにコピペしました。 <?php if ( is_singular() && get_the_author_meta( 'description' ) && is_multi_author() ) : // If a user has filled out their description and this is a multi-author blog, show a bio on their entries. ?> <div cl

テクノロジー
2014/05/23 16:28

Google、Twitter上で有料リンクの契約更新を促していた「Web Design Library」にペナルティか？｜ SEOモード

5 users

www.tyto-style.com

Googleが「Web Design Library」に対しペナルティを与えた可能性が報じられています。同サイトは先週Twitter上でクライアントに対し有料リンクの契約更新を促していたことで話題になっていました。

テクノロジー
2014/03/26 21:45

Googleはページ上の複数のパンくずリストをどのように扱うのか？｜ SEOモード

3 users

www.tyto-style.com

Google Webmastersの新しい動画が投稿されており、Matt Cutts氏が質問に回答しています。質問は次の通りです。 ECサイトのアイテムの多くが複数のカテゴリに属しています。ページ上に複数のパンくずを置いても構わないでしょうか？Googlebotを混乱させてしまいますか？サイトの論理構造を適切に理解してくれますか？質問に対し、Cutts氏は複数のパンくずを利用することに問題はないと回答しています。そういえば、既にGoogleが提供しているリッチスニペットのヘルプページにも「ページには複数のパンくずリストを表示できます」と記載されていました。 ※（折りたたまれているので見逃しがちですが、）「microdata」や「RDFa」で「child」プロパティを使って複数のパンくずリストをマークアップする方法も記載されています。さらに、Cutts氏によると、Googleは複数の

テクノロジー
2014/03/23 11:57

SEO

Googleの検索結果の新デザインが正式公開に｜ SEOモード

3 users

www.tyto-style.com

昨日、リリース？リリース間近？と疑問符付きで記事にしていたGoogleの新しい検索結果のデザイン、一度は「未だ開発中」と報じられたのですが、その後、正式公開であることが分かりました。私の知る限りでは新しいデザインを望まない声もあり、個人的な印象ですが、不満の残る中での適用となりそうです。今回の正式公開に関して、Google検索のリードデザイナーJon Wiley氏がGoogle+上で次のように説明しています。デスクトップのGoogle検索が少し違って見えることに気付いているかもしれません。昨年末頃、モバイルやタブレットデバイスでの検索にとても大きな改善を行いました（モバイル・ファーストです！）:-)。今日、その変更をデスクトップ上での体験に適用しました。タイトルのサイズを増やし、下線を削除し、全ての行の高さを一定にしました。このことが読みやすさを向上させ、全体的にすっきりとした見た

テクノロジー
2014/03/14 17:58

seo

Googleの新しい検索結果がリリース？リリース間近？適用範囲を拡大中｜ SEOモード

9 users

www.tyto-style.com

しばらく前から試験的に導入されていたGoogleの新しい検索結果。多くの方の環境や私の職場のPCで新しいデザインが表示されている中、旧デザインのまま頑張っていた自宅のPCでもついに新デザインに切り替わりました。ついにリリースでしょうか。あるいはリリース間近で最終的な調整の途中なのでしょうか。適用対象が拡大されたのは間違いなさそうです。新しいデザインの特徴としてまず目を引くのが、「大きくなったフォントサイズ」と、「広告に付けられた黄色のラベル」、そして「下線のなくなったリンク」です。以下は「Amazon」で検索した際の検索結果のキャプチャですが、これまでのデザインとは大きく異なっているのが分かります。また、上記以上に気になるのがタイトルです。（かなり短くなったという情報もありましたが、）今日の時点では、やや短い30文字前後が表示されています。例えば次のキャプチャでは上が「30文字

テクノロジー
2014/03/13 08:27

「URLの長さは2,000文字より短くした方がいい」とGoogleのMueller氏がアドバイス｜ SEOモード

13 users

www.tyto-style.com

「URLはどれくらい長ければ長すぎるといえるのでしょうか」という質問が英語版ウェブマスターフォーラムに投稿され、John Mueller氏が「2,000文字より短くした方がいい」とアドバイスしています。投稿された質問は以下です。 URLはどれくらい長ければ長すぎるといえるのでしょうか？私たちが使っているツールによれば、http://www.tlcingredients.com/about-us…が長すぎるというのですが、本当でしょうか？ Mueller氏は次のようにアドバイスしています。私が知っている限りでは、理論上長さの制限はありません。しかし、管理できるようにしておくために、2000字よりも短くしておくことをお勧めします。あなたの挙げたURLはそれよりはずっと短いようです。だから長さには問題ありません。(…) Mueller氏のいうように基本的にURLはできるだけ短くまとめた方がい

テクノロジー
2014/03/09 18:46

「Search Plus Your World（SPYW）」の反映を「google.co.jp」で確認｜ SEOモード

4 users

www.tyto-style.com

本日の昼ごろから「google.co.jp」の検索結果に「Search Plus Your World（SPYW）」が反映されているのが確認されています。辻氏のツイートで知りました。繋がりがあるアカウントからのGoogle+の投稿が検索結果に大きく影響を及ぼす仕様、Search Plus Your Worldがgoogle co.jpでも確認。テストの可能性も。米国等では2年前からの仕様です。 http://t.co/rRFt1gFrhz — 辻正浩 | Masahiro Tsuji (@tsuj) 2014, 3月 8 私もGoogle+アカウントにログインして確認したところ、同一のアカウントながら複数のブラウザで確認できました。 Twitter等でも、中山氏のツイートをはじめとして、複数の方が「表示されている」といった主旨の投稿をしており、テストの可能性もありますが、広範囲で適用

テクノロジー
2014/03/08 19:55

Googleが「スクレイピングサイト（コピーサイト）」の情報を収集｜ SEOモード

9 users

www.tyto-style.com

GoogleのMatt Cutts氏がTwitterで「スクレイピングサイト（コピーサイト）」の情報を集めるフォームをシェアしました。ツイートは以下です。 If you see a scraper URL outranking the original source of content in Google, please tell us about it: http://t.co/WohXQmI45X — Matt Cutts (@mattcutts) 2014, 2月 27 「Goolge上でオリジナルの情報より上位に来ているスクレイパーのURLを見つけたら教えてください」というシンプルな内容ですね。添えられているURLのリンク先は「Scraper Report」となっています。それぞれの項目を訳すと以下のようになります。スクレイパー・レポートもし、オリジナルよりも上位表示され

テクノロジー
2014/02/28 08:24

SEO
Google

ファセットナビゲーションの最適化―Googleが提示するベストプラクティスとワーストプラクティス｜ SEOモード

32 users

www.tyto-style.com

少し前に、Googleの「Webmaster Central blog」でファセットナビゲーションのベストプラクティスとワーストプラクティスに関する記事が投稿されました。Maile Ohye氏とMehmet Aktuna氏によって書かれた「Faceted navigation best (and 5 of the worst) practices」です。公式訳が公開されそう＆とにかく長いため紹介をしようかどうか迷っていたのですが、とても勉強になったので、私なりにまとめて記事にしておきます。ただ、（今でも長いですが）翻訳をそのまま載せるとどうも冗長になってしまう気がしたので、私なりに意訳したり端折ったりしたところがあることを、あらかじめご了承ください。前回の記事同様、公式が出る前のつなぎ程度に参考にしていただければと思います。また、おかしな訳や解釈がありましたら、ご指摘いだけると嬉しいです

テクノロジー
2014/02/17 10:08

Googleが推奨する無限スクロールのベストプラクティス｜ SEOモード

60 users

www.tyto-style.com

最近TwitterやFacebook、Google+等が採用しているため、無限スクロールがとても身近なものになりました。中にはプラグインなどを使ってWordPressのブログに無限スクロール（infinite scroll）を導入している方もいらっしゃるのではないでしょうか。ただ、無限スクロールのページを検索エンジンに最適化する方法についてまとめられている記事はあまり見かけませんね。無限スクロールを導入したけれど、どうやって最適化すればいいのか分からないという方も多いと思います。今回は昨日（先ほど）公開されたGoogleの「Webmaster Central Blog」の記事「Infinite scroll search-friendly recommendations」の一部（といってもかなりの部分ですが）を引用・翻訳して紹介いたします（ざくざくと急いで翻訳したので、おかしなところ

テクノロジー
2014/02/14 11:02

Facebookプラグイン「Like Box」の横幅を可変にしてレスポンシブにする方法｜ SEOモード

19 users

www.tyto-style.com

当ブログにはFacebookのプラグイン「Like Box」を設置しています。この「Like Box」、Facebookの専用ページから直接コードを取得すると、横幅がある程度決められているため、レスポンシブWebデザインの場合などページの横幅が変化する場合、はみ出したりして困ることがあります。今回「Like Box」を新たにコンテンツ内に設置するにあたり、コンテンツ幅が変化しても対応できるようにしたかったので調べてみたところ、とりあえずCSSだけで対応できたので、メモも兼ねて記事にしておきます。「Like Box」のコードにはいくつか種類がありますが、「HTML5」と「XFBML」であれば、次のように記述します。 .fb_iframe_widget, .fb_iframe_widget span, .fb_iframe_widget iframe[style]{ width: 100

テクノロジー
2014/02/07 15:59

Chrome 32でUserAgentやデバイスのエミュレーションを利用する方法｜ SEOモード

3 users

www.tyto-style.com

どのタイミングか分からないのですが（おそらくChrome32の更新と同時だと思いますが）、比較的最近Google Chromeの「デベロッパーツール」のUIが変更になりました。それと同時に、探し回るはめになったのが、これまで確か「右下の歯車アイコン」->「Overrides」->「Enable」と移動し、「User Agent」にチェックを入れることで表示できていた、エミュレートできる「UserAgent」の一覧です。どこにあるのかまったくわからなくて本当に困ったので（次回アップデートでもっと分かりやすい場所に移動することを願いつつ）、メモしておきます。

テクノロジー
2014/01/31 18:34

Breadcrumb NavXTを使ったパンくずリストの構造化マークアップ｜ SEOモード

36 users

www.tyto-style.com

Googleが検索結果画面にパンくずリストを出すようになって随分立ちます。当ブログの場合は結構前に出るようになっていたので、特に何もせずに放っておいたのですが、先日「SEOまとめ」片川氏（@seomatome）の記事「ul（リストタグ）とmicrodata構造化マークアップでパンくずリストにこだわりを」を読んでいて、やはり当ブログにも導入しておこうと思い導入してみました。今まで当ブログでは「WordPressにプラグインなしでパンくずリストを表示させる方法」を元にしてパンくずリストを設置しており、それをカスタマイズしたかったのですが、親子のカテゴリーに上手くmicrodataの記述を行えなかったので断念し「Breadcrumb NavXT」を使うことにしました。もっと簡単な方法もあるかもしれませんが、以下では私なりの方法をご紹介します。 ※マークアップに関しては「Breadcrumb

テクノロジー
2012/02/06 09:36

サイトの品質を高める23項目のチェックリスト｜ SEOモード

5 users

www.tyto-style.com

長らくブログを更新していなかったので、パンダアップデート等のホットな話題に記事内で触れる機会が無かったのですが、個人的に今月初旬のGoogle Webmaster Central Blogに掲載されたAmit Singhal氏の記事「More guidance on building high-quality sites」に掲載されているサイトの品質を測るためのチェックリストを、自分で訳す必要があったので、どうせならと記事にしてみました。先日の鈴木氏の記事によると、日本ではまだパンダ・アップデートが導入されていないとのことですが、パンダ・アップデート導入の有無に関わらず理解すべき内容だと思います。とはいえ、ここで採り上げる内容は既に、渡辺氏が翻訳し記事にされており、また安田氏も詳細な記事にされているため読まれた方も多いと思います。まだ読まれていない方や、別の翻訳として興味のある方は、ぜ

テクノロジー
2011/05/28 12:34

16のソーシャルブックマーク・アイコン素材 | tyto-style

12 users

www.tyto-style.com

今回はソーシャルブックマーク系のアイコンです。 TwitterやFaebookのアイコンは以前にも作ったのですが、そのとき結構楽しかったのと、他のアイコンが欲しいとブログに書かれていた方もいらっしゃったりしたので、少しずつ作っていました。とりあえずはpngの48*48のサイズだけです。今のところ他のサイズの作成は予定していません。小さいのが必要な人は、画像編集ソフトなどで加工してください。「ソーシャルメディア系アイコン / Social Media Icons」と同様に、それぞれ「それっぽい」ものを使って作っており、公式のものとは異なります。もし著作権とか問題があれば教えてくださいね。だらだら作っていたので、Fc2ブックマークが閉鎖するなど、既に使えないものも入ってしまっていますが、せっかく作ったので公開しておきます。 16 Social Bookmark Icons 以上、16

テクノロジー
2011/02/20 18:20

リンク構築のための51項目｜ SEOモード

9 users

www.tyto-style.com

今回は、「Econsultancy」に投稿されたKelvin Newman氏の「51 essential link building tips」をご紹介したいと思います。 TwitterやFacebook上で交流させていただいている某氏から依頼されて（笑）、翻訳を試みたのですが、51項目と非常に量が多く、全訳は厳しかったので、項目だけのご紹介となります。内容は「なるほど！」というものから「うーん？」と首を傾げてしまうものまで様々ですが、普段の自分自身のやっていることを考えると、まだまだやれることがあることに気づかされて、とても参考になりました。元記事は、Newman氏の経験を踏まえた解説などを含んでいて、分かりやすいので、興味のある項目があればぜひ直接読んでみてくださいね。リンク構築51のヒントゲスト投稿出版可能なリソースの提供リソースをキュレートする初心者ガイド神話を覆す時事コンテ

テクノロジー
2011/02/16 00:39

フッターを有効に使うための6つのポイント｜ SEOモード

18 users

www.tyto-style.com

Michael Gray Graywolf’s SEO Blogに投稿された記事「How to Build an Effective Footer」の内容が個人的にとても興味深かったので、メモ的に投稿します。 Michael Gray氏はフッターがウェブサイトの中でも上手く使われなかったり、誤った使われ方をしたりするエリアだとして、SEOを意識してフッターを効果的に使う方法を6つのポイントに分けて紹介しています。以下は記事の内容を私なりにまとめたものです。フッターのリンク数を必要最小限に抑えるようにします。 Gray氏は可能であればリンクを25以下に抑えることを勧めています。具体的な数字はともかく、大量のリンクがマイナスに働くことも指摘されていますので、気をつけたいところです。検索エンジンに定期的に異なるコンテンツを見せるため、限定的に動的要素を採り入れるようにします。例えば、「最近の投

テクノロジー
2011/02/01 07:25

Facebookファンページの更新をメールで通知する「Hyper Alerts」｜ SEOモード

14 users

www.tyto-style.com

先日、Facebookのファンページを作ったことをお知らせしました。今までとはまた違った感じでこれはこれで楽しく、ちょこちょこと更新していますが、ひとつ不便だったのは、更新状況を把握できず、定期的にアクセスしなくてはいけなかったことでした。「HootSuite」という手もあるのですが、メールかRSSで通知してくれるものが良かったんですね。そこで探しているうちに見つけたのが、「Hyper Alerts」で、 Facebookのファンページに投稿があったときにメールで通知してくれるサービスです。このサービスが便利なのは、ウォールへの投稿だけでなく、コメントが投稿されたときも通知してくれるように設定できることですね。 ※ちなみにただ単にウォールへの投稿を知りたい場合は、Googleリーダーに直接ファンページのURLを投稿すれば更新を取得できるようになります。 Hyper Alertsに登録

テクノロジー
2011/01/29 10:57

SEOを意識したページ作成時に気をつけたい7つの項目｜ SEOモード

31 users

www.tyto-style.com

ウェブページを検索エンジンに最適化するには、閲覧しやすいユニークなコンテンツを作るのがいいというのは変わらない事実だと思います。しかし、そもそも検索エンジンにインデックスされにくかったり、見つけられにくかったりするとせっかくのコンテンツが台無しになってしまいますから、そんなことがないよう、ページをクロールしやすく、また結果的にリンク構築やアクセスの増加につながるように作成しておくことは重要ですね。以下では、SEOを意識したページ作成で気をつけておきたい項目を7つ挙げてみたいと思います。 1. Title要素オンページSEOでは重要な箇所だと考えています。タイトルに含まれるテキストは露出が多く、自然なかたちでキーワードが含まれていることが望ましいです。もちろん、闇雲にキーワードを詰め込むようなことは避けるべきです。 Googleは「Holiday source code houseke

テクノロジー
2011/01/24 07:56

2011年に注意すべきリンク構築に関する6つのポイント｜ SEOモード

25 users

www.tyto-style.com

2011年の最初の記事は、リンク構築に関する記事にしたいと思います。 Search Engine Journalに投稿されたKristi Hines氏の記事「5 Link Building Predictions for 2011」は2011年にリンク構築を行う上で注意すべきポイントを以下のように6つにまとめています。今回はこのポイントを手掛かりにリンク構築について考えてみます。 2011年のリンク構築に関する予測キーワードに基づくアンカーテキストの使用が減り、ブランド名の使用が増加する量の価値が減じ、質に重点が置かれるページランクの価値が減じ、オーソリティに重点が置かれるホームページへのリンクが減り、コンテンツへのリンクが増加するランキングへの関心が減り、コンバージョンへの関心が増すDofollowの必要性が低下し、ソーシャルな言及の必要性が増すキーワードに基づくアンカーテキストの使用が

テクノロジー
2011/01/05 09:08

SEOの基礎(16) – リンク構築に関して知っておくべきこと｜ SEOモード

7 users

www.tyto-style.com

SEOの基礎、パート16です。今回はリンク構築を扱った記事になります。SEOの基礎シリーズもこれで最後になりますね。8月の始めからですから、約2か月かかりました。長かったですが、自分自身非常に勉強になりましたので、個人的にはとても満足しています。以下はStoney deGeyter氏による「SEO 101 – Part 16: Everything You Need to Know About Building Links」の全訳になります。もし誤訳や解釈のミスなどがありましたら、ぜひご指摘ください。可能な限り修正していきたいと思います。 SEO101 – Part16: リンク構築についてこれだけは知っておきたいこと以下のシリーズはニューヨークでL’Oreal主催の美容系ブロガーグループに行ったプレゼンテーションから転用したものである。プレゼンテーションのほとんどは、ブログを検索エン

テクノロジー
2010/10/01 07:44

SEOの基礎(15) – リンク行為に関して知っておくべきこと｜ SEOモード

6 users

www.tyto-style.com

SEOの基礎、パート15です。リンク行為に関することを扱った記事になります。以下はStoney deGeyter氏による「SEO 101 – Part 15: Everything You Need to Know About Linking」の全訳になります。もし誤訳や解釈のミスなどがありましたら、ぜひご指摘ください。可能な限り修正していきたいと思います。 SEO101 – Part15: リンク行為についてこれだけは知っておきたいこと以下のシリーズはニューヨークでL’Oreal主催の美容系ブロガーグループに行ったプレゼンテーションから転用したものである。プレゼンテーションのほとんどは、ブログを検索エンジンとユーザーに優しいものにする方法について用意されたものだが、ここで私はあらゆる業界をまたがって製品やサービスを販売するサイト向けのコツや戦略を含む多くのコンセプトを膨らませていく

テクノロジー
2010/09/27 08:24

はてなブックマーク

はてなブックマーク

『Tyto Style』

Android標準ブラウザで表示がヘンなら原因は「background-attachment」かも｜ SEOモード

AndroidのChromeでフォントサイズが大きくなってしまう不具合は「max-height」で解決するかも｜ SEOモード

ウェブ検索のインデックスにOGPメタタグは利用していない、とGoogleのMueller氏｜ SEOモード

複数人で投稿するWordPressで記事毎に著者情報を表示する方法｜ SEOモード

Google、Twitter上で有料リンクの契約更新を促していた「Web Design Library」にペナルティか？｜ SEOモード

Googleはページ上の複数のパンくずリストをどのように扱うのか？｜ SEOモード

Googleの検索結果の新デザインが正式公開に｜ SEOモード

Googleの新しい検索結果がリリース？リリース間近？適用範囲を拡大中｜ SEOモード

「URLの長さは2,000文字より短くした方がいい」とGoogleのMueller氏がアドバイス｜ SEOモード

「Search Plus Your World（SPYW）」の反映を「google.co.jp」で確認｜ SEOモード

Googleが「スクレイピングサイト（コピーサイト）」の情報を収集｜ SEOモード

ファセットナビゲーションの最適化―Googleが提示するベストプラクティスとワーストプラクティス｜ SEOモード

Googleが推奨する無限スクロールのベストプラクティス｜ SEOモード

Facebookプラグイン「Like Box」の横幅を可変にしてレスポンシブにする方法｜ SEOモード

Chrome 32でUserAgentやデバイスのエミュレーションを利用する方法｜ SEOモード

Breadcrumb NavXTを使ったパンくずリストの構造化マークアップ｜ SEOモード

ソーシャルブックマーク＆投稿ボタンの設置方法｜ SEOモード

無料アイコン素材 | tyto-style

サイトの品質を高める23項目のチェックリスト｜ SEOモード

16のソーシャルブックマーク・アイコン素材 | tyto-style

リンク構築のための51項目｜ SEOモード

フッターを有効に使うための6つのポイント｜ SEOモード

Facebookファンページの更新をメールで通知する「Hyper Alerts」｜ SEOモード

SEOを意識したページ作成時に気をつけたい7つの項目｜ SEOモード

2011年に注意すべきリンク構築に関する6つのポイント｜ SEOモード

SEOの状況を分析するためのフレームワーク｜ SEOモード

SEOを考慮したウェブサイト移転のプロセス｜ SEOモード

SEOの基礎(16) – リンク構築に関して知っておくべきこと｜ SEOモード

SEOの基礎(15) – リンク行為に関して知っておくべきこと｜ SEOモード

キーボードショートカット一覧

はてなブックマーク

公式Twitter

はてなのサービス

『Tyto Style』

このページはまだブックマークされていません

キーボードショートカット一覧

公式Twitter

はてなのサービス

このページはまだ
ブックマークされていません