Progressive Enhancement

•

2 gefällt mir•851 views

Progressive Enhancement is one of the most important and useful software engineering tools in our web development toolbox, but in practice it's largely ignored. We'll dive into the basics of PE, the common pitfalls (think <noscript> and the newer class="no-js"), how to support Blackberry 4.x and IE6 without a ton of extra work, tools to avoid that violate PE best practices, and how to apply PE pragmatically.

Technologie Design

Hello.
Zach Leatherman
Front End Engineer est. 1998
UI “Architect” at Union Paciﬁc Railroad
Web 3.0, 6 Bladed Razors, 7 Minute Abs:
849K Pageviews, 1.3K RSS subscribers
BigText jQuery Plugin Author
Omaha Startup Weekend: GiftBright and CallSpinner
No afﬁliation:

@zachleat http://zachleat.com

4, 5

http://www.quirksmode.org/blog/archives/2009/10/there_is_no_web.html

HTML2 HTML5
76 pages 500 pages

http://html5.hadw.com/

<a href=”#”
onclick=”throw Error(‘Whoops’)”>
GO TO NEXT PAGE
</a>

HTML Content
CSS Presentation
JavaScript Behaviors

Choose Your
Weapons Wisely

http://www.ﬂickr.com/photos/29503348@N03/4915763648/

Text
Images alt=”Text”
CSS Defaults
JavaScript No Ajax
No Behaviors

Text
Images
Flash Video Transcripts
Still Images

Text Telegraph
1838

Images1865 Telefax

Audio1876 Telephone

1896 Radio

Video 1927 Television
1930 Videophone

Inclusive

One Web,
Mobile First Two Web
JavaScript IE Only

Exclusive
Required Web WebKit Only

Layouts
Responsive Design & Text

http://blog.andyhume.net/responsive-by-default

NetMag
Issue 208

http://issuu.com/curtisbrenneman/docs/net208

http://developer.yahoo.com/yui/articles/gbs/

IE6 and Blackberry 4.x
still have CSS, JavaScript
support

Three Ways To Fork
http://allyoucanleet.com/2011/02/05/the-cost-of-feature-testing/

User Agent Snifﬁng
Bad.
“Mozilla”
“Like Gecko”

Thanks!

Zach Leatherman
@zachleat

http://zachleat.com

Weitere ähnliche Inhalte

Was ist angesagt?

Browser Wars Episode 1: The Phantom Menace

Nicholas Zakas

On 23.03.2013 I visited The Netherlands to give the keynote speak about Joomla! web security. I talked about the most common 8 ways a Joomla! website can get hacked. So you should check the presentation if you are a Joomla! hacker that knows less than 8 ways :) It will be useful for you. However, if you are a Joomla user that doesn’t know anything about how to hack a Joomla!, or even worse, how to protect your Joomla! from being hacked, you should definitely check the slides! Because there is a way to protect yourself from each of the common Joomla hacks that I revealed them in the presentation. I went through the following scenarios and what should be done to prevent each of them: - Hacked through outdated Joomla!/extensions/themes. - Hacked through a vulnerable extensions/themes, that is not outdated - Hacked with the help of stolen/weak login details - Hacked through outdated/vulnerable server software - Apache, PHP, MySQL. - Hacked through incorrectly configured web server - A completely healthy site hacked through another vulnerable Joomla that is hosted on the same server - Hacked because of incorrect Joomla permissions - Hacked through malware on local PC which allows attackers to access a healthy site

8 Most Common Joomla! Hacks and How to Avoid Them

Daniel Kanchev

High Performance JavaScript (Amazon DevCon 2011)

Nicholas Zakas

Rey Bango - HTML5: polyfills and shims

StarTech Conference

5 single page application principles developers need to know

Chris Love

Augmented Reality (AR) - The Future of Mobile Applications?

Carin Campanario

Taiwan Web Standards Talk 2011

Zi Bin Cheah

Real World Web Standards

gleddy

Mobile Web Speed Bumps

Nicholas Zakas

Web Development for UX Designers

