The importance of being unobtrusive

•

8 gefällt mir•3,723 views

A five minute run through of some basic techniques for writing unobtrusive javascript. Using an example site - http://unobtrusify.com as a reference. Accompanying video available via http://oxford.geeknights.net/2009/may-27th/

Technologie Business

@philhawksworth
hello! http://hawksworx.com

http://www.ﬂickr.com/photos/casasroger/239168376/

separate

style & content

http://www.ﬂickr.com/photos/casasroger/239168376/

separate

style & content
behavior

http://www.ﬂickr.com/photos/houseofsims/3558311516/

who gives a monkeyʼs

not human
http://www.ﬂickr.com/photos/dhollahan/411071191/

bots

http://www.ﬂickr.com/photos/keinepanik/1081215934

mashups

http://www.ﬂickr.com/photos/benny4bs/473910801/

screen readers

http://www.ﬂickr.com/photos/lissalou66/2997534298/

managable

http://www.ﬂickr.com/photos/urtica/2354829631/

managable
CMS

http://www.ﬂickr.com/photos/urtica/2354829631/

performance
http://www.ﬂickr.com/photos/adamkjems/3559454088/

an example

http://www.ﬂickr.com/photos/adamkjems/3559454088/

progressive
enhancement

http://www.ﬂickr.com/photos/xfp/2533663094/

Empfohlen

Why You Are Not Your Type's TypeHugo Manila

Oxford Dogma catalog of handcrafted dog accessoriesAmy Lamp

Coulta Crosby CatalogAsif Ali

Why Your 5-Year-Old is More Digital Than Most CMOs - Sean Miller, R/GA and J...R/GA

I May Like You, But I'm Not In LIke With You - Chloe Gottlieb, R/GAR/GA

IT’S AN “M” WORLD - 9+1 Learnings to Build a Path to SuccessXPLAIN

Taking Hollywood Out of ProductionR/GA

What got you here won't get you thereChris Lema

Empfohlen

Why You Are Not Your Type's TypeHugo Manila

Oxford Dogma catalog of handcrafted dog accessoriesAmy Lamp

Coulta Crosby CatalogAsif Ali

Why Your 5-Year-Old is More Digital Than Most CMOs - Sean Miller, R/GA and J...R/GA

I May Like You, But I'm Not In LIke With You - Chloe Gottlieb, R/GAR/GA

IT’S AN “M” WORLD - 9+1 Learnings to Build a Path to SuccessXPLAIN

Taking Hollywood Out of ProductionR/GA

What got you here won't get you thereChris Lema

The Sports Fan in 2015 - Richard Ting and Kyle Bunch, R/GAR/GA

Does Your Product Have a Plot - David Womack, R/GAR/GA

SPARK 2016: Our Predictive FutureTrackMaven

Zendesk satisfaction-reportEnrique NTlgns

Asif hugomnlhpdAsif Ali

An Event Apart Recap, 2013Amy Lamp

Getting started with developing NodejsPhil Hawksworth

Hyperkat teachersVera Kovaleva

Hyperkat teachersEnrique NTlgns

Infographics Made EasyChris Lema

How to Stop Killer Robots from Destroying the Human Race*Brady Brim-DeForest

Smell cmsVera Kovaleva

Brainstorming Technology First R/GA

Better Together: Content Strategy and Design #CSFORUM16Rebekah Baggs

The Web Designers ToolkitR/GA

Next Level Collaboration: The Future of Content & Web Design at Future Insigh...Rebekah Baggs

Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...Neo4j

TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc

How to Troubleshoot Apps for the Modern Connected WorkerThousandEyes

Tech Trends Report 2024 Future Today Institute.pdfhans926745

Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Miguel Araújo

Weitere ähnliche Inhalte

Andere mochten auch

The Sports Fan in 2015 - Richard Ting and Kyle Bunch, R/GAR/GA

Does Your Product Have a Plot - David Womack, R/GAR/GA

SPARK 2016: Our Predictive FutureTrackMaven

Zendesk satisfaction-reportEnrique NTlgns

Asif hugomnlhpdAsif Ali

An Event Apart Recap, 2013Amy Lamp

Getting started with developing NodejsPhil Hawksworth

Hyperkat teachersVera Kovaleva

Hyperkat teachersEnrique NTlgns

Infographics Made EasyChris Lema

How to Stop Killer Robots from Destroying the Human Race*Brady Brim-DeForest

