メディア関係者向けお問い合わせ先 メールでのお問い合わせ: pr-jp@google.com メディア関係者以外からのお問い合わせにはお答えいたしかねます。 その他すべてのお問い合わせにつきましては、ヘルプセンターをご覧ください。
![リッチスニペットで検索結果をより分かりやすく](https://cdn-ak-scissors.b.st-hatena.com/image/square/344988ebe8c10ce169549d8d7d0d0862cd8c4b1d/height=288;version=1;width=512/https%3A%2F%2F2.bp.blogspot.com%2F-7bZ5EziliZQ%2FVynIS9F7OAI%2FAAAAAAAASQ0%2FBJFntXCAntstZe6hQuo5KTrhi5Dyz9yHgCK4B%2Fs1600%2Fgooglelogo_color_200x200.png)
メディア関係者向けお問い合わせ先 メールでのお問い合わせ: pr-jp@google.com メディア関係者以外からのお問い合わせにはお答えいたしかねます。 その他すべてのお問い合わせにつきましては、ヘルプセンターをご覧ください。
HTML 各デモのベースとなるHTMLです。 div要素のclassを変更して利用します。 <div class="pic"> <img src="image.jpg"> </div> 各デモで共通で使用するスタイルです。 * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } body { background: #333; } .pic { border: 10px solid #fff; float: left; height: 300px; width: 300px; margin: 20px; overflow: hidden; -webkit-box-shadow: 5px 5px 5px #111
ボタンを触ったときに画像を変更させるロールオーバーは良く使いますよね。 jqueryを使っての簡単ロールオーバーする方法を紹介します。 $(function(){ $("img[src=’img/button.gif’]").mouseover(function(){ $(this).attr("src","img/button_on.gif"); }).mouseout(function(){ $(this).attr("src","img/button.gif"); }); }); 解説 $("img[src='img/button.gif']").mouseover 画像を$(“img[src=’img/button.gif’]”)で選択して、 mouseoverでマウスが画像の上にのったときに下記のイベントが実行されます。 (function(){ $(this).attr("sr
タグの閉じ忘れをチェックするブックマークレットを紹介します。 もう数年使わせてもらってます。 コーディングがほぼ終わった状態で、カラム落ちとか なにか表示がおかしいとき、divタグなどの閉じ忘れってよくあるのですが どのタグ周辺の閉じタグがないのかをワンクリックでチェックしてくれるものです。 使い方は簡単で、こちらのページのインストール項目の「タグ対応をチェック」というリンクをドラッグしてブックマークツールバーに入れるだけ。 あとは、チェックしたいページで さきほどブックマークツールバーに入れたブックマークを押すと 自動でチェックしてくれます! ご参考にどうぞ。 HTML内タグの閉じ忘れをチェックするツール[ブックマークレット] 関連記事 セリフ体をうまく利用しておしゃれな印象の4サイト 2011/12/26 Fireworksの微妙な色の調節に、「ブレンダー」が便利です。 2011/12
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
上記の属性は、select要素とoption要素のどちらにも指定することができます。しかし、option要素に対するこの属性の指定は、一部のブラウザでは対応していないようです。 disabled (部品を無効化する) この属性が指定された部品は、選択することができなくなります。
Web 制作のことを中心に、ちょっとした Tips などを掲載しています。「自分用メモ」が基本スタンス。 btmup Blog 最近、Google カスタム検索エンジンのコードが変更されたみたいです。それも大幅に。 以前までは HTML ソースを直接貼り付ける方法だったんですが、新しいコードは JavaScript を使って HTML を呼び出しています。 前まではこんな感じ↓だったんですが、 <form action="http://www.google.com/cse" id="cse-search-box"> <div> <input type="hidden" name="cx" value="XXXXXXXXXXXXXXXXXXXXX:YYYYYYYYYYY" /> <input type="hidden" name="ie" value="UTF-8" /> <input ty
この例をもとに、HTMLのフォームを構成する要素を順番に説明していきます。この例のHTML全体は、本章の最後で改めて紹介します。 フォームの基本枠組み データを送信するためには「何を」「どこに」「どうやって」送るかを示さなければなりません。フォームはこのための手段を提供します。 HTMLのフォームは、データを入力するための手段(コントロールと呼びます)と、それに関するラベルや説明から構成されるひとまとまりのセクションです。「何を」送信するかを示すためにこのセクションの範囲を明示し、「どこに」「どうやって」送信するかを設定します。この枠組みを提供するのがform要素です。 form要素の構造 form要素タイプは2つの主要な属性を持ちます。ひとつは「どこに」、つまりデータを受け取るプログラムを指定するaction属性、もうひとつが「どうやって」、つまりデータの送信方法を指定するmethod属
ファイル名の最後のドット(.)から後ろの部分を『拡張子』と呼びます。index.html の拡張子は .html で、title.gif の拡張子は .gif です。拡張子はそのファイルが何であるかを示します。例えば、.html はHTML文書、.txt はテキスト文書、.gif は GIF画像、.jpg は JPEG画像のファイルであることを示しています。 Windows では、標準の設定では拡張子は表示されません。[スタート]-[(すべての)プログラム]-[アクセサリ]-[エクスプローラ] を起動し、[ツール]メニューの [フォルダオプション]-[表示] で、[登録されている拡張子は表示しない] のチェックをオフにしてください。 また、Windows では、ファイルをダブルクリックした時の動作はこの拡張子によって決まります。例えば .txt のファイルをダブルクリックすると [メモ帳]
この要素がform要素内に配置されている場合は、name属性の有効範囲はそのform要素内に限られます。 name属性の値は、入力されたデータ(またはvalue属性の値)とセットで送信されることになります。 type属性の値がtextまたはpasswordの場合は、value属性の値が入力欄に表示されます。 type属性の値がsubmit reset buttonの場合は、value属性の値がボタン上に表示されます。 type属性の値がradioまたはcheckboxの場合は、value属性が必須となります。 type属性の値がtextまたはpasswordの場合は、size属性の値を文字数で指定します。(それ以外の部品に対してはピクセル数で指定しますが、実際にはその指定の効果はないようです) maxlength属性の指定は、type属性の値がtextまたはpasswordの場合に有効とな
type="hidden" (隠された部品を作成) type属性の値に hidden を指定すると、画面上には表示されない隠された部品を作成できます。 name="" (部品の名前を指定) フォーム部品を識別するための名前を指定します。 この属性の値は、value属性の値とセットで送信されることになります。 value="" (送信される文字列を指定) この属性の値が、データとして送信されることになります。 隠しデータについて このフォーム部品で設定されたデータは、ブラウザの画面上には表示されません。(ただし、ソースを見れば確認することができます) 予め設定しておいたデータを、CGI等のプログラムに送信したい場合などに使用します。 使用例 <form method="post" action="example.cgi"> <p>隠しデータ<br> <input type="hidden"
当サイトは2008年頃までに作成されたものをモバイル端末向けに再設計したものです。 現在では有効ではない情報が多いので、技術情報ではなくSEOの黎明期に想いを馳せる読み物としてご利用ください。 決定打にこそなりませんが、SEOにおいて唯一自己の技術だけで解決できる要素なので、やらなければ損です。 HTMLの厳格化(NGタグや属性の撤廃) 当ページの主意と矛盾するようですが、基本的に冗長なタグや属性、あるいは少々の構文ミスがあってもSEOには「ほとんど」影響しません。 しかし「ほとんど」という点が、SEOでは非常に問題になります。何故なら無頓着な人がつくったサイトのNG箇所はソースの大半を占めることもあり、こうなると目に見える違いが出てきます。 装飾のためのタグはCSSに代替 ここでいう装飾とは主に次のようなものを指します。
目次 4.1. 文書は整形式でなければならない 4.2. 要素名と属性名は小文字でなければならない 4.3. 非空要素に対しては終了タグが必須 4.4. 属性値は常に引用符でくくらなければならない 4.5. 属性の最小化 4.6. 空要素 4.7. 属性値内の空白の取り扱い 4.8. スクリプトとスタイル要素 4.9. SGML 排除機能 4.10. 'id' と 'name' 属性を持つ要素 4.11. 定義済み値セットを持つ属性 4.12. 16進数値の実体参照 本セクションは参考的。 XHTML は XML 応用言語であるという事実により、SGMLベースの HTML 4 [HTML4] では完全に合法的であった特定の実践は変更されなければならない。 4.1. 文書は整形式でなければならない (Documents must be well-formed) 整形式は [XML] で導入さ
HTML文書の文法をチェックし、採点します htmllint.cgi 1.28 / htmllint.pm 3.58 33,323 lints / 0 visits / since Jan 6, 1998 文法しか採点しません。内容の良し悪しは採点されません。結果に疑問を感じたら必ず結果の解説を読んでください。満点で慢心しないでください。 チェックしない警告は減点対象外で、満点は 100点です。チェックしても減点されない警告もあります。気に入らないチェック項目は外すことができます。お好みに調整してください。 また、基本的な設定項目だけの簡易ゲートウェイもあります。いちいちオプションなんかどうせ指定しないや、という方はご利用ください。 ローカル環境でチェックしたいとお考えの方は、ダウンロードのページを参照してください。 チェック方式 チェックしたいHTMLのURLを指定するか、HTMLを下の
Facebookを利用するようになって各種サイトにおいてある「いいね!(like)」ボタンを自然に押すようになった。ボタンをおいてないところもlike bookmarkletなんかで押せるから問題ないと言えば問題ないものの、やはりサイトにおいてあった方が目に付くし押しやすいという事実はどうしても感じてしまう。 ところが先日記事ごとに「いいね!」ボタンをおいていたサイトにアクセスしたら、ボタンが消えてしまっていた。話によると「(ページ自体が重いので)軽くするために外してしまった」らしい。確かにいいね!ボタンはiframeかJavaScript(XFBML)を使って表示するしかなく、インラインフレームの読み込み時間も相まって少々重いパーツになってしまっていると思う。 しかしこれで納得してしまっては面白くないので、フレームを使わない簡単なHTMLとCSSだけでブログなどに設置できるいいね!ボタン
はじめに ご使用上の注意 (1) 主な更新履歴 (24) 管理者へのメール (1) 自己紹介 (1) 基本編 用語集 (82) Webページ作成入門 (7) 逆引きリファレンス (32) フォーマット HTML (400) HTML5 (7) XHTML (1) MathML (1) DTD (1) JSON (1) SVG (1) VML (1) GIF (1) CSV (1) セマンティック・ウェブ (1) CSS CSS (ABC順)(719) Bootstrap (61) Less (1) Sass (1) Tailwind CSS (1) CSSフレームワーク (1) リセットCSS (1) プログラミング言語 JavaScript (39) TypeScript (1) Java (25) Perl (4) PHP (14) Ruby (11) Python (13) Go (
border=n [非推奨] H3/e2/Ch/Fx/Sa/Op/N2 枠線の太さを指定します。この属性を記述しない、または、0 を指定すると枠線を表示しません。HTML5 では 1 のみ指定可能で、太さはスタイルシートを用いるようになります。HTML Living Standard では廃止されました。 bordercolor=color [非推奨] e2/Ch/Fx/Sa/Op/N4 枠線の色を指定します。HTML5 には採用されていません。代わりに border-color を使用してください。 bordercolordark=color [非推奨] e2 立体的な枠線の暗い部分の色を指定します。 bordercolorlight=color [非推奨] e2 立体的な枠線の明るい部分の色を指定します。 frame=frame [非推奨] H4-4/e3/Ch/Fx/Sa/Op 各セ
Googleは、FlashファイルをHTML5に変換するツール「Swiffy」を発表した。SWFファイルにこのツールを適用すると、SWFファイルがJSONファイルに変換され、HTML、SVG(Scalable Vector Graphics)、CSS(Cascading Style Sheets)を使ってレンダリングされる。Googleによれば、変換されたファイルのレンダリングパフォーマンスは非常によく、ファイルサイズはオリジナルよりわずかに大きくなるという。 Adobe Systemsも、2011年に入って同様のツール「Wallaby」を発表している。このツールは、FLA形式のファイルを、HTML5、JavaScript、CSSに変換するものである。 Googleは、Swiffyに関するFAQで、Adobeは「FlashプラットフォームがFlashプレーヤーをサポートしていないデバイスに
スタイルの付与・常套テクニックを使う CSSを分けて記述する 次にスタイルを定義していく。このようにシンプルなデザインの場合は、常套(じょうとう)的に使われているテクニックで効率的に制作できる。 CSSを設定するには<link>要素を用いて、href属性にパスを指定する。ここではほかに、type属性とrel属性・media属性を指定している。これらの属性について説明すると、<link>のtype属性はhrefで指定されるコンテンツ(この場合はCSSファイル)のMIMEタイプに関する情報を与えることができる。rel属性は、そのコンテンツとの関係性を述べ、media属性は意図する出力メディアを指定できる。ここでは「all」と指定しているので、すべてのメディアに対してこのCSSが適用されることになる。 この<link>属性に割り当てられているのは、CSSをインポートするのみの役割を持ったCSSで
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く