Ashlimarie

Web Front End Performance

Chris Love

State of jQuery '09

jeresig

In the beginning, progressive enhancement was simple: HTML layered with CSS layered with JavaScript. That worked fine when there were two browsers, but in today's world of multiple devices and multiple browsers, it's time for a progressive enhancement reboot. At the core is the understanding that the web is not print - the same rules don't apply. As developers and consumers we've been fooled into thinking about print paradigms for too long. In this talk, you'll learn just how different the web is and how the evolution of progressive enhancement can lead to better user experiences as well as happier developers and users.

Progressive Enhancement 2.0 (jQuery Conference SF Bay Area 2011)

Nicholas Zakas

Prebrowsing - Velocity NY 2013

Steve Souders

Data entry is boring. Developing web forms is tedious and can be complicated. As AJAX heavy applications have become the standard of today’s web developers have relied on many third party plugins and libraries to add client-side value to data entry forms. Modern browsers implement many of these features natively, in many cases eliminating the need to load and maintain an application against a third party library. In this session I will review new input types, attributes, styling and validation techniques that should make you forget those third party libraries for your next project.

Html5 inputs

Chris Love

Joomla! Plugin Development

Yireo

High Performance Mobile (SF/SV Web Perf)

Steve Souders

J query

Chalermpon Areepong

Every URL visited from the Facebook iPhone app is done through a webview. Same with Twitter. Even if you don't have a mobile app, your website gets a lot of traffic from webviews. And yet, testing on webviews is challenging. There are significant performances differences between UIWebView vs WkWebView, and similarly for Android webview vs the new Chromium webview. And what about home screen apps?! In this talk, Steve Souders discusses the differences across webviews and how that affects performance of mobile web apps.

do u webview?

Steve Souders

It is extremely common that parts of pages within a Joomla! website are replicated across several views, or even across several extensions. So what does Joomla! contain that could potentially make our lives easier to manage these repeating entities? JLayouts enters the room... Joomla's superb JLayout structure was added to Joomla! v3 to help solve this very problem. Having the ability to use different layout's and associated data across views and extensions is such an awesome addition to Joomla!, but have you used it? Philip will be explaining JLayouts, what it is, how it works & where you could possibly be missing a trick in your front-end development of Joomla! websites.

Joomla 3 JLayout's - Joomladay Netherlands 2014 #jd14nl

Philip Locke

Was ist angesagt? (20)

Browser Wars Episode 1: The Phantom Menace

8 Most Common Joomla! Hacks and How to Avoid Them

High Performance JavaScript (Amazon DevCon 2011)

Rey Bango - HTML5: polyfills and shims

5 single page application principles developers need to know

Augmented Reality (AR) - The Future of Mobile Applications?

Taiwan Web Standards Talk 2011

Real World Web Standards

Mobile Web Speed Bumps

Web Development for UX Designers

Web Front End Performance

State of jQuery '09

Progressive Enhancement 2.0 (jQuery Conference SF Bay Area 2011)

Prebrowsing - Velocity NY 2013

Html5 inputs

Joomla! Plugin Development

High Performance Mobile (SF/SV Web Perf)

J query

do u webview?

Joomla 3 JLayout's - Joomladay Netherlands 2014 #jd14nl

Ähnlich wie Progressive Enhancement

HTML5 WebSocket: The New Network Stack for the Web

Peter Lubbers

The Node.js movement has transformed the landscape of UI development. In this session we'll look at how Node.js can be leveraged on multiple layers of the web application development lifecycle. Attendees will learn how incorporating Node.js into your front-end build process can optimize code, allow you to use use new and upcoming JavaScript features in your code today, and to improve your asset delivery pipeline. This session will also cover how Node is changing the template rendering landscape, allowing developers to write "isomorphic" code that runs on the client and server. Lastly we'll look into using Node to achieve developer zen by keeping the codebase clean and limiting the risk of changes to the code causing unknown errors.

Modern UI Development With Node.js

Ryan Anklam

