タグ

HTMLに関するushi1019のブックマーク (11)

  • イベントで「右クリック禁止」を禁止してみよう

    JavaScript格的なプログラミングの世界に触れてみよう。連載を通じて実用的なアプリケーションを作れるようになるはず!?(編集部) ボタンを押すと何かが起きる? 第1回「ようこそJavaScriptの世界へ」では、document.writeを使って文字や計算結果を表示するJavaScriptを書きました。今回はJavaScriptを使って動的なWebページを作ってみましょう。 皆さんはイベントと聞くと何を思い浮かべますか。運動会や遠足、学園祭、パーティー、それとも音楽ライブなどの行事や催し事でしょうか。JavaScriptの世界でのイベントはちょっと違う意味で使われます。 さっそくですが、サンプルを動かしてみましょう。この講座では、とにかく実際に動かしてみるというのがテーマです。文は読み飛ばしても(?)、サンプルは自分で実行してみてください。 テキストエディタを起動し、次のサン

    イベントで「右クリック禁止」を禁止してみよう
  • いまからでも遅くない! ケータイデザインの基礎固め

    いまからでも遅くない! ケータイデザインの基礎固め:一撃デザインの種明かし(6)(1/2 ページ) 普段はPCサイトを作っているけど、ケータイサイトに興味が出始めた人向けの、初めてケータイのデザインハウツーです。日々変化するケータイデザインの基礎の基礎をご紹介 ケータイ機種のスペックが上がりデザイン表現の幅は広がっていますが、PCサイトに比べまだまだ容量やスタイル、キャリア対応などさまざまな制限があるのも確かです。 今回は、普段PCサイトを作っているけど、ケータイサイトに興味が出始めた人、初めてケータイのデザインに触れる人のための基礎固めとして、日々変化するケータイデザインの基礎の基礎をご紹介したいと思います。 誰でも最初は初心者だった! ケータイデザインの基礎の基礎 ケータイの画面サイズを考える! 一般的な画面サイズはQVGA(縦320px×横240px)ですが、最近ではQVGAワイド(

    いまからでも遅くない! ケータイデザインの基礎固め
  • [柔軟すぎる]IEのCSS解釈で起こるXSS

    [柔軟すぎる]IEのCSS解釈で起こるXSS:教科書に載らないWebアプリケーションセキュリティ(3)(1/3 ページ) XSSにCSRFにSQLインジェクションにディレクトリトラバーサル……Webアプリケーションのプログラマが知っておくべき脆弱性はいっぱいあります。そこで連載では、そのようなメジャーなもの“以外”も掘り下げていきます (編集部) なぜか奥深いIEのXSSの話 皆さんこんにちは、はせがわようすけです。 第1回「[これはひどい]IEの引用符の解釈」と第2回「[無視できない]IEのContent-Type無視」でInternet Explorer(IE)の独自の機能がクロスサイトスクリプティング(XSS:cross-site scripting)を引き起こす可能性があるということについて説明してきました。 第3回でも引き続き、IE特有の機能がXSSを引き起こす例ということで、

    [柔軟すぎる]IEのCSS解釈で起こるXSS
  • Webページを速く見せるための5つのちょっとした工夫(1/3) - @IT

    株式会社ライブドア マークアップエンジニア 浜 俊太朗 2009/4/30 ページ表示高速化をサーバの設定だけに任せていませんか? HTMLCSSJavaScriptの書き方でも速くできます(編集部) 連載第1回の「Webサイトを“速く”表示させる7つの計測ポイント」では、YSlowを使って速度に関する問題を調査しました。 今回は、CSSJavaScriptHTMLの工夫で速度を改善する下記5つの方法を紹介します。中にはYSlowの指摘に含まれないものもありますが、併せてチェックしていきましょう。 CSSはソースコードの上部に記述する JavaScriptはソースコードの下部に記述する CSSJavaScriptを書く順番 JavaScriptを圧縮して読み込みを速くする 読み込みが遅いブログパーツには要注意 【1】CSSはソースコードの上部に記述する 連載第1回では、「CSS

  • アクセシビリティも考慮して表組みするための10のタグ(1/11) - @IT

    有限会社タグパンダ 喜安 亮介 2009/4/24 XHTMLでページ全体をレイアウトする際に“表”を使っていませんか? それはCSSでやるべきで、ほかに使いどころは多々あります Webアクセシビリティを考慮した表組みをしよう 今回は“表組み”(テーブル)を表すタグを紹介してきたいと思います。HTMLの表組みは、table要素でマークアップされたブロックで、Excelでよく見る「スプレッドシート」と同じイメージです。tr要素が“行”、th/td要素が“列”を表します。Webアクセシビリティを考慮した表組みをするには、以下に上げる点も踏まえ、きちんとコーディングする必要があります。 table要素にsummary属性を付けて要約を記述 テーブル項目のタイトルは、th要素でマークアップ caption要素により、きちんと表題を付ける theadやtfoot、tbody要素によりテーブル行をグル

  • Webサイトを“速く”表示させる7つの計測ポイント(1/2) - @IT

    株式会社ライブドア マークアップエンジニア 浜 俊太朗 2009/3/24 FirefoxやYSlowを使ってWebサイトの問題点を探るには? ライブドアブログを速くした著者が7つのポイントを伝授します(編集部) Webサイトは“見た目”が重要なのは当たり前だが…… 皆さんはWebサイトを作るときに、どのようなことを意識していますか? デザイナや主にHTMLのコーダー/マークアップエンジニアと呼ばれる職種に就いている人は、やはり“見た目”を強く意識しているのではないでしょうか。 例えば、複数のWebブラウザで同じか近い表示になるようにとか、リリース後の更新業務によって表示崩れが起きないように、などです。もちろんそれは職種の適性として正しいものですが、実はほかにも意識した方がよい重要な要素があるのです。 良い印象を与えるには、“速度”も重要 Webサイトを見たユーザーが、良い印象を受けるのか

  • テキストに意味を持たせるXHTMLタグの正しいマークアップ(1/20) - @IT

    有限会社タグパンダ 喜安 亮介 2009/2/20 テキストに意味を持たせるXHTMLタグの正しいマークアップをおさらいしましょう。フレーズ要素を含む19タグを一挙ご紹介します。 これらの要素を用いたマークアップを行うことにより、「この文章は○○から引用された文」とか「この文字列は▲▲の略語である」といったふうに、テキストに論理的な意味を持たせることが可能になります。 p要素 p要素は、文章の段落を表すための要素です。 ブロックレベル要素として機能し、テキストとインライン要素を内包できますが、ブロックレベル要素を内包できません。 p 文章の段落構造を表すp要素 q要素 q要素は、段落による区切りが不要な短い引用文を表す際に使います。 インライン要素として機能し、テキストとインライン要素を内包できますが、ブロックレベル要素を内包できません。cite属性値に引用元のURIを記述し、必要に応じて

  • 文書構造を表現するXHTMLタグの正しいマークアップ HTMLタグリファレンス(1/10) - @IT

    文書構造を表現するタグ 文書構造を表現するXHTMLタグを大まかに分類し、分類したタグをXHTMLの“要素”として、1つずつ紹介していきます。 これらの要素類はXHTMLの骨格(枠)となる部分を形成していくために使われる、XHTMLタグの記述(=マークアップ)を行ううえで基礎となる要素類です。 htmlタグが一番の外側(先祖)となり、その内側(子)に上からhead要素、body要素といった順番でマークアップされます。 ページとして作成する(.htmlファイル)の文書構造を考慮し、情報構造として論理的に合っているかというのを考えながらマークアップを行いましょう。 html要素 htmlのそれぞれの要素はhtml要素を頂点とする階層構造になっています。 その中でhtml要素は最も基礎となる要素で、そのほかの要素はすべてがhtml要素の子や子孫(※)となる関係性になります。 なお、htmlファイ

  • はてなグループの終了日を2020年1月31日(金)に決定しました - はてなの告知

    はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28

    はてなグループの終了日を2020年1月31日(金)に決定しました - はてなの告知
  • まずはHTML。ハイパーなタグ付き言語(1/5)<デザイナーのためのWeb勉強帳(1) - @IT

    Webページを構成する技術を超初心者向けに説明。まずは基の基である「HTML」について。ハイパーなタグ付きテキストを一緒に解読しましょう インターネットはHTMLでできている? インターネットの利用者は総務省の調べによると、平成18年度のおととしの時点で8754万人に達したそうです。人口に対する普及率は68.5%で、およそ7割の人が、インターネットを利用していることになります。言われてみれば、60歳以上の年配の方が、メールやチャットでのコミュニケーション、サービスや製品の評判や性能を調べたり、通販やオークションサイトで商品を手に入れたりしていると聞いても、そんなに驚かなくなってきました。 どっぷりとインターネットが生活にしみこんできているのですが、そんな中で、一番皆さんの目に触れやすいのがWebページだと思います。 そして、この記事を読んでいる人は、Webページ制作にかかわっている人が

    まずはHTML。ハイパーなタグ付き言語(1/5)<デザイナーのためのWeb勉強帳(1) - @IT
  • DOMの基本。正しいHTMLとドキュメントツリーを理解しよう

    DOMを介してHTMLを操作する方法を理解しよう。そのためには、正しいHTMLの概念とドキュメントツリーを知る必要がある。 旧来のDHTMLの手法では、JavaScriptから操作できるHTML要素には限りがありましたが、DOMでは、HTML上のありとあらゆる要素を自由自在に読み取ったり、書き換えることができるようになります。連載では、おもにDOM Level 1で規定されている手法を使って、JavaScriptを使ってどのようにHTML上の要素へアクセスするのか、そして、それをどうやって書き換えるのかを詳しく解説していきます。JavaScriptからHTML要素を手に取るように操れるようになります。 ドキュメントツリーとは DOMスクリプティングでは、HTMLに関する正しい知識が求められます。まずは正しいHTMLとはなんなのかを理解していただきます。そして、DOMスクリプティングでは欠

    DOMの基本。正しいHTMLとドキュメントツリーを理解しよう
  • 1