Speed Up Google Fonts – CSS Wizardry
19 May, 2020 Speed Up Google Fonts Written by Harry Roberts on CSS Wizardry. Table of Contents Testing Default/Legacy font-display: swap; Async CSS preload preconnect Bonus: font-display: optional; Comparisons and Visualisations Findings Google Fonts Async Snippet Ten-Second Version: If you really can’t be bothered going to all of the effort outlined in this post, there is a super rough-and-ready,
More Transparent UI Code with Namespaces – CSS Wizardry
6 March, 2015 More Transparent UI Code with Namespaces Written by Harry Roberts on CSS Wizardry. Table of Contents The Namespaces Object Namespaces: o- Component Namespaces: c- Utility Namespaces: u- Theme Namespaces: t- Scope Namespaces: s- Stateful Namespaces: is-/has- Hack Namespaces: _ JavaScript Namespaces: js- QA Namespaces: qa- Handy Side Effects Detecting Namespaces Finding (In)valid Class
MindBEMding – getting your head ’round BEM syntax – CSS Wizardry
25 January, 2013 MindBEMding – getting your head ’round BEM syntax Written by Harry Roberts on CSS Wizardry. Table of Contents Featured case study: NHS One of the questions I get asked most frequently is what do -- and __ mean in your classes? The answer is thanks to BEM and Nicolas Gallagher… BEM – meaning block, element, modifier – is a front-end naming methodology thought up by the guys at Yand
Code smells in CSS – CSS Wizardry
20 November, 2012 Code smells in CSS Written by Harry Roberts on CSS Wizardry. Table of Contents Undoing styles Magic numbers Qualified selectors Hard-coded/absolute values Brute forcing Dangerous selectors Reactive !important IDs Loose class names Final word Chris Coyier recently answered someone’s question: How can you tell if your CSS code smells? What are the signs that the code is sub-optiona
CSS: CamelCase Seriously Sucks! – CSS Wizardry
6 December, 2010 CSS: CamelCase Seriously Sucks! Written by Harry Roberts on CSS Wizardry. Table of Contents CSS is a hyphen-delimited syntax XHTML is a lower-case language Inconsistency within your own rules It’s harder to read Scannability Hyphens work better in text editors Underscores? Final word Now, I know this is going to instantly ruffle some feathers, but I’m not normally one to tell you
Building sites without using IDs or classes – CSS Wizardry
7 April, 2010 Building sites without using IDs or classes Written by Harry Roberts on CSS Wizardry. Table of Contents Using advanced selectors Why I think this won’t catch on Advantages: Disadvantages: Final word This morning, for one reason or another, I decided to have a go at coding up a page without using any IDs or classes in my markup, and therefore none in my CSS. I’m not sure why I tried i
CSS Wizardry—CSS3 Examples & Progressive Enhancement
All CSS shown corresponds to the elements directly above. The ID/class names are the same as used and all CSS3/progressive enhancement snippets are shown in bold. By Harry Roberts—CSS Wizardry. Please Tweet. Columns: Lorem ipsum dolor sit amet, consectetuer adipiscing elit. In accumsan diam vitae velit. Aliquam vehicula, turpis sed egestas porttitor, est ligula egestas leo, at interdum leo ante ut
Typogridphy — A Typographical and Grid Layout CSS Framework From Harry Roberts of CSS Wizardry
Typogridphy — A Typographical and Grid Layout CSS Framework From Harry Roberts of CSS Wizardry Grids & Typography Typogridphy is a CSS framework constructed to allow web designers and front-end developers to quickly code typograhically pleasing grid layouts. Based on the popular 960 Grid System, Typogridphy allows you to create grid layouts which are versatile and great looking. Typogridphy is mad
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Canvas Conf, 2012 – CSS Wizardry
http://csswizardry.com/html5/