The document discusses what makes for "good" JavaScript from a developer perspective. It argues that good JavaScript should be understandable, reusable, extensible, optimized, secure, internationalized, optional, and accessible. It provides examples and recommendations for each of these qualities, such as using clear naming and documentation to improve understandability, writing code in a modular and structured way to improve reusability, and using frameworks to avoid reinventing patterns. It also discusses performance optimizations like reducing DOM reflows and different techniques for modifying the DOM efficiently.
Let Grunt do the work, focus on the fun! [Open Web Camp 2013]Dirk Ginader
Google’s Dirk Ginader thinks great developers are lazy, and there’s nothing wrong with that. After all, would you rather spend your time working on the mundane stuff — like minification, linting, compilation, unit testing, etc — or actually developing your code?
In this presentation, Dirk will show you how to set up the Grunt JavaScript Task Runner so that you and your team can focus on the fun!
jQuery For Beginners - jQuery Conference 2009Ralph Whitbeck
The first part of a three part beginner track, this talk is for the designer/developer that is just starting out with jQuery. Perhaps you’ve heard of jQuery or you’ve used it occasion- ally, this talk will help you understand the core jQuery library.
We will:
•Cover jQuery’s history
•Introduce you to the core team
•Explain how jQuery works
•Demonstrate how to set-up jQuery
•Explore core jQuery methods and structure • Look through a couple of real-world examples
Last year, AOL adopted a new content strategy and has positioned itself as a premier destination for original content. Core to this strategy is having reusable, highly efficient and optimized common code and experiences at scale, which is where jQuery comes in. Check in with Dave Artz to see how jQuery has helped his front-end standards team tackle unique challenges like optimizing 3rd party widget performance, overriding plugin functionality, and managing dependencies and updates across 100+ sites spanning multiple back-end platforms.
Let Grunt do the work, focus on the fun! [Open Web Camp 2013]Dirk Ginader
Google’s Dirk Ginader thinks great developers are lazy, and there’s nothing wrong with that. After all, would you rather spend your time working on the mundane stuff — like minification, linting, compilation, unit testing, etc — or actually developing your code?
In this presentation, Dirk will show you how to set up the Grunt JavaScript Task Runner so that you and your team can focus on the fun!
jQuery For Beginners - jQuery Conference 2009Ralph Whitbeck
The first part of a three part beginner track, this talk is for the designer/developer that is just starting out with jQuery. Perhaps you’ve heard of jQuery or you’ve used it occasion- ally, this talk will help you understand the core jQuery library.
We will:
•Cover jQuery’s history
•Introduce you to the core team
•Explain how jQuery works
•Demonstrate how to set-up jQuery
•Explore core jQuery methods and structure • Look through a couple of real-world examples
Last year, AOL adopted a new content strategy and has positioned itself as a premier destination for original content. Core to this strategy is having reusable, highly efficient and optimized common code and experiences at scale, which is where jQuery comes in. Check in with Dave Artz to see how jQuery has helped his front-end standards team tackle unique challenges like optimizing 3rd party widget performance, overriding plugin functionality, and managing dependencies and updates across 100+ sites spanning multiple back-end platforms.
Drush - use full power - DrupalCamp Donetsk 2014Alex S
Drush - незаменимый инструмент для Drupal разработчика. Если вы досихпор не используете этот замечательный инструмент либо пользуетесь только малой частью команд - этот доклад будет очень полезен для вас.
Ten practical ways to improve front-end performanceAndrew Rota
Conference talk presented at PHP South Coast 2017. Ten concrete ways to improve web performance, split between quick tactical wins and longer-term overarching strategies.
Drupal 8 leverages Assetic for managing Javascript and CSS assets. This library abstracts the headaches of integrating with the burgeoning universe of asset pre-processors and optimization tools available to the modern developer.
The lead developer of Assetic will give a tour of the library and discuss the current state of the project, its strengths, and its weaknesses, and also touch on the future: Assetic 2.0.
Drush - use full power - DrupalCamp Donetsk 2014Alex S
Drush - незаменимый инструмент для Drupal разработчика. Если вы досихпор не используете этот замечательный инструмент либо пользуетесь только малой частью команд - этот доклад будет очень полезен для вас.
Ten practical ways to improve front-end performanceAndrew Rota
Conference talk presented at PHP South Coast 2017. Ten concrete ways to improve web performance, split between quick tactical wins and longer-term overarching strategies.
Drupal 8 leverages Assetic for managing Javascript and CSS assets. This library abstracts the headaches of integrating with the burgeoning universe of asset pre-processors and optimization tools available to the modern developer.
The lead developer of Assetic will give a tour of the library and discuss the current state of the project, its strengths, and its weaknesses, and also touch on the future: Assetic 2.0.
CSS3 Media Queries: Mobile Elixir or CSS Snake Oiljameswillweb
CSS Media Queries have received a justifiable amount of hype lately. However, do they really represent a new way to take your web content mobile or do they promise more than they deliver? In this session lynda.com senior author James Williamson breaks down media queries, how to use them, and where they belong in your mobile development medicine chest.
Almost all Browsers allow you to install Extensions/Add-ons to make them more powerful by adding new functionality. Dirk Ginader will show you how he built build such an Browser extension to add a feature all modern Browsers lack, and how you can do the same by using basic web technologies and how to make them run in every Browser.
Future-proof Development for Classic SharePointBob German
This talk explains how to build headers and footers that work in both SharePoint "modern" (SharePoint Framework) and Classic pages. This work is from Julie Turner and me (Bob German)
Performance Optimization and JavaScript Best PracticesDoris Chen
Performance optimization and JavaScript best practices tips are discussed in the talk. Here are some of the tips:
Put stylesheets at the top (css)
Move scripts to the bottom (javascript)
Provide a clean separation of content, CSS, and JavaScript
De-reference unused objects
Think Asynchronous
Working with Objects
Defer Loading Resources
Use JSLint -- Code Quality Tool
Reduce the size of JavaScript file
gzip
General JavaScript Coding Best Practices
Use === Instead of ==
Eval = Bad
Don’t Use Short-Hand
Reduce Globals: Namespace
Don't Pass a String to "SetInterval" or "SetTimeOut"
Use {} Instead of New Object()
Use [] Instead of New Array()
This prentation describes quality in the context of commonly understood (but under-appreciated) Unix programming best practices in three general categories.
Transparency: The ease with which a script can be understood by reading the code
Clear communication: How well the script informs the user of its activities
Scalability: Whether the script can be used across the enterprise without intervention
Similar to Javascript done right - Open Web Camp III (20)
The accessibility features of Yahoo! FinanceDirk Ginader
Yahoo! Finance, the largest financial site, features accessible tools to control your finances. Learn how to use these tools and what makes them accessible.
Javascript auf Client und Server mit node.js - webtech 2010Dirk Ginader
node.js erlaubt die Ausführung von Javascript auf dem Server. Zusammen mit YUI3 gibt es jetzt auch noch einen echten DOM und plötzlich macht alles Spass :-)
the 5 layers of web accessibility - Open Web Camp IIDirk Ginader
Dirk Ginader, part of the Yahoo! Accessibility Taskforce, will talk about the “5 Layers of Web Accessibility”. He extents the commonly known 3 layers model consisting of HTML, CSS and JavaScript with 2 new layers for more accessibility. He shows how easy it can be to make a website or web application more accessible by following simple rules.
see:
http://openwebcamp.org/agenda/#5_layers_of_accessibility
Das Web Als Datenbank Mit Yql Und PipesDirk Ginader
In der Zeit von Mashups und Hacks ist nichts wichtiger als Daten. Mithilfe der richtigen Werkzeuge kann einfach das ganze Internet als standardisierte Datenquelle genutzt werden. Dirk Ginader zeigt uns, wie man mit Yahoo! Pipes und YQL einfach und komfortabel alles vom RSS Feed bis zur HTML-Seite als API nutzen, vermischen und damit Neues erzeugen kann. Nie war es einfacher, umfangreiche datengetriebene Applikationen zu erstellen als heute.
http://it-republik.de/konferenzen/webtech09/speaker/#4386
Die 5 Ebenen Barriererfreier Web EntwicklungDirk Ginader
Es ist ein weit verbreiteter Irrglaube, dass JavaScript und Barrierefreiheit sich ausschließen würden. Assistive Technologien können sehr wohl mit JavaScript umgehen. Richtig angewandt, kann JavaScript nicht nur zugänglich sein, sondern sogar helfen, Barrieren weiter zu reduzieren. Man muss aber einige Regeln dabei beachten. Dirk Ginader sagt uns, welche das sind und zeigt uns, wie man JavaScript dazu nutzen kann, um eine Webseite für alle interessanter und nutzbarer zu machen.
http://it-republik.de/konferenzen/webtech09/speaker/#4386
In this month's YDN Tuesday Dirk Ginader, Web Developer and part of the Accessibility Task Force at Yahoo!, will talk about Web Accessibility.
Starting with basic markup and ending with accessible javascript and WAI ARIA he'll cover best practices and lots of tips and tricks to make your websites and web applications accessible to everyone.
Get more information about the event here:
http://skillsmatter.com/event/ajax-ria/web-accessibility
Transcript: Selling digital books in 2024: Insights from industry leaders - T...BookNet Canada
The publishing industry has been selling digital audiobooks and ebooks for over a decade and has found its groove. What’s changed? What has stayed the same? Where do we go from here? Join a group of leading sales peers from across the industry for a conversation about the lessons learned since the popularization of digital books, best practices, digital book supply chain management, and more.
Link to video recording: https://bnctechforum.ca/sessions/selling-digital-books-in-2024-insights-from-industry-leaders/
Presented by BookNet Canada on May 28, 2024, with support from the Department of Canadian Heritage.
Neuro-symbolic is not enough, we need neuro-*semantic*Frank van Harmelen
Neuro-symbolic (NeSy) AI is on the rise. However, simply machine learning on just any symbolic structure is not sufficient to really harvest the gains of NeSy. These will only be gained when the symbolic structures have an actual semantics. I give an operational definition of semantics as “predictable inference”.
All of this illustrated with link prediction over knowledge graphs, but the argument is general.
Generating a custom Ruby SDK for your web service or Rails API using Smithyg2nightmarescribd
Have you ever wanted a Ruby client API to communicate with your web service? Smithy is a protocol-agnostic language for defining services and SDKs. Smithy Ruby is an implementation of Smithy that generates a Ruby SDK using a Smithy model. In this talk, we will explore Smithy and Smithy Ruby to learn how to generate custom feature-rich SDKs that can communicate with any web service, such as a Rails JSON API.
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024Tobias Schneck
As AI technology is pushing into IT I was wondering myself, as an “infrastructure container kubernetes guy”, how get this fancy AI technology get managed from an infrastructure operational view? Is it possible to apply our lovely cloud native principals as well? What benefit’s both technologies could bring to each other?
Let me take this questions and provide you a short journey through existing deployment models and use cases for AI software. On practical examples, we discuss what cloud/on-premise strategy we may need for applying it to our own infrastructure to get it to work from an enterprise perspective. I want to give an overview about infrastructure requirements and technologies, what could be beneficial or limiting your AI use cases in an enterprise environment. An interactive Demo will give you some insides, what approaches I got already working for real.
Software Delivery At the Speed of AI: Inflectra Invests In AI-Powered QualityInflectra
In this insightful webinar, Inflectra explores how artificial intelligence (AI) is transforming software development and testing. Discover how AI-powered tools are revolutionizing every stage of the software development lifecycle (SDLC), from design and prototyping to testing, deployment, and monitoring.
Learn about:
• The Future of Testing: How AI is shifting testing towards verification, analysis, and higher-level skills, while reducing repetitive tasks.
• Test Automation: How AI-powered test case generation, optimization, and self-healing tests are making testing more efficient and effective.
• Visual Testing: Explore the emerging capabilities of AI in visual testing and how it's set to revolutionize UI verification.
• Inflectra's AI Solutions: See demonstrations of Inflectra's cutting-edge AI tools like the ChatGPT plugin and Azure Open AI platform, designed to streamline your testing process.
Whether you're a developer, tester, or QA professional, this webinar will give you valuable insights into how AI is shaping the future of software delivery.
Securing your Kubernetes cluster_ a step-by-step guide to success !KatiaHIMEUR1
Today, after several years of existence, an extremely active community and an ultra-dynamic ecosystem, Kubernetes has established itself as the de facto standard in container orchestration. Thanks to a wide range of managed services, it has never been so easy to set up a ready-to-use Kubernetes cluster.
However, this ease of use means that the subject of security in Kubernetes is often left for later, or even neglected. This exposes companies to significant risks.
In this talk, I'll show you step-by-step how to secure your Kubernetes cluster for greater peace of mind and reliability.
JMeter webinar - integration with InfluxDB and GrafanaRTTS
Watch this recorded webinar about real-time monitoring of application performance. See how to integrate Apache JMeter, the open-source leader in performance testing, with InfluxDB, the open-source time-series database, and Grafana, the open-source analytics and visualization application.
In this webinar, we will review the benefits of leveraging InfluxDB and Grafana when executing load tests and demonstrate how these tools are used to visualize performance metrics.
Length: 30 minutes
Session Overview
-------------------------------------------
During this webinar, we will cover the following topics while demonstrating the integrations of JMeter, InfluxDB and Grafana:
- What out-of-the-box solutions are available for real-time monitoring JMeter tests?
- What are the benefits of integrating InfluxDB and Grafana into the load testing stack?
- Which features are provided by Grafana?
- Demonstration of InfluxDB and Grafana using a practice web application
To view the webinar recording, go to:
https://www.rttsweb.com/jmeter-integration-webinar
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...UiPathCommunity
💥 Speed, accuracy, and scaling – discover the superpowers of GenAI in action with UiPath Document Understanding and Communications Mining™:
See how to accelerate model training and optimize model performance with active learning
Learn about the latest enhancements to out-of-the-box document processing – with little to no training required
Get an exclusive demo of the new family of UiPath LLMs – GenAI models specialized for processing different types of documents and messages
This is a hands-on session specifically designed for automation developers and AI enthusiasts seeking to enhance their knowledge in leveraging the latest intelligent document processing capabilities offered by UiPath.
Speakers:
👨🏫 Andras Palfi, Senior Product Manager, UiPath
👩🏫 Lenka Dulovicova, Product Program Manager, UiPath
The Art of the Pitch: WordPress Relationships and SalesLaura Byrne
Clients don’t know what they don’t know. What web solutions are right for them? How does WordPress come into the picture? How do you make sure you understand scope and timeline? What do you do if sometime changes?
All these questions and more will be explored as we talk about matching clients’ needs with what your agency offers without pulling teeth or pulling your hair out. Practical tips, and strategies for successful relationship building that leads to closing the deal.
Essentials of Automations: Optimizing FME Workflows with ParametersSafe Software
Are you looking to streamline your workflows and boost your projects’ efficiency? Do you find yourself searching for ways to add flexibility and control over your FME workflows? If so, you’re in the right place.
Join us for an insightful dive into the world of FME parameters, a critical element in optimizing workflow efficiency. This webinar marks the beginning of our three-part “Essentials of Automation” series. This first webinar is designed to equip you with the knowledge and skills to utilize parameters effectively: enhancing the flexibility, maintainability, and user control of your FME projects.
Here’s what you’ll gain:
- Essentials of FME Parameters: Understand the pivotal role of parameters, including Reader/Writer, Transformer, User, and FME Flow categories. Discover how they are the key to unlocking automation and optimization within your workflows.
- Practical Applications in FME Form: Delve into key user parameter types including choice, connections, and file URLs. Allow users to control how a workflow runs, making your workflows more reusable. Learn to import values and deliver the best user experience for your workflows while enhancing accuracy.
- Optimization Strategies in FME Flow: Explore the creation and strategic deployment of parameters in FME Flow, including the use of deployment and geometry parameters, to maximize workflow efficiency.
- Pro Tips for Success: Gain insights on parameterizing connections and leveraging new features like Conditional Visibility for clarity and simplicity.
We’ll wrap up with a glimpse into future webinars, followed by a Q&A session to address your specific questions surrounding this topic.
Don’t miss this opportunity to elevate your FME expertise and drive your projects to new heights of efficiency.
Connector Corner: Automate dynamic content and events by pushing a buttonDianaGray10
Here is something new! In our next Connector Corner webinar, we will demonstrate how you can use a single workflow to:
Create a campaign using Mailchimp with merge tags/fields
Send an interactive Slack channel message (using buttons)
Have the message received by managers and peers along with a test email for review
But there’s more:
In a second workflow supporting the same use case, you’ll see:
Your campaign sent to target colleagues for approval
If the “Approve” button is clicked, a Jira/Zendesk ticket is created for the marketing design team
But—if the “Reject” button is pushed, colleagues will be alerted via Slack message
Join us to learn more about this new, human-in-the-loop capability, brought to you by Integration Service connectors.
And...
Speakers:
Akshay Agnihotri, Product Manager
Charlie Greenberg, Host
Key Trends Shaping the Future of Infrastructure.pdfCheryl Hung
Keynote at DIGIT West Expo, Glasgow on 29 May 2024.
Cheryl Hung, ochery.com
Sr Director, Infrastructure Ecosystem, Arm.
The key trends across hardware, cloud and open-source; exploring how these areas are likely to mature and develop over the short and long-term, and then considering how organisations can position themselves to adapt and thrive.
13. Understandable -> Documented
• Writing Docs isn’t fun
• Reading Code you wrote 5 years ago
and didn’t document is worse...
• Reading undocumented code
someone else wrote even more so...
14. Understandable -> Documented
• use clear variable and function
names:
– a = b(c) // Whut?
– user = getUserOfProduct(productId) // Alright!
• good comments
– // IE seems to break here...
– // dirty hack. This must never go live!
– // this works. No idea why. Better don’t touch.
15. Understandable -> Documented
• exceptionally good comments:
– YUI Doc: http://developer.yahoo.com/
yui/yuidoc/
– creates the YUI API Dos automatically
– simple Javadoc syntax
/**
* short description
* @method methodName
* @param {bool}
* @returm {type}
*/
16. Understandable -> Documented
• YUI Doc now even prettier thanks to
Carlo & Dana:
http://www.yuiblog.com/blog/
2010/10/01/yuidoc-dana-theme/
18. Understandable -> Structured
• CSS for Javascript
– <script>
document.documentElement.className += ' js';
</script>
<style>
.module{
/* with JS */
}
.js .module{
/* without JS */
}
</style>
19. Understandable -> Structured
• HTML for Javascript
– Mustache Templating Partials for
Ajax content
– /partials/login_success.html
– Hello {{user_name}}
You have sucesfully registered
Your currently have {{user_points}} points
– {
user_name : “dude”,
user_points : 123
}
– http://mustache.github.com/
20. Reusable
• find patterns
• largest common denominator
• when you’re writing a new
dropdown menu every month
something is very wrong...
• write ONE dropdown menu and keep
making it better
21. Reusable
• open source != “I’m giving it away
for free”
• open source == “I get free testers,
co-developers, fame and fortune”
• github is full of excellent code
• “FORK OFF” - make it better!
• a plugin for an existing library is a
great start
22. Reusable
• How do you write Javascript?
– jQuery, YUI and alike?
– all “pure”?
23. Reusable
• You’re using and understand just
one Javascript Framework?
– learn Javascript!
– look under the hood
– understand Errors
25. Reusable
• Javascript Frameworks/Libraries
help to
– not reinvent the wheel all over again
– keep Code fresh
– secure quality
– write modular applications rather than
“scripts”
26. Reusable
• “Standing on the Shoulders of
Giants”
• “Zwerge auf den Schultern von
Riesen”
• “nanos gigantium humeris
insidentes”
27. Extensible
•What is the most popular about jQuery?
- THE PLUGINS!
$.fn.extend({
accessibleTabs: function(config) {
return this.each(function() {
//...
}
}
});
$(".tabs").accessibleTabs();
28. Extensible
• Everything can have plugins!
• Tiny Form Validation script:
addValidator : function(name,func){
this.validators[name] = func;
}
this.addValidator('isText',function(el){
var filter = /^[a-zA-Z ]+$/;
return filter.test(el.get('value'));
});
if( !this.validators['isText'](el) ){ //error!}
30. Optimized for Development
• Good Development Code != good
Production Code
• Good for Development:
– granular code split over many files
• module / config / i18n / init / etc
– many comments
– examples
31. Optimized for Production
• Good Development Code != good
Production Code
• Good for Production:
– code combined into as few files as
possible
– comments and whitespace removed
– optional code-minification
32. Optimized for Production
• YUI Compressor
http://developer.yahoo.com/yui/
compressor/
• Google Closure Compiler
http://code.google.com/closure/
compiler/
33. Optimized for Performance
• Caching of DOM-accesses
var el = document.getElementById('bla');
• CSS is MUCH faster than JS when it’s
about changing the DOM
el.addClass('bla');
instead of
el.css({
width:'20px',
height:'20px',
...
});
34. Optimized for Performance
• reduce “reflows”
after every DOM-manipulation the
Browser needs to rerender!
• Changing CSS is usually faster than
changing the DOM
$('<style type="text/css"> a { color: red; } </
style>').appendTo('head');
35. Optimized for Performance
• changing the DOM using:
– classic DOM Methods:
el = document.getElementById('list');
l1 = document.createElement('li');
t1 = document.createTextNode('hello 1');
l2 = document.createElement('li');
t2 = document.createTextNode('hello 2');
l3 = document.createElement('li');
t3 = document.createTextNode('hello 3');
l1.appendChild(t1);
l2.appendChild(t2);
l3.appendChild(t3);
el.appendChild(t1).appendChild(t2).appendChild(t3);
36. Optimized for Performance
• changing the DOM using:
– innerHTML:
el = document.getElementById('list');
li = '<li>hallo 1</li>';
li += '<li>hallo 2</li>';
li += '<li>hallo 3</li>';
el.innerHTML = li;
– faster than DOM-Methods (thanks to IE)
37. Optimized for Performance
• changing the DOM using:
– innerHTML:
el = document.getElementById('list');
li = [];
li.push('<li>hallo 1</li>');
li.push('<li>hallo 2</li>');
li.push('<li>hallo 3</li>');
el.innerHTML = li.join('');
– even faster because string
concatenation in IE is slow
38. Optimized for Performance
• changing the DOM using:
– innerHTML:
el = document.getElementById('list');
li = [];
li[0] = '<li>hallo 1</li>';
li[1] = '<li>hallo 2</li>';
li[2] = '<li>hallo 3</li>';
el.innerHTML = li.join('');
– even faster as also array.push is slow
in IE...
39. Optimized for Performance
• changing the DOM using:
– DOM Fragment:
l = document.getElementById('list');
f = document.createDocumentFragment();
l1 = document.createElement('li');
t1 = document.createTextNode('hallo 1');
...
l1.appendChild(t1);
l2.appendChild(t2);
l3.appendChild(t3);
f.appendChild(l1).appendChild(l2).appendChild(l3);
el.appendChild(f);
– Even faster! Just 1 DOM access!
40. Secure
• XSS is a massive security issue
• never echo user inputs
• filter inputs!
whitelisting not blacklisting
• define data types
• trust nothing and nobody
• be paranoid...
41. Secure
• Caja
http://en.wikipedia.org/wiki/
Caja_project
• “virtual iFrames”
• no direct access to native objects
• Transpiler on the Server
• YUI3 1st Javascript Library being
compatible
42. International/Multilingual
• UTF-8
• RTL/Bidi
• If possible reuse strings that are in
the HTML already
• Use standards
– Text {0} more text {1} yet more text {2}
Text {0:currency} more text {1:symbol} even
more text {2:amount} // {variable:comment}
43. International/Multilingual
• Variable sentence structure requires
multi step translation
– T_WELCOME : {
en_US:”We welcome {0:user}”
de_DE:”Wir heissen {0:user} willkommen”
}
– getText(‘de_DE’,‘T_WELCOME’,{user:”Dude”})
• check ISO Standards
• HTML in Strings isn’t ideal but
better than pseudo code
• bold = asian symbols unreadable
44. International/Multilingual
TRANSLATIONS = { // check http://internationalisationtips.com
O: "{market} open",
OT: "{market} open in {timePeriod}",
OE: "{market} open early",
OET: "{market} open early in {timePeriod}",
OER: "{market} open early for {reason}",
OERT: "{market} open early for {reason} in {timePeriod}",
OL: "{market} open late",
OLT: "{market} open late in {timePeriod}",
OLR: "{market} open late for {reason}",
OLRT: "{market} open late for {reason} in {timePeriod}",
C: "{market} close",
CT: "{market} close in {timePeriod}",
CE: "{market} close early",
CET: "{market} close early in {timePeriod}",
CER: "{market} close early for {reason}",
CERT: "{market} close early for {reason} in {timePeriod}",
CL: "{market} close late",
CLT: "{market} close late in {timePeriod}",
CLR: "{market} close late for {reason}",
CLRT: "{market} close late for {reason} in {timePeriod}",
X: "{market} closed"
};
45. Optional
• Progressive Enhancement
– Base functionality of the site needs to
be available even though the user
agent does not understand Javascript
– Mobile != iPhone (Opera Mini is No.1!)
• Search Machines
• Paranoid Sysadmins
• Y! has ~1% non-js Users -> Millions!
• ...
46. Optional
• base page has interaction thanks to:
– Links
– Forms
– (+ everything important is visible!)
• With Javascript:
– Links that update the page become
Buttons
– Forms are being processed instantly
– Infos can be hidden and shown
47. Accessible
• Tab order is super important
• using focus() we can direct the user
• tabindex=-1 makes everything
focusable (for Javascript)
• Ajax works but mind the load time
• update Virtual Buffer
48. Accessible
• some Effects can make the JS
Version more accessible
– yellow fade to temporary highlight
what changed
– animated open close is easier to
understand than a hard show/hide
49. Accessible
• WAI-ARIA
– maps UI Elements that are well known
on the Desktop to Elements in the
Browser
– teaches meaning to non-semantic
markup
50. Accessible
• WAI-ARIA
– proper realtime updates
• Live Regions
– real Form Validation state
• aria-required="true"
• aria-invalid="true"
– real Dialogs
• role="alert"