SlideShare a Scribd company logo
HTML5 and CSS3 for
Bloggers
Jason N. Gaylord
Why should you care about this
stuff?
Have you ever authored a blog post that you wanted more control over?
Do you use a blog engine (or CMS), such as WordPress, Orchard, Drupal or
others and would like to customize the theme?
HTML is Born
The Internet may have been created by Al Gore…
(not actually true)

But HTML was developed by Sir Tim Berners-Lee
Structured Markup
HTML is a set of instructions that help a browser render content in a desired
way.
Generally speaking, those instructions begin with a less than sign < and end
with a greater than sign >. In between the signs, you’ll find an instruction
keyword called an HTML tag.

All instructions can be written in full form such as <foo></ foo>. Notice that
the ending tag contains a forward slash. This helps to indicate that it is a
closing tag.
Some tags can have nested tags and/or content such as <foo>bar</ foo>.
Common Structure
What’s New in HTML 5?
New Semantic Elements
(article, aside, audio, canvas, figure, footer, header, nav, video, section, etc.)
New Attributes (i.e.: Textbox types for calendar, date, email, tel, time, url, etc.)
New APIs (audio, video, graphics, history, location, Web Sockets, etc.) which
should reduce the need for plug-ins (i.e.: Flash, Silverlight, etc.) and browserspecific implementations.
Local (“offline”) storage
CSS and What’s New in CSS3?
Cascading Style Sheets (CSS) allow control over the style of the content.
Style can be inline or in an external file that is referenced.
The style follows cascading rules with the most general rules located at the
top of the file (regardless of whether it is inline or external).
So what’s new? A lot. New selectors, improved border and background
capabilities, font capabilities, multi-column capabilities, 2D/3D
transforms, page media, etc.

Keep away from browser prefixes (i.e.: -moz, -webkit, -ms)
Writing HTML
DEMO. DEMO. DEMO.

Downloads:
 http://jasong.us/vs2013rc
 http://jasong.us/WLWriter
Questions
Find Out More
Twitter: @jgaylord

W3C: w3.org

Website: jasongaylord.com

CSS Info: css3.info

Email: jason@jasongaylord.com

W3 Schools: w3schools.com

Book: jasong.us/amzn-aspnet45

Modern Testing: modern.ie

More Related Content

What's hot

HTML CSS and Web Development
HTML CSS and Web DevelopmentHTML CSS and Web Development
HTML CSS and Web Development
Rahul Mishra
 
Progressive enhancement
Progressive enhancementProgressive enhancement
Progressive enhancement
Zohar Arad
 
Html
HtmlHtml
Html
mazario
 
Web Design Fundamentals
Web Design FundamentalsWeb Design Fundamentals
Web Design Fundamentals
Ahmed Faris
 
Training HTML5 CSS3 Ilkom IPB
Training HTML5 CSS3 Ilkom IPBTraining HTML5 CSS3 Ilkom IPB
Training HTML5 CSS3 Ilkom IPB
Wahyu Putra
 
Web Development Workshop (Front End)
Web Development Workshop (Front End)Web Development Workshop (Front End)
Web Development Workshop (Front End)
DSCIIITLucknow
 
Kristina benjamin fonttag
Kristina benjamin fonttagKristina benjamin fonttag
Kristina benjamin fonttag
kristibenjamin
 
HTML 5, CSS3 and ASP.NET Best Practices by Example
HTML 5, CSS3 and ASP.NET Best Practices by ExampleHTML 5, CSS3 and ASP.NET Best Practices by Example
HTML 5, CSS3 and ASP.NET Best Practices by Example
Darren Sim
 
Web development basics
Web development basicsWeb development basics
Web development basics
Kalluri Vinay Reddy
 
Rakshat bhati
Rakshat bhatiRakshat bhati
Rakshat bhati
Rakshat bhati
 
How to use CSS3 in WordPress
How to use CSS3 in WordPressHow to use CSS3 in WordPress
How to use CSS3 in WordPress
Suzette Franck
 
How to manage a big scale HTML/CSS project
How to manage a big scale HTML/CSS projectHow to manage a big scale HTML/CSS project
How to manage a big scale HTML/CSS project
Renoir Boulanger
 
Bootstrap 3 Basic - Bangkok WordPress Meetup
Bootstrap 3 Basic - Bangkok WordPress MeetupBootstrap 3 Basic - Bangkok WordPress Meetup
Bootstrap 3 Basic - Bangkok WordPress Meetup
Woratana Perth Ngarmtrakulchol
 
xhtml_basics
xhtml_basicsxhtml_basics
xhtml_basics
tutorialsruby
 
GTU Web Designing Interview Questions And Answers for freshers
GTU Web Designing Interview Questions And Answers for freshersGTU Web Designing Interview Questions And Answers for freshers
GTU Web Designing Interview Questions And Answers for freshers
TOPS Technologies
 
Introduction to CSS
Introduction to CSSIntroduction to CSS
Introduction to CSS
AursalanSayed
 
1. html introduction
1. html introduction1. html introduction
1. html introduction
Muhammad Toqeer
 
WordCamp Atlanta 2014 - CSS For Beginners - By Michael Earley of ATL Squared ...
WordCamp Atlanta 2014 - CSS For Beginners - By Michael Earley of ATL Squared ...WordCamp Atlanta 2014 - CSS For Beginners - By Michael Earley of ATL Squared ...
WordCamp Atlanta 2014 - CSS For Beginners - By Michael Earley of ATL Squared ...
New Tricks
 
