This document provides an overview and summary of Scalable Vector Graphics (SVG). It begins with a brief introduction to SVG concepts like basic shapes. It then discusses the history and evolution of SVG standards over time. It outlines how SVG is commonly used today in areas like logos, icons, charts and graphics. Examples are given of tools for editing, optimizing and automating SVG. Reasons for using SVG like crisp images, scriptability, animations and small file sizes are explained. The document discusses how SVG is used and its potential in Drupal. It concludes with an overview of the future SVG 2 standard and resources for learning more about SVG.
Slides for presentation at DrupalCon Munich August 2012
http://munich2012.drupal.org/program/sessions/backbonejs-frontend
Author: David Corbacho
http://corbacho.info
Developers keep hearing a lot about HTML5, but many don’t know what it actually means or is truly capable of. In this deep dive you will learn how to use HTML5 to solve existing challenges on the web and how to design and develop stunning HTML5 application. You will also preview HTML5 application runs cross platforms, in the desktop browsers as well as on the Phones. What will be covered in the session:
• Introduction to CSS3, Canvas, SVG, Video, and Audio
• What is the real potential of HTML5 using CSS3, Canvas, SVG, Video, Audio, and JavaScript?
• Canvas and SVG comparison, and when to use what
• Best Practices of writing good HTML5 application
• Come and see a collection of the best HTML5 application on Games, Videos, Movies, Comics, Travel, Music and Art
• Expect a lot of demos and code
Presentation and demo will be available at http://blogs.msdn.com/b/dorischen/
Vector Graphics on the Web: SVG, Canvas, CSS3Pascal Rettig
An overview of the current state of Vector graphics on the web, why we would want to use them, what the options are. Presented to the Boston Ruby group at the January 2011 meeting.
Sara Soueidan: Styling and Animating Scalable Vector Graphics with CSS [CSSCo...Guillaume Kossi
Scalable Vector Graphics, or SVGs, are the new "big thing" in web design today, and for a good reason. With the proliferation of retina screens and high resolution displays, we need to adopt techniques that allow us to serve graphics that look good on all screens in all circumstances, and because SVGs offer resolution-independent, fully scalable and crystal clear graphics, it is safe to say that they are the future graphics format of the web.
In this talk we're going to see how SVGs can be styled in CSS, and how they can be animated using CSS animations and transitions. We're also going to cover "responsifying" SVGs using CSS media queries, and how we can control the size and looks of SVGs allowing them to adapt to different screen sizes. We'll cover a short workflow from a vector graphics editor to a responsive animated graphic on screen.
Slides for presentation at DrupalCon Munich August 2012
http://munich2012.drupal.org/program/sessions/backbonejs-frontend
Author: David Corbacho
http://corbacho.info
Developers keep hearing a lot about HTML5, but many don’t know what it actually means or is truly capable of. In this deep dive you will learn how to use HTML5 to solve existing challenges on the web and how to design and develop stunning HTML5 application. You will also preview HTML5 application runs cross platforms, in the desktop browsers as well as on the Phones. What will be covered in the session:
• Introduction to CSS3, Canvas, SVG, Video, and Audio
• What is the real potential of HTML5 using CSS3, Canvas, SVG, Video, Audio, and JavaScript?
• Canvas and SVG comparison, and when to use what
• Best Practices of writing good HTML5 application
• Come and see a collection of the best HTML5 application on Games, Videos, Movies, Comics, Travel, Music and Art
• Expect a lot of demos and code
Presentation and demo will be available at http://blogs.msdn.com/b/dorischen/
Vector Graphics on the Web: SVG, Canvas, CSS3Pascal Rettig
An overview of the current state of Vector graphics on the web, why we would want to use them, what the options are. Presented to the Boston Ruby group at the January 2011 meeting.
Sara Soueidan: Styling and Animating Scalable Vector Graphics with CSS [CSSCo...Guillaume Kossi
Scalable Vector Graphics, or SVGs, are the new "big thing" in web design today, and for a good reason. With the proliferation of retina screens and high resolution displays, we need to adopt techniques that allow us to serve graphics that look good on all screens in all circumstances, and because SVGs offer resolution-independent, fully scalable and crystal clear graphics, it is safe to say that they are the future graphics format of the web.
In this talk we're going to see how SVGs can be styled in CSS, and how they can be animated using CSS animations and transitions. We're also going to cover "responsifying" SVGs using CSS media queries, and how we can control the size and looks of SVGs allowing them to adapt to different screen sizes. We'll cover a short workflow from a vector graphics editor to a responsive animated graphic on screen.
An overview of DojoX GFX and DojoX Drawing, and the underlying technology that uses SVG and VML to provide vector-based graphics cross-browser without the use of Flash.
An introduction and demonstration of graphics and animation techniques using canvas and CSS3 working in concert in webkit with html5. Targeted for Palm webOS devices, but compatible with other webkit implementations.
The Modern Java Web Developer - JavaOne 2013Matt Raible
HTML5, CSS3, JavaScript, jQuery, Angular JS, Bootstrap, Mobile, CoffeeScript, GitHub, functional programming, Page Speed, Apache, JSON with Jackson, caching, REST, Security, load testing, profiling, Wro4j, Heroku, Cloudbees, AWS. These are just some of the buzzwords that a Java web developer hears on a daily basis. This talk is designed to expose you to a plethora of technologies that you might've heard about, but haven't learned yet. We'll concentrate on the most important web developer skills, as well as UI tips and tricks to make you a better front-end engineer. Some of the most valuable engineers these days have front-end JS/CSS skills, as well as backend Java skills.
Java Web Application Security - Denver JUG 2013Matt Raible
During this presentation, you'll learn how to implement authentication in your Java web applications using good ol' Java EE 6 Security, Spring Security and Apache Shiro. You'll also learn how to secure your REST API with OAuth and lock it down with SSL.
After learning how to integrate security, I'll show how to use Zed Attack Proxy to pentest your app and fix vulnerabilities.
Accessibility Hacks Wordcamp Manchester October 2018Graham Armfield
A bunch of small accessibility tweaks that WordPress theme builders can make to improve the accessibility of their products.
Contains a section on making SVG files accessible to screen reader users. And then some CSS techniques that can help trap accessibility gotchas when building themes, and for content authors when they preview posts or pages.
Angular or Backbone, which one you will use in your mobile app? How could you develop a mobile app across iOS, Android or windows devices? This talk will take an intimate look at two of today’s most popular frameworks, Angular and Backbone and explore their differences. We’ll show how Apache Cordova opens the world of mobile app development to web developers. In the session, we will demonstrate a “To Do” app using Angular and Backbone, with access to native device capabilities. We’ll compare the frameworks when transported to the world of mobile app development. Along the way, you'll also learn what kind of apps are best-suited for the hybrid architecture and when to make the switch from web app to mobile app.
HTML5: An Introduction To Next Generation Web DevelopmentTilak Joshi
This slideshow provides an introduction to HTML5. The target audience should have an understanding of web development, javascript, and previous standards of HTML. This tutorial contains a brief background on the language and an overview of the most popular features. Features covered include native audio/video support, geolocation, canvas, drawing API, web forms 2.0, drag and drop, and more. Also covered is backwards compatibility and section 508 compliance. Extras include polyfills, modernizr, and a brief introduction to CSS3. Enjoy!
jQuery: The World's Most Popular JavaScript Library Comes to XPagesTeamstudio
Whether you want to add some serious eye candy to your XPages Applications or just want to do more with less code, jQuery, the world’s most popular JavaScript framework can help you. Come to this webinar and find out how you can use some of the thousands of jQuery plugins, in harmony with Dojo, within your XPages applications to create a better experience not only for your users, but for you as a developer. In this webinar, we'll look at how jQuery works, how to add it to your XPages, and how a complete JavaScript beginner can take advantage of its power. We'll demonstrate many working examples -- and a sample database will be provided.
An overview of DojoX GFX and DojoX Drawing, and the underlying technology that uses SVG and VML to provide vector-based graphics cross-browser without the use of Flash.
An introduction and demonstration of graphics and animation techniques using canvas and CSS3 working in concert in webkit with html5. Targeted for Palm webOS devices, but compatible with other webkit implementations.
The Modern Java Web Developer - JavaOne 2013Matt Raible
HTML5, CSS3, JavaScript, jQuery, Angular JS, Bootstrap, Mobile, CoffeeScript, GitHub, functional programming, Page Speed, Apache, JSON with Jackson, caching, REST, Security, load testing, profiling, Wro4j, Heroku, Cloudbees, AWS. These are just some of the buzzwords that a Java web developer hears on a daily basis. This talk is designed to expose you to a plethora of technologies that you might've heard about, but haven't learned yet. We'll concentrate on the most important web developer skills, as well as UI tips and tricks to make you a better front-end engineer. Some of the most valuable engineers these days have front-end JS/CSS skills, as well as backend Java skills.
Java Web Application Security - Denver JUG 2013Matt Raible
During this presentation, you'll learn how to implement authentication in your Java web applications using good ol' Java EE 6 Security, Spring Security and Apache Shiro. You'll also learn how to secure your REST API with OAuth and lock it down with SSL.
After learning how to integrate security, I'll show how to use Zed Attack Proxy to pentest your app and fix vulnerabilities.
Accessibility Hacks Wordcamp Manchester October 2018Graham Armfield
A bunch of small accessibility tweaks that WordPress theme builders can make to improve the accessibility of their products.
Contains a section on making SVG files accessible to screen reader users. And then some CSS techniques that can help trap accessibility gotchas when building themes, and for content authors when they preview posts or pages.
Angular or Backbone, which one you will use in your mobile app? How could you develop a mobile app across iOS, Android or windows devices? This talk will take an intimate look at two of today’s most popular frameworks, Angular and Backbone and explore their differences. We’ll show how Apache Cordova opens the world of mobile app development to web developers. In the session, we will demonstrate a “To Do” app using Angular and Backbone, with access to native device capabilities. We’ll compare the frameworks when transported to the world of mobile app development. Along the way, you'll also learn what kind of apps are best-suited for the hybrid architecture and when to make the switch from web app to mobile app.
HTML5: An Introduction To Next Generation Web DevelopmentTilak Joshi
This slideshow provides an introduction to HTML5. The target audience should have an understanding of web development, javascript, and previous standards of HTML. This tutorial contains a brief background on the language and an overview of the most popular features. Features covered include native audio/video support, geolocation, canvas, drawing API, web forms 2.0, drag and drop, and more. Also covered is backwards compatibility and section 508 compliance. Extras include polyfills, modernizr, and a brief introduction to CSS3. Enjoy!
jQuery: The World's Most Popular JavaScript Library Comes to XPagesTeamstudio
Whether you want to add some serious eye candy to your XPages Applications or just want to do more with less code, jQuery, the world’s most popular JavaScript framework can help you. Come to this webinar and find out how you can use some of the thousands of jQuery plugins, in harmony with Dojo, within your XPages applications to create a better experience not only for your users, but for you as a developer. In this webinar, we'll look at how jQuery works, how to add it to your XPages, and how a complete JavaScript beginner can take advantage of its power. We'll demonstrate many working examples -- and a sample database will be provided.
The SlideShare 101 is a quick start guide if you want to walk through the main features that the platform offers. This will keep getting updated as new features are launched.
The SlideShare 101 replaces the earlier "SlideShare Quick Tour".
SVG is often used for content, linked icons, and buttons. Learn which coding methods perform best across a variety of screen reader and browser combinations. By @DennisL
Vskills certification for SVG Professional assesses the candidate as per the company’s need for scalable vector graphics development. The certification tests the candidates on various areas in Coordinates, Document Structure, Shapes, Paths, Coordinate System, Patterns, Gradients, Clipping, Masking, Animating and Scripting SVG.
Revised version of my presentation - first delivered to WordCamp Manchester in 2019.
Presentation looks at some small tweaks to HTML and CSS that can make your site a little more accessible.
Covers: SVG images, screen reader text, some CSS to help when building your web templates/themes, and some CSS that can help show your content authors where they may have made some accessibility mistakes.
This presentation talks about an Ekino (www.ekino.com) application made for Microsoft Techdays 2012 in Paris.
This application is based on many new technologies : HTML5, CSS3, IndexedDB, File API, D'n'D, SPA, IE10.
CSS3 isn't the future, it's the present. Learn the gamut of CSS3 properties from colors, web fonts, and visual effects, to transitions, animations and media queries. Find the inspiration and resources to go forth and implement the new properties with confidence.
Italy Agriculture Equipment Market Outlook to 2027harveenkaur52
Agriculture and Animal Care
Ken Research has an expertise in Agriculture and Animal Care sector and offer vast collection of information related to all major aspects such as Agriculture equipment, Crop Protection, Seed, Agriculture Chemical, Fertilizers, Protected Cultivators, Palm Oil, Hybrid Seed, Animal Feed additives and many more.
Our continuous study and findings in agriculture sector provide better insights to companies dealing with related product and services, government and agriculture associations, researchers and students to well understand the present and expected scenario.
Our Animal care category provides solutions on Animal Healthcare and related products and services, including, animal feed additives, vaccination
Bridging the Digital Gap Brad Spiegel Macon, GA Initiative.pptxBrad Spiegel Macon GA
Brad Spiegel Macon GA’s journey exemplifies the profound impact that one individual can have on their community. Through his unwavering dedication to digital inclusion, he’s not only bridging the gap in Macon but also setting an example for others to follow.
2.Cellular Networks_The final stage of connectivity is achieved by segmenting...JeyaPerumal1
A cellular network, frequently referred to as a mobile network, is a type of communication system that enables wireless communication between mobile devices. The final stage of connectivity is achieved by segmenting the comprehensive service area into several compact zones, each called a cell.
Understanding User Behavior with Google Analytics.pdfSEO Article Boost
Unlocking the full potential of Google Analytics is crucial for understanding and optimizing your website’s performance. This guide dives deep into the essential aspects of Google Analytics, from analyzing traffic sources to understanding user demographics and tracking user engagement.
Traffic Sources Analysis:
Discover where your website traffic originates. By examining the Acquisition section, you can identify whether visitors come from organic search, paid campaigns, direct visits, social media, or referral links. This knowledge helps in refining marketing strategies and optimizing resource allocation.
User Demographics Insights:
Gain a comprehensive view of your audience by exploring demographic data in the Audience section. Understand age, gender, and interests to tailor your marketing strategies effectively. Leverage this information to create personalized content and improve user engagement and conversion rates.
Tracking User Engagement:
Learn how to measure user interaction with your site through key metrics like bounce rate, average session duration, and pages per session. Enhance user experience by analyzing engagement metrics and implementing strategies to keep visitors engaged.
Conversion Rate Optimization:
Understand the importance of conversion rates and how to track them using Google Analytics. Set up Goals, analyze conversion funnels, segment your audience, and employ A/B testing to optimize your website for higher conversions. Utilize ecommerce tracking and multi-channel funnels for a detailed view of your sales performance and marketing channel contributions.
Custom Reports and Dashboards:
Create custom reports and dashboards to visualize and interpret data relevant to your business goals. Use advanced filters, segments, and visualization options to gain deeper insights. Incorporate custom dimensions and metrics for tailored data analysis. Integrate external data sources to enrich your analytics and make well-informed decisions.
This guide is designed to help you harness the power of Google Analytics for making data-driven decisions that enhance website performance and achieve your digital marketing objectives. Whether you are looking to improve SEO, refine your social media strategy, or boost conversion rates, understanding and utilizing Google Analytics is essential for your success.
Meet up Milano 14 _ Axpo Italia_ Migration from Mule3 (On-prem) to.pdfFlorence Consulting
Quattordicesimo Meetup di Milano, tenutosi a Milano il 23 Maggio 2024 dalle ore 17:00 alle ore 18:30 in presenza e da remoto.
Abbiamo parlato di come Axpo Italia S.p.A. ha ridotto il technical debt migrando le proprie APIs da Mule 3.9 a Mule 4.4 passando anche da on-premises a CloudHub 1.0.
APNIC Foundation, presented by Ellisha Heppner at the PNG DNS Forum 2024APNIC
Ellisha Heppner, Grant Management Lead, presented an update on APNIC Foundation to the PNG DNS Forum held from 6 to 10 May, 2024 in Port Moresby, Papua New Guinea.
1.Wireless Communication System_Wireless communication is a broad term that i...JeyaPerumal1
Wireless communication involves the transmission of information over a distance without the help of wires, cables or any other forms of electrical conductors.
Wireless communication is a broad term that incorporates all procedures and forms of connecting and communicating between two or more devices using a wireless signal through wireless communication technologies and devices.
Features of Wireless Communication
The evolution of wireless technology has brought many advancements with its effective features.
The transmitted distance can be anywhere between a few meters (for example, a television's remote control) and thousands of kilometers (for example, radio communication).
Wireless communication can be used for cellular telephony, wireless access to the internet, wireless home networking, and so on.
3. David Corbacho Román
Senior Drupal developer - Frontend
Drupal core contributor, module maintainer
(d.o. user: corbacho)
We are hiring
London
Twitter
@dcorbacho
25. Why SVG? Small size
For example, new google logo, 305 bytes
SVG DOM
http://gizmodo.com/how-could-googles-new-
logo-be-only-305-bytes-while-its-1728793790
26. 1. Brief introduction to SVG
2. The past
3. The present. Using SVG
4. SVG and Drupal
5. SVG 2: The future
Structure
27. SVG 1.0 begins in 1998
http://www.w3.org/Talks/2014/schepers-accessible_graphics/rise-and-fall.svg
http://www.w3.org/Graphics/SVG/WG/wiki/Secret_Origin_of_SVG
SVG 1.0 = XML + SVG + DOM +
CSS + Animations +
Filters + XLINKS + …
51. SVG adds a new dimension of possibilities
5 ways of embedding SVG in your HTML
x
multiple ways of scripting SVG
x
multiple ways of adding CSS
x
multiple ways of “reusing” SVG elements xlink, def, symbol, fill, etc
x
html in your svg (foreignObject)
x
svg in your svg (nested svg)
x
svg in your CSS
x
multiple ways of animating techniques and libraries
x
multiple browsers. Fallback techniques
caniuse.com
can’t track
every single
combination
73. Drupal SVG
Guidelines (on work)
https://www.drupal.org/node/2433761
Similar project https://svgontheweb.com/
74. Drupal 7 has 0 SVG files in core
Drupal 8 has 79 SVG files in core
We use them as images, not taking full potential
SVG Sprite for toolbar icons
https://www.drupal.org/node/2306499
79. SVG 2 will bring more integration
with new web features such as
CSS, HTML5 and WOFF.
http://www.w3.org/Graphics/SVG/WG/wiki/SVG2_Requirements_Commitments
82. Conclusion
SVG is not new.. but it’s here to stay.
Now it’s the time.
and let’s bring more SVG goodness to
Drupal
83. Resources
Dmitry Baranovskiy - You Don't Know SVG
https://www.youtube.com/watch?v=SeLOt_BRAqc
"If you don't know svg you can't call yourself a Web Developer.
Call yourself a Web Enthusiast” — Dmitry
Tavmjong Bah - SVG 2 For the Artist and Developer
https://www.youtube.com/watch?v=UL2-ZAyvXOM
Everything that Sarah Soueidan publishes.
http://sarasoueidan.com/articles/index.html
CSS Tricks. SVG category
2nd edition!