「Webページの表示速度を向上させる最新研究結果」 米Yahoo!がプレゼン資料公開：CodeZine
米Yahoo!は、開発者向けWebサイト「Yahoo! Developer Network」内のブログで、Webページのパフォーマンスを向上させる最新研究結果について解説したプレゼン資料を公開した。 これは先週開催されたPHP Quebec Conferenceのセッションにおいて、同社のStoyan Stefanov氏が使用した資料を公開したもの。Yahoo!が研究を続けている「より速くWebページを表示させるテクニック」として、既存の14種類に加え、新しく20種類のルールが明かされている。 改善対象はサーバ、コンテンツ、クッキー、JavaScript、CSS、画像、モバイルとなっており、同社が提供するFirefox拡張機能YSlowなどを利用して検証する。YSlowで「A判定」が出ていないようであればこれらの改善に取り組むよう推奨しており、A判定が出ている場合でも新しい20のルールを
これでSafariに乗り換えられる？·SafariStand MOONGIFT
Safariの新版、Safari3.1がリリースされた。高速化されたJavaScriptエンジンが売りで、さらにHTML5の一部サポートや様々な機能が追加、修正されている。何より高速性を売りにしているだけに、素早く表示されるのは良い。 だが、実際のところ乗り換えには至っていなかった。その大きな壁が一つあったのだが、ついに乗り越えられそうだ。 今回紹介するフリーウェアはSafariStand、Safariに様々な追加機能を施すソフトウェアだ。 個人的に一番問題だったのは、Googleリーダーなどで元記事を表示するときに新しいウィンドウが開いてしまうことだった。それはSafari3.1でも解決しておらず、もったいない気がしていた。だが、このSafariStandを使うと、新しいタブとして開くことが可能になる。 他にもFirefoxで言うところのスマートキーワードに相当するクイックサーチ機能、カ
IE8登場以後はCSS tablesを使ってカラムデザインをシンプルに | エンタープライズ | マイコミジャーナル
Kevin Yank氏によって執筆されたCSS tablesに関する記事が2月28日(米国時間)、SitePointに「Table-Based Layout Is The Next Big Thing」として公開された。IE8がリリースされた以降のWebデザインのテクニックを検討するうえで興味深い内容だ。 現状では複数カラムデザインを持ったのWebページを制作する場合、古典的にはHTMLのtable要素とCSSによるサイズ指定を組み合わせたり、CSSを使う場合でもトリッキーな指定を行わなければならない。最新のCSSの機能を使うとIE6/7などで表示されない問題があるからだ。 こうした状況はIE8の登場からかわることになりそうだ。すでに主要なWebブラウザには導入されているCSS tablesの機能がIE8に導入されるためだ。このため、IE8の普及にあわせて従来の複雑な記述を、CSS tab
[CSS]Flashを背景にして動作する、階層型ナビゲーション
CSS playのエントリー「A flyout menu over flash objects」から、Flashを背景にして動作する、階層型ナビゲーションの紹介です。 A flyout menu over flash objects 通常、Flashを背景とするとうまく動作しませんが、下記の手法を使用して実装しています。 swfの埋めこみの記述 「wmode」に、「transparent」を指定。 ※swfファイルの背景色を確認する。 <textarea name="code" class="html" cols="60" rows="5"> <param name="wmode" value="transparent" /> <embed wmode="transparent"></embed> </textarea>
カスタマイズの自由度が高いツールチップ用JSライブラリ「Prototip」他ツールチップJS色々:phpspot開発日誌
カスタマイズの自由度が高いツールチップ用JSライブラリ「Prototip」他ツールチップJS色々 2008年02月13日- Prototip - Tooltips for prototype While waiting for Prototype 1.6.0.1 I've put together a preview for the next release of Prototip. カスタマイズの自由度が高いツールチップ用JSライブラリ「Prototip」他ツールチップJS色々。 まずは、最近公開されたprototip の紹介。 実現したい大体のツールチップは prototip で出来る、というぐらい多機能です。 通常のツールチップ タイトルを付けてみる ツールチップ表示位置を指定 HTMLを表示 リンクボックスを表示 その他 ツールチップのアニメーション表示 クリックでツールチップ表示
Keeping Your Elements’ Kids in Line with Offspring
CSS selectors are handy things. They make coding CSS easier, sure, but they can also help keep your markup clean. For example, here’s a chunk of code that doesn’t use selectors well: <ul class="products"> <li class="product">Item 1</li> <li class="product">Item 2</li> <li class="product">Item 3</li> </ul> This textbook class-itis leads to messy CSS: ul.products { /* Properties here */ } li.product
はねつき IE６で勝手にコンテンツ内容が複製されるバグ
よく、バグが多いバグが多いと嘆かれ続ける、業界ナンバーワンシェアの我らがふぁっきんIE様。 で、今日もまた恒例のバグに直面したわけです。それがタイトルにあるとおり、コンテンツ内容が複製されるバグというやつ。どうにか無事解決も出来たので、今回もメモがてらに書いてみます。内容は長くなるので以下に。 コンテンツ内容が複製される、別の言い方をすると、最後の内容物のゴーストが作成されるとでも言うのでしょうか。もしくは分身とか残像とかそんな感じ。 言葉だけだとわかり辛いので、画像を用意してみました。 Opera9で見た場合 IE6で見た場合 こんな感じでIEの方では最後の内容物の文字が複製されて下にはみ出してます。ちなみに、これが文字じゃなくて背景画像だった場合、背景画像が複製されることもあるそうで。 でサンプルソースはこんな感じ。 <body> <div id="container"> <di
CSS擬似クラスを使うべき理由 | エンタープライズ | マイコミジャーナル
A List Apart - For People Who Make Websites HTMLとCSSは規格通りに使うとすれば縦横無尽にさまざまな記述ができる。しかし規格上サポートされているからといって、馬鹿正直にそうした機能を使うのは避けたい。シンプルな記述であとから読んでも理解しやすい、他人が読んでも理解しやすいHTMLやCSSを書けるようになることが理想だ。しかし誰しも最初は素人だ。エキスパートがまとめたドキュメントを参考にして、そうしたテクニックであり勘どころを学んでしまいたい。 フロントエンドデベロッパであるAlex Bischoff氏は5日(米国時間)、A List ApartにおいてKeeping Your Elements' Kids in Line with Offspringという名のもと、CSSやHTMLの記述方法について細かい技巧をまとめて発表した。同ドキュメント
CSS における display, position, float プロパティの相互関係 - elm200 の日記(旧はてなダイアリー)
趣旨 要素を描画する位置や大きさに関係する重要な 3 つのプロパティがある。display, position, float である。この3者は複雑に絡みあっていて、いつも頭が爆発しそうになる。今日は、これを整理することから始めたい。 注意事項 まず注意。 私は W3C CSS 2.1 を勉強中の身で、すべての項目にわたってきちんと理解しているとはとてもいえない。したがって、誤りも多く含まれると思うので、その点を留意してほしい。逆に間違っている場所を教えていただけると助かります。ただ、CSS 2.1 はあまりに複雑で、そのままでは頭に入らないので、「なぜこのルールは存在するのか？」ということを常に考えながら勉強していこうと思っている。これからの文章で「このルールってこういう趣旨だよな〜」とかブツブツ言っているかもしれないが、読みたい人は読めばよし、読みたくなければスルーしてほしい。 用語定
2007年の「CSSやWeb標準」ベストエントリー100選＋α - Trans
2007年にCSSやWeb標準に関するどんなテクニックや議論があったのかを書き出しておくのも一興かなと思いまとめてみると大変なことになってしまいました。 筆者より一言 CSSな人たちは「懐かしいなー」と振り返ってもらえればいいですし、今年こそCSSやるぞ！と思っている人は参考に、また違う言語の人たちは「へえー」とでも思ってもらえれば。 このリスト自体は、個人的に運営していたCSS Engine in Japanから引っ張ってきたものです。そのため本来なら入れるべきなのに抜け落ちている記事もかなりあります。カテゴリーや順序は適当です。また、2007年と言っておきながら、たまに今年のものとかも入っていることはご愛嬌。その上、ベストエントリーと書いておきながら、良質なエントリーが抜け落ちていることも認めます。 ただ、CSSの議論も一段落しているので、そろそろこの検索も役目を終えたなーと思い、その
これは便利! CSSのコピペはこのコンテンツで - SitePoint CSS Reference | ネット | マイコミジャーナル
SitePoint CSS Reference SitePointは31日(米国時間)、CSSのリファレンスサイトSitePoint CSS Referenceを公開した。同サイトはTommy Olsson氏およびPaul O'Brien氏という著名な2人のCSSエキスパートによって執筆されたもの。そのままコピー&ペーストして使えるようなCSSのコードと説明がまとめられたサイトで、CSSを編集するWebデザイナはぜひともブックマークしておきたいサイトだ。 SitePoint CSS Referenceは公開以前となるプライベートベータテストの状態で、すでにSitePointコミュニティからのフィードバックを受けて改善が実施されている。いわば現状でのCSSベストプラクティスがまとまっているコンテンツだ。 SitePoint CSS Reference - そのまま使えるサンプルとブラウザでの
馬鹿全 - Flex と FlashCS3 で SWF を作るときの 18 のポイント＋α
以前も書いたことですが、色々増えてきたのでまとめてみた。 Flex と Flash CS3 でハイブリッドな SWF を作る場合、 大抵は Flex で土台を作り、グラフィック部分などを Flash で作るということになるだろう。 その際に俺が実際引っかかったりした部分をまとめた。 なので Flash しか関係ないじゃんとか Flex しか関係ないじゃんと思わずに Flash しか関係ないじゃん？って所は それを制御する側がいるということを考えて Flex しか関係ないじゃん？って所は それに制御される側がいるということを考えて 読んで欲しい。 Flex と Flash CS3 では コンパイラが違う。 Flex で出来ることは Flash でも同じように実装できるわけではない。 逆もまた然り。 また、エラーの出力なども違う。 Flash CS3 では出るエラーも F
10 Mac Apps（ネタフル）2008年版 - ネタフル
2005年9月に10 Mac Apps（ネタフル）というエントリーを書きました。 ぼくが使っているMac用のソフトベスト10だったのですが、改めて見てみると現在とは随分と変わっているので、2008年版を自分のメモ代わりとしても書いておきます。 ＃もしマシンに何かあっても、これで復旧が早くなるカモ。 ブログばかりの生活なので、主にブログを書くのに欠かせないソフトが中心となっています。 ///// 【情報収集用】 1. Skype 「Skype」で重宝しているのはグループチャット機能です。知り合いとグループを作成し、それをブックーマークすることができます。 一度グループを作成すれば、半永久的にチャットは続いていきます。普段はひとりで作業しているので、ぼくにとっては外界に開かれた重要な窓の一つです。 2. TwitterPod 「TwitterPod」はTwitter用のクライアントソフトです。
手軽にお安くデュアルディスプレイ環境を構築してみませんか？
パソコンが発達した現在、もう1台のディスプレイじゃ満足できないっていう人、急増中です。 でも、マルチディスプレイ対応のグラフィックボードじゃないと、グラフィックボードを増設したりしなくちゃいけないくて、意外と面倒なんですよね。 そこでバッファローのUSB2.0用 ディスプレイ増設アダプタ｢GX-DVI/U2｣。USB2.0端子に接続するディスプレイアダプタで、DVI端子とD-sub15ピンの両方に対応しています。 最大解像度は1680×1050ピクセル。22型ワイド液晶ディスプレイに対応しています。USB接続ですから、グラフィックボードが増設できないノートパソコンにも利用できますね。 しかも最大6台まで追加増設が可能。僕は一生使わないと思いますけど、ディスプレイが余りまくっている人は、このアダプタを6台買って試してみてはいかがでしょうか。 気になるお値段、1万1130円です。 GX-DVI
10 JavaScript Effects to Boost Your Website’s Fanciness Factor
President of WebFX. Bill has over 25 years of experience in the Internet marketing industry specializing in SEO, UX, information architecture, marketing automation and more. William’s background in scientific computing and education from Shippensburg and MIT provided the foundation for MarketingCloudFX and other key research and development projects at WebFX. There comes a point in time where we w
SMART情報ツール HDDチェッカー
｢SmartChecker Mini｣は、ハードディスクのS.M.A.R.T.情報を参照して、劣化状況を確認するためのツールです。 S.M.A.R.T.を保存するので、劣化率を把握することができます。 参照するハードディスクの台数に制限がありません。 ATA、シリアルATAインターフェイスのハードディスクをサポートしています。 簡単なＨＤＤ情報を参照することができます。
Useful Adobe Fireworks Resources: Tutorials, Articles And Freebies (Part 2) — Smashing Magazine
Since Adobe decided to feature-freeze Fireworks in 2013, there is no replacement available for this Software. However, there are many extensions that might help you improve Fireworks. In the second part of this article, Michael Bozgounov will show you more extensions (commands, command panels, and auto shapes) and you’ll learn how to take full advantage of them. Let’s get started! A few weeks ago,
PR下手で損してる人（たち）に贈る日々のPRを続ける5つのコツ：DESIGN IT! w/LOVE
不確実な時代をクネクネ蛇行しながら道を切りひらく非線形型ブログ。人間の思考の形の変遷を探求することをライフワークに。 会社でも、個人でも、自分(たち)ができること・やりたいことをうまく外部の人に理解してもらえてなくて損してるよなーと感じることがよくあります。 まわりにもっと自分(たち)ができること・やりたいことをわかってもらえば、いまよりやりたい仕事ができるようになるし、やりたいことをもっと楽にできるようになるのになーと、はたから見ていて感じるわけです。 そういう人（たち）って、一言でいえば、PR下手。 だって、よく知らない相手と仕事するより、多少なりとも相手ができること・やりたいことを知ってたほうが仕事するうえでのコミュニケーションの苦労もずいぶん軽減されるのに、相手に自分のことを知っておいてもらうための事前のPRができない。 誰が何ができるかがわかっていれば、相手はそれが必要になったと
10 CSS Form Examples
Forms can be greatly enhanced with a touch of CSS, making them more usable and far more visually attractive. Follow some of the examples below and you’ll be creating stunning CSS forms in no time at all. The Ultimate Designer Toolkit: 2 Million+ Assets Envato gives you unlimited access to 19+ million pro design resources, themes, templates, photos, graphics and more. Everything you'll ever need in
ウェブ業界に入って知った言葉 : LINE Corporation ディレクターブログ
こんにちは。渡辺です。 どの業種にも、業界内でしか通じないような言葉ってありますよね。もちろん、インターネット業界にも業界用語はたくさんあり、知っているのは当たり前で、知らないまま打ち合わせなどに出席すると、恥をかくことがあります。 今回はライブドアのウェブディレクターたちが、業界に入ってから知った「ウェブ業界用語」をまとめてみました。 ウェブディレクターの職域の幅の広さを表すように、ビジネス用語、金融用語など色々でてきました。これらは、ウェブディレクターが知るべき言葉のほんの一部ですが、ぜひ参考にしてみてください。 【01】ウェブ開発関連 ･アサイン 本来は「割り当てる」という意味の言葉です。 案件の担当者を割り振るときに使用します。ライブドアでは専用の「BTS」があり、「プログラマーのアサインをお願いします」といった依頼の仕方をしま す。 ･SEO 「Search Engine Opt
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
DOM Scripting Toolkit - jQuery
ナビゲーションのトレンドと傾向 -2008年2月 | コリス
Blogger