タグ

htmlに関するcapriceのブックマーク (20)

  • URLの正規化ができていないよく見かける4つのケース | エンジニアのためのSEO入門

    Web担当者さんへ システムで生成していないページでもURLの正規化は重要な要素です。今一度自分のサイトで正規化できてない個所がないか、アクセス解析などのデータをチェックしてみてください。正規化とは「正規化」とは、システム開発の世界でデータベース設計に関連してよく利用される言葉ですが、これをSEOの世界に置き換えてみると、大きく以下の2つの意味になります。 そのキーワードを表すURLは、そのサイト内で1つのみ存在するそのコンテンツは、そのサイト内で1つのみ存在するユーザーが検索キーワードを入力すると、検索エンジンはインデックスされている全ドメインから1~2つのURLをピックアップして、順番に並べて表示します。SEOの対象となる、自然検索(オーガニック検索)結果表示エリアへの露出に関しては、1サイト(=1ドメイン)につき、最大2つのページしか表示されません(Googleではこれをクラスタリン

    URLの正規化ができていないよく見かける4つのケース | エンジニアのためのSEO入門
  • いま起きているWeb標準の進化、HTML5、CSS3、JavaScript 2.0

    が大型連休に入る少し前の4月23日、W3CはHTML5の新しいドラフトを公開しました。いつも最新のWeb標準化動向を伝えてくれるWeb標準ブログのエントリ「Last Callに向け進むHTML5 | Web標準Blog | ミツエーリンクス」によると、今回のドラフトから仕様書に大きく手が加わり、Webサイトを作る人向け(制作者に関係する要件)と、Webブラウザを作る人向け(実装要件についての要件)ごとに見やすくなるようなスタイルシートが用意されたとのこと。 これまでも何度かこのブログでは、HTML5やJavaScript 2.0などのWeb標準の動向を書いてきましたが、今回は分かりやすいようにその動きをまとめてみました。 HTMLHTML4でいったん進化が終了し、それ以後はXHTMLで進化していくことになっていました。しかし実際にはXHTMLは期待されたほど普及せず、XHTMLによっ

    いま起きているWeb標準の進化、HTML5、CSS3、JavaScript 2.0
  • なぜHTML5がそれほど重要か?

    HTML5はなぜ重要なのでしょうか。このブログでも、HTML5はIT業界全体にとって重要な標準だと位置づけて、その動向については何度も取り上げてきました。 いま起きているWeb標準の進化、HTML5、CSS3、JavaScript 2.0 HTML5/CSS3は最新Webブラウザでどれだけ実装が進んでいるか? HTML5の標準化で表面化したSQLの非互換性問題 HTML 5でセマンティックWebが進むと困る人たち HTML5はHTML4のバージョンアップではありますが、HTML5はそれまでのHTMLやXMLと大きく異なる点があります。それは、HTML5がWebアプリケーションのための標準だという点です。そこがHTML5の最大の重要性ですが、それに加えて2つの重要なポイントがあると考えています。 エントリでは、その3つの重要性について紹介したいと思います。 ドキュメントの共有から始まったW

    なぜHTML5がそれほど重要か?
    caprice
    caprice 2009/07/24
  • Vector: HTML Project2 - 新着ソフトレビュー

    高機能なタグ挿入型HTMLエディタ。タグの入力支援や整合性のチェックから、複数のサイトを制作するような場合に便利なプロジェクト単位でのファイル管理機能、コマンドマクロなどにいたるまで、数え切れないほどの豊富な機能を持つ。メイン画面の編集エリアはタブ切り替え式になっており、複数のファイルを同時に開いて編集することが可能。フォルダツリーを使って簡単に編集対象ファイルを選択できるほか、プロジェクトを作成することで、編集するファイルのセットを簡単に切り替えることもできる。フォルダツリーは通常、画面左側に配置されるが、フロートさせることも可能。さらに、編集エリアの下には「階層」「属性値」「ビュー」「検索」の四つのタブがあり、タグの階層構造(入れ子状態)やリンク切れのチェック、プレビューなどの機能を利用できる。 タグの入力は、メニューコマンドから選択・挿入する以外にも、さまざまな支援機能を使って行える

  • HTMLを綺麗に保つ12の原則 | エンタープライズ | マイコミジャーナル

    Smashing Magazine - WE SMASH YOU WITH THE INFORMATION THAT WILL MAKE YOUR LIFE EASIER, REALLY. Chris Coyier氏がSmashing Magazineにおいて12 Principles For Keeping Your Code CleanのタイトルのもとHTMLコードをクリーンにするための12の原則を紹介している。厳密には11の原則だが、HTMLをクリーンに保つ上で実践的で効果的なものだ。WebデザイナやWebデベロッパは一度チェックしておきたい。12 Principles For Keeping Your Code Cleanで紹介されている原則を要約すると次のようになる。 [原則1] HTML 4.01を採用する場合でもXHTML 1.0を採用する場合でもStrict指定のDOCTY

    caprice
    caprice 2008/11/16
  • Dan Benjamin

    Dan Benjamin is an inventor, podcaster, software developer, and writer. In early 2009, Dan became a full-time podcaster with the launch of 5by5.tv, often called "NPR for Geeks" by its listeners. 5by5 quickly rose to become one of the top tech-focused pocast networks, drawing talent from all corners of the tech, gaming, productivity, and entertainment industries. Dan’s podcasts have gone on to rece

  • テキストエディタでWebサイト構築をガンバル人へ(1/3) ― @IT

    テキストエディタでWebサイト構築をガンバル人へ:どこまでできる? 無料ツールでWebサイト作成(6)(1/3 ページ) 「あえて」テキストエディタでWebサイト構築 今回はテキストエディタと組み合わせることで、開発をより便利にできるツールについて考えてみよう。 現在「あえて」テキストエディタでの開発を行われている方には、現在使っているエディタを選択するまでの“経緯”や“こだわり”があると思う。筆者もこれまでにさまざまなテキストエディタを試し、「この程度のもので十分だ」と感じるテキストエディタを現在使っている。 テキストエディタ+α そこで今回は、テキストエディタ自体とそのプラグイン/拡張機能に関する紹介は行わないこととし、「どのようなテキストエディタを使っている場合でも、組み合わせて使うことでより簡単にWebサイト構築ができるツール」という観点で紹介したいと思う。もちろん、Webオーサリ

    テキストエディタでWebサイト構築をガンバル人へ(1/3) ― @IT
  • BET体育365官网-best365官网登录

    推荐¢BET体育365官网-best365官网登录为您提供最高质量的真钱娱乐游戏,每个游戏都受专业部门认准,绝对公平公正,官网品牌授权认证,拥有可靠先进稳定的场所,24小时无断线,欢迎您的到来.

  • 入力フォームが空のときに入力案内を表示 - [ホームページ作成]All About

    テキスト入力欄に案内文字を表示 テキスト入力欄内に最初から薄い文字で案内が表示されていて、クリックしてカーソルを入れると案内文字が消えるフォームをよく見かけます。 例えば下図のようなフォームです。 このような「案内文字」を表示したり消したりする入力欄は、JavaScriptを活用すると簡単に作れます。 JavaScriptを使えば、入力欄内の文字と装飾(文字色)を自由に変更できるからです。 試しに作ってみた入力フォームを下記に掲載しています。下記の入力欄内をクリックして、カーソルを入れてみて下さい。案内文字が消えるはずです。 何もフォーム内に入力しないまま(ページ内の他の場所をクリックするなどして)カーソルを入力欄外に出せば、案内文字が戻ります。 ※JavaScriptが使えないか無効な環境では、案内文字は消えずに入ったままです。 上記のサンプルでは、以下のような動作が行われています。

  • HTML 5はユーザビリティにもSEOにも効く新次元の規格 | 企画書を光らせる珠玉のキーワード

    HTML 5は、HTML、XHTMLと、それらをスクリプトなどで扱うための仕組みの定義を総合的に扱う、新しいHTML仕様だ。 HTML 5を正しく理解する大きなポイントとして、現在はウェブ標準の仕様を多く定めているW3C(ワールドワイドウェブコンソーシアム)で策定作業が進められているが、以前はWHATWGという団体によって「ウェブアプリケーション1.0(Web Applications 1.0)」という名前の仕様として開発が進められていた点がある。内容にふれる前に、まずはその根の思想にもかかわるWHATWGという団体について軽くふれておきたい。 WHATWGの正式名称は「ウェブハイパーテキストアプリケーション技術ワーキンググループ(Web Hypertext Application Technology Working Group)」。ウェブブラウザの開発元であるApple、Mozill

    HTML 5はユーザビリティにもSEOにも効く新次元の規格 | 企画書を光らせる珠玉のキーワード
    caprice
    caprice 2007/10/12
  • 入力された文字をいい感じに実体参照に変換してくれる便利ツール『HTML Entity Character Lookup』 | POP*POP

    ウェブサイトを作っている人に便利なツールのご紹介。「HTML Entity Character Lookup」ではAjaxを使って記号を実体参照に変換してくれます。 ある程度適当に書いても似たようなコードの一覧を出してくれるのが特徴。 ↑ 「c」と入力するとそれに該当しそうなコードをすべて教えてくれます。 あのコードなんだったかな、という時に便利そうですね。ご利用は以下からどうぞ。 » HTML Entity Character Lookup › Left Logic ちなみに実体参照がらみでよく使っているツールもあわせてご紹介。 蓄々HTML実体参照変換 : akiyan.com ↑ コードを張り付けるとさくっと変換してくれます。 MovableType用EntityRefButtonプラグイン v0.0.5 (エムロジック放課後プロジェクト) ↑ MovableType上でコードを書く

    入力された文字をいい感じに実体参照に変換してくれる便利ツール『HTML Entity Character Lookup』 | POP*POP
  • HTMLをPHPやJavaScript、ASPでの出力文に変換してくれるサービス:phpspot開発日誌

    HTMLPHPJavaScript、ASPでの出力文に変換してくれるサービス 2007年04月12日- Yellowpipe - HTML converter: HTML to PHP, HTML to Javascript, HTML to ASP Online HTML to Script Converter tool HTMLPHPJavaScript、ASPでの出力文に変換してくれるサービス。 次のように、プレーンなHTMLを書いて変換ボタンを押すと、JavaScript の場合 document.writeln("〜"); な形式に変換してくれます。 (PHPの場合は echo 文にしてくれます) <html> <body> hogehoge </body> </html> ↓ <script type="text/javascript"> <!-- document.w

  • 窓の杜 - 【NEWS】好きなテキストエディターでHTMLタグ入力補完を利用できる「HTMLAssistant」

    さまざまなテキストエディターでHTMLタグ入力補完機能を利用できるようにする支援ソフト「HTMLAssistant」v1.06が公開された。Windowsに対応するフリーソフトで、編集部にてWindows XPでの動作を確認した。現在、作者のホームページからダウンロードできる。 「HTMLAssistant」は、タスクトレイ常駐型のHTMLタグ入力支援ソフト。普段利用しているさまざまなテキストエディター上で、HTMLタグの入力補完を実現できるのが特長。 ソフト起動中に任意のテキストエディターで“<”を入力すると、HTMLタグの要素や属性の候補リストがキャレット位置にポップアップ表示される。このとき、1文字入力するたびに該当するHTML要素が絞り込まれていく仕組み。また、属性に関してもキャレット位置の要素に対応する候補のみに絞り込むことが可能。 ソフトは多くのテキストエディターに対応して

  • http://msugai.fc2web.com/web/tips/link.html

    caprice
    caprice 2007/03/28
  • CSSに見惚れてばかりじゃなくて、もっと私(HTML)を見てよっ!

    と、htmlさんが嘆いている気がしたので、こんなサイトですがhtmlさんに付いて書きます。 ウチのサイトの一番の目的は「CSSって面白い!」って思ってもらい、興味を持ってもらう事にある訳ですが、次のSTEPに進む為にやっぱり通らなければならない道である(X)HTMLの正しい記述方法。 もちろん、CSSの勉強の前に(X)HTMLの理解をしてからが理想だと思いますが、ボクはソレがベストだとは思っていません。 何かを覚えるのに、「この順番で覚えなければ絶対にいけない。」なんて事は無いと思います。 ホントのビギナーさんは、CSSビギナー向けから、取りあえずCSSに触ってみるっていうのがボクのオススメです。 楽しんでナンボっす。 で、まぁ今回の対象となる方々は、テーブルレイアウトからCSSに移行した人で、(X)HTMLについては特に触れなかった人とか、Blogで初めてCSSに触れた人とか、CSSの魅

    CSSに見惚れてばかりじゃなくて、もっと私(HTML)を見てよっ!
  • Always with HTML - Section 2

    Section 1 ではクライアントサイドイメージマップの概要を解説した。ここでは座標の指定のしかたなどを細かく見ていこう。 <AREA> の SHAPE 属性で rect,circle,poly が指定された場合には,その領域を COORDS 属性に指定しなければならない。このために,画像の左上を原点として,右を x 軸正の向き,下を y 軸正の向きにとる座標系を考える。たとえば 160×120 ピクセルの画像の左上は (0,0),右上は (159,0),左下は (0,119),右下は (159,119) になる。0 から数えるので,x および y の最大値は幅あるいは高さより 1 だけ小さくなる。 COORDS 属性の値は複数の座標(長さ)をカンマで区切って与える。ピクセルまたは百分率で指定可能である。これから,個々の場合について COORDS 属性の指定方法を見てみよう。

    caprice
    caprice 2007/02/19
  • 装飾およびレイアウト目的の画像の代替テキスト | アクセシビリティBlog | ミツエーリンクス

    Webサイトのアクセシビリティを高めるための方法や国内外の関連情報など、さまざまな角度からWebアクセシビリティに関する話題をご提供していきたいと思います。 2007年02月09日 装飾およびレイアウト目的の画像の代替テキスト アクセシビリティ・エンジニア 中村 Blog上でも何度か取り上げておりますが、アクセシビリティ向上のためには画像の代替テキストは必須です。このことについては、JIS X 8341-3やWCAG 1.0、そして策定中のWCAG 2.0の草案でも、それぞれ表現は異なるものの明確に述べられています。例えばJIS X 8341-3の場合、5.4 a)において、以下のように記されています。 画像には、利用者が画像の内容を的確に理解できるようにテキストなどの代替情報を提供しなければならない。 また、HTML 4.01の仕様書でも、img要素のalt属性は必須であることが明記さ

  • IFRAMEを使わずにHTMLファイルから他のHTMLファイルを読み込む方法:phpspot開発日誌

    Insert HTML page into another HTML page | published @ aplus moments IFRAMEを使わずにHTMLファイルから他のHTMLファイルを読み込む方法。 Objectタグで外部ファイルを読み込む方法があるんですね。 <html> <head> <title>test</title> </head> <body> <!--[if IE]> <object classid="clsid:25336920-03F9-11CF-8FD0-00AA00686F13" data="/exec/some.html" style="width:100;height:100px"> <p>non object</p> </object> <![endif]--> <!--[if !IE]> <--> <object type="text/html

    caprice
    caprice 2006/11/24
  • 印刷専用ページを簡単に作るには(SSI版) - [ホームページ作成]All About

    印刷専用ページを用意する! ホームページ上のコンテンツは、紙に印刷されることもよくあります。 ページの左右にメニューや広告などが配置されている場合、うまく印刷できない場合もありますね。 印刷される頻度が高そうなコンテンツには、余計なものをなくした シンプルな「印刷専用ページ」が用意されていると便利です。 しかし、同じコンテンツを「表示用」と「印刷用」の2ページに記述するのは面倒ですね。 更新する際にも2ページを同時に修正する必要があって大変です。 そこで、今回は、SSIを使って簡単に「表示用」と「印刷用」の2ページを用意する方法をご紹介致します。 SSIを使えばコンテンツ体は1ファイルだけで済む SSI(Server Side Include/サーバ・サイド・インクルード)を使うと、HTML中に他のファイルの中身を挿入(合成)することができます。 この機能を使うと、

    caprice
    caprice 2006/10/19
  • 2乗や3乗をうまく表示する -All About

    平方メートルや立方メートルのような2乗・3乗を表示するには? 距離を表現するには、たとえば「6m」や「12km」などのように表記します。 メートルという記号はアルファベットの「m」(エム)ですから何も問題ありませんね。 では、面積を示す平方メートルを表示したい場合はどうでしょうか。 また、体積を示す立方メートルを表示したい場合は? 上付き文字にするsup要素はあるけれど… HTMLには、「上付き」文字にする「sub」という要素がありますので、これを使えば解決します。 しかし、このsub要素では、Mozilla系のブラウザではちょっと乗数が離れてしまいます。(下図の右側) (左側)Internet Explorer6の場合 (右側)Netscape Navigator7の場合 Netscape Navigatorの例だと、乗数がずいぶん上のほうに行ってしまい、なんとなく2乗

    caprice
    caprice 2006/08/31
  • 1