Web1O1 - Intro to HTML/CSS
Web1O1 - Intro to HTML/CSSWeb1O1 - Intro to HTML/CSS
Web1O1 - Intro to HTML/CSS
NYCSS Meetup
 
How to Make HTML and CSS Files
How to Make HTML and CSS FilesHow to Make HTML and CSS Files
How to Make HTML and CSS Files
LearningNerd
 

What's hot (20)

HTML CSS and Web Development
HTML CSS and Web DevelopmentHTML CSS and Web Development
HTML CSS and Web Development
 
Progressive enhancement
Progressive enhancementProgressive enhancement
Progressive enhancement
 
Html
HtmlHtml
Html
 
Web Design Fundamentals
Web Design FundamentalsWeb Design Fundamentals
Web Design Fundamentals
 
Training HTML5 CSS3 Ilkom IPB
Training HTML5 CSS3 Ilkom IPBTraining HTML5 CSS3 Ilkom IPB
Training HTML5 CSS3 Ilkom IPB
 
Web Development Workshop (Front End)
Web Development Workshop (Front End)Web Development Workshop (Front End)
Web Development Workshop (Front End)
 
Kristina benjamin fonttag
Kristina benjamin fonttagKristina benjamin fonttag
Kristina benjamin fonttag
 
HTML 5, CSS3 and ASP.NET Best Practices by Example
HTML 5, CSS3 and ASP.NET Best Practices by ExampleHTML 5, CSS3 and ASP.NET Best Practices by Example
HTML 5, CSS3 and ASP.NET Best Practices by Example
 
Web development basics
Web development basicsWeb development basics
Web development basics
 
Rakshat bhati
Rakshat bhatiRakshat bhati
Rakshat bhati
 
How to use CSS3 in WordPress
How to use CSS3 in WordPressHow to use CSS3 in WordPress
How to use CSS3 in WordPress
 
How to manage a big scale HTML/CSS project
How to manage a big scale HTML/CSS projectHow to manage a big scale HTML/CSS project
How to manage a big scale HTML/CSS project
 
Bootstrap 3 Basic - Bangkok WordPress Meetup
Bootstrap 3 Basic - Bangkok WordPress MeetupBootstrap 3 Basic - Bangkok WordPress Meetup
Bootstrap 3 Basic - Bangkok WordPress Meetup
 
xhtml_basics
xhtml_basicsxhtml_basics
xhtml_basics
 
GTU Web Designing Interview Questions And Answers for freshers
GTU Web Designing Interview Questions And Answers for freshersGTU Web Designing Interview Questions And Answers for freshers
GTU Web Designing Interview Questions And Answers for freshers
 
Introduction to CSS
Introduction to CSSIntroduction to CSS
Introduction to CSS
 
1. html introduction
1. html introduction1. html introduction
1. html introduction
 
WordCamp Atlanta 2014 - CSS For Beginners - By Michael Earley of ATL Squared ...
WordCamp Atlanta 2014 - CSS For Beginners - By Michael Earley of ATL Squared ...WordCamp Atlanta 2014 - CSS For Beginners - By Michael Earley of ATL Squared ...
WordCamp Atlanta 2014 - CSS For Beginners - By Michael Earley of ATL Squared ...
 
Web1O1 - Intro to HTML/CSS
Web1O1 - Intro to HTML/CSSWeb1O1 - Intro to HTML/CSS
Web1O1 - Intro to HTML/CSS
 
How to Make HTML and CSS Files
How to Make HTML and CSS FilesHow to Make HTML and CSS Files
How to Make HTML and CSS Files
 

Viewers also liked

Html5/CSS3
Html5/CSS3Html5/CSS3
Html5/CSS3
Simratpreet Singh
 
谈一谈HTML5/CSS3 @ WebRebuild 2010
谈一谈HTML5/CSS3 @ WebRebuild 2010谈一谈HTML5/CSS3 @ WebRebuild 2010
谈一谈HTML5/CSS3 @ WebRebuild 2010
Zi Bin Cheah
 
HTML5/CSS3 @ Baidu
HTML5/CSS3 @ BaiduHTML5/CSS3 @ Baidu
HTML5/CSS3 @ Baidu
Zi Bin Cheah
 
HTML5 Tags and Elements Tutorial
HTML5 Tags and Elements TutorialHTML5 Tags and Elements Tutorial
HTML5 Tags and Elements Tutorial
ProdigyView
 
HTML5 and CSS3 for Teachers
HTML5 and CSS3 for TeachersHTML5 and CSS3 for Teachers
HTML5 and CSS3 for Teachers
Jason Hando
 
Beginner & Intermediate Guide to HTML5/CSS3 In Drupal
Beginner & Intermediate Guide to HTML5/CSS3 In DrupalBeginner & Intermediate Guide to HTML5/CSS3 In Drupal
Beginner & Intermediate Guide to HTML5/CSS3 In Drupal
Mediacurrent
 
Fastest css3 animations
Fastest css3 animations Fastest css3 animations
Fastest css3 animations
Ismail Berkay Beyaz
 
Introduction to CSS3
Introduction to CSS3Introduction to CSS3
Introduction to CSS3
Doris Chen
 
HTML5, CSS3, and JavaScript
HTML5, CSS3, and JavaScriptHTML5, CSS3, and JavaScript
HTML5, CSS3, and JavaScript
Zac Gordon
 