When Orbitz Worldwide released a new generation of its global technology platform there were some lofty goals for the UI. They wanted to build a presentation tier (HTML, CSS, JavaScript) that would meet the goals of internationalization, accessibility, have rich Ajax interactions, and be faster and easier to develop in. This session will explore the key challenges in achieving these goals, including what worked, what didn\'t, and what\'s next.

Coding the UI

Mark Meeker

Coding Ui

rajivmordani

There is no denying that the Apple App Store is huge, but who wants to have to deal with Objective-C? Thank fully, tech nologies like PhoneGap and Sencha allow web devel opers to work in languages they know (HTML/CSS/JavaScript) while still making them look native. PhoneGap also allows us to port our apps to other plat forms, like Android. This session will look at the mobile web devel opment life cycle from building a prototype in the browser, inte gration with the phone, app submission and some basic marketing tricks.

Smart phone development

Myles Eftos

Cowboy rabbit-websockets

Wade Mealing

State of the Web

Dmitry Buzdin

Keeping up with the state of web technology is one of the biggest challenges for us developers today. We invent new tools; we define new best practices, everything’s new, always... And we do all that for good user experience! We do all that to build the best possible web – it’s all about our users. But is it, really? Or do developers like to play with technology secretly loving the new and shiny? Or do we only pretend that it’s about users, and behind closed doors, it’s developer experience that matters to us? Did we lose direction? Is it time for a critical look at the state of the web and the role JavaScript plays in it?

Stefan Judis "Did we(b development) lose the right direction?"

Fwdays

Moving to the Client - JavaFX and HTML5 (PowerPoint Version)

Stephen Chin

HTML5 and CSS3 have arrived and they are redefining rich, standards-based web development. Features previously the exclusive domain of browser plug-ins can now be added to web applications as easily as images. Understanding the new power that these standards define, as well as the rapidly increasing power and speed of JavaScript in modern browsers and devices is essential. These slides accompany a full-day workshop, where attendees are guided through the new features in HTML5 and CSS3, with special attention to how these technologies can be used today in new and old browsers.

HTML5 Bootcamp: Essential HTML, CSS, & JavaScript

Todd Anglin

HTML5 and Beyond

dynamis

With the recent release of ASP.NET 4.0, there are many new tools in the WebForms developer toolbox that make it possible to build faster, more standards-compliant web applications. In this session, you'll be introduced to all of the new major features in ASP.NET 4.0 and shown how these features can be leveraged to build better WebForms applications. From improved ViewState handling to powerful control over client IDs and caching, this session is your primer for making the upgrade to 4.0.

What’s New in ASP.NET 4

Todd Anglin

Speed is Essential for a Great Web Experience

Andy Davies

Html5 Overview

Daniel Arndt Alves

HTML5 Intoduction for Web Developers

Sascha Corti

Change by HTML5

dynamis

Ajax to the Moon

davejohnson

WHAT IS HTML5? (at CSS Nite Osaka)

Shumpei Shiraishi

7 Habits of Exceptional Performance

Nicole Sullivan

Html5

Ben MacNeill

Ähnlich wie Progressive Enhancement (20)

HTML5 WebSocket: The New Network Stack for the Web

Modern UI Development With Node.js

Coding the UI

Coding Ui

Smart phone development

Cowboy rabbit-websockets

State of the Web

Stefan Judis "Did we(b development) lose the right direction?"

Moving to the Client - JavaFX and HTML5 (PowerPoint Version)

HTML5 Bootcamp: Essential HTML, CSS, & JavaScript

HTML5 and Beyond

What’s New in ASP.NET 4

Speed is Essential for a Great Web Experience

Html5 Overview

HTML5 Intoduction for Web Developers

Change by HTML5

Ajax to the Moon

WHAT IS HTML5? (at CSS Nite Osaka)

7 Habits of Exceptional Performance

Html5

Kürzlich hochgeladen

