Evaluating your stylesheets

•

17 gefällt mir•8,001 views

Koji Ishimoto

円滑なWeb 運用のできるCSS設計＆制作を考えよう【2015年8月1日｜西新宿】 http://yuru2.jp/2015/07/21/cafe48/

Design

Evaluating your stylesheets
Koji Ishimoto, 『
© 2015 Kaizen Platform, Inc.

Metrics
• Style Sheets
• Style Elements
• Size
• Gzipped Size
• Data URI Size
• Ratio of Data URI Size
• Simplicity
• Rules
• Selectors
• Declarations
• Average of Identifier
• Most Identifier
• Most Identifier
Selector
• Average of Cohesion
• Lowest Cohesion
• Lowest Cohesion
Selector
• Total Unique Font
Sizes
• Unique Font Sizes
• Total Unique Font
Families
• Unique Font Families
• Total Unique Colors
• Unique Colors
• ID Selectors
• Universal Selectors
• Unqualified Attribute
• Selectors
• JavaScript Specific
• Selectors
• User Specified
Selectors
• Important Keywords
• Float Properties
• Media Queries
• Properties Count

Weitere ähnliche Inhalte

Ähnlich wie Evaluating your stylesheets

Intro to css & sassSean Wolfe

Project Credit: Richard Wynne - Workflow and Manuscript Contributor Role TaggingCASRAI

Fonts in Publishing - What's the issue?Extensis

Principles of TaxonomiesTheresa Putkey

Website Architecture Presentation from Web Strategy WorkshopsCharles Edmunds

Multimedia Development LifecycleLeoni Rahmawati

Building a Flexible UI with Oracle ApExBradley Brown

Building an Inclusive Magento Community #mm18deSherrie Rohde

SEO Workshop (Blazin Multimedia)blazinmedia

Web design training , Web Design Training In KolkataW3webschool

IOUG93 - Technical Architecture for the Data Warehouse - PresentationDavid Walker

Measuring Impact: Towards a data citation metricEdward Baker

Developing With DjangoDaniel Ryan

Beyond Yoast: 7 Critical SEO Steps Your Are Probably Missingbigfishresults

Ui devoplerJanu Jahnavi

BASPUG May 2014 - Taming Your Taxonomy in SharePointJonathan Ralton

Building and Deploying a Global Intranet with Liferayrivetlogic

SEO Do's and Dont's - Search in 2018Linus Logren