New HTML5/CSS3 techniques
New HTML5/CSS3 techniquesNew HTML5/CSS3 techniques
New HTML5/CSS3 techniques
mbeatrizoliveira
 
HTML5 and CSS3 Refresher
HTML5 and CSS3 RefresherHTML5 and CSS3 Refresher
HTML5 and CSS3 Refresher
Ivano Malavolta
 
Presentation about html5 css3
Presentation about html5 css3Presentation about html5 css3
Presentation about html5 css3
Gopi A
 
Intro to CSS3
Intro to CSS3Intro to CSS3
Intro to CSS3
Denise Jacobs
 
Fundamental CSS3
Fundamental CSS3Fundamental CSS3
Fundamental CSS3
Achmad Solichin
 
Introduction to HTML5 & CSS3
Introduction to HTML5 & CSS3Introduction to HTML5 & CSS3
Introduction to HTML5 & CSS3
Pradeep Varadaraja Banavara
 
Cours d'introduction aux HTML5 & CSS3
Cours d'introduction aux HTML5 & CSS3Cours d'introduction aux HTML5 & CSS3
Cours d'introduction aux HTML5 & CSS3
Abel LIFAEFI MBULA
 

Viewers also liked (16)

Html5/CSS3
Html5/CSS3Html5/CSS3
Html5/CSS3
 
谈一谈HTML5/CSS3 @ WebRebuild 2010
谈一谈HTML5/CSS3 @ WebRebuild 2010谈一谈HTML5/CSS3 @ WebRebuild 2010
谈一谈HTML5/CSS3 @ WebRebuild 2010
 
HTML5/CSS3 @ Baidu
HTML5/CSS3 @ BaiduHTML5/CSS3 @ Baidu
HTML5/CSS3 @ Baidu
 
HTML5 Tags and Elements Tutorial
HTML5 Tags and Elements TutorialHTML5 Tags and Elements Tutorial
HTML5 Tags and Elements Tutorial
 
HTML5 and CSS3 for Teachers
HTML5 and CSS3 for TeachersHTML5 and CSS3 for Teachers
HTML5 and CSS3 for Teachers
 
Beginner & Intermediate Guide to HTML5/CSS3 In Drupal
Beginner & Intermediate Guide to HTML5/CSS3 In DrupalBeginner & Intermediate Guide to HTML5/CSS3 In Drupal
Beginner & Intermediate Guide to HTML5/CSS3 In Drupal
 
Fastest css3 animations
Fastest css3 animations Fastest css3 animations
Fastest css3 animations
 
Introduction to CSS3
Introduction to CSS3Introduction to CSS3
Introduction to CSS3
 
HTML5, CSS3, and JavaScript
HTML5, CSS3, and JavaScriptHTML5, CSS3, and JavaScript
HTML5, CSS3, and JavaScript
 
New HTML5/CSS3 techniques
New HTML5/CSS3 techniquesNew HTML5/CSS3 techniques
New HTML5/CSS3 techniques
 
HTML5 and CSS3 Refresher
HTML5 and CSS3 RefresherHTML5 and CSS3 Refresher
HTML5 and CSS3 Refresher
 
Presentation about html5 css3
Presentation about html5 css3Presentation about html5 css3
Presentation about html5 css3
 
Intro to CSS3
Intro to CSS3Intro to CSS3
Intro to CSS3
 
Fundamental CSS3
Fundamental CSS3Fundamental CSS3
Fundamental CSS3
 
Introduction to HTML5 & CSS3
Introduction to HTML5 & CSS3Introduction to HTML5 & CSS3
Introduction to HTML5 & CSS3
 
Cours d'introduction aux HTML5 & CSS3
Cours d'introduction aux HTML5 & CSS3Cours d'introduction aux HTML5 & CSS3
Cours d'introduction aux HTML5 & CSS3
 

Similar to NEPA BlogCon 2013 - HTML5/CSS3 for Bloggers

Grade 10 COMPUTER
Grade 10 COMPUTERGrade 10 COMPUTER
Grade 10 COMPUTER
Joel Linquico
 
DSC, html and CSS basics.pptx
DSC, html and CSS basics.pptxDSC, html and CSS basics.pptx
DSC, html and CSS basics.pptx
DiffouoFopaEsdras
 
Website development-osgl
Website development-osglWebsite development-osgl
Website development-osgl
priyanka sharma
 
Web Information Systems Html and css
Web Information Systems Html and cssWeb Information Systems Html and css
Web Information Systems Html and css
Artificial Intelligence Institute at UofSC
 
Wa html5-pdf
Wa html5-pdfWa html5-pdf
Wa html5-pdf
rcobos_fireworks
 
Wa html5-pdf
Wa html5-pdfWa html5-pdf
Wa html5-pdf
Olivier Eeckhoutte
 
Lecture-7.pptx
Lecture-7.pptxLecture-7.pptx
Lecture-7.pptx
vishal choudhary
 
HTML5 & CSS3 -- UPA Iowa
HTML5 & CSS3 -- UPA IowaHTML5 & CSS3 -- UPA Iowa
HTML5 & CSS3 -- UPA Iowa
Ian Lintner
 
HTML/CSS Lecture 1
HTML/CSS Lecture 1HTML/CSS Lecture 1
HTML/CSS Lecture 1
Lee Lundrigan
 
