SlideShare a Scribd company logo
1 of 11
Cascading Style Sheets &
DII.UTK.EDU
A proposal to use cascading style
sheets rather than depreciated
techniques for the DII web site
Summary
Two-part proposal
 Why we should use style sheets
 How style sheets change the recovery
process
Interruptions
 If you would like further explanation
 Save your questions and discussion points
HTML is a Markup Language
Few understand this. None follow it.
<FONT>, <B>, <I> should not exist
Pages do not look like anything
What is a Style Sheet?
Separate form and function
Tells a user agent how to render
markup
Implemented by all browsers
Accessibility & Adaptability
CSS only provides a suggested layout
Choose adaptability or PDF-like control
WAP, PDA, handheld override our style
Advantages
Always download faster
Can be shuffled between levels with no
modification
If we cheat, we only cheat once
Can override bad markup throughout
the site with one !important sheet
Ease of migration to XHTML and XML
Misconceptions
Style-sheets are just another bleeding-
edge technology like Flash whose time
has not yet come.
 First impression
 “Style sheets rule!”
Isn’t this really web developer-centered
design?
We’ll be leaving people out.
Who do you want to leave out?
1. Complete usability over all platforms,
devices, and user agents
2. Minimal visual discrepancy across half
a dozen commonly-used visual user
agents
Style Sheet Penetration
Font-based control penetration is over
90%
Box model penetration is about 70%
Interim Solutions
Server-side addition/replacement of
deprecated markup
 Margin directives to collapse viewport
spacing
 Replacement of boxes with tables
Browser-detecting sheets
Final Thoughts
UT would be setting the standard
Thanks for the job security!

More Related Content

Similar to Proposal use style sheets

The Pragmatist's Approach to SharePoint Branding
The Pragmatist's Approach to SharePoint BrandingThe Pragmatist's Approach to SharePoint Branding
The Pragmatist's Approach to SharePoint BrandingStu King
 
Bootstrap for Beginners
Bootstrap for BeginnersBootstrap for Beginners
Bootstrap for BeginnersD'arce Hess
 
lesson-1-introduction-html-and-css.pptx
lesson-1-introduction-html-and-css.pptxlesson-1-introduction-html-and-css.pptx
lesson-1-introduction-html-and-css.pptxkulmiye2
 
Lean And Clean! Building A Site With Web Standards
Lean And Clean! Building A Site With Web StandardsLean And Clean! Building A Site With Web Standards
Lean And Clean! Building A Site With Web Standardsweb.designer.developer
 
Single sourcing to the max
Single sourcing to the maxSingle sourcing to the max
Single sourcing to the maxNeil Perlin
 
Branding share point 2013
Branding share point 2013Branding share point 2013
Branding share point 2013Khoa Quach
 
Common Mistakes Made By Web Developers
Common Mistakes Made By Web DevelopersCommon Mistakes Made By Web Developers
Common Mistakes Made By Web DevelopersBOSS Webtech
 
2010 share point saturday deck enterprise office applications
2010 share point saturday deck   enterprise office applications2010 share point saturday deck   enterprise office applications
2010 share point saturday deck enterprise office applicationsGarry Stewart
 
Web designtrends
Web designtrendsWeb designtrends
Web designtrendsTafu Norido
 
CSS Interview Questions for Fresher and Experience
CSS Interview Questions for Fresher and Experience CSS Interview Questions for Fresher and Experience
CSS Interview Questions for Fresher and Experience Hitesh Kumar
 
Class 4: Introduction to web technology entrepreneurship
Class 4: Introduction to web technology entrepreneurshipClass 4: Introduction to web technology entrepreneurship
Class 4: Introduction to web technology entrepreneurshipallanchao
 
blogger html & css.pdf
blogger html & css.pdfblogger html & css.pdf
blogger html & css.pdfdevbhargav1
 

Similar to Proposal use style sheets (20)

