This document discusses HTML5 on mobile devices. It begins by explaining why mobile web is growing and why HTML5 is well-suited for mobile. It then provides an overview of what HTML5 is and examples of features like forms, multimedia, geolocation that can be used on mobile. It also discusses considerations for mobile web development like responsive design and frameworks. The document recommends tools for mobile debugging and testing performance.
"Mobile themes for Wordpress, QR codes, and custom shortURLs". Delivered by Chris Traganos, Web Developer at Harvard Public Affairs & Communications, on May 18th, 2010 at Lamont Library, Forum Room.
"Mobile themes for Wordpress, QR codes, and custom shortURLs". Delivered by Chris Traganos, Web Developer at Harvard Public Affairs & Communications, on May 18th, 2010 at Lamont Library, Forum Room.
Dethroning Grunt: Simple and Effective Builds with gulp.jsJay Harris
Grunt is king. It is the ubiquitous task runner used for most nodejs projects and has quickly expanded to conquer other software ecosystems. However, its kingdom is vulnerable. Grunt does not align well with many nodejs paradigms and is notorious for its harsh learning curve. Meet Gulp, the challenger in the taskrunner revolution. Gulp’s easy configuration produces an easy learning curve, and its alignment with nodejs paradigms eliminates the friction. Grab your ticket, your foam finger, and your team-colored face paint and witness the battle, the revolution, and the crowning of Gulp.
What Web Developers Need to Know to Develop Windows 8 AppsDoris Chen
You already have a Web app on the Internet and want to reach customers with a new, targeted experience on Windows 8. Come get practical guidance and best practices on how to reuse your Web assets. Come dive into the specifics of this exciting platform and see how you can use your Web skills to build deeply-integrated Windows apps.
◦You’ll discover how this mirrors or differs from traditional Web programming and how to harness the rich capabilities of Windows 8 through JavaScript and the Windows Runtime.
◦You'll learn practical techniques on how to access a web service, how to work with camera, and how to make live tiles, etc.
◦Expect a lot of code and demo.
This session will jump start you with everything you need to know to start building Windows 8 apps with the skills you already have.
Slides from my talk discussing my experience rebuilding a video player I previously developed in Flash. I gave this talk on March 18th, at the Brisbane Web Design Meetup.
PrimeFaces, JavaServer Faces icin gelistirllen ve dunya capinda populer olan zengin bir arayuz kutuphanesidir. Bu sunumda PrimeFaces Bilesenleri, Mobil, Ajax Push, Tema Destegi gibi modullerin yani sira PrimeFaces ekibinin gelistirdigi yeni jQuery javascript kutuphanesi PrimeUI'da tanitilmaktadir.
Consórcio realiza consta da relação das administradoras de consórcios autoriz...Jessica R.
FONTE: INSTITUIÇÕES FINANCEIRAS (O TEOR DAS INFORMAÇÕES É DE RESPONSABILIDADE DA RESPECTIVA INSTITUIÇÃO/EMPRESA, DE ACORDO COM A REGULAMENTAÇÃO EM VIGOR)
Dethroning Grunt: Simple and Effective Builds with gulp.jsJay Harris
Grunt is king. It is the ubiquitous task runner used for most nodejs projects and has quickly expanded to conquer other software ecosystems. However, its kingdom is vulnerable. Grunt does not align well with many nodejs paradigms and is notorious for its harsh learning curve. Meet Gulp, the challenger in the taskrunner revolution. Gulp’s easy configuration produces an easy learning curve, and its alignment with nodejs paradigms eliminates the friction. Grab your ticket, your foam finger, and your team-colored face paint and witness the battle, the revolution, and the crowning of Gulp.
What Web Developers Need to Know to Develop Windows 8 AppsDoris Chen
You already have a Web app on the Internet and want to reach customers with a new, targeted experience on Windows 8. Come get practical guidance and best practices on how to reuse your Web assets. Come dive into the specifics of this exciting platform and see how you can use your Web skills to build deeply-integrated Windows apps.
◦You’ll discover how this mirrors or differs from traditional Web programming and how to harness the rich capabilities of Windows 8 through JavaScript and the Windows Runtime.
◦You'll learn practical techniques on how to access a web service, how to work with camera, and how to make live tiles, etc.
◦Expect a lot of code and demo.
This session will jump start you with everything you need to know to start building Windows 8 apps with the skills you already have.
Slides from my talk discussing my experience rebuilding a video player I previously developed in Flash. I gave this talk on March 18th, at the Brisbane Web Design Meetup.
PrimeFaces, JavaServer Faces icin gelistirllen ve dunya capinda populer olan zengin bir arayuz kutuphanesidir. Bu sunumda PrimeFaces Bilesenleri, Mobil, Ajax Push, Tema Destegi gibi modullerin yani sira PrimeFaces ekibinin gelistirdigi yeni jQuery javascript kutuphanesi PrimeUI'da tanitilmaktadir.
Consórcio realiza consta da relação das administradoras de consórcios autoriz...Jessica R.
FONTE: INSTITUIÇÕES FINANCEIRAS (O TEOR DAS INFORMAÇÕES É DE RESPONSABILIDADE DA RESPECTIVA INSTITUIÇÃO/EMPRESA, DE ACORDO COM A REGULAMENTAÇÃO EM VIGOR)
Perfil sociodemográfico de los internautas 2013 - ONTSIAritz Pérez
El informe “Perfil sociodemográfico del Internauta 2013” estudia a la población española en cuanto al número de internautas, frecuencia de uso de Internet, tipo de actividades realizadas por los usuarios en la Red ,así como la evolución de estos indicadores en los últimos años.
Además se recoge información sobre la intensidad de uso de Internet según ciertas características sociodemográficas de los españoles.
SIGRE se caracteriza por un modelo de funcionamiento singular, eficaz y eficiente. En él, participan todos los agentes del sector farmacéutico: laboratorios, farmacias y empresas de distribución.
The Newsletter Factory has been writing and designing company newsletters since 1987.
Organizations and companies have relied on the Newsletter Factory to assist them in “Producing Newsletters That Get Results.”
Comunicación presentada por G. Ibán de la Horra en el III Encuentro Buenas Prácticas TIC en educación, celebrado en el CITA el 16 de noviembre de 2013.
Presentación realizada por el Dr. Mauro A. Valles Cancela,
MIR IV HCUZ, en el marco de la I Jornada de actualización e innovación en Oncología que tuvo lugar en el CIBA en enero de 2015.
Making your site mobile-friendly - DevCSI Reading 21.07.2010Patrick Lauke
Extended version of my "Making your site mobile-friendly" talk, including a short look at native applications vs web apps, for the UKOLN DevCSI event "Developing for Mobile Applications in Education" in Reading http://www.ukoln.ac.uk/events/devcsi/mobile_applications/
Introduction to PhoneGap
Background
Setting up the environment for Android
Handling Events
Working With The Device, The Network, And Notifications
Getting Information from the Device
Determining the Connection Type
Using Notifications
Using Alerts
Using Confirmation Dialogs
Using Beeps
Using Vibrations
Accelerometer
Using the Acceleration Object
Using Accelerometer Methods
Media
The Media Object
Using Media Methods
Camera
Using The Camera Object
Using The Getpicture Method
Using Camera Options
Geolocation
Position, PositionError, Coord
Geolocation Methods
Geolocation Options
Deployment using Phonegap (Android)
Hands-on exercises
Storage
Available options
Db object
localStorage
Files
Filessystem
File read & write
Handling errors
Contacts
Creating contacts
Finding contacts
Handling errors
Capture
Video
Audio
Handling errors
Hands-on exercises
Introduction to PhoneGap
Background
Setting up the environment for Android
Handling Events
Working With The Device, The Network, And Notifications
Getting Information from the Device
Determining the Connection Type
Using Notifications
Using Alerts
Using Confirmation Dialogs
Using Beeps
Using Vibrations
Accelerometer
Using the Acceleration Object
Using Accelerometer Methods
Media
The Media Object
Using Media Methods
Camera
Using The Camera Object
Using The Getpicture Method
Using Camera Options
Geolocation
Position, PositionError, Coord
Geolocation Methods
Geolocation Options
Deployment using Phonegap (Android)
Hands-on exercises
Storage
Available options
Db object
localStorage
Files
Filessystem
File read & write
Handling errors
Contacts
Creating contacts
Finding contacts
Handling errors
Capture
Video
Audio
Handling errors
Hands-on exercises
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.
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdf91mobiles
91mobiles recently conducted a Smart TV Buyer Insights Survey in which we asked over 3,000 respondents about the TV they own, aspects they look at on a new TV, and their TV buying preferences.
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...DanBrown980551
Do you want to learn how to model and simulate an electrical network from scratch in under an hour?
Then welcome to this PowSyBl workshop, hosted by Rte, the French Transmission System Operator (TSO)!
During the webinar, you will discover the PowSyBl ecosystem as well as handle and study an electrical network through an interactive Python notebook.
PowSyBl is an open source project hosted by LF Energy, which offers a comprehensive set of features for electrical grid modelling and simulation. Among other advanced features, PowSyBl provides:
- A fully editable and extendable library for grid component modelling;
- Visualization tools to display your network;
- Grid simulation tools, such as power flows, security analyses (with or without remedial actions) and sensitivity analyses;
The framework is mostly written in Java, with a Python binding so that Python developers can access PowSyBl functionalities as well.
What you will learn during the webinar:
- For beginners: discover PowSyBl's functionalities through a quick general presentation and the notebook, without needing any expert coding skills;
- For advanced developers: master the skills to efficiently apply PowSyBl functionalities to your real-world scenarios.
DevOps and Testing slides at DASA ConnectKari Kakkonen
My and Rik Marselis slides at 30.5.2024 DASA Connect conference. We discuss about what is testing, then what is agile testing and finally what is Testing in DevOps. Finally we had lovely workshop with the participants trying to find out different ways to think about quality and testing in different parts of the DevOps infinity loop.
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...Ramesh Iyer
In today's fast-changing business world, Companies that adapt and embrace new ideas often need help to keep up with the competition. However, fostering a culture of innovation takes much work. It takes vision, leadership and willingness to take risks in the right proportion. Sachin Dev Duggal, co-founder of Builder.ai, has perfected the art of this balance, creating a company culture where creativity and growth are nurtured at each stage.
GraphRAG is All You need? LLM & Knowledge GraphGuy Korland
Guy Korland, CEO and Co-founder of FalkorDB, will review two articles on the integration of language models with knowledge graphs.
1. Unifying Large Language Models and Knowledge Graphs: A Roadmap.
https://arxiv.org/abs/2306.08302
2. Microsoft Research's GraphRAG paper and a review paper on various uses of knowledge graphs:
https://www.microsoft.com/en-us/research/blog/graphrag-unlocking-llm-discovery-on-narrative-private-data/
"Impact of front-end architecture on development cost", Viktor TurskyiFwdays
I have heard many times that architecture is not important for the front-end. Also, many times I have seen how developers implement features on the front-end just following the standard rules for a framework and think that this is enough to successfully launch the project, and then the project fails. How to prevent this and what approach to choose? I have launched dozens of complex projects and during the talk we will analyze which approaches have worked for me and which have not.
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...James Anderson
Effective Application Security in Software Delivery lifecycle using Deployment Firewall and DBOM
The modern software delivery process (or the CI/CD process) includes many tools, distributed teams, open-source code, and cloud platforms. Constant focus on speed to release software to market, along with the traditional slow and manual security checks has caused gaps in continuous security as an important piece in the software supply chain. Today organizations feel more susceptible to external and internal cyber threats due to the vast attack surface in their applications supply chain and the lack of end-to-end governance and risk management.
The software team must secure its software delivery process to avoid vulnerability and security breaches. This needs to be achieved with existing tool chains and without extensive rework of the delivery processes. This talk will present strategies and techniques for providing visibility into the true risk of the existing vulnerabilities, preventing the introduction of security issues in the software, resolving vulnerabilities in production environments quickly, and capturing the deployment bill of materials (DBOM).
Speakers:
Bob Boule
Robert Boule is a technology enthusiast with PASSION for technology and making things work along with a knack for helping others understand how things work. He comes with around 20 years of solution engineering experience in application security, software continuous delivery, and SaaS platforms. He is known for his dynamic presentations in CI/CD and application security integrated in software delivery lifecycle.
Gopinath Rebala
Gopinath Rebala is the CTO of OpsMx, where he has overall responsibility for the machine learning and data processing architectures for Secure Software Delivery. Gopi also has a strong connection with our customers, leading design and architecture for strategic implementations. Gopi is a frequent speaker and well-known leader in continuous delivery and integrating security into software delivery.
UiPath Test Automation using UiPath Test Suite series, part 3DianaGray10
Welcome to UiPath Test Automation using UiPath Test Suite series part 3. In this session, we will cover desktop automation along with UI automation.
Topics covered:
UI automation Introduction,
UI automation Sample
Desktop automation flow
Pradeep Chinnala, Senior Consultant Automation Developer @WonderBotz and UiPath MVP
Deepak Rai, Automation Practice Lead, Boundaryless Group and UiPath MVP
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.
PHP Frameworks: I want to break free (IPC Berlin 2024)Ralf Eggert
In this presentation, we examine the challenges and limitations of relying too heavily on PHP frameworks in web development. We discuss the history of PHP and its frameworks to understand how this dependence has evolved. The focus will be on providing concrete tips and strategies to reduce reliance on these frameworks, based on real-world examples and practical considerations. The goal is to equip developers with the skills and knowledge to create more flexible and future-proof web applications. We'll explore the importance of maintaining autonomy in a rapidly changing tech landscape and how to make informed decisions in PHP development.
This talk is aimed at encouraging a more independent approach to using PHP frameworks, moving towards a more flexible and future-proof approach to PHP development.
2. Previous Slides
• HTML5 on Mobile – For Designer
http://www.slideshare.net/adamlu/html5-on-
mobilefor-designer
• HTML5 on Mobile – For Developer
http://www.slideshare.net/adamlu/html5-on-
mobilefor-developer
3. Today’s Topic
• Why we’re focusing on mobile web
• Why we’re using HTML5 on mobile
• What is HTML5
• What we can use HTML5 to do on
mobile(Large Coverage)
• What we should care about for mobile web
development
• Miscellaneous
5. Mobile is Growing
• In January 2012, 8.49 percent of website
hits/pageviews come from a handheld mobile
device (StatCounter)
• Mobile will be bigger than desktop internet in
5 years (Morgan Stanley)
• 2.1 billion mobile devices will have HTML5
browsers by 2016 up from 109 million in 2010
(ABI Research)
8. Web App vs Native App
Web App Native App Comparation
Just enter the URL Must be deployed or Installation/updates
downloaded
Access to web analytics. Apple Store, Android Monetization
Rate,SaaS based revenue Market, Rating
Progressive Enhancement Follow the standards End User Experience
GeoLocation, Offline camera, gyroscope, Access to hardware sensors
Storage, Canvas Graphics, microphone, compass,
Audio, Video, accelerometer, GPS
Camera(Android3.1+)
HTML5, CSS3, Javascript, UI Object-C, Java, C++, J2EE, Developer Experience
Library .NET, Cocoa Touch
Web Workers, Graphic Run directly on the metal, Performance
acceleration, WebGL GPU Acceleration, Multi-
Threading
10. HTML5 is Great for Mobile
• Do not need download to use Web App
• One Code base, all popular devices
• Tons of great HTML5 features are already
supported on modern browsers
19. HTML5 has been widely used on pc
web development
• http://www.cuttherope.ie/
• http://chrome.angrybirds.com/
• http://www.20thingsilearned.com/en-US
• ……
* We will not talk more about HTML5 on PC Web.
25. Offline Web Application Cache
• Method of defining web page files to be
cached using a cache manifest file, allowing
them to work offline on subsequent visits to
the page
<html window.applicationCache.addEventListen
manifest="/cache.manifest”> er('updateready', function(e) {
CACHE MANIFEST if (window.applicationCache.status ==
# version 1.0.0 window.applicationCache.UPDATEREADY{
NETWORK:
* window.applicationCache.swapCach();
CACHE: window.location.reload();
/js/*
/image/* }}, false);
FALLBACK:
http://www.w3.org/TR/html5/offline.html
26. Local Storage, Session Storage
• Web storage and DOM storage (document
object model) are web application software
methods and protocols used for storing data
in a web browser.
varfoo = localStorage.getItem(“bar”);
localStorage.setItem(“bar”, “foo”);
localStorage.clear();
sessionStorage.setItem(‘a’, ‘1’);
sessionStorage.removeItem(‘a’);
window.addEventListener(“storage”, ha
ndle_storage, false);
http://dev.w3.org/html5/webstorage/
32. Web Sockets
• W3C/IETF Standard
• Real-time, low latency, true full-duplex
communication channel
• Build on top of HTTP, sharing ports with existing
HTTP content, use ws: and wss: schemes
• Only small overhead for text messages, reducing
bandwidth
conn = new WebSocket('ws://node.remysharp.com:8001');
conn.onopen= function (envent) {conn.send(‘hello’);};
conn.onmessage= function (event) {};
conn.onclose= function (event) {};
http://html5demos.com/web-socket
33. Server-Sent Events
• Open an HTTP connection for receiving push notifications
from a server in the form of DOM events.
• Standardize sending a continuous stream of data from
server to browser
• The API is designed such that it can be extended to work
with other push notification schemes such as Push SMS.
Client: Server:
var source = new EventSource("url"); res.writeHead(200, {"Content‐Type":
source.onmessage = function(event) { "text/event‐stream"});
alert(event.data); res.write(“data: ” + JSON.stringify(stuff)
} +”n”);res.flush();
http://dev.w3.org/html5/eventsource/
35. Cross-document messaging
• Enables secure cross-origin communication
across iframes, tabs and windows
• Uses Origin security
window.addEventListner("message", message
Handler, true);
function messageHandler(e){
if(e.origin== 'http://www.yahoo.com'){
processMessage(e.data);
}
//ignore message if origin not recognized
}
http://dev.w3.org/html5/postmsg/
36. Cross-Origin Resource Sharing
• Defines a mechanism to enable client-side cross-
origin requests. Specifications that enable an API
to make cross-origin requests to resources can
use the algorithms defined by this specification. If
such an API is used on http://example.org
resources, a resource on http://hello-
world.examplecan opt in using the mechanism
described by this specification (e.g., specifying
Access-Control-Allow-Origin: http://example.org
as response header), which would allow that
resource to be fetched cross-origin from
http://example.org.
http://www.w3.org/TR/cors/
41. Canvas
• 2D drawing platform within the browser
• Use nothing more than JavaScript and HTML –
no plugins
• Extensible through a JavaScript API
<canvas id="a" width="300" height="225"></canvas>
vara_canvas = document.getElementById("a");
vara_context = a_canvas.getContext("2d");
a_context.lineWidth = 5;
a_context.strokeStyle = ‘rgba(244, 34, 23, .8)’;
a_context.fillRect(50, 25, 150, 100);
a_context.stroke();
http://jacebook.co.uk/share/html5/
42. WebGL
• Javascript Binding for OpenGL ES 2.0 on
Browser
• Run as a specific context for the HTML
<canvas> element, which gives you access to
hardware-accelerated 3D rendering in
JavaScript.
• Allow developers to put real-time interactive
3D graphics in the browser.
http://mrdoob.github.com/three.js/ a lightweight 3D engine
43. SVG
• Method of displaying basic Vector Graphics
features using the embed or object elements
* SVG isn’t part of HTML5
45. Web Workers
• Scripts running in background
• Heavy Weight Scripts
var worker = new Worker('doWork.js'); doWorker.js
worker.addEventListener('message', functi
on(e) { self.addEventListner(‘message’, functio
console.log('Worker said: ', e.data); n(e){
}, false); self.postMessage(e.data+’ Worker
worker.postMessage('Hello World'); // says: Hello’);
Send data to our worker
worker.onerror= function(e){} },
worker.terminate(); false);
http://dev.w3.org/html5/workers/
46. History API
• The DOM window object provides access to
the browser's history through the history
object. It exposes useful methods and
properties that let you move back and forth
through the user's history
window.history.pushState(data, title, url);//Add one history state into browser
history and update the URL in the browser window.
window.history.replaceState(state, title, url);//Modify the current history entry
instead of creating a new one.
window.onpopstate = function(e){e.state;};//A popstate event is dispatched to
the window every time the active history entry changes.
http://html5demos.com/history
51. Mobile-First Responsive Design
• Responsive Web design is the approach that
suggests that design and development should
respond to the user’s behavior and
environment based on screen size, platform
and orientation.
http://www.alistapart.com/articles/responsive-web-design/
64. Inspiration
• http://mobile-patterns.com/ - Mobile UI
Patterns
• http://pttrns.com- Another gallery of Mobile
UI
• http://mobileawesomeness.com- the best in
mobile web design and developer news.
Develop in HTML5 for mobile devices namely deploy roughly the same code based on all HTML5-ready phones
Giving meaning to structure, semantics are front and center with HTML5. A richer set of tags, along with RDFa, microdata, and microformats, are enabling a more useful, data driven web for both programs and your users.
Web Apps can start faster and work even if there is no internet connection, thanks to the HTML5 App Cache, as well as the Local Storage, Indexed DB, and the File API specifications.
Beginning with the Geolocation API, Web Applications can present rich, device-aware features and experiences. Incredible device access innovations are being developed and implemented, from audio/video input access to microphones and cameras, to local data such as contacts & events, and even tilt orientation.
More efficient connectivity means more real-time chats, faster games, and better communication. Web Sockets and Server-Sent Events are pushing (pun intended) data between client and server more efficiently than ever before.
Audio and video are first class citizens in the HTML5 web, living in harmony with your apps and sites. Lights, camera, action!
Between SVG, Canvas, WebGL, and CSS3 3D features, you're sure to amaze your users with stunning visuals natively rendered in the browser.
Make your Web Apps and dynamic web content faster with a variety of techniques and technologies such as Web Workers and XMLHttpRequest 2. No user should ever wait on your watch.
CSS3 delivers a wide range of stylization and effects, enhancing the web app without sacrificing your semantic structure or performance. Additionally Web Open Font Format (WOFF) provides typographic flexibility and control far beyond anything the web has offered before.