Riyadh UseR Group - 1st Meeting (Dec 2016(Ali Arsalan Kazmi

Domain Driven Design Demonstrated Alan Christensen

Ähnlich wie Evaluating your stylesheets (20)

Intro to css & sass

Project Credit: Richard Wynne - Workflow and Manuscript Contributor Role Tagging

Fonts in Publishing - What's the issue?

Principles of Taxonomies

Website Architecture Presentation from Web Strategy Workshops

Multimedia Development Lifecycle

Building a Flexible UI with Oracle ApEx

Building an Inclusive Magento Community #mm18de

SEO Workshop (Blazin Multimedia)

Web design training , Web Design Training In Kolkata

IOUG93 - Technical Architecture for the Data Warehouse - Presentation

Measuring Impact: Towards a data citation metric

Developing With Django

Beyond Yoast: 7 Critical SEO Steps Your Are Probably Missing

Ui devopler

BASPUG May 2014 - Taming Your Taxonomy in SharePoint

Building and Deploying a Global Intranet with Liferay

SEO Do's and Dont's - Search in 2018

Riyadh UseR Group - 1st Meeting (Dec 2016(

Domain Driven Design Demonstrated

Mehr von Koji Ishimoto

マイクロインタラクション事始め以前Koji Ishimoto

JavaScript/CSS 2015 AutumnKoji Ishimoto

フロントエンドエンジニア（仮）〜え、ちょっとフロントやること多すぎじゃない！？〜Koji Ishimoto

WebデザイナーのためのSass/Compass入門Koji Ishimoto

パフォーマンスから考えるSass/Compassの導入・運用Koji Ishimoto

モバイル制作におけるパフォーマンス最適化についてKoji Ishimoto

Measuring Web Performance - 自己満足で終わらないためのパフォーマンス計測 -Koji Ishimoto

スマートフォンWebアプリ最適化”３つの極意”Koji Ishimoto

TumblrTouchKoji Ishimoto

大規模サイトにおけるGoogleアナリティクス導入から成果までKoji Ishimoto

tissa for iOSKoji Ishimoto

Using Google Analytics with jQuery MobileKoji Ishimoto

mobile firstKoji Ishimoto

Communities of Practice – kanazawa.js結成までの軌跡 -Koji Ishimoto

Long Life Web Performance OptimizationKoji Ishimoto

Coding Web PerformanceKoji Ishimoto

ビジネスにおけるウェブパフォーマンスKoji Ishimoto

High Performance Web DesignKoji Ishimoto

Webスライスから始めるmicroformatsKoji Ishimoto

Mehr von Koji Ishimoto (19)

マイクロインタラクション事始め以前

JavaScript/CSS 2015 Autumn

フロントエンドエンジニア（仮）〜え、ちょっとフロントやること多すぎじゃない！？〜

WebデザイナーのためのSass/Compass入門

パフォーマンスから考えるSass/Compassの導入・運用

モバイル制作におけるパフォーマンス最適化について

Measuring Web Performance - 自己満足で終わらないためのパフォーマンス計測 -

スマートフォンWebアプリ最適化”３つの極意”

TumblrTouch

大規模サイトにおけるGoogleアナリティクス導入から成果まで

tissa for iOS

Using Google Analytics with jQuery Mobile

mobile first

Communities of Practice – kanazawa.js結成までの軌跡 -

Long Life Web Performance Optimization

Coding Web Performance

ビジネスにおけるウェブパフォーマンス

High Performance Web Design

Webスライスから始めるmicroformats

Kürzlich hochgeladen

Design and Managing Service in the field of tourism and hospitality industryrioverosanniejoy

PORTAFOLIO 2024_ ANASTASIYA KUDINOVAAnastasiya Kudinova

Unveiling the Future: Columbus, Ohio Condominiums Through the Lens of 3D Arch...Yantram Animation Studio Corporation

昆士兰大学毕业证（UQ毕业证）#文凭成绩单#真实留信学历认证永久存档208367051

How to Empower the future of UX Design with Gen AIyuj

定制(CQU文凭证书)中央昆士兰大学毕业证成绩单原版一比一Fi ss

Dubai Calls Girl Tapes O525547819 Real Tapes Escort Services Dubaikojalkojal131

专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degreeyuu sss

毕业文凭制作#回国入职#diploma#degree澳洲弗林德斯大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree ttt fff

Call Girls Aslali 7397865700 Ridhima Hire Me Full Nightssuser7cb4ff

cda.pptx critical discourse analysis pptMaryamAfzal41

(办理学位证)约克圣约翰大学毕业证,KCL成绩单原版一比一D SSS

Pharmaceutical Packaging for the elderly.pdfAayushChavan5

Business research proposal mcdo.pptxBusiness research proposal mcdo.pptxBusin...mrchrns005

办理(宾州州立毕业证书)美国宾夕法尼亚州立大学毕业证成绩单原版一比一F La

'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,Aginakm1

306MTAMount UCLA University Bachelor's Diploma in Social MediaD SSS

shot list for my tv series two steps back17lcow074

Iconic Global Solution - web design, Digital Marketing servicesIconic global solution

在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证nhjeo1gg

Kürzlich hochgeladen (20)

Design and Managing Service in the field of tourism and hospitality industry

PORTAFOLIO 2024_ ANASTASIYA KUDINOVA

Unveiling the Future: Columbus, Ohio Condominiums Through the Lens of 3D Arch...

昆士兰大学毕业证（UQ毕业证）#文凭成绩单#真实留信学历认证永久存档

How to Empower the future of UX Design with Gen AI

定制(CQU文凭证书)中央昆士兰大学毕业证成绩单原版一比一

Dubai Calls Girl Tapes O525547819 Real Tapes Escort Services Dubai

专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree

毕业文凭制作#回国入职#diploma#degree澳洲弗林德斯大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree

Call Girls Aslali 7397865700 Ridhima Hire Me Full Night

cda.pptx critical discourse analysis ppt

(办理学位证)约克圣约翰大学毕业证,KCL成绩单原版一比一

Pharmaceutical Packaging for the elderly.pdf

Business research proposal mcdo.pptxBusiness research proposal mcdo.pptxBusin...

办理(宾州州立毕业证书)美国宾夕法尼亚州立大学毕业证成绩单原版一比一

'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,

306MTAMount UCLA University Bachelor's Diploma in Social Media

shot list for my tv series two steps back

Iconic Global Solution - web design, Digital Marketing services

在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证

Evaluating your stylesheets

2. Koji Ishimoto @t32k Front-end Engineer

7. StyleStats

8. Demo

9. stylestats.org

10. Metrics • Style Sheets • Style Elements • Size • Gzipped Size • Data URI Size • Ratio of Data URI Size • Simplicity • Rules • Selectors • Declarations • Average of Identifier • Most Identifier • Most Identifier Selector • Average of Cohesion • Lowest Cohesion • Lowest Cohesion Selector • Total Unique Font Sizes • Unique Font Sizes • Total Unique Font Families • Unique Font Families • Total Unique Colors • Unique Colors • ID Selectors • Universal Selectors • Unqualified Attribute • Selectors • JavaScript Specific • Selectors • User Specified Selectors • Important Keywords • Float Properties • Media Queries • Properties Count

11. Who is using StyleStats?

12. StyleStats in Kaizen Platform

13. Kaizen Platform Styleguide

14.

15. ๑•̀ •́ ‫✧و‬

16.

17. Work with us!

18. Sign up as a Growth Hacker!

19. Thanks!