The Pragmatist's Approach to SharePoint Branding
The Pragmatist's Approach to SharePoint BrandingThe Pragmatist's Approach to SharePoint Branding
The Pragmatist's Approach to SharePoint Branding
 
Basic web designing 2
Basic web designing 2Basic web designing 2
Basic web designing 2
 
Dfg Intranet Development
Dfg Intranet DevelopmentDfg Intranet Development
Dfg Intranet Development
 
Bootstrap for Beginners
Bootstrap for BeginnersBootstrap for Beginners
Bootstrap for Beginners
 
Accessibility, SEO and Joomla
Accessibility, SEO and Joomla Accessibility, SEO and Joomla
Accessibility, SEO and Joomla
 
Accessibility, SEO and Joomla
Accessibility, SEO and JoomlaAccessibility, SEO and Joomla
Accessibility, SEO and Joomla
 
lesson-1-introduction-html-and-css.pptx
lesson-1-introduction-html-and-css.pptxlesson-1-introduction-html-and-css.pptx
lesson-1-introduction-html-and-css.pptx
 
Lean And Clean! Building A Site With Web Standards
Lean And Clean! Building A Site With Web StandardsLean And Clean! Building A Site With Web Standards
Lean And Clean! Building A Site With Web Standards
 
Lean And Clean! Building A Site With
Lean And Clean! Building A Site WithLean And Clean! Building A Site With
Lean And Clean! Building A Site With
 
Web dev-101
Web dev-101Web dev-101
Web dev-101
 
Single sourcing to the max
Single sourcing to the maxSingle sourcing to the max
Single sourcing to the max
 
Branding share point 2013
Branding share point 2013Branding share point 2013
Branding share point 2013
 
Common Mistakes Made By Web Developers
Common Mistakes Made By Web DevelopersCommon Mistakes Made By Web Developers
Common Mistakes Made By Web Developers
 
2010 share point saturday deck enterprise office applications
2010 share point saturday deck   enterprise office applications2010 share point saturday deck   enterprise office applications
2010 share point saturday deck enterprise office applications
 
Web designtrends
Web designtrendsWeb designtrends
Web designtrends
 
Web designtrends 1wd
Web designtrends 1wdWeb designtrends 1wd
Web designtrends 1wd
 
CSS Interview Questions for Fresher and Experience
CSS Interview Questions for Fresher and Experience CSS Interview Questions for Fresher and Experience
CSS Interview Questions for Fresher and Experience
 
Web Standards
Web StandardsWeb Standards
Web Standards
 
Class 4: Introduction to web technology entrepreneurship
Class 4: Introduction to web technology entrepreneurshipClass 4: Introduction to web technology entrepreneurship
Class 4: Introduction to web technology entrepreneurship
 
blogger html & css.pdf
blogger html & css.pdfblogger html & css.pdf
blogger html & css.pdf
 

Recently uploaded

SBFT Tool Competition 2024 -- Python Test Case Generation Track
SBFT Tool Competition 2024 -- Python Test Case Generation TrackSBFT Tool Competition 2024 -- Python Test Case Generation Track
SBFT Tool Competition 2024 -- Python Test Case Generation TrackSebastiano Panichella
 
Governance and Nation-Building in Nigeria: Some Reflections on Options for Po...
Governance and Nation-Building in Nigeria: Some Reflections on Options for Po...Governance and Nation-Building in Nigeria: Some Reflections on Options for Po...
Governance and Nation-Building in Nigeria: Some Reflections on Options for Po...Kayode Fayemi
 
OSCamp Kubernetes 2024 | Zero-Touch OS-Infrastruktur für Container und Kubern...
OSCamp Kubernetes 2024 | Zero-Touch OS-Infrastruktur für Container und Kubern...OSCamp Kubernetes 2024 | Zero-Touch OS-Infrastruktur für Container und Kubern...
OSCamp Kubernetes 2024 | Zero-Touch OS-Infrastruktur für Container und Kubern...NETWAYS
 