The microservices honeymoon is over. When starting a new project or revamping a legacy monolith, teams started looking for alternatives to microservices. The Modular Monolith, or 'Modulith', is an architecture that reaps the benefits of (vertical) functional decoupling without the high costs associated with separate deployments. This talk will delve into the advantages and challenges of this progressive architecture, beginning with exploring the concept of a 'module', its internal structure, public API, and inter-module communication patterns. Supported by spring-modulith, the talk provides practical guidance on addressing the main challenges of a Modultith Architecture: finding and guarding module boundaries, data decoupling, and integration module-testing. You should not miss this talk if you are a software architect or tech lead seeking practical, scalable solutions. About the author With two decades of experience, Victor is a Java Champion working as a trainer for top companies in Europe. Five thousands developers in 120 companies attended his workshops, so he gets to debate every week the challenges that various projects struggle with. In return, Victor summarizes key points from these workshops in conference talks and online meetups for the European Software Crafters, the world’s largest developer community around architecture, refactoring, and testing. Discover how Victor can help you on victorrentea.ro : company training catalog, consultancy and YouTube playlists.

Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024

Victor Rentea

Keynote 2: APIs in 2030: The Risk of Technological Sleepwalk Paolo Malinverno, Growth Advisor - The Business of Technology Apidays New York 2024: The API Economy in the AI Era (April 30 & May 1, 2024) ------ Check out our conferences at https://www.apidays.global/ Do you want to sponsor or talk at one of our conferences? https://apidays.typeform.com/to/ILJeAaV8 Learn more on APIscene, the global media made by the community for the community: https://www.apiscene.io Explore the API ecosystem with the API Landscape: https://apilandscape.apiscene.io/

Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...

apidays

MS Copilot expands with MS Graph connectors

Nanddeep Nachan

Dubai, known for its towering skyscrapers, luxurious lifestyle, and relentless pursuit of innovation, often finds itself in the global spotlight. However, amidst the glitz and glamour, the emirate faces its own set of challenges, including the occasional threat of flooding. In recent years, Dubai has experienced sporadic but significant floods, disrupting normalcy and posing unique challenges to its infrastructure. Among the critical nodes in this bustling metropolis is the Dubai International Airport, a vital hub connecting the world. This article delves into the intersection of Dubai flood events and the resilience demonstrated by the Dubai International Airport in the face of such challenges.

Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf

Orbitshub

Exploring Multimodal Embeddings with Milvus

Zilliz

Webinar Recording: https://www.panagenda.com/webinars/why-teams-call-analytics-is-critical-to-your-entire-business Nothing is as frustrating and noticeable as being in an important call and being unable to see or hear the other person. Not surprising then, that issues with Teams calls are among the most common problems users call their helpdesk for. Having in depth insight into everything relevant going on at the user’s device, local network, ISP and Microsoft itself during the call is crucial for good Microsoft Teams Call quality support. To ensure a quick and adequate solution and to ensure your users get the most out of their Microsoft 365. But did you know that ‘bad calls’ are also an excellent indicator of other problems arising? Precisely because it is so noticeable!? Like the canary in the mine, bad calls can be early indicators of problems. Problems that might otherwise not have been noticed for a while but can have a big impact on productivity and satisfaction. Join this session by Christoph Adler to learn how true Microsoft Teams call quality analytics helped other organizations troubleshoot bad calls and identify and fix problems that impacted Teams calls or the use of Microsoft365 in general. See what it can do to keep your users happy and productive! In this session we will cover - Why CQD data alone is not enough to troubleshoot call problems - The importance of attributing call problems to the right call participant - What call quality analytics can do to help you quickly find, fix-, and prevent problems - Why having retrospective detailed insights matters - Real life examples of how others have used Microsoft Teams call quality monitoring to problem shoot problems with their ISP, network, device health and more.

Why Teams call analytics are critical to your entire business

panagenda

AWS Community Day CPH - Three problems of Terraform

Andrey Devyatkin

