タグ

WebとHTMLに関するTakahashiMasakiのブックマーク (111)

  • トップページだけでもなんとかしたいのよの目次

    トップページだけでもなんとかしたいのよ 【 トップページだけでもなんとかしたいのよ 】のコンテンツは、全てのページを トップページだと思って見ていただけると、わかりやすいかもしれません。 初級編から順番に見ていくことをオススメしますが、見たいところだけを、 かいつまんで見ていくこともできます。 01 とりあえずこれ ←ここがスタートです まずは、↑ここから始めましょう。 これだけでスカスカだったトップページが一気に埋まります(笑) 02 文字を入れてみました いままで見向きもされなかったのが、いきなり 「んっ?なんだかちょっと気になる」になってしまいます。 03 画像を作ってみよう 素材を持っていない方が、自分で簡単に作る方法。 とりあえず画像を●●してしまう。 04 分割で作ってみました 大きな画像が、どうしても見つからないときに使う 組み合わせるという方法。 05 デメリットもあります

  • いまさら聞けないHTML --- Part3:要素を埋め込む

    図3-2 HTMLファイルにリンク先を埋め込む<BR>リンクにしたいテキストや<img>タグを<a>と</a>タグで囲んでリンク先を埋め込む。 図3-3 別アプリケーションで再生するコンテンツを貼り付ける<BR>Internet Explorerは<object>タグを解釈してActiveXコントロールを起動し,MozillaやFirefoxは<embed>タグを解釈してプラグイン・アプリケーションを起動する。そこで,どちらのブラウザでも解釈できるように,<object>タグと<embed>タグを入れ子にして指定する。 ここまでで,ブラウザが表示するWebページのレイアウトと見栄えの指定方法はわかった。あとは,リンクを埋め込んだり,イメージや動画などを貼り付ける作業だ。 リンクや貼り付けは得意技 HTMLはもともと,ほかのWebページへのリンクを埋め込んだり,静止画などのデータを貼り付ける

    いまさら聞けないHTML --- Part3:要素を埋め込む
    TakahashiMasaki
    TakahashiMasaki 2006/03/15
    (ついに第3弾。img要素のalt属性の説明が……
  • hxxk.jp - 自分のフリカケを持ち歩きつつも、できるなら出されたフリカケで味わいたい

    自分のフリカケを持ち歩きつつも、できるなら出されたフリカケで味わいたい http://hxxk.jp/2006/03/11/2358 前の記事 : ビール日記 2006/03/10 - キュベ デ トロールス 次の記事 : iPod nano と 3 月の東京ツアー 記事データ 投稿者 望月真琴 投稿日時 2006-03-11T23:58+09:00 タグ CSS weblog アソシエイト スクリーンショット デザイン 概要 自分好みのフリカケをかければ ( ユーザスタイルシートを使えば ) どうにかなるので、どうしようもなくマズかったらそれを最終手段で使うようにしつつも、作った人のフリカケ ( 製作者スタイルシート ) が美味しかったらそのままべたいよねえ、と思っています。 リプライ 2 件のリプライがあります。 Re: ekken♂:(ほぼ)みんな「善意」じゃなくて「自己満足」でそ

    TakahashiMasaki
    TakahashiMasaki 2006/03/12
    ユーザCSSに関する話とページの「見易さ」について
  • 第5章 ページデザインの基礎

    TakahashiMasaki
    TakahashiMasaki 2006/03/11
    "リンクを作成するとき(中略)"ここをクリック"症候群に陥らないように注意して下さい。このようにすると、読者は他のページに移動してもどこへ行こうとしているのか覚えておかなければならなくなってしまいます。 "
  • いまさら聞けないHTML --- Part2:レイアウトと見栄えを固定

    今どきのWebページは,ウインドウの大きさを変えてもレイアウトが変わらない。見栄えもWebサイト全体で統一されている。このようなレイアウトや見栄えの指定にも,HTMLのタグが使われている。 3ステップでページ作成 Webページ制作者から見ると,Webページの作り方は3ステップ。この作り方の手順に沿って見ていこう(図2-1[拡大表示])。 ステップ1ではレイアウトを決める。使い勝手や見栄えを考えてレイアウトを決めて,Webページに貼り付ける要素を考えながら枠を区切るわけだ。具体的には,枠を固定して区切ることができるタグを使ってHTMLファイルを作成する。 ステップ2は,スタイルの定義だ。デザインを考えれば,ページ内の文字の大きさなどは揃えたい。しかし,今どきのWebページは,もともとは別のファイルを組み合わせて作ることが多い。部分ごとに,更新頻度が違っていたり,作成者が違ったりするからだ。こ

    いまさら聞けないHTML --- Part2:レイアウトと見栄えを固定
    TakahashiMasaki
    TakahashiMasaki 2006/03/08
    やはりテーブルレイアウトが…(まぁいろいろなブラウザにあわせるためにはしょうがないのだろうか (追記:早速コメント(はてブじゃなくて当記事内のやつ)でツッコミが入っとる
  • もうパンツはかない

    このサイトは webサイトのデザインをいろいろ考えてみようかななどとでっち上げたサイトです。ようやく7つ目のデザインとなります。 デザインにはカスケーディングスタイルシート(CSS)を使っています。21世紀の今、テーブルレイアウトでもないでしょうから。ですのでデザイン的にはターゲットとなるwebブラウザは、CSSにきちんと対応した新しめのもの、たとえば Firefox(レンダリングエンジン Gecko を使ったもの。N9なども含む)や 、Opera9、Safari などを想定していますが、HTML的には素直なよいHTMLをめざしてますので、まともなWEBブラウザであれば閲覧に支障はないでしょう。デザインが再現できるかはともかく。 デザインノート 今回のポイントは半透明画像の重ねあわせといったところでしょうか。 一番下の背景の上に3枚の半透明画像が重なり、スクロールするとそれぞれ違う速度で動

    TakahashiMasaki
    TakahashiMasaki 2006/03/07
    背景画像のテクニック等(タイトルが……
  • いまさら聞けないHTML ITpro

    かっこいいWebページを作りたい。それにはHTMLの知識が必要だ。Webアクセスで見つけた見栄えのいいWebページも,基はすべてシンプルなHTMLファイル。HTMLを理解していれば,自分のWebページの参考にできる。基と,今どきのWebページの特徴を学んで,かっこいいWebページを身近なものにしよう。 Part0:最新ページを分析 複雑そうなページも分解すれば難しくない Part1 基を確認 < と >で囲んだタグで表現何重もの入れ子にして使う Part2 レイアウトと見栄えを固定 <table>でレイアウトを決めスタイル・シートで見栄えを統一 Part3 要素を埋め込む スクリプトやリンクを埋め込み画像や動画データを貼り付ける

    いまさら聞けないHTML ITpro
    TakahashiMasaki
    TakahashiMasaki 2006/03/06
    (ここが元か!
  • いまさら聞けないHTML --- Part1:基本を確認

    図1-2 HTMLは < と > で囲んだタグを使う<BR>多くのタグは,指定する範囲を示すために<XX>(開始タグ)と</XX>(終了タグ)を組にして使う。一方,ケイ線や改行など,指定する範囲がないタグは終了タグなしで使う。 Part1ではHTMLの基を確認するために,30行程度のテキストが書かれたHTMLファイルを例に,その内容を解析していく。インターネットに公開されている見栄えのいい企業のWebページでも要素が増えているだけで,個々の要素を取り出してみれば,基は同じである。 中身はタグを含んだテキスト 図1-1[拡大表示]は,HTMLファイルの中身(ソース)と,それをWebブラウザで表示した結果である*表示した結果である。 Webブラウザの表示と,HTMLソースを見比べると,ブラウザのウインドウに表示している文字がそのままHTMLソースに書かれていることがわかる。 また,HTML

    いまさら聞けないHTML --- Part1:基本を確認
    TakahashiMasaki
    TakahashiMasaki 2006/03/06
    (6、7年前のHTML講座みたいだな
  • 読みやすいブログにするなら、「絵文録ことのは」に学ぼう:ekken

    文章術とは別に「読みやすいブログの条件」として、画面の構成をどうするか、という問題もあります。 読みにくい文章の大半は、文章を改めるまでもなく、テンプレートを見直せば、解決してしまうのではないか、と思う事もしばしば。 サイドバーをゴテゴテ飾るのをやめ、文字の大きさや色を見直し、行間設定を少し広げてみる…… これだけでもかなり読みやすくなるブログが、たくさんあるような気がします。 ブログパーツをどんどん付け加えて、サイドバーがゴチャゴチャになっている人、ナントカ同盟やアフィリエイトリンクの画像を節操無く貼り付けて、文とサイドバーのどちらがメインなのかが分からなくなってしまっているようなブログをやっている人は、読んでもらいたいのがどの部分なのか、もう一度見直して、テンプレートの見直しをしてみてはいかがでしょう。 テンプレデザインの好みは、人それぞれでしょう。小さい文字がカッコいいと思う人、画

  • 強力なSSOを実現するXML認証・認可サービス(SAML)

    「第1回 Webサービスセキュリティ概要」ではWebサービスセキュリティのフレームワークについて、「第2回 XMLデジタル署名とXML暗号」ではXML署名とXML暗号について述べた。「第3回 XML鍵管理サービスとXMLプロトコル」は鍵情報の登録と検証を外部のサービスに依頼する仕組みであるXKMSと、これらの情報を伝達するためのXMLプロトコルSOAPについて述べた。 今回はシングルサインオン(SSO)や、それに続いて属性情報やアクセス制御情報を伝達するプロトコルSAML(Security Assertion Markup Language)について述べる。SAMLは連携した企業間のWebサービスのSSOを目指して最近策定されたLiberty Allianceの仕様や、マイクロソフトの.NET Passportに用いられる基的な技術として注目されているものである。さらにSAMLの上で

    強力なSSOを実現するXML認証・認可サービス(SAML)
    TakahashiMasaki
    TakahashiMasaki 2006/03/01
    SAML(XML Security Assertion Markup Language)
  • A better Project@はてなダイアリー - はてな記法について

    私がはてなUI問題に興味を持った理由の一番最たるところは、「はてな記法」が気になっていたからだ。 はてなUIが使いにくいとかいう人は、順応性が低いだけなんじゃないの?:ekken で、私ははてなブックマークのコメントに、 確かに、はてな記法は便利なところはあるけど、全てが便利というわけじゃないところが問題なんだよなあ。 と書いた。 何が便利じゃないって、やはり、 はてなのとっつきにくさ - ぼくはまちちゃん! にもあるように、 改行が簡単に出来ない。 ことに尽きる。私が以前に「YukiWiki記法」に触れたことがないならば(「PukiWiki記法」では「~」で改行できる。)、はっきりいって、はてな記法を投げ出していた可能性はなくはない。 逆に便利だと思うのは、「見出し記法」。なぜ、便利と思ったかというと・・・。 「*」一文字でPermalink付きの見出しが作成される点。 これは、最近(

    A better Project@はてなダイアリー - はてな記法について
    TakahashiMasaki
    TakahashiMasaki 2006/02/28
    いちど「改行」について考えたほうがいいかもしれん
  • Ajax入門 | Ajax入門:基本サイトのリンク集

    一定期間更新がないため広告を表示しています

    Ajax入門 | Ajax入門:基本サイトのリンク集
  • はてなのUIが使いにくいとかいう人は、順応性が低いだけなんじゃないの?:ekken

    はてなのユーザーインターフェースが使いにくい、とかいう話が、はてなブックマークで人気で、支持を得ているようです。 僕がはてなダイアリーを利用し始めたのは、2003年の夏ごろだったと思います。 まだブログサービスの選択肢が少ない頃でした。当時、インフォシークの無料ウェブスペース(isweb)を使って「ホームページ」を運営して、PC雑誌で知った「ブログ」というものを試す為に、はてなダイアリーを始めてみたのです。 既にある程度のHTMLタグを理解している人間にとって、はてなの独自記法は、かなり違和感がありました。 当時はブログというもののメリットがよく分からず、はてな特有のキーワードリンクが陶しくて、一ヶ月くらい続けた後に放置してしまいました。 そういう意味では「はてなのインターフェースは使いにくい」ということには同意なのですが、しかし、別の見方をすれば、はてなのユーザーインターフェースが悪い

    TakahashiMasaki
    TakahashiMasaki 2006/02/25
    どんなUIでも個人によって好みや慣れによる向き不向きがあるとのこと。同感。(以下暴言。はてな記法程度がだめだとか言う人はcururuでも使ってればいいのに
  • はてな記法ってべんりなの? - ぼくはまちちゃん!

    前回の日記のコメントを書いてて思ったんだけど…! 純粋に疑問が! 「はてな記法」ってべんりなの? 言語っていっちゃうには大げさなんだけど、 (それでも、ぼくみたいな初心者にとってはこれもじゅうぶん言語だよ…!) 使い方をおぼえても、ツブシのきかない言語なんだよね?これって。 で、それをおぼえて得られることって、 htmlの表現を、少ないキー入力でできる、ってことでいいのかな。 もしhtmlを知ってるひとなら、 はてな記法を使わないとできない表現、っていうのは無いんだよね。 つまり…、えーと… わーやっぱり何がべんりなのかわからないよ>< と、おもってヘルプを見つけてきた! はてなダイアリーでは、HTMLの知識がなくとも、 はてな独自の記述方法「はてな記法」で書くことにより、 自動的に見出しを作ったり、 リストを作ったりといった、 いろいろな表現を簡単に行うことができます。 あ!これって、や

    はてな記法ってべんりなの? - ぼくはまちちゃん!
  • ぼくはまちちゃん!(Hatena) - はてなのとっつきにくさ

    こんにちはこんにちは!! はてな楽しいですね! ぼく最近、はてなおもしろくて友達にすすめちゃったりしてるんだよ。 だけど反応がいまいちで、とっても残念なんだよね。 なんかこんなかんじ。 Aさん(男性) にすすめたとき ※Aさんはこんなひと 業務系Cプログラマ パソコン通信の頃からのネットワーカー Rubyに興味ありそうだけど、Webの技術や動向には詳しくないというか関心なさげかな 主に掲示板・チャット・mixiなんかで遊んでいるひと はまち「はてなおもしろいよ!!!!!ぶっくまーく!!!!!!」 Aさん「はてな? あー、ググった時によくでてくるあの邪魔なサイトかぁ… なんかひたすら文字が並んでてさー、 正直、あんなサイト二度と見たくないんだよね…」 たぶん「文字が並んでいた」っていうのは、 「単語のリンク」がたくさん並んでいたってことかな…。 うん。わかるわかる。 ぼくもはじめてはてな

    ぼくはまちちゃん!(Hatena) - はてなのとっつきにくさ
    TakahashiMasaki
    TakahashiMasaki 2006/02/23
    "文節はpタグでくくる、みたいな「カッコイイHTML」なんかに"カッコイイじゃなくて規格に従っているか否かです、(とW3C原理主義者っぽいことをたまには
  • ウェブサイトのアクセシビリティで裁判--米の視覚障害者が提訴

    Bruce Sextonという24歳の大学生は、自分を含む多くの視覚障害者が、インターネットのおかげで今まで以上に自立した生活を送れるようになったと語る。 たとえば買い物をするにしても、実際の店舗に行って品物を探したり店員に尋ねたりする必要はない。代わりにキーボードと画面読み上げソフトを使って、ウェブで品物を探したり購入したりできるからだ。 でも、それは当に可能なのだろうか。 先週、Sextonはある視覚障害者支援団体と共に、大手小売チェーンTargetのウェブサイトが目の不自由な人にはアクセス不可能で、米国障害者法を採用するカリフォルニア州法に違反するとして、同社を相手取った集団代表訴訟を起こした。 Sextonとボルティモアに拠点を置くNational Federation of the Blind(NFB)は、カリフォルニア北部にあるアラメダ郡高等裁判所に訴状を提出した訴状の中で、

    ウェブサイトのアクセシビリティで裁判--米の視覚障害者が提訴
    TakahashiMasaki
    TakahashiMasaki 2006/02/13
    "画像の部分にその内容を説明したアルト(alt)タグがないため、"(;-_-)/ 先生!altは属性です!それにalt属性は画像の代替であり「説明」とは限りません!
  • mixiのデザイン変更から学ぶ、ウェブサイトの最小横幅を800px以下にすべき理由 : akiyan.com

    mixiのデザイン変更から学ぶ、ウェブサイトの最小横幅を800px以下にすべき理由 2006-02-09 mixiのレイアウトが大幅に変更された。右側にサイドバーが出現して、全体の横幅が大きく広がったのだ。全体の横幅は900pxほどだ。このため、私の環境ではブラウザの横スクロールバーが現れるようになってしまった。以下がその様子だ。 これはユーザビリティ的にかなりよくない状況だ。横スクロールは可能な限り避けなければならない。なぜなら多くのユーザーは横スクロールすること自体に不慣れだから。 しかし、画面を見てお気づきの方もいると思うが私はWindowsのタスクバーを縦に配置している。このレイアウトはマイノリティな類であろう。このレイアウトのためにブラウザの横幅が縮まっているので「それは例外だ。みんなブラウザの幅は900px以上にしてるよ」という声が聞こえてきそうだ。しかしこれには反論の余地があ

  • 読みやすい文章 ― 誰でも見られるホームページ@脱初心者

  • tableタグを得る自己流の方法 : PamGau

    TakahashiMasaki
    TakahashiMasaki 2006/02/04
    wiki記法で書いて簡単にtable要素以下を入手
  • 大藤幹 『世界の「最先端」事例に学ぶ CSSプロフェッショナル・スタイル』 - モジログ

    MYCOM BOOKS - 大藤幹 『世界の「最先端」事例に学ぶ CSSプロフェッショナル・スタイル』 http://book.mycom.co.jp/book/4-8399-1907-0/4-8399-1907-0.shtml 『Web Designing』誌に連載されている、大藤幹氏のCSS記事をまとめた。 これは早くになってほしいと以前から思っていたが、になってみれば、連載に加えて特集記事などのオマケもついて、予想以上に充実した素晴らしい内容になっている。 この連載(書)がいいのは、CSSの文法を教科書的に解説するのではなく、CSS界で名高いトップデザイナーが作ったサイトを題材に、そのCSSコードを実際に解析して、詳しく解説している点だ。 プログラミングでも、語学でもそうだが、文法を解説することが主眼の教科書は、「This is a pen」式の味気ない例文で学ばされることが