Web designing course bangalore
Web designing course bangaloreWeb designing course bangalore
Web designing course bangalore
Infocampus Logics Pvt.Ltd.
 
HTML5 & CSS3
HTML5 & CSS3 HTML5 & CSS3
HTML5 & CSS3
Ian Lintner
 
Wa html5-pdf
Wa html5-pdfWa html5-pdf
Wa html5-pdf
Selvaraj V
 
Wa html5-pdf
Wa html5-pdfWa html5-pdf
Wa html5-pdf
MassoudmAlShareef
 
Intro to HTML & CSS
Intro to HTML & CSSIntro to HTML & CSS
Intro to HTML & CSS
Syed Sami
 
Ncp computer appls web tech asish
Ncp computer appls  web tech asishNcp computer appls  web tech asish
Ncp computer appls web tech asish
NCP
 
Web Concepts - an introduction - introduction
Web Concepts - an introduction - introductionWeb Concepts - an introduction - introduction
Web Concepts - an introduction - introduction
clement swarnappa
 
GDI Seattle Intro to HTML and CSS - Class 1
GDI Seattle Intro to HTML and CSS - Class 1GDI Seattle Intro to HTML and CSS - Class 1
GDI Seattle Intro to HTML and CSS - Class 1
Heather Rock
 
Iwt module 1
Iwt  module 1Iwt  module 1
Iwt module 1
SANTOSH RATH
 
Uta005 lecture2
Uta005 lecture2Uta005 lecture2
Uta005 lecture2
vinay arora
 
WELCOME-FOLKS--CSS.-AND-HTMLS.pptx
WELCOME-FOLKS--CSS.-AND-HTMLS.pptxWELCOME-FOLKS--CSS.-AND-HTMLS.pptx
WELCOME-FOLKS--CSS.-AND-HTMLS.pptx
HeroVins
 

Similar to NEPA BlogCon 2013 - HTML5/CSS3 for Bloggers (20)

Grade 10 COMPUTER
Grade 10 COMPUTERGrade 10 COMPUTER
Grade 10 COMPUTER
 
DSC, html and CSS basics.pptx
DSC, html and CSS basics.pptxDSC, html and CSS basics.pptx
DSC, html and CSS basics.pptx
 
Website development-osgl
Website development-osglWebsite development-osgl
Website development-osgl
 
Web Information Systems Html and css
Web Information Systems Html and cssWeb Information Systems Html and css
Web Information Systems Html and css
 
Wa html5-pdf
Wa html5-pdfWa html5-pdf
Wa html5-pdf
 
Wa html5-pdf
Wa html5-pdfWa html5-pdf
Wa html5-pdf
 
Lecture-7.pptx
Lecture-7.pptxLecture-7.pptx
Lecture-7.pptx
 
HTML5 & CSS3 -- UPA Iowa
HTML5 & CSS3 -- UPA IowaHTML5 & CSS3 -- UPA Iowa
HTML5 & CSS3 -- UPA Iowa
 
HTML/CSS Lecture 1
HTML/CSS Lecture 1HTML/CSS Lecture 1
HTML/CSS Lecture 1
 
Web designing course bangalore
Web designing course bangaloreWeb designing course bangalore
Web designing course bangalore
 
HTML5 & CSS3
HTML5 & CSS3 HTML5 & CSS3
HTML5 & CSS3
 
Wa html5-pdf
Wa html5-pdfWa html5-pdf
Wa html5-pdf
 
Wa html5-pdf
Wa html5-pdfWa html5-pdf
Wa html5-pdf
 
Intro to HTML & CSS
Intro to HTML & CSSIntro to HTML & CSS
Intro to HTML & CSS
 
Ncp computer appls web tech asish
Ncp computer appls  web tech asishNcp computer appls  web tech asish
Ncp computer appls web tech asish
 
Web Concepts - an introduction - introduction
Web Concepts - an introduction - introductionWeb Concepts - an introduction - introduction
Web Concepts - an introduction - introduction
 
GDI Seattle Intro to HTML and CSS - Class 1
GDI Seattle Intro to HTML and CSS - Class 1GDI Seattle Intro to HTML and CSS - Class 1
GDI Seattle Intro to HTML and CSS - Class 1
 
Iwt module 1
Iwt  module 1Iwt  module 1
Iwt module 1
 
Uta005 lecture2
Uta005 lecture2Uta005 lecture2
Uta005 lecture2
 
WELCOME-FOLKS--CSS.-AND-HTMLS.pptx
WELCOME-FOLKS--CSS.-AND-HTMLS.pptxWELCOME-FOLKS--CSS.-AND-HTMLS.pptx
WELCOME-FOLKS--CSS.-AND-HTMLS.pptx
 

More from Michelle Davies (Hryvnak)

NEPA BlogCon 2013 - Blogging 101 (Knepper)
NEPA BlogCon 2013 - Blogging 101 (Knepper)NEPA BlogCon 2013 - Blogging 101 (Knepper)
NEPA BlogCon 2013 - Blogging 101 (Knepper)
Michelle Davies (Hryvnak)
 
NEPA BlogCon 2013 - Blogging 101 (Culp)
NEPA BlogCon 2013 - Blogging 101 (Culp)NEPA BlogCon 2013 - Blogging 101 (Culp)
NEPA BlogCon 2013 - Blogging 101 (Culp)
Michelle Davies (Hryvnak)
 