In the thrilling conclusion to 2023, ransomware groups had a banner year, really outdoing themselves in the "make everyone's life miserable" department. LockBit 3.0 took gold in the hacking olympics, followed by the plucky upstarts Clop and ALPHV/BlackCat. Apparently, 48% of organizations were feeling left out and decided to get in on the cyber attack action. Business services won the "most likely to get digitally mugged" award, with education and retail nipping at their heels. Hackers expanded their repertoire beyond boring old encryption to the much more exciting world of extortion. The US, UK and Canada took top honors in the "countries most likely to pay up" category. Bitcoins were the currency of choice for discerning hackers, because who doesn't love untraceable money?

Ransomware_Q4_2023. The report. [EN].pdf

Overkill Security

"I see eyes in my soup": How Delivery Hero implemented the safety system for ...

Zilliz

When you’re building (micro)services, you have lots of framework options. Spring Boot is no doubt a popular choice. But there’s more! Take Quarkus, a framework that’s considered the rising star for Kubernetes-native Java. It always depends on what's best for your situation, but how to choose the best solution if you're comparing 2 frameworks? Both Spring Boot and Quarkus have their positives and negatives. Let us compare the two by live coding a couple of common use cases in Spring Boot and Quarkus. After this talk, you’ll be ready to get started with Quarkus yourself, and know when to select Quarkus or Spring Boot.

Spring Boot vs Quarkus the ultimate battle - DevoxxUK

Jago de Vreede

Three things you will take away from the session: • How to run an effective tenant-to-tenant migration • Best practices for before, during, and after migration • Tips for using migration as a springboard to prepare for Copilot in Microsoft 365 Main ideas: Migration Overview: The presentation covers the current reality of cross-tenant migrations, the triggers, phases, best practices, and benefits of a successful tenant migration Considerations: When considering a migration, it is important to consider the migration scope, performance, customization, flexibility, user-friendly interface, automation, monitoring, support, training, scalability, data integrity, data security, cost, and licensing structure Next Wave: The next wave of change includes the launch of Copilot, which requires businesses to be prepared for upcoming changes related to Copilot and the cloud, and to consolidate data and tighten governance ShareGate: ShareGate can help with pre-migration analysis, configurable migration tool, and automated, end-user driven collaborative governance

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

sammart93

Angeliki Cooney has spent over twenty years at the forefront of the life sciences industry, working out of Wynantskill, NY. She is highly regarded for her dedication to advancing the development and accessibility of innovative treatments for chronic diseases, rare disorders, and cancer. Her professional journey has centered on strategic consulting for biopharmaceutical companies, facilitating digital transformation, enhancing omnichannel engagement, and refining strategic commercial practices. Angeliki's innovative contributions include pioneering several software-as-a-service (SaaS) products for the life sciences sector, earning her three patents. As the Senior Vice President of Life Sciences at Avenga, Angeliki orchestrated the firm's strategic entry into the U.S. market. Avenga, a renowned digital engineering and consulting firm, partners with significant entities in the pharmaceutical and biotechnology fields. Her leadership was instrumental in expanding Avenga's client base and establishing its presence in the competitive U.S. market.

Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...

Angeliki Cooney

Following the popularity of “Cloud Revolution: Exploring the New Wave of Serverless Spatial Data,” we’re thrilled to announce this much-anticipated encore webinar. In this sequel, we’ll dive deeper into the Cloud-Native realm by uncovering practical applications and FME support for these new formats, including COGs, COPC, FlatGeoBuf, GeoParquet, STAC, and ZARR. Building on the foundation laid by industry leaders Michelle Roby of Radiant Earth and Chris Holmes of Planet in the first webinar, this second part offers an in-depth look at the real-world application and behind-the-scenes dynamics of these cutting-edge formats. We will spotlight specific use-cases and workflows, showcasing their efficiency and relevance in practical scenarios. Discover the vast possibilities each format holds, highlighted through detailed discussions and demonstrations. Our expert speakers will dissect the key aspects and provide critical takeaways for effective use, ensuring attendees leave with a thorough understanding of how to apply these formats in their own projects. Elevate your understanding of how FME supports these cutting-edge technologies, enhancing your ability to manage, share, and analyze spatial data. Whether you’re building on knowledge from our initial session or are new to the serverless spatial data landscape, this webinar is your gateway to mastering cloud-native formats in your workflows.

Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME

