You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
※ この記事は、Sep 16, 2009に投稿されたものを再掲したものです。情報が古かったりリンクが切れてたりするかもしれません。というか、当時、全く理解できてなかったっぽいのがバレバレで恥ずかしいです。 最近困った事などを反省する意味も込めて、新しい手法を身につける必要があると感じたので、今更ながらOOCSS(Object Oriented CSS)についてちゃんと考えてみることにしました。 とりあえず今日のところはメモ程度です。 英語。。。全く自信がないので、誤りをご指摘いただけると大変助かります（願 なんでやろうと思ったか 個人的に、最近はCMS絡みの案件がとても多いです。 CMSのテンプレートなどを書く場合もあれば、その基礎となるHTML/CSS/JSあたりを書く場合もあります。 その際に、予めかなり様々なパターンをシミュレートして、利用するレイアウトなどが全て用意されている状
It’s an exciting time for CSS. On top of the advances being made both in what to write (CSS3) and what to write with (SASS+Compass, Less), CSS is enjoying a spate of serious discussion over how it should be written. This might come as a suprise to some (and did to me). After all, CSS seems pretty straightforward — without many of the complexities of programming, CSS has long been seen as something
Web Directions East | カンファレンス：11月13日（金） Nicole Sullivan（ニコール・サリバン） 3000以上にも昇る大規模サイトの最適化に携わって来た Nicole Sullivan は、現在 Yahoo! のパフォーマンスエンジニアと最適化のエバンジェリストとして国内外のセミナーで講演。Webサイトに関する研究だけでなく、プロジェクト管理もこなすマルチタスクなリーダーシップを発揮。フロントエンドエンジニアとしての高いスキルを持つ。 Stubbornella Nicole Sullivan (@stubbornella) | Twitter Nicole Sullivan presentations | SlideShare 高速ウェブアプリのためのCSSパフォーマンス UNDERSTANDING THE CASCADE デフォルトのスタイルがブラウザ
CSSでサイトを作るとき、ページをidで区切り、その中のclassに対してスタイルを指定するというやり方が一般的じゃないかなと思います。 #page-foo .box {margin:10px } #page-baa .box {margin:20px }しかし、いざあのページのこの部分をこのページに持ってきたい…となるとCSSファイルごと持ってこなければならない、移転先のclass名とバッティングしてしまうなど再利用が難しいという反面もあります。 今回仕事でサイトを構築するにあたり、再利用可能なモジュールで構成すればコーディングにかかる工数は減るのではと考えていたので（特にIEのバグ関連…検証済みのモジュールで構成すれば確実！）再利用性とパフォーマンスを重視したフレームワークOOCSSについて調べてみました。 OOCSSの基本的な考え方 目的別にclassを複数指定する。 idに依存する
Have you ever heard the phrase “Content is King”? Being a Web developer, and therefore having a job that’s often linked to content creation, it’s likely you have. It’s a fairly overused but true statement about what draws visitors to a site. From a Web developer’s perspective, however, some may argue that speed is king. More and more, I’m starting to favour that stance. In recent years many experi
Another day, another melodramatic blog post title. 😉 I was prepping to speak at Webstock this year when I realized I didn’t want to give the talk I had proposed. I didn’t want to talk about the Mistakes of Massive CSS, because I realized it went deeper than that. In fact, in most cases, the things we considered best practices were leading to the bad outcomes we sought to avoid. I realized (unpopu
What is the internet made of? At least the UI layer is mainly composed of media blocks. I talked about the Facebook stream story before, and all the tiny objects of which it is composed. For the most part, the stream story is made up of the media object repeated over and over. The media object is an image to the left, with descriptive content to the right, like this Facebook story: The media objec
How to create CSS objects? Get the granularity right! In a previous post, I said: Shoehorning CSS and HTML into PHP abstractions prevents the code from being DRY and ultimately leads to code bloat, because, the CSS and HTML require a far more granular object structure than the PHP. And then I didn’t expand on it, or give proper context. Ooops, sorry! Correct granularity is one of the keys to tiny
The web stack (simplified) between you and your users On the last day of TXJS, a developer asked me: Doesn’t Object Oriented CSS leave you with a pile of presentation based class names? Each layer in the web stack has its own architecture. You wouldn’t expect the DB schema to be used to architect the PHP middleware, and yet people expect that of the HTML and CSS. HTML needs to be written with a
Most web standards-based developers are more than familiar with creating their sites with semantic HTML with lots and lots of CSS. With each new page in a design, the CSS tends to grow and grow and more elements and styles are added. But CSS can be used to better effect. The idea of object-oriented CSS isn’t new. Nicole Sullivan has written a presentation on the subject and outlines two main conce
PHP/CSS書いてて、最近思ったことと、自分CSSデザインパターン解説。class名のつけ方の続き的内容。 オブジェクト指向を勉強してるとこ 最近、XSLTでCMS作る！って思っていろいろPHP書いてます。それで、すっごいclassが増えまくってしまって、継承とかいうものがある！ということで使ってみたら、すっきり。ほほーこれは便利だ！と思いきや、またしてもごちゃごちゃ。どこをどうしたらいいのやら。どーしたもんかと思ってネットをうろうろ見てたら、どうやら、デザインパターンってのを覚えた方がよさそうだということに気づき、この本を買いました。 これがすごい良かったです。継承とかinterfaceとか、こういうためにあったんだ！というのを学びました。すべてをまだ理解できてないけど、大きいものには大きいものの作り方があるんだ！と。結果総作りなおしｗｗｗ CSSのデザインパターン？ そんでCSSの話
Stay Relevant and Grow Your Career in TechPremium ResultsPublish articles on SitePointDaily curated jobsLearning PathsDiscounts to dev toolsStart Free Trial7 Day Free Trial. Cancel Anytime. Key Takeaways Object Oriented CSS (OOCSS) is a methodology that encourages the reuse of code by separating structure from skin, resulting in a more efficient and consistent approach to styling. It promotes the
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