Russian Call Girls in Kolkata Vaishnavi 🤌 8250192130 🚀 Vip Call Girls Kolkata
Russian Call Girls in Kolkata Vaishnavi 🤌  8250192130 🚀 Vip Call Girls KolkataRussian Call Girls in Kolkata Vaishnavi 🤌  8250192130 🚀 Vip Call Girls Kolkata
Russian Call Girls in Kolkata Vaishnavi 🤌 8250192130 🚀 Vip Call Girls Kolkataanamikaraghav4
 
Open Source Strategy in Logistics 2015_Henrik Hankedvz-d-nl-log-conference.pdf
Open Source Strategy in Logistics 2015_Henrik Hankedvz-d-nl-log-conference.pdfOpen Source Strategy in Logistics 2015_Henrik Hankedvz-d-nl-log-conference.pdf
Open Source Strategy in Logistics 2015_Henrik Hankedvz-d-nl-log-conference.pdfhenrik385807
 
CTAC 2024 Valencia - Sven Zoelle - Most Crucial Invest to Digitalisation_slid...
CTAC 2024 Valencia - Sven Zoelle - Most Crucial Invest to Digitalisation_slid...CTAC 2024 Valencia - Sven Zoelle - Most Crucial Invest to Digitalisation_slid...
CTAC 2024 Valencia - Sven Zoelle - Most Crucial Invest to Digitalisation_slid...henrik385807
 
CTAC 2024 Valencia - Henrik Hanke - Reduce to the max - slideshare.pdf
CTAC 2024 Valencia - Henrik Hanke - Reduce to the max - slideshare.pdfCTAC 2024 Valencia - Henrik Hanke - Reduce to the max - slideshare.pdf
CTAC 2024 Valencia - Henrik Hanke - Reduce to the max - slideshare.pdfhenrik385807
 
LANDMARKS AND MONUMENTS IN NIGERIA.pptx
LANDMARKS  AND MONUMENTS IN NIGERIA.pptxLANDMARKS  AND MONUMENTS IN NIGERIA.pptx
LANDMARKS AND MONUMENTS IN NIGERIA.pptxBasil Achie
 
call girls in delhi malviya nagar @9811711561@
call girls in delhi malviya nagar @9811711561@call girls in delhi malviya nagar @9811711561@
call girls in delhi malviya nagar @9811711561@vikas rana
 
NATIONAL ANTHEMS OF AFRICA (National Anthems of Africa)
NATIONAL ANTHEMS OF AFRICA (National Anthems of Africa)NATIONAL ANTHEMS OF AFRICA (National Anthems of Africa)
NATIONAL ANTHEMS OF AFRICA (National Anthems of Africa)Basil Achie
 
Call Girls in Rohini Delhi 💯Call Us 🔝8264348440🔝
Call Girls in Rohini Delhi 💯Call Us 🔝8264348440🔝Call Girls in Rohini Delhi 💯Call Us 🔝8264348440🔝
Call Girls in Rohini Delhi 💯Call Us 🔝8264348440🔝soniya singh
 
Work Remotely with Confluence ACE 2.pptx
Work Remotely with Confluence ACE 2.pptxWork Remotely with Confluence ACE 2.pptx
Work Remotely with Confluence ACE 2.pptxmavinoikein
 
OSCamp Kubernetes 2024 | SRE Challenges in Monolith to Microservices Shift at...
OSCamp Kubernetes 2024 | SRE Challenges in Monolith to Microservices Shift at...OSCamp Kubernetes 2024 | SRE Challenges in Monolith to Microservices Shift at...
OSCamp Kubernetes 2024 | SRE Challenges in Monolith to Microservices Shift at...NETWAYS
 
Philippine History cavite Mutiny Report.ppt
Philippine History cavite Mutiny Report.pptPhilippine History cavite Mutiny Report.ppt
Philippine History cavite Mutiny Report.pptssuser319dad
 