Safe Software

The Good, the Bad and the Governed - Why is governance a dirty word? David O'Neill, Chief Operating Officer - APIContext Apidays New York 2024: The API Economy in the AI Era (April 30 & May 1, 2024) ------ Check out our conferences at https://www.apidays.global/ Do you want to sponsor or talk at one of our conferences? https://apidays.typeform.com/to/ILJeAaV8 Learn more on APIscene, the global media made by the community for the community: https://www.apiscene.io Explore the API ecosystem with the API Landscape: https://apilandscape.apiscene.io/

Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...

apidays

EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER

MadyBayot

[BuildWithAI] Introduction to Gemini.pdf

Sandro Moreira

AXA XL - Insurer Innovation Award Americas 2024

The Digital Insurer

Boost Fertility New Invention Ups Success Rates.pdf

sudhanshuwaghmare1

Sidekick Solutions uses Bonterra Impact Management (fka Social Solutions Apricot) and automation solutions to integrate data for business workflows. We believe integration and automation are essential to user experience and the promise of efficient work through technology. Automation is the critical ingredient to realizing that full vision. We develop integration products and services for Bonterra Case Management software to support the deployment of automations for a variety of use cases. This video focuses on the deployment of external web forms using Jotform for Bonterra Impact Management. This solution can be customized to your organization’s needs and deployed to support the common use cases below: - Intake and consent - Assessments - Surveys - Applications - Program registration Interested in deploying web form automations for Bonterra Impact Management? Contact us at sales@sidekicksolutionsllc.com to discuss next steps.

Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...

Jeffrey Haguewood

Effective data discovery is crucial for maintaining compliance and mitigating risks in today's rapidly evolving privacy landscape. However, traditional manual approaches often struggle to keep pace with the growing volume and complexity of data. Join us for an insightful webinar where industry leaders from TrustArc and Privya will share their expertise on leveraging AI-powered solutions to revolutionize data discovery. You'll learn how to: - Effortlessly maintain a comprehensive, up-to-date data inventory - Harness code scanning insights to gain complete visibility into data flows leveraging the advantages of code scanning over DB scanning - Simplify compliance by leveraging Privya's integration with TrustArc - Implement proven strategies to mitigate third-party risks Our panel of experts will discuss real-world case studies and share practical strategies for overcoming common data discovery challenges. They'll also explore the latest trends and innovations in AI-driven data management, and how these technologies can help organizations stay ahead of the curve in an ever-changing privacy landscape.

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

TrustArc

Kürzlich hochgeladen (20)

Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024

Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...

MS Copilot expands with MS Graph connectors

Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf

Exploring Multimodal Embeddings with Milvus

Why Teams call analytics are critical to your entire business

AWS Community Day CPH - Three problems of Terraform

Ransomware_Q4_2023. The report. [EN].pdf

"I see eyes in my soup": How Delivery Hero implemented the safety system for ...

Spring Boot vs Quarkus the ultimate battle - DevoxxUK

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

Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...

Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME

Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...

EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER

[BuildWithAI] Introduction to Gemini.pdf

AXA XL - Insurer Innovation Award Americas 2024

Boost Fertility New Invention Ups Success Rates.pdf

Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...

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

Progressive Enhancement

1. Progressive Enhancement

2. Hello. Zach Leatherman Front End Engineer est. 1998 UI “Architect” at Union Paciﬁc Railroad Web 3.0, 6 Bladed Razors, 7 Minute Abs: 849K Pageviews, 1.3K RSS subscribers BigText jQuery Plugin Author Omaha Startup Weekend: GiftBright and CallSpinner No afﬁliation: @zachleat http://zachleat.com

3. Problem?

5. WEB BROWSERS

6. 3.6, 4, 5

7. Fennec

8. Camino

9. Flock SeaMonkey K-Meleon

10. MicroB

11. 4, 5 http://www.quirksmode.org/blog/archives/2009/10/there_is_no_web.html

12. 11, 12

13. Konqueror

14.

15.