NEPA BlogCon 2013 - Google Analytics 101
NEPA BlogCon 2013 - Google Analytics 101NEPA BlogCon 2013 - Google Analytics 101
NEPA BlogCon 2013 - Google Analytics 101
Michelle Davies (Hryvnak)
 
NEPA BlogCon 2013 - Content Creation & Management
NEPA BlogCon 2013 - Content Creation & ManagementNEPA BlogCon 2013 - Content Creation & Management
NEPA BlogCon 2013 - Content Creation & Management
Michelle Davies (Hryvnak)
 
NEPA BlogCon 2013 - Non-Profits vs. For-Profits in the Game of Social Media, ...
NEPA BlogCon 2013 - Non-Profits vs. For-Profits in the Game of Social Media, ...NEPA BlogCon 2013 - Non-Profits vs. For-Profits in the Game of Social Media, ...
NEPA BlogCon 2013 - Non-Profits vs. For-Profits in the Game of Social Media, ...
Michelle Davies (Hryvnak)
 
NEPA BlogCon 2013 - WordPress Customization & Security
NEPA BlogCon 2013 - WordPress Customization & SecurityNEPA BlogCon 2013 - WordPress Customization & Security
NEPA BlogCon 2013 - WordPress Customization & Security
Michelle Davies (Hryvnak)
 
NEPA BlogCon 2013 - Building a Professional Network in the Digital Age
NEPA BlogCon 2013 - Building a Professional Network in the Digital AgeNEPA BlogCon 2013 - Building a Professional Network in the Digital Age
NEPA BlogCon 2013 - Building a Professional Network in the Digital Age
Michelle Davies (Hryvnak)
 
NEPA BlogCon 2012 - Sharing is Caring
NEPA BlogCon 2012 - Sharing is CaringNEPA BlogCon 2012 - Sharing is Caring
NEPA BlogCon 2012 - Sharing is Caring
Michelle Davies (Hryvnak)
 
NEPA BlogCon 2013 - Blog Growth & Development
NEPA BlogCon 2013 - Blog Growth & DevelopmentNEPA BlogCon 2013 - Blog Growth & Development
NEPA BlogCon 2013 - Blog Growth & Development
Michelle Davies (Hryvnak)
 
BitCoin, P2P, Distributed Computing
BitCoin, P2P, Distributed ComputingBitCoin, P2P, Distributed Computing
BitCoin, P2P, Distributed Computing
Michelle Davies (Hryvnak)
 
A Brief History of NEPA Blogs
A Brief History of NEPA BlogsA Brief History of NEPA Blogs
A Brief History of NEPA Blogs
Michelle Davies (Hryvnak)
 
Catalog WTFs
Catalog WTFsCatalog WTFs
NEPA BlogCon 2012 - HTML 101
NEPA BlogCon 2012 - HTML 101NEPA BlogCon 2012 - HTML 101
NEPA BlogCon 2012 - HTML 101
Michelle Davies (Hryvnak)
 
NEPA BlogCon 2012 - All Things Google
NEPA BlogCon 2012 - All Things GoogleNEPA BlogCon 2012 - All Things Google
NEPA BlogCon 2012 - All Things Google
Michelle Davies (Hryvnak)
 
NEPA BlogCon 2012 - Social Media for Business
NEPA BlogCon 2012 - Social Media for BusinessNEPA BlogCon 2012 - Social Media for Business
NEPA BlogCon 2012 - Social Media for Business
Michelle Davies (Hryvnak)
 
NEPA BlogCon 2012 - Blogging for Smart People
NEPA BlogCon 2012 - Blogging for Smart PeopleNEPA BlogCon 2012 - Blogging for Smart People
NEPA BlogCon 2012 - Blogging for Smart People
Michelle Davies (Hryvnak)
 
NEPA BlogCon
NEPA BlogConNEPA BlogCon
The (mis)adventures of Flat Stanley
The (mis)adventures of Flat StanleyThe (mis)adventures of Flat Stanley
The (mis)adventures of Flat Stanley
Michelle Davies (Hryvnak)
 
Internet Safety Tips for Children
Internet Safety Tips for ChildrenInternet Safety Tips for Children
Internet Safety Tips for Children
Michelle Davies (Hryvnak)
 
Welcome to epix
Welcome to epixWelcome to epix
Welcome to epix
Michelle Davies (Hryvnak)
 

More from Michelle Davies (Hryvnak) (20)

NEPA BlogCon 2013 - Blogging 101 (Knepper)
NEPA BlogCon 2013 - Blogging 101 (Knepper)NEPA BlogCon 2013 - Blogging 101 (Knepper)
NEPA BlogCon 2013 - Blogging 101 (Knepper)
 
NEPA BlogCon 2013 - Blogging 101 (Culp)
NEPA BlogCon 2013 - Blogging 101 (Culp)NEPA BlogCon 2013 - Blogging 101 (Culp)
NEPA BlogCon 2013 - Blogging 101 (Culp)
 
NEPA BlogCon 2013 - Google Analytics 101
NEPA BlogCon 2013 - Google Analytics 101NEPA BlogCon 2013 - Google Analytics 101
NEPA BlogCon 2013 - Google Analytics 101
 
NEPA BlogCon 2013 - Content Creation & Management
NEPA BlogCon 2013 - Content Creation & ManagementNEPA BlogCon 2013 - Content Creation & Management
NEPA BlogCon 2013 - Content Creation & Management
 