Night 7k Call Girls Noida Sector 128 Call Me: 8448380779
Night 7k Call Girls Noida Sector 128 Call Me: 8448380779Night 7k Call Girls Noida Sector 128 Call Me: 8448380779
Night 7k Call Girls Noida Sector 128 Call Me: 8448380779Delhi Call girls
 
SBFT Tool Competition 2024 - CPS-UAV Test Case Generation Track
SBFT Tool Competition 2024 - CPS-UAV Test Case Generation TrackSBFT Tool Competition 2024 - CPS-UAV Test Case Generation Track
SBFT Tool Competition 2024 - CPS-UAV Test Case Generation TrackSebastiano Panichella
 
Simulation-based Testing of Unmanned Aerial Vehicles with Aerialist
Simulation-based Testing of Unmanned Aerial Vehicles with AerialistSimulation-based Testing of Unmanned Aerial Vehicles with Aerialist
Simulation-based Testing of Unmanned Aerial Vehicles with AerialistSebastiano Panichella
 
WhatsApp 📞 9892124323 ✅Call Girls In Juhu ( Mumbai )
WhatsApp 📞 9892124323 ✅Call Girls In Juhu ( Mumbai )WhatsApp 📞 9892124323 ✅Call Girls In Juhu ( Mumbai )
WhatsApp 📞 9892124323 ✅Call Girls In Juhu ( Mumbai )Pooja Nehwal
 
Genesis part 2 Isaiah Scudder 04-24-2024.pptx
Genesis part 2 Isaiah Scudder 04-24-2024.pptxGenesis part 2 Isaiah Scudder 04-24-2024.pptx
Genesis part 2 Isaiah Scudder 04-24-2024.pptxFamilyWorshipCenterD
 
George Lever - eCommerce Day Chile 2024
George Lever -  eCommerce Day Chile 2024George Lever -  eCommerce Day Chile 2024
George Lever - eCommerce Day Chile 2024eCommerce Institute
 

Recently uploaded (20)

SBFT Tool Competition 2024 -- Python Test Case Generation Track
SBFT Tool Competition 2024 -- Python Test Case Generation TrackSBFT Tool Competition 2024 -- Python Test Case Generation Track
SBFT Tool Competition 2024 -- Python Test Case Generation Track
 
Governance and Nation-Building in Nigeria: Some Reflections on Options for Po...
Governance and Nation-Building in Nigeria: Some Reflections on Options for Po...Governance and Nation-Building in Nigeria: Some Reflections on Options for Po...
Governance and Nation-Building in Nigeria: Some Reflections on Options for Po...
 
OSCamp Kubernetes 2024 | Zero-Touch OS-Infrastruktur für Container und Kubern...
OSCamp Kubernetes 2024 | Zero-Touch OS-Infrastruktur für Container und Kubern...OSCamp Kubernetes 2024 | Zero-Touch OS-Infrastruktur für Container und Kubern...
OSCamp Kubernetes 2024 | Zero-Touch OS-Infrastruktur für Container und Kubern...
 
Russian Call Girls in Kolkata Vaishnavi 🤌 8250192130 🚀 Vip Call Girls Kolkata
Russian Call Girls in Kolkata Vaishnavi 🤌  8250192130 🚀 Vip Call Girls KolkataRussian Call Girls in Kolkata Vaishnavi 🤌  8250192130 🚀 Vip Call Girls Kolkata
Russian Call Girls in Kolkata Vaishnavi 🤌 8250192130 🚀 Vip Call Girls Kolkata
 
Open Source Strategy in Logistics 2015_Henrik Hankedvz-d-nl-log-conference.pdf
Open Source Strategy in Logistics 2015_Henrik Hankedvz-d-nl-log-conference.pdfOpen Source Strategy in Logistics 2015_Henrik Hankedvz-d-nl-log-conference.pdf
Open Source Strategy in Logistics 2015_Henrik Hankedvz-d-nl-log-conference.pdf
 
