Web standards and Visual Studio web tools

•Descargar como PPTX, PDF•

0 recomendaciones•554 vistas

How to build and deploy an ASP.NET applicaton. This entire series can be found here: http://www.davevoyles.com/slides-and-code-for-my-asp-net-presentation/

Tecnología

Web standards
and Visual Studio Web Tools
Dave Voyles
Dvoyles@Microsoft.com

Agenda
1) Modern web standards overview
2) Visual Studio Tools overview

Modern Web Standards
HTML5 + CSS3 = Magic!

Not a marketing
message
What is HTML5?
A new standard for
a new web
A language with support
on a variety of devices
Umbrella term: vNext HTML, CSS, ECMAScript

Map of Web Browser Standards
Standard
Standards
Body

Building with standards
Modern.ie Can I Use
Compat
Inspector
Modernizer
CSS Resets
(Normalize.css)
11

New HTML5 Markup Elements
<div class=“header”></div>
<div class=“nav”></div>
From this:
<header></header>
<nav></nav>
To this:

New HTML5 Markup Elements
Eliminate the
“generic”
tagging
Native tags
DOM parsing is
quicker than
class searching
Accessibility
Standardizing
tags
Why?

Canvas
•Methods for drawing include: paths, boxes, circles,
text and rasterized
images

HTML 5 <video>
•Industry-standard MPEG-4/H.264 video
•HTML content, images, SVG graphics

HTML 5 <video> Attributes
• src – specifies the location to pull the source file
• autoplay – if present starts playing as soon as it’s ready
• controls – if present displays controls
• preload – if present loads source at page load
• loop – if present loops back to the beginning of the video

Multiple HTML 5 <video> Sources?
•source – child element used to specify the location
to pull the source file(s)

HTML 5 <audio>
•Industry-standard MP3
and AAC audio
•Fully scriptable via
the DOM
src
autoplay
controls
preload

Who Uses jQuery?
http://trends.builtwith.com/javascript/jQuery
Over 59 million sites
66.2% of the top 10k

jQuery Fundamentals
Find something, Do something
Functional Syntax
DOM Manipulation
Changing of events

Summary
 Modern web standards overview
 Visual Studio Tools overview

Más contenido relacionado

Similar a Web standards and Visual Studio web tools

HTML5- The Boosting Era of Web DevelopmentMobilePundits

Web matrix part 2yuvaraj72

Wordcamp Thessaloniki 2011 The NextwebGeorge Kanellopoulos

WordCamp Thessaloniki2011 The NextWebGeorge Kanellopoulos

Word camp nextwebPanagiotis Grigoropoulos

Word camp nextwebGreekTuts Ελληνικά Βοηθήματα

Vs2005pcm_chitta

Daniel Egan Msdn Tech Days OcDaniel Egan

Divya ASP Developer divya k

Intro to .NET for Government DevelopersFrank La Vigne

Html5mikusuraj

Javantura Zagreb 2014 - Vaadin - Peter LehtoHUJAK - Hrvatska udruga Java korisnika / Croatian Java User Association

Html5 more than just html5 v finalLohith Goudagere Nagaraj

HTML5 for ASP.NET DevelopersJustin Lee

WebMatrix2Subodh Pushpak

Extreme CSS Techniques - MadWorld Europe 2018, Scott DeLoach, ClickStartScott DeLoach

html5_css3Sindh Madresatul Islam University

Q and a design2 webKevin Davison

Web development todayJaydev Gajera

CSS Designer CertificationVskills

Similar a Web standards and Visual Studio web tools (20)

HTML5- The Boosting Era of Web Development

Web matrix part 2

Wordcamp Thessaloniki 2011 The Nextweb

WordCamp Thessaloniki2011 The NextWeb

Word camp nextweb

Vs2005p

Daniel Egan Msdn Tech Days Oc

Divya ASP Developer

Intro to .NET for Government Developers

Html5

Javantura Zagreb 2014 - Vaadin - Peter Lehto

Html5 more than just html5 v final

HTML5 for ASP.NET Developers

WebMatrix2

Extreme CSS Techniques - MadWorld Europe 2018, Scott DeLoach, ClickStart

html5_css3

Q and a design2 web

Web development today

CSS Designer Certification

Más de David Voyles

Developing games for consoles as an indie in 2019David Voyles

Developing for consoles as an indie in 2019David Voyles

Overview Microsoft's ML & AI toolsDavid Voyles

Intro to deep learning David Voyles

What is a Tech Evangelist?David Voyles

Microsoft on open source and securityDavid Voyles

Students: How to get started in the tech worldDavid Voyles

Students -- How to get started in the tech worldDavid Voyles

Getting started with Emscripten – Transpiling C / C++ to JavaScript / HTML5David Voyles