NEPA BlogCon 2013 - Non-Profits vs. For-Profits in the Game of Social Media, ...
NEPA BlogCon 2013 - Non-Profits vs. For-Profits in the Game of Social Media, ...NEPA BlogCon 2013 - Non-Profits vs. For-Profits in the Game of Social Media, ...
NEPA BlogCon 2013 - Non-Profits vs. For-Profits in the Game of Social Media, ...
 
NEPA BlogCon 2013 - WordPress Customization & Security
NEPA BlogCon 2013 - WordPress Customization & SecurityNEPA BlogCon 2013 - WordPress Customization & Security
NEPA BlogCon 2013 - WordPress Customization & Security
 
NEPA BlogCon 2013 - Building a Professional Network in the Digital Age
NEPA BlogCon 2013 - Building a Professional Network in the Digital AgeNEPA BlogCon 2013 - Building a Professional Network in the Digital Age
NEPA BlogCon 2013 - Building a Professional Network in the Digital Age
 
NEPA BlogCon 2012 - Sharing is Caring
NEPA BlogCon 2012 - Sharing is CaringNEPA BlogCon 2012 - Sharing is Caring
NEPA BlogCon 2012 - Sharing is Caring
 
NEPA BlogCon 2013 - Blog Growth & Development
NEPA BlogCon 2013 - Blog Growth & DevelopmentNEPA BlogCon 2013 - Blog Growth & Development
NEPA BlogCon 2013 - Blog Growth & Development
 
BitCoin, P2P, Distributed Computing
BitCoin, P2P, Distributed ComputingBitCoin, P2P, Distributed Computing
BitCoin, P2P, Distributed Computing
 
A Brief History of NEPA Blogs
A Brief History of NEPA BlogsA Brief History of NEPA Blogs
A Brief History of NEPA Blogs
 
Catalog WTFs
Catalog WTFsCatalog WTFs
Catalog WTFs
 
NEPA BlogCon 2012 - HTML 101
NEPA BlogCon 2012 - HTML 101NEPA BlogCon 2012 - HTML 101
NEPA BlogCon 2012 - HTML 101
 
NEPA BlogCon 2012 - All Things Google
NEPA BlogCon 2012 - All Things GoogleNEPA BlogCon 2012 - All Things Google
NEPA BlogCon 2012 - All Things Google
 
NEPA BlogCon 2012 - Social Media for Business
NEPA BlogCon 2012 - Social Media for BusinessNEPA BlogCon 2012 - Social Media for Business
NEPA BlogCon 2012 - Social Media for Business
 
NEPA BlogCon 2012 - Blogging for Smart People
NEPA BlogCon 2012 - Blogging for Smart PeopleNEPA BlogCon 2012 - Blogging for Smart People
NEPA BlogCon 2012 - Blogging for Smart People
 
NEPA BlogCon
NEPA BlogConNEPA BlogCon
NEPA BlogCon
 
The (mis)adventures of Flat Stanley
The (mis)adventures of Flat StanleyThe (mis)adventures of Flat Stanley
The (mis)adventures of Flat Stanley
 
Internet Safety Tips for Children
Internet Safety Tips for ChildrenInternet Safety Tips for Children
Internet Safety Tips for Children
 
Welcome to epix
Welcome to epixWelcome to epix
Welcome to epix
 

Recently uploaded

Chapter 4 - Islamic Financial Institutions in Malaysia.pptx
Chapter 4 - Islamic Financial Institutions in Malaysia.pptxChapter 4 - Islamic Financial Institutions in Malaysia.pptx
Chapter 4 - Islamic Financial Institutions in Malaysia.pptx
Mohd Adib Abd Muin, Senior Lecturer at Universiti Utara Malaysia
 
Walmart Business+ and Spark Good for Nonprofits.pdf
Walmart Business+ and Spark Good for Nonprofits.pdfWalmart Business+ and Spark Good for Nonprofits.pdf
Walmart Business+ and Spark Good for Nonprofits.pdf
TechSoup
 
clinical examination of hip joint (1).pdf
clinical examination of hip joint (1).pdfclinical examination of hip joint (1).pdf
clinical examination of hip joint (1).pdf
Priyankaranawat4
 
How to Fix the Import Error in the Odoo 17
How to Fix the Import Error in the Odoo 17How to Fix the Import Error in the Odoo 17
How to Fix the Import Error in the Odoo 17
Celine George
 
Azure Interview Questions and Answers PDF By ScholarHat
Azure Interview Questions and Answers PDF By ScholarHatAzure Interview Questions and Answers PDF By ScholarHat
Azure Interview Questions and Answers PDF By ScholarHat
Scholarhat
 
PCOS corelations and management through Ayurveda.
PCOS corelations and management through Ayurveda.PCOS corelations and management through Ayurveda.
PCOS corelations and management through Ayurveda.
Dr. Shivangi Singh Parihar
 
DRUGS AND ITS classification slide share
DRUGS AND ITS classification slide shareDRUGS AND ITS classification slide share
DRUGS AND ITS classification slide share
taiba qazi
 
Advanced Java[Extra Concepts, Not Difficult].docx
Advanced Java[Extra Concepts, Not Difficult].docxAdvanced Java[Extra Concepts, Not Difficult].docx
Advanced Java[Extra Concepts, Not Difficult].docx
adhitya5119
 
The History of Stoke Newington Street Names
The History of Stoke Newington Street NamesThe History of Stoke Newington Street Names
The History of Stoke Newington Street Names
History of Stoke Newington
 