CTAC 2024 Valencia - Sven Zoelle - Most Crucial Invest to Digitalisation_slid...
CTAC 2024 Valencia - Sven Zoelle - Most Crucial Invest to Digitalisation_slid...CTAC 2024 Valencia - Sven Zoelle - Most Crucial Invest to Digitalisation_slid...
CTAC 2024 Valencia - Sven Zoelle - Most Crucial Invest to Digitalisation_slid...
 
CTAC 2024 Valencia - Henrik Hanke - Reduce to the max - slideshare.pdf
CTAC 2024 Valencia - Henrik Hanke - Reduce to the max - slideshare.pdfCTAC 2024 Valencia - Henrik Hanke - Reduce to the max - slideshare.pdf
CTAC 2024 Valencia - Henrik Hanke - Reduce to the max - slideshare.pdf
 
LANDMARKS AND MONUMENTS IN NIGERIA.pptx
LANDMARKS  AND MONUMENTS IN NIGERIA.pptxLANDMARKS  AND MONUMENTS IN NIGERIA.pptx
LANDMARKS AND MONUMENTS IN NIGERIA.pptx
 
call girls in delhi malviya nagar @9811711561@
call girls in delhi malviya nagar @9811711561@call girls in delhi malviya nagar @9811711561@
call girls in delhi malviya nagar @9811711561@
 
NATIONAL ANTHEMS OF AFRICA (National Anthems of Africa)
NATIONAL ANTHEMS OF AFRICA (National Anthems of Africa)NATIONAL ANTHEMS OF AFRICA (National Anthems of Africa)
NATIONAL ANTHEMS OF AFRICA (National Anthems of Africa)
 
Call Girls in Rohini Delhi 💯Call Us 🔝8264348440🔝
Call Girls in Rohini Delhi 💯Call Us 🔝8264348440🔝Call Girls in Rohini Delhi 💯Call Us 🔝8264348440🔝
Call Girls in Rohini Delhi 💯Call Us 🔝8264348440🔝
 
Work Remotely with Confluence ACE 2.pptx
Work Remotely with Confluence ACE 2.pptxWork Remotely with Confluence ACE 2.pptx
Work Remotely with Confluence ACE 2.pptx
 
OSCamp Kubernetes 2024 | SRE Challenges in Monolith to Microservices Shift at...
OSCamp Kubernetes 2024 | SRE Challenges in Monolith to Microservices Shift at...OSCamp Kubernetes 2024 | SRE Challenges in Monolith to Microservices Shift at...
OSCamp Kubernetes 2024 | SRE Challenges in Monolith to Microservices Shift at...
 
Philippine History cavite Mutiny Report.ppt
Philippine History cavite Mutiny Report.pptPhilippine History cavite Mutiny Report.ppt
Philippine History cavite Mutiny Report.ppt
 
Night 7k Call Girls Noida Sector 128 Call Me: 8448380779
Night 7k Call Girls Noida Sector 128 Call Me: 8448380779Night 7k Call Girls Noida Sector 128 Call Me: 8448380779
Night 7k Call Girls Noida Sector 128 Call Me: 8448380779
 
SBFT Tool Competition 2024 - CPS-UAV Test Case Generation Track
SBFT Tool Competition 2024 - CPS-UAV Test Case Generation TrackSBFT Tool Competition 2024 - CPS-UAV Test Case Generation Track
SBFT Tool Competition 2024 - CPS-UAV Test Case Generation Track
 
Simulation-based Testing of Unmanned Aerial Vehicles with Aerialist
Simulation-based Testing of Unmanned Aerial Vehicles with AerialistSimulation-based Testing of Unmanned Aerial Vehicles with Aerialist
Simulation-based Testing of Unmanned Aerial Vehicles with Aerialist
 