How to win a hackathon - Penn APps 2015David Voyles

ASP.NET 5David Voyles

Running, improving & maintaining a site in the real worldDavid Voyles

Building web front ends using single page applicationsDavid Voyles

Build and deploy an ASP.NET applicatonDavid Voyles

Cluster puck99 postmortemDavid Voyles

Joe Healy - How to set up your DreamSpark accountDavid Voyles

Joe Healy - Students as App PublishersDavid Voyles

Using prime[31] to connect your unity game to azure mobile servicesDavid Voyles

An Introdouction to Venture Capital and Microsoft VenturesDavid Voyles

Intro to WebGL and BabylonJSDavid Voyles

Más de David Voyles (20)

Developing games for consoles as an indie in 2019

Developing for consoles as an indie in 2019

Overview Microsoft's ML & AI tools

Intro to deep learning

What is a Tech Evangelist?

Microsoft on open source and security

Students: How to get started in the tech world

Students -- How to get started in the tech world

Getting started with Emscripten – Transpiling C / C++ to JavaScript / HTML5

How to win a hackathon - Penn APps 2015

ASP.NET 5

Running, improving & maintaining a site in the real world

Building web front ends using single page applications

Build and deploy an ASP.NET applicaton

Cluster puck99 postmortem

Joe Healy - How to set up your DreamSpark account

Joe Healy - Students as App Publishers

Using prime[31] to connect your unity game to azure mobile services

An Introdouction to Venture Capital and Microsoft Ventures

Intro to WebGL and BabylonJS

Último

Boost Fertility New Invention Ups Success Rates.pdfsudhanshuwaghmare1

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

[2024]Digital Global Overview Report 2024 Meltwater.pdfhans926745

GenCyber Cyber Security Day PresentationMichael W. Hawkins

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

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

Handwritten Text Recognition for manuscripts and early printed textsMaria Levchenko

HTML Injection Attacks: Impact and Mitigation StrategiesBoston Institute of Analytics

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

Data Cloud, More than a CDP by Matt RobisonAnna Loughnan Colquhoun

Artificial Intelligence: Facts and MythsJoaquim Jorge

A Year of the Servo Reboot: Where Are We Now?Igalia

Partners Life - Insurer Innovation Award 2024The Digital Insurer

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

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

How to Troubleshoot Apps for the Modern Connected WorkerThousandEyes

A Domino Admins Adventures (Engage 2024)Gabriella Davis

Axa Assurance Maroc - Insurer Innovation Award 2024The Digital Insurer

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

Driving Behavioral Change for Information Management through Data-Driven Gree...Enterprise Knowledge

Web standards and Visual Studio web tools

1. Web standards and Visual Studio Web Tools Dave Voyles Dvoyles@Microsoft.com

2. Agenda 1) Modern web standards overview 2) Visual Studio Tools overview

3. Modern Web Standards HTML5 + CSS3 = Magic!

4. HTML5

5. Not a marketing message What is HTML5? A new standard for a new web A language with support on a variety of devices Umbrella term: vNext HTML, CSS, ECMAScript

6. Why do you care?

7. Photosynth 2 Hover contre jour

8. Visual Studio Online

9. Map of Web Browser Standards Standard Standards Body

10.

11. Building with standards Modern.ie Can I Use Compat Inspector Modernizer CSS Resets (Normalize.css) 11

12. New HTML5 Markup Elements <div class=“header”></div> <div class=“nav”></div> From this: <header></header> <nav></nav> To this:

13. New HTML5 Markup Elements Eliminate the “generic” tagging Native tags DOM parsing is quicker than class searching Accessibility Standardizing tags Why?

14. Canvas •Methods for drawing include: paths, boxes, circles, text and rasterized images

15. HTML 5 <video> •Industry-standard MPEG-4/H.264 video •HTML content, images, SVG graphics

16. HTML 5 <video> Attributes • src – specifies the location to pull the source file • autoplay – if present starts playing as soon as it’s ready • controls – if present displays controls • preload – if present loads source at page load • loop – if present loops back to the beginning of the video

17. Multiple HTML 5 <video> Sources? •source – child element used to specify the location to pull the source file(s)

18. HTML 5 <audio> •Industry-standard MP3 and AAC audio •Fully scriptable via the DOM src autoplay controls preload

19. JavaScript Library Overview

20. Who Uses jQuery? http://trends.builtwith.com/javascript/jQuery Over 59 million sites 66.2% of the top 10k

21. jQuery – why so popular?

22. jQuery Community

23. jQuery Fundamentals Find something, Do something Functional Syntax DOM Manipulation Changing of events

24. Overview Visual Studio Web Tools

25. Demo Visual Studio Web Tools

26. Summary  Modern web standards overview  Visual Studio Tools overview