タグ

HTMLとCSSに関するraimon49のブックマーク (102)

  • ドコモ光GMOの評判の悪さとデメリットを完全解剖

    スマホとのセット割などで人気のドコモ光は、プロバイダが選べるのが特徴です。 今回は数あるプロバイダの中でも特に人気のあるGMOについて、 GMOでドコモ光を登録した人の口コミと評判 GMOをプロバイダに選ぶメリットとデメリット 新規登録方法 などを詳しく解説していきたいと思います。 これからドコモ光を契約する人で、プロバイダ選びに悩んでいる人はぜひチェックしてみてくださいね。 ドコモ光GMOについては以下からどうぞ。 GMOドコモ光公式サイトはこちら【無料】 同じGMOでもwimaxであれば更に安く利用する事も可能です。 GMOとくとくBB公式サイトはこちら【無料】 光回線おすすめ安い比較ランキング。プロバイダ戸建てマンション ドコモ光のプロバイダGMOのガチ口コミと評判を大解析! まずは、ドコモ光のプロバイダGMOを実際に利用した評判を見てみましょう。 「キャンペーンでお得に使えた!」A

    raimon49
    raimon49 2010/08/30
    iPhone / iPad用のUIを提供しているウェブサイトのショーケース。リンク先が一部古い。
  • いろいろな言語のコーディング規約,スタイルガイドのリスト — TRIVIAL TECHNOLOGIES 2.0

    みんなのIoT/みんなのPythonの著者。二子玉近く160平米の庭付き一戸建てに嫁/息子/娘/わんこと暮らしてます。月間1000万PV/150万UUのWebサービス運営中。 免責事項 プライバシーポリシー プログラミング言語(C#,VB,PHP,C/C++PythonJavaRubyJavaScript,Objective-C)やHTMLのコーディングスタンダードを集めたリストを発見しました。日語訳があるものはできるかぎり探し出して,括弧のなかに併記して補ってあります。微妙に古いのが混じってるかな。Rubyは日発のコーディング規約がある気がする(まつもとさんの日記を見つけた)。 元記事にPerlのスタイルガイドがなかったんだけど,モダンなPerlスタイルガイドがあったら教えて欲しいです:-)。 PythonにはPEP8というコーディングスタイルガイドがあってよく読まれることは

  • HTMLでもっともよく使われているclass名,id値は「footer」 | TRIVIAL TECHNOLOGIES 4 @ats のイクメン日記

    みんなのIoT/みんなのPythonの著者。二子玉近く160平米の庭付き一戸建てに嫁/息子/娘/わんこと暮らしてます。月間1000万PV/150万UUのWebサービス運営中。 免責事項 プライバシーポリシー EuroPythonで聞いた,OperaのBruce Lawsonさんのキーノートに出てきた話題。 OperaがMAMAというHTMLマークアップの構造を専門にあつかうクローラーを作って,世界中のHTMLを読んで解析したところ,HTMLで最もよく使われているclass名とid値はともに「footer」だったのだそうです。class名は「menu」「style1」のように続きます。id値は「content」「header」と続きます。 class名の10位までのランキングは。。。 class名 出現回数

    raimon49
    raimon49 2010/07/24
    style1っていかにもオーサリングツールが吐き出しそうな名前。
  • マークアップ効率化 - zen-codingでコーディングを倍速に

    HTMLの記法について 基的には「div」の様に要素を省略せずに記述して、それを展開すると「<div></div>」という形に展開されます。 このときに展開できる要素は以下の公式ドキュメントに明記されていますのでそちらを見るとよいです。 Zen HTML Elements Zen HTML Selectors Zen CheatSheets 基的な記法 ひとつずつ順番に記述して説明していきます。しばらく初歩的な説明になるのである程度知っている方は飛ばしていただいて良いかと思います。 まずものすごく基的な記法である、単独タグの記法について説明を行います。 cssのセレクタをイメージしながら見ていくと納得しやすいと思います。 タグだけ変換 変換前 div 変換後 <div></div> デモ 文末でtabを押してください div 変換後、div要素の間にカーソルが移動するので、すぐにテキ

    マークアップ効率化 - zen-codingでコーディングを倍速に
    raimon49
    raimon49 2010/03/17
    セレクタ風の記法から自動変換。分かり易い説明。
  • Google Slides: Sign-in

    Not your computer? Use a private browsing window to sign in. Learn more

  • やってしまいがちなユーザビリティのミスとその解決方法

    ユーザビリティでやってしまいがちなミスや見落とされがちな10の罪とその解決方法をLINE25から紹介します。 10 Usability Crimes You Really Shouldn't Commit 下記は、やってしまいがちなユーザビリティの10のミスとその解決方法を意訳したものです。 はじめに 1. ラベルがないフォーム 2. トップページにリンクしないロゴ 3. 訪問済みリンクの指定がない 4. アクティブなフィールドが明示されない 5. altの記述がない画像 6. 背景色がない背景画像 7. 長い長いテキスト 8. 下線付きだがリンクではない 9. ココをクリック 10. 均等割付「justified」の使用 はじめに ここで紹介している10のユーザビリティのポイントは、ありがちなミスだったり見落とされがちなものを集めました。 あなたのウェブサイトのユーザビリティを拡張する手

    raimon49
    raimon49 2009/12/02
    本当によくあるから困る。
  • Applerの備忘録(仮): CSS Spriteの流派をまとめる

    Yahoo!ニュースがリニューアルしてレスポンスが速くなったそうですが、高速化手法の中に「CSS Sprite」というものがありました。 いくつかある画像を1つの画像に連結し、CSSにて連結画像の中にある目的部位を切り出して表示しようという技術です。サーバに対するリクエストの数を減らす効果があります。 (今日の大嘘 - by edvakf in hatenaもそうですが、Yahoo!ニュースの一部のCSS Sprite画像も余白が多く、「速くする技術使ったよ」というのは説得力に欠けるのですが) 最近よく見るこのヘンテコな技術について調べ、転送の速さだけでなく、利便性を損なわないような形でこの技術を使えないものだろうかと考えました。 ではその成果を生かしてあれこれしようと思いましても当備忘録程度ではサーバにリクエストする画像の数など高が知れています。 そういうわけで、使わない技術

    raimon49
    raimon49 2009/05/26
    clip:rectを使った方法も
  • jQuery の位置・サイズ関連メソッドまとめ - Cyokodog :: Diary

    ばらけてきたのでこちらにまとめます。 索引 位置の設定 css(name,value) 位置の取得 css(name) offset() position() scrollTop() / scrollLeft() event.pageY / event.pageX サイズの設定 css(name,value) / height(value) / width(value) サイズの取得 css(name) / height() / width() attr(clientHeight / offsetHeight / scrollHeight) outerHeight() / innerHeight() コンテナ要素の取得 offsetParent() 解説 位置の設定 css(name,value) 対象要素を指定した位置に配置できます。単位を省略した場合はピクセル単位となります。 $('#

    jQuery の位置・サイズ関連メソッドまとめ - Cyokodog :: Diary
    raimon49
    raimon49 2009/05/26
    レイアウト関連が綺麗にまとまってる。
  • いま起きている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
    raimon49
    raimon49 2009/05/07
    >しかし実際にはXHTMLは期待されたほど普及せず、XHTMLによってWebページがマシンリーダブルになることよりも、Ajaxに代表されるようなWebアプリケーションとしての進化のニーズの方が圧倒的に大きなものになりました。
  • 【レポート】IE8で互換性の実現や新機能を利用するには? - MSがサイト管理者向けガイド (1) IE8準拠のための見直しポイント | パソコン | マイコミジャーナル

    Microsoftの次期Webブラウザ「Internet Explorer 8 (IE8)」の正式提供がスタートした。同ブラウザは今年内にも登場が噂されるWindows 7の標準ブラウザとして搭載が決まっている。MicrosoftではIE8のリリースに合わせ、従来のIE7との互換性情報のガイドラインを紹介している。 IE8では標準準拠をさらに推し進めたのが1つの特徴となっているが、それと同時に、従来のIE7の動作に依存したサイトの一部にはIE8での互換性に問題を持つものが存在する。特にスクリプトやCSSの実装を絡めてがっちりとコーディングが行われたサイトほど互換性の問題に直面することになる。 IE8ではこうした問題に対処するため、標準に準拠したIE8 Standards Modeと従来との互換性を重視したCompatibility Viewの2種類を用意しており、可能な限りIE7準拠のサ

    raimon49
    raimon49 2009/03/31
    IEBlog 和訳
  • 大量の同じ画像の表示 - 素人がプログラミングを勉強していたブログ

    画像周りの速度メモ - #生存戦略 、それは - subtech 大量に同じ画像を表示したいとき - 0xFF もっと高速にする方法。 background-repeat and clientX <!DOCTYPE HTML> <html><head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <meta charset="utf-8"> <title>background-repeat and clientX</title> <style type="text/css"> #star{ width: 0; height:10px; background:url('http://s.hatena.ne.jp/images/star.gif'); background-repeat: repeat-

    大量の同じ画像の表示 - 素人がプログラミングを勉強していたブログ
    raimon49
    raimon49 2009/03/18
    >background-repeatをrepeat-xに設定し、あたかも複数の画像を貼り付けたかのように見せる。 / 発想がすごい。
  • 【メモ】IE8の3レンダリングモードのまとめ / KOMOREBI || blog

    さて、Internet Explorer 8 ベータが現在公開されている訳だが、 既にチェックをしているクリエーターさんは、このIE8の表示モードには「3モードレンダリングエンジン」機能があるのは知っていることだろう。 ここれは知らない人の為に・・・そして自分のやってる講義用にメモ書きしときたい。 内容は、先日のCSSnite in Shinjukuの五寳さんのプレゼンのをまとめ。 IE8においては、強制的にレンダリングモードを切り替えられ、 今後はレンダリングモードを変えて互換性をとっていこう、というモノだ。 具体的には以下のような方法で切り替えることができる。 DCTYPE宣言とmeta要素によるモード変更 HTTPヘッダーでのモード変更 この構成は、IE8の表示を基準としたデフォルトの“IE8レイアウト”と、互換性のための“IE7レイアウト”の2つに大きく分かれる。 そして、“IE7

    raimon49
    raimon49 2009/03/09
    IE8のレンダリングモードの振り分けパターン一覧表。分かり易い。meta要素での指定はDOCTYPE宣言による振り分けよりも優先される。
  • IE8のレンダリングモードに関するまとめ

    Apr 12, 2008 某所で行われたIE8 Beta 1についてのセミナーで、DOCTYPEスイッチとIE8の複数のモードの話を聞いていたら、頭の中がごちゃごちゃしてきたのでざっくりとまとめてみる。 レンダリングモードの使い分け まず最初に、IE8には以下の3つのレンダリングモードがあることを覚えておきます。 IE8標準準拠モード (デフォルトのレンダリングモード) IE7標準準拠モード Quirksモード (いわゆる互換モード) IE8のデフォルトでのレンダリングモードは一番上の「IE8標準準拠モード」になります。これらのレンダリングモードを覚えたら、次にIE8が備える「IE7エミュレート機能」について知っておきましょう。エミュレート機能とは「IE7とまったく同じレンダリングをする」ための機能です。つまりこの機能を有効にするとデフォルトのレンダリングモードが「IE7標準準拠モード」に

    IE8のレンダリングモードに関するまとめ
    raimon49
    raimon49 2009/03/09
    IE8は3つのレンダリングモードを持つ。JavaScriptでdocument.documentModeを参照すると、現在のレンダリングモードが判る。
  • 【ハウツー】FirebugにHTML/CSSリファレンスをアドオン! - FireScope (1) あのプロパティの使い方なんだっけ? これからはFireScopeで一発! | エンタープライズ | マイコミジャーナル

    あのプロパティの使い方なんだっけ? これからはFireScopeで一発! SitePoint.comは1月27日(米国時間)、Firebug上で動作するアドオン「FireScope v1.0.1」をリリースした。FireScopeはFirefox2-3のFirebug1.2以降で動作するアドオン。各種HTMLエレメントやCSSプロパティといった要素のリファレンスと各種ブラウザの対応状況、サンプルコードを表示してくれるアドオンだ。SitePointが公開している各種HTML, CSSリファレンスの一部をまとめた内容となっている。 主な機能は次のとおり。 HTML Elements Reference HTML Attributes Reference CSS Properties Reference サンプルコード リファレンス内検索 W3C勧告に準拠しているかどうか 各種ブラウザ対応状況(

    raimon49
    raimon49 2009/02/23
    FirebugにReferenceタブが追加される
  • [CSS]気をつけたいIE 7のバグ -CSS-Discuss

    CSS-Discussにアップされている「IE 7 Bugs」の意訳です。 省略している箇所も多数あるので、原文も参照ください。 Internet Explorer Win Bugs - css-discuss 注意: バグには、IE7のみでなく、IE 5, 5.5, 6のものも含まれています。 公開されてから時間が経っているためか、ちょっと古いものもあります。 IEのフォントサイズのバグ フォントサイズの継承 IEの相対指定のフォントサイズの継承は、うまく機能しません。 相対指定を行う場合、emより%で指定を行う方が便利です。もし、em指定を行う場合は最初に%指定を行ってください。 例: body{ font-size: 100.01%; } ※100%の代わりに100.01%を使用するのは、Operaでの継承バグの回避のためです。 キーワード指定でのサイズ フォントサイズに「small

    [CSS]気をつけたいIE 7のバグ -CSS-Discuss
    raimon49
    raimon49 2008/11/06
    Empty divはコメントオンリーで
  • The Performance of Dynamic Site (id:amachang) - monjudoh’s diary

    Javaユーザーグループ 概要 JavaScriptの誤解 重くしている犯人 プロファイラ JavaScriptの誤解 JavaScriptは遅い 速いです 重くしている犯人 DOM DOMをフェーズに分けて考える JavaScriptとコンポーネント(C++)との通信(取得) DOMノードの追加、値の変更 スタイルの計算 レイアウトの計算 JavaScriptとコンポーネント(C++)との通信(取得) XPConnectやCOMとの通信 単純なプロパティアクセスの数十倍(IE以外は無視しておk) COMは重い 通信回数=DOMのオブジェクトの「.」の数 DOMノードの追加、値の変更 取得の場合と同じ「.」の数 ノードに変更したというフラグが立つ parent.appendChild(child)だとparentとchildにフラグが立つ。 重要:再計算がJavaScriptの実行後に

    The Performance of Dynamic Site (id:amachang) - monjudoh’s diary
    raimon49
    raimon49 2008/10/17
    >通信回数=DOMのオブジェクトの「.」の数
  • 最新Webブラウザ、Web標準への対応度は? | OSDN Magazine

    2008年になり、主要なWebブラウザのバージョンアップが相次いで行われている。これらのバージョンアップでは、Webブラウザ自体の機能強化が行われているほか、レンダリングエンジンについても積極的に改良が行われ、新たな機能が取り込まれている。そこで記事では、最新Webブラウザが搭載しているレンダリングエンジンについて、それぞれが備えている機能やWeb標準規格への対応状況について比較していく。 2008年8月末、Internet Explorer(IE)8のベータ2がリリースされた。IE8ではパフォーマンスの向上や、多数の新機能が追加されており、正式版リリースへの期待も高まっているのではないだろうか。しかし、大規模な改良が加えられているWebブラウザはIEだけではない。今年6月にはFirefoxの新版であるFirefox 3がリリースされているほか、同じく6月に公開されたOpera 9.5や

    最新Webブラウザ、Web標準への対応度は? | OSDN Magazine
    raimon49
    raimon49 2008/10/16
    いい加減IEはCanvasサポート & 過去のバージョンの強制アップデートしてくれないかな。
  • CSS に関する互換性と Internet Explorer

    Windows Internet Explorer の新しいリリースが発表されるたびに、カスケード スタイル シート (CSS) 標準のサポートは絶えず改善されてきました。 Internet Explorer 6 は、CSS レベル 1 に完全準拠した最初の Internet Explorer バージョンでした。 Windows Internet Explorer 8 は、CSS レベル 2 リビジョン 1 (CSS 2.1) の仕様に完全準拠し、CSS レベル 3 (CSS 3) の一部の機能をサポートします。 お客様の Web サイトが、以前のバージョンの Internet Explorer を含むブラウザーを対象にする場合、各バージョンの CSS 準拠レベルを確認する必要があります。 この記事では、Internet Explorer 8 でのサポート状況を含む、Internet Ex

    CSS に関する互換性と Internet Explorer
    raimon49
    raimon49 2008/09/16
    公式ドキュメント。IE8がリリースされたら参照するかも。
  • HTMLを理解していないウェブ開発者ってどうよ? - builder by ZDNet Japan

    エンドポイントセキュリティの転機 情報セキュリティ戦略が問われる今 重要インフラ事業者としてANAが考えること ゼロトラスト対策3つのポイント ニューノーマル時代に必須なゼロトラスト セキュリティの始め方 クラウドネイティブの実現 モダンインフラの構築・運用の課題解決へ コンテナの可能性を広げるVMware Tanzu 中小企業のひとり情シスの現実 夢か幻か、はたまた現実か? ヘルプデスク業務の週休4日制を考える 日清品グループのDX(前編) 現場が主役のDXのススメ トップの強い意思で変革に弾み EDRトップランナー対談:後編 セキュリティ戦略を転換せざる得ない背景と EDRのような手法が必要な理由に迫る 激変するビジネス環境の中でのDX モダンアプリケーション戦略への取り組みが 市場の競争力の源泉となる アプリケーションモダナイズ 求められている背景にあるビジネスの今 そして、成功の

    raimon49
    raimon49 2008/08/18
    同意
  • 「フロントエンド・エンジニア」という呼び名のパワー - モジログ

    私の仕事は、Zope/PloneをベースとしたカスタムCMS(その顧客専用のコンテンツ管理システム)を開発するというもので、これは「Web開発」とか「サーバサイド開発」とか呼ばれるカテゴリに入る。 これに対して、HTMLCSSJavaScriptなどクライアントサイドの開発・コーディングを担当する人を、最近のWeb業界では「フロントエンドエンジニア」と呼ぶ場合があるようだ。これはなかなかいい呼び名だと思う。 一般的に「Webデザイナー」と呼ばれる人の仕事は、じつに幅広い。ビジュアル的に「デザイン」すること(どんなサイトにするかの「絵」を作ること)や、サイトの構造・ラベリング・ナビゲーションといった「情報アーキテクチャ」を決めること、そしてHTMLCSSJavaScriptといった技術によってそれらを実装することは、それぞれ異質な作業であり、別種のスキルが求められる。 最近はこうし

    raimon49
    raimon49 2008/06/25
    >HTMLやCSS、JavaScriptを「きれい」に書けるという技術は、一般的にはその価値がなかなか見えにくいけれども、きわめて重要だし、投資対効果の高いスキルだと思う。 / スキルを際立たせるためにも名前が重要。なるほど