WhatsApp 📞 9892124323 ✅Call Girls In Juhu ( Mumbai )
WhatsApp 📞 9892124323 ✅Call Girls In Juhu ( Mumbai )WhatsApp 📞 9892124323 ✅Call Girls In Juhu ( Mumbai )
WhatsApp 📞 9892124323 ✅Call Girls In Juhu ( Mumbai )
 
Genesis part 2 Isaiah Scudder 04-24-2024.pptx
Genesis part 2 Isaiah Scudder 04-24-2024.pptxGenesis part 2 Isaiah Scudder 04-24-2024.pptx
Genesis part 2 Isaiah Scudder 04-24-2024.pptx
 
George Lever - eCommerce Day Chile 2024
George Lever -  eCommerce Day Chile 2024George Lever -  eCommerce Day Chile 2024
George Lever - eCommerce Day Chile 2024
 

Proposal use style sheets

  • 1. Cascading Style Sheets & DII.UTK.EDU A proposal to use cascading style sheets rather than depreciated techniques for the DII web site
  • 2. Summary Two-part proposal  Why we should use style sheets  How style sheets change the recovery process Interruptions  If you would like further explanation  Save your questions and discussion points
  • 3. HTML is a Markup Language Few understand this. None follow it. <FONT>, <B>, <I> should not exist Pages do not look like anything
  • 4. What is a Style Sheet? Separate form and function Tells a user agent how to render markup Implemented by all browsers
  • 5. Accessibility & Adaptability CSS only provides a suggested layout Choose adaptability or PDF-like control WAP, PDA, handheld override our style
  • 6. Advantages Always download faster Can be shuffled between levels with no modification If we cheat, we only cheat once Can override bad markup throughout the site with one !important sheet Ease of migration to XHTML and XML
  • 7. Misconceptions Style-sheets are just another bleeding- edge technology like Flash whose time has not yet come.  First impression  “Style sheets rule!” Isn’t this really web developer-centered design? We’ll be leaving people out.
  • 8. Who do you want to leave out? 1. Complete usability over all platforms, devices, and user agents 2. Minimal visual discrepancy across half a dozen commonly-used visual user agents
  • 9. Style Sheet Penetration Font-based control penetration is over 90% Box model penetration is about 70%
  • 10. Interim Solutions Server-side addition/replacement of deprecated markup  Margin directives to collapse viewport spacing  Replacement of boxes with tables Browser-detecting sheets
  • 11. Final Thoughts UT would be setting the standard Thanks for the job security!

Editor's Notes

  1. Why now? I wanted to present this idea before the stakeholders meeting so that, if accepted, the strategy and possibly timeframes could be revised before the stakeholders meeting. This will seem irrelevant at first. The second presentation will bring it together. Please hold your questions to the end since I may address them later in the presentation.
  2. I’m sure many of you understand this already. I didn’t learn it until three years of making web pages. When I heard markup and layout were different, I didn’t really understand.
  3. A style sheet is just a document that tells a user agent how to render markup. All user agents use them.
  4. Style sheet are designed to provide a suggested layout. One can either have PDF-like control of layout, or have adaptability.
  5. See if you can put together some examples of one style sheet being applied to multiple pages. Talk about the toe page.
  6. What isn’t a style sheet? Misconception number one comes from a bad first impression. The capabilities of style sheets completely overlaps and extends HTML’s functionality, so whenever one sees the underlines removed from links, or strangely colored scrollbars, one automatically blames style sheets. We have never gone to a site and said, “Woah, style sheets rock!” because when done correctly, the implementation is invisible.
  7. The question isn’t, “Who do you want to leave out?” It’s, “How do you want to leave them out?”
  8. Until style sheet penetration is to a sufficient level, we can configure the server to add site-wide deprecated markup.
  9. Since I was hired for such a specific purpose, I would have no problem with you rejecting this proposal and going with a strategy of combined content and layout. I’m going to guess it’ll take another couple years for the site to degrade to a state of disrepair, and I’ll come on back!