Smell cmsVera Kovaleva

Brainstorming Technology First R/GA

Better Together: Content Strategy and Design #CSFORUM16Rebekah Baggs

The Web Designers ToolkitR/GA

Next Level Collaboration: The Future of Content & Web Design at Future Insigh...Rebekah Baggs

Andere mochten auch (16)

The Sports Fan in 2015 - Richard Ting and Kyle Bunch, R/GA

Does Your Product Have a Plot - David Womack, R/GA

SPARK 2016: Our Predictive Future

Zendesk satisfaction-report

Asif hugomnlhpd

An Event Apart Recap, 2013

Getting started with developing Nodejs

Hyperkat teachers

Infographics Made Easy

How to Stop Killer Robots from Destroying the Human Race*

Smell cms

Brainstorming Technology First

Better Together: Content Strategy and Design #CSFORUM16

The Web Designers Toolkit

Next Level Collaboration: The Future of Content & Web Design at Future Insigh...

Kürzlich hochgeladen

Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...Neo4j

TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc

How to Troubleshoot Apps for the Modern Connected WorkerThousandEyes

Tech Trends Report 2024 Future Today Institute.pdfhans926745

Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Miguel Araújo

[2024]Digital Global Overview Report 2024 Meltwater.pdfhans926745

AWS Community Day CPH - Three problems of TerraformAndrey Devyatkin

Real Time Object Detection Using Open CVKhem

2024: Domino Containers - The Next Step. News from the Domino Container commu...Martijn de Jong

Boost PC performance: How more available memory can improve productivityPrincipled Technologies

ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProduct Anonymous

Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobeapidays

Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoffsammart93

04-2024-HHUG-Sales-and-Marketing-Alignment.pptxHampshireHUG

Strategies for Landing an Oracle DBA Job as a FresherRemote DBA Services

GenAI Risks & Security Meetup 01052024.pdflior mazor

Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Drew Madelung

Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024The Digital Insurer

Artificial Intelligence: Facts and MythsJoaquim Jorge

Kürzlich hochgeladen (20)

Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...

TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery

How to Troubleshoot Apps for the Modern Connected Worker

Tech Trends Report 2024 Future Today Institute.pdf

Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...

[2024]Digital Global Overview Report 2024 Meltwater.pdf

AWS Community Day CPH - Three problems of Terraform

Real Time Object Detection Using Open CV

2024: Domino Containers - The Next Step. News from the Domino Container commu...

Boost PC performance: How more available memory can improve productivity

ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke

Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe

Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff

04-2024-HHUG-Sales-and-Marketing-Alignment.pptx

Strategies for Landing an Oracle DBA Job as a Fresher

GenAI Risks & Security Meetup 01052024.pdf

Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...

Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024

Artificial Intelligence: Facts and Myths

The importance of being unobtrusive

1. @philhawksworth hello! http://hawksworx.com

2. The importance of being Unobtrusive

3. http://www.ﬂickr.com/photos/casasroger/239168376/ separate style & content

4. http://www.ﬂickr.com/photos/casasroger/239168376/ separate style & content behavior

5. http://www.ﬂickr.com/photos/houseofsims/3558311516/ who gives a monkeyʼs

6. not human http://www.ﬂickr.com/photos/dhollahan/411071191/

7. bots http://www.ﬂickr.com/photos/keinepanik/1081215934

8. mashups http://www.ﬂickr.com/photos/benny4bs/473910801/

9. screen readers http://www.ﬂickr.com/photos/lissalou66/2997534298/

10. managable http://www.ﬂickr.com/photos/urtica/2354829631/

11. managable CMS http://www.ﬂickr.com/photos/urtica/2354829631/

12. performance http://www.ﬂickr.com/photos/adamkjems/3559454088/

13. an example http://www.ﬂickr.com/photos/adamkjems/3559454088/

14.

15.

16.

17.

18.

19.

20.

21.

22.

23.

24.

25.

26.

27.

28. progressive enhancement http://www.ﬂickr.com/photos/xfp/2533663094/

29. modern javascript libraries

30.

31.

32.

33.

34. performance http://www.ﬂickr.com/photos/adamkjems/3559454088/

35.

36. http://stevesouders.com

37.

38.

39.

40.

41.

42.

43.

44. appropriate affordance

45.

46.

47. set up your wizzbang with js

48.

49.

50.

51. ta! http://unobtrusify.com