自分のページやサイトが各ブラウザでどのように見えるか確認できる便利なサイトいろいろ - GIGAZINE
サイトのレイアウトを変更したり、新しくデザインする際に使えるのがこのクロスブラウザテスト、要するに「それぞれのOSのそれぞれのブラウザで自サイトは正しく見えているのか？」をチェックするサイトです。予算と時間が潤沢であれば、自分で各種OSを揃え、各種ブラウザを導入してチェックできるのですが、あまりにも非現実的な場合が多いため、この手のテストサイトは非常に重宝します。 というわけで、デザインやレイアウトのチェックに使えるクロスブラウザテストのサイト一覧は以下から。 10 Helpful Resources for Cross Browser Testing Browsershots http://browsershots.org/ 見てのとおり、現時点ではほぼ最強に最も近い定番クロスブラウザテストサイトが「Browsershots」です。Linux・Windows・Mac OS・BSDの各種ブ
【改造済み】開閉するサイドバーを作成するJavascript「PBB SideBar」 -イイラボ-
カッコよく開閉できるサイドバー「PBB SideBar」 …ですが、そのままだとただ開閉するだけで、何もできませんでした。 そこで、MRBで少しコードを改修し、内容を直接HTMLで書き込めるようにしました。 仮にJavascriptがOFFになっていても、コンテンツの一部として普通に表示されます。 ダウンロード pbbsidebar.mrb.js（右クリックで保存してください） サンプル込み一式ダウンロード(ZIP) pbbsidebar.mrb.jsの他、mootoolsからmootools.jsをダウンロードしてください。 使用方法 <script type="text/javascript" src="./mootools.js"></script> <script type="text/javascript" src="./pbbsidebar.mrb.js"></script>
3キャリア対応の携帯サイトを作るには
制限の多いキャリアに合わせた作り 前回（http://www.thinkit.co.jp/article/143/2/）は、汎用的な携帯サイトを作る手順とポイントを解説しました。今回は、3キャリア対応の携帯サイトを作るテクニックと「こうしたい」を実現するデザインテクニックを技術的視点で解説します。 3キャリアに対応した携帯サイトを作るためには、各キャリアの仕様を比較し、最も制限の多い（自由度の低い）キャリアに合わせなくてはなりません。まず、第1回（http://www.thinkit.co.jp/article/143/1/）と第2回（http://www.thinkit.co.jp/article/143/2/）の内容をふまえて、3キャリアの携帯サイト制作のポイントをおさらいしましょう。 HTML／CSSに関しては、最新のデザインを取り入れるならHTML文書は「XHTML」で記述する、コ
選択範囲のリンクを取得する: Days on the Moon
Web ページの選択範囲に含まれるリンクを取得する方法として、Piro さんによる DOM 2 Range の compareBoundaryPoints メソッドを使ったやり方があります。これはリンクを探すのに DOM Core の機能を使って文書ツリーをたどっていますが、今現在ノードを探すといわれて真っ先に思いつくのは XPath でしょう。そこで、XPath を使って選択範囲のリンクを取得する方法を考えてみました。もちろん、選択範囲を扱う以上 DOM 2 Range も利用します。 基本的な考え方 Range オブジェクトの取得 選択範囲の始点より前にあるリンクの数の取得 選択範囲の終点より前にあるリンクの取得 選択されているようには見えないリンクの除外 まとめ 基本的な考え方 基本的なアイデアは、選択範囲の終点より前にあるリンクで、選択範囲の始点より前にはないものが求めるリンクとい
Analytics 日本版 公式ブログ: RSSフィードとアクセス解析（その２） - Movable TypeでRSSをトラッキングする方法 -
A/Bテスト 5 Ads Data Hub 1 AdSense 5 AdWords 19 AdWords 連携 21 AMP 4 Analytics 1 Analytics 基本 5 API 2 BigQuery 11 Cookie 1 CPA 1 DCM 1 DFP 3 DoubleClick 11 DoubleClick Campaign Manager 1 DoubleClick for Publishers 3 e コマース 2 Firebase 8 Firebase Analytics 4 Firebase 向け Google アナリティクス 2 ga.js 2 GA4 12 GACP 18 GCP 1 Google Ads 1 Google Cloud Platform 1 Google Consumer Surveys 2 Google Insights for Search
PCブラウザで携帯サイトのテストをする
PCブラウザを使ってテストする 前回（http://www.thinkit.co.jp/article/142/1/）は、携帯テストを行う上でのポイントを見てきました。今回は、携帯サイトのテストをPCのWebブラウザを使って行う方法について紹介します。 携帯サイトは携帯キャリアによる仕様が違うといえども、基本的には一部を除きHTMLやXHTMLを利用しているWebサイトには違いありません。そのため通常のブラウザでPC向けのWebサイトと同じように表示することができます。そのため一般的な画面が表示できるかのテストはPCブラウザで行うことができます。 また、PCブラウザは携帯端末ではできないテストも行うことができます。それは「ソースコードのチェック」や「HTTPの通信ログ」の確認などです。通常のPCブラウザでは表示されているHTMLのソースコードを見ることが簡単にできますが、携帯端末ではソース
モバイルサイトに関するサイト19
twitter facebook hatena google pocket 近年モバイルサイトへの注目が集まっていますが、実態を把握していない人も多いのではないでしょうか。 そんな訳でモバイルサイトに関するサイトを集めてみました。 sponsors 制作実務 【モバイル向けサイト制作】今から始める携帯サイト制作 【モバイル向けサイト制作】携帯サイトをテストする方法 【モバイル向けサイト制作】出遅れるな！Flash Lite入門 【モバイル向けサイト制作】モバイルWeb構築の最新潮流 携帯ホームページを作ろう！ -ちょっと詳しいモバイルサイトの作り方- 3G端末（FOMA・WIN・3GC）のモバイルサイトのコーディング＆デザイン モバイルサイトで使われる画像の容量を落とす方法 モバイルサイトを成功させるためのたった3つのポイントと、10の構築ルール トレンド Web2.0よりケータイ1.0が
[JS]わずか1.3KBの軽量で、快適に動作するアコーディオンのスクリプト | コリス
Leigeberのエントリーから、以前紹介した「軽量でシンプルなアコーディオンのスクリプト」より更に軽量（1.3KB）になったアコーディオンのスクリプトを紹介します。 Animated JavaScript Accordion V2 demo Accordion V2はjQueryやPrototypeなどの他のスクリプトに依存することなく、単独で動作するスクリプトで、対応ブラウザはIE6, 7, 8, Fx2, 3, Op, Safari, Chromeとなっています。 ※Op9.6.0, Safari3.1.2 for Winで正常に動作しました。 仕様自体に大きな変更はなく、アコーディオンの開閉のタイミングやスピードを調整することができます。 アコーディオンの各項目はdl要素となっており、CSSオフ時やスクリプトオフ時にも情報入手の差し支えないように表示されます。
[JS]拡大時のアニメーションが面白い、画像ギャラリーのスクリプト -flyout.js
jQuery.flyout デモでは、３種類の実装方法が紹介されており、拡大時のアニメーションだけでなく、ローディングのサインをテキストや画像にするなども可能です。 jQuery.flyoutはjQueryのプラグインのため、動作にはjquery.jsが必要です。
外国の絵本みたいなタッチのPhotoshopのブラシ -Tiff | コリス
deviantARTに登録しているTiffから、外国の絵本みたいなタッチのPhotoshopのブラシを紹介します。 tiffcali06 on deviantART
めっちゃ旨い唐揚げの作り方教えてくれ・・・ :アルカン速報
1 名前：>>1 ：2008/05/27(火) 19:41:34 ID:o3B2SyZM0日曜日までに唐揚げを作れるようにならないといけない・・・ 料理経験のまったくない俺にかなりうまい唐揚げの作り方を 全力で教えてほしい！！！ 4 名前：ぱくぱく名無しさん ：2008/05/27(火) 20:35:41 ID:b83Gl+hVOニンニクのスライスを醤油に一時間くらい漬けてからその汁で唐揚げ作れ旨いぞ 揚げてすぐ喰うなら片栗粉がオススメ 5 名前：>>1 ：2008/05/27(火) 20:55:09 ID:o3B2SyZM0>>4>サンクス！！！参考にさせてもらう！！！ 6 名前：>>1 ：2008/05/27(火) 21:31:02 ID:o3B2SyZM0余談だが、唐揚げつくりは友人との勝負でもあるんだ 向こうは家庭の味（ﾏﾏﾝの味だな） こっちはネットの味（底力だな） 決戦は最初に
フリーフォントを入手するためのトップ５サイト:phpspot開発日誌
Top 5 Websites to Download Free fonts for both Windows and Mac | iTechMax フリーフォントを入手するためのトップ５サイトということでサイトが紹介されていました。 フォントを探す際の参考に。 Abstractfonts - 12000近くのフォントを紹介。全部の文字もウェブ上で確認できます DaFont - フォント多数、ランキングなども。こちらも全部の文字をブラウザで確認可能 WhattheFont - 画像をアップロードして画像から探せる 1001fonts.com - カテゴリ別にフォントを探せる。レーティングも可能 SearchFreeFonts - フォントの検索エンジン 関連エントリ フリーフォント集いろいろ 小学生が書いたみたいな手書きフォント「りゅうのすけ」
[CSS]大きい画像を背景にする時のスタイルシートの３つの実装例 | コリス
Web Designer Wallのエントリーから、大きい画像を背景に使用する時のスタイルシートの３つの実装例を紹介します。 How to: CSS Large Background 一枚の画像を使用する方法 demo 実装のポイントは、使用する背景画像（background image）の端と背景色（background color）に同じ色（#f8f7e5）を使用します。 サンプルコード <textarea name="code" class="css" cols="60" rows="5"> body { padding: 0; margin: 0; background: #f8f7e5 url(wdw-bg.jpg) no-repeat center top; width: 100%; display: table; } </textarea>
サイトによく使いそうなピクセルタイプの54個のアローのPSD素材 | コリス
deviantARTのsizer92から、サイトによく使いそうなピクセルタイプの54個のアロー（矢印）のPSD素材を紹介します。
Movable Type 4.21 から 4.22 へのアップグレード
当ブログを、Movable Type 4.21 から 4.22 へアップグレードしました。変更されているファイルが少ない場合は特定のファイルだけを上書きするのですが、今回は変更ファイルが多かったので、通常のアップグレード手順を紹介します。 アップグレードは個人の責任で行ってください。正常にアップグレードできなかった場合、申し訳ありませんが当ブログに質問を頂いても解決するお手伝いをすることはできません。作業前には１項に示すバックアップ作業などを行い、ブログのバックアップを行ってください。 なお、4.1x から 4.22 にアップグレードされる場合、4.1x と 4.2x のバックアップファイルは互換性がありませんので、ご注意ください。 １．ブログのバックアップ 4.21 の状態でブログのバックアップを取得します。 バックアップした後、正しくバックアップされているかどうか、バックアップファイル
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://e0166nt.com/blog-entry-538.html
IDEA * IDEA
[CSS]カスタマイズも可能なドロップダウン型のナビゲーションのテンプレート -CSS Candy Menu | コリス