writing about opinions about Australia the movie
writing about opinions about Australia the moviewriting about opinions about Australia the movie
writing about opinions about Australia the movie
Nicholas Montgomery
 
How to Make a Field Mandatory in Odoo 17
How to Make a Field Mandatory in Odoo 17How to Make a Field Mandatory in Odoo 17
How to Make a Field Mandatory in Odoo 17
Celine George
 
Pengantar Penggunaan Flutter - Dart programming language1.pptx
Pengantar Penggunaan Flutter - Dart programming language1.pptxPengantar Penggunaan Flutter - Dart programming language1.pptx
Pengantar Penggunaan Flutter - Dart programming language1.pptx
Fajar Baskoro
 
Digital Artefact 1 - Tiny Home Environmental Design
Digital Artefact 1 - Tiny Home Environmental DesignDigital Artefact 1 - Tiny Home Environmental Design
Digital Artefact 1 - Tiny Home Environmental Design
amberjdewit93
 
Smart-Money for SMC traders good time and ICT
Smart-Money for SMC traders good time and ICTSmart-Money for SMC traders good time and ICT
Smart-Money for SMC traders good time and ICT
simonomuemu
 
The Diamonds of 2023-2024 in the IGRA collection
The Diamonds of 2023-2024 in the IGRA collectionThe Diamonds of 2023-2024 in the IGRA collection
The Diamonds of 2023-2024 in the IGRA collection
Israel Genealogy Research Association
 
RPMS TEMPLATE FOR SCHOOL YEAR 2023-2024 FOR TEACHER 1 TO TEACHER 3
RPMS TEMPLATE FOR SCHOOL YEAR 2023-2024 FOR TEACHER 1 TO TEACHER 3RPMS TEMPLATE FOR SCHOOL YEAR 2023-2024 FOR TEACHER 1 TO TEACHER 3
RPMS TEMPLATE FOR SCHOOL YEAR 2023-2024 FOR TEACHER 1 TO TEACHER 3
IreneSebastianRueco1
 
Digital Artifact 1 - 10VCD Environments Unit
Digital Artifact 1 - 10VCD Environments UnitDigital Artifact 1 - 10VCD Environments Unit
Digital Artifact 1 - 10VCD Environments Unit
chanes7
 
LAND USE LAND COVER AND NDVI OF MIRZAPUR DISTRICT, UP
LAND USE LAND COVER AND NDVI OF MIRZAPUR DISTRICT, UPLAND USE LAND COVER AND NDVI OF MIRZAPUR DISTRICT, UP
LAND USE LAND COVER AND NDVI OF MIRZAPUR DISTRICT, UP
RAHUL
 
ISO/IEC 27001, ISO/IEC 42001, and GDPR: Best Practices for Implementation and...
ISO/IEC 27001, ISO/IEC 42001, and GDPR: Best Practices for Implementation and...ISO/IEC 27001, ISO/IEC 42001, and GDPR: Best Practices for Implementation and...
ISO/IEC 27001, ISO/IEC 42001, and GDPR: Best Practices for Implementation and...
PECB
 
What is Digital Literacy? A guest blog from Andy McLaughlin, University of Ab...
What is Digital Literacy? A guest blog from Andy McLaughlin, University of Ab...What is Digital Literacy? A guest blog from Andy McLaughlin, University of Ab...
What is Digital Literacy? A guest blog from Andy McLaughlin, University of Ab...
GeorgeMilliken2
 

Recently uploaded (20)

Chapter 4 - Islamic Financial Institutions in Malaysia.pptx
Chapter 4 - Islamic Financial Institutions in Malaysia.pptxChapter 4 - Islamic Financial Institutions in Malaysia.pptx
Chapter 4 - Islamic Financial Institutions in Malaysia.pptx
 
Walmart Business+ and Spark Good for Nonprofits.pdf
Walmart Business+ and Spark Good for Nonprofits.pdfWalmart Business+ and Spark Good for Nonprofits.pdf
Walmart Business+ and Spark Good for Nonprofits.pdf
 
clinical examination of hip joint (1).pdf
clinical examination of hip joint (1).pdfclinical examination of hip joint (1).pdf
clinical examination of hip joint (1).pdf
 
How to Fix the Import Error in the Odoo 17
How to Fix the Import Error in the Odoo 17How to Fix the Import Error in the Odoo 17
How to Fix the Import Error in the Odoo 17
 
Azure Interview Questions and Answers PDF By ScholarHat
Azure Interview Questions and Answers PDF By ScholarHatAzure Interview Questions and Answers PDF By ScholarHat
Azure Interview Questions and Answers PDF By ScholarHat
 
PCOS corelations and management through Ayurveda.
PCOS corelations and management through Ayurveda.PCOS corelations and management through Ayurveda.
PCOS corelations and management through Ayurveda.
 
DRUGS AND ITS classification slide share
DRUGS AND ITS classification slide shareDRUGS AND ITS classification slide share
DRUGS AND ITS classification slide share
 
Advanced Java[Extra Concepts, Not Difficult].docx
Advanced Java[Extra Concepts, Not Difficult].docxAdvanced Java[Extra Concepts, Not Difficult].docx
Advanced Java[Extra Concepts, Not Difficult].docx
 
The History of Stoke Newington Street Names
The History of Stoke Newington Street NamesThe History of Stoke Newington Street Names
The History of Stoke Newington Street Names
 
writing about opinions about Australia the movie
writing about opinions about Australia the moviewriting about opinions about Australia the movie
writing about opinions about Australia the movie
 
How to Make a Field Mandatory in Odoo 17
How to Make a Field Mandatory in Odoo 17How to Make a Field Mandatory in Odoo 17
How to Make a Field Mandatory in Odoo 17
 
Pengantar Penggunaan Flutter - Dart programming language1.pptx
Pengantar Penggunaan Flutter - Dart programming language1.pptxPengantar Penggunaan Flutter - Dart programming language1.pptx
Pengantar Penggunaan Flutter - Dart programming language1.pptx
 
Digital Artefact 1 - Tiny Home Environmental Design
Digital Artefact 1 - Tiny Home Environmental DesignDigital Artefact 1 - Tiny Home Environmental Design
Digital Artefact 1 - Tiny Home Environmental Design
 
Smart-Money for SMC traders good time and ICT
Smart-Money for SMC traders good time and ICTSmart-Money for SMC traders good time and ICT
Smart-Money for SMC traders good time and ICT
 
The Diamonds of 2023-2024 in the IGRA collection
The Diamonds of 2023-2024 in the IGRA collectionThe Diamonds of 2023-2024 in the IGRA collection
The Diamonds of 2023-2024 in the IGRA collection
 
RPMS TEMPLATE FOR SCHOOL YEAR 2023-2024 FOR TEACHER 1 TO TEACHER 3
RPMS TEMPLATE FOR SCHOOL YEAR 2023-2024 FOR TEACHER 1 TO TEACHER 3RPMS TEMPLATE FOR SCHOOL YEAR 2023-2024 FOR TEACHER 1 TO TEACHER 3
RPMS TEMPLATE FOR SCHOOL YEAR 2023-2024 FOR TEACHER 1 TO TEACHER 3
 
Digital Artifact 1 - 10VCD Environments Unit
Digital Artifact 1 - 10VCD Environments UnitDigital Artifact 1 - 10VCD Environments Unit
Digital Artifact 1 - 10VCD Environments Unit
 
LAND USE LAND COVER AND NDVI OF MIRZAPUR DISTRICT, UP
LAND USE LAND COVER AND NDVI OF MIRZAPUR DISTRICT, UPLAND USE LAND COVER AND NDVI OF MIRZAPUR DISTRICT, UP
LAND USE LAND COVER AND NDVI OF MIRZAPUR DISTRICT, UP
 
ISO/IEC 27001, ISO/IEC 42001, and GDPR: Best Practices for Implementation and...
ISO/IEC 27001, ISO/IEC 42001, and GDPR: Best Practices for Implementation and...ISO/IEC 27001, ISO/IEC 42001, and GDPR: Best Practices for Implementation and...
ISO/IEC 27001, ISO/IEC 42001, and GDPR: Best Practices for Implementation and...
 
What is Digital Literacy? A guest blog from Andy McLaughlin, University of Ab...
What is Digital Literacy? A guest blog from Andy McLaughlin, University of Ab...What is Digital Literacy? A guest blog from Andy McLaughlin, University of Ab...
What is Digital Literacy? A guest blog from Andy McLaughlin, University of Ab...
 

NEPA BlogCon 2013 - HTML5/CSS3 for Bloggers

  • 1. HTML5 and CSS3 for Bloggers Jason N. Gaylord
  • 2. Why should you care about this stuff? Have you ever authored a blog post that you wanted more control over? Do you use a blog engine (or CMS), such as WordPress, Orchard, Drupal or others and would like to customize the theme?
  • 3. HTML is Born The Internet may have been created by Al Gore… (not actually true) But HTML was developed by Sir Tim Berners-Lee
  • 4. Structured Markup HTML is a set of instructions that help a browser render content in a desired way. Generally speaking, those instructions begin with a less than sign < and end with a greater than sign >. In between the signs, you’ll find an instruction keyword called an HTML tag. All instructions can be written in full form such as <foo></ foo>. Notice that the ending tag contains a forward slash. This helps to indicate that it is a closing tag. Some tags can have nested tags and/or content such as <foo>bar</ foo>.
  • 6. What’s New in HTML 5? New Semantic Elements (article, aside, audio, canvas, figure, footer, header, nav, video, section, etc.) New Attributes (i.e.: Textbox types for calendar, date, email, tel, time, url, etc.) New APIs (audio, video, graphics, history, location, Web Sockets, etc.) which should reduce the need for plug-ins (i.e.: Flash, Silverlight, etc.) and browserspecific implementations. Local (“offline”) storage
  • 7. CSS and What’s New in CSS3? Cascading Style Sheets (CSS) allow control over the style of the content. Style can be inline or in an external file that is referenced. The style follows cascading rules with the most general rules located at the top of the file (regardless of whether it is inline or external). So what’s new? A lot. New selectors, improved border and background capabilities, font capabilities, multi-column capabilities, 2D/3D transforms, page media, etc. Keep away from browser prefixes (i.e.: -moz, -webkit, -ms)
  • 8. Writing HTML DEMO. DEMO. DEMO. Downloads:  http://jasong.us/vs2013rc  http://jasong.us/WLWriter
  • 10. Find Out More Twitter: @jgaylord W3C: w3.org Website: jasongaylord.com CSS Info: css3.info Email: jason@jasongaylord.com W3 Schools: w3schools.com Book: jasong.us/amzn-aspnet45 Modern Testing: modern.ie