Submit Search
Upload
Introduction to HTML5+CSS
•
5 likes
•
1,381 views
Ramses Cabello
Follow
Brief introduction to HTML5+CSS for designers.
Read less
Read more
Design
Technology
Report
Share
Report
Share
1 of 30
Download now
Download to read offline
Recommended
Html for beginners
Html for beginners
Florian Letsch
Web1O1 - Intro to HTML/CSS
Web1O1 - Intro to HTML/CSS
NYCSS Meetup
HTML+CSS: how to get started
HTML+CSS: how to get started
Dimitris Tsironis
Responsive Web Design (April 18th, Los Angeles)
Responsive Web Design (April 18th, Los Angeles)
Thinkful
Html
Html
Rudresh Shrivastav
Web development basics
Web development basics
Kalluri Vinay Reddy
Htmlcss1
Htmlcss1
mreckman
Html css crash course may 11th, atlanta
Html css crash course may 11th, atlanta
Thinkful
Recommended
Html for beginners
Html for beginners
Florian Letsch
Web1O1 - Intro to HTML/CSS
Web1O1 - Intro to HTML/CSS
NYCSS Meetup
HTML+CSS: how to get started
HTML+CSS: how to get started
Dimitris Tsironis
Responsive Web Design (April 18th, Los Angeles)
Responsive Web Design (April 18th, Los Angeles)
Thinkful
Html
Html
Rudresh Shrivastav
Web development basics
Web development basics
Kalluri Vinay Reddy
Htmlcss1
Htmlcss1
mreckman
Html css crash course may 11th, atlanta
Html css crash course may 11th, atlanta
Thinkful
HTML CSS and Web Development
HTML CSS and Web Development
Rahul Mishra
Thinkful - Frontend Crash Course - Intro to HTML/CSS
Thinkful - Frontend Crash Course - Intro to HTML/CSS
TJ Stalcup
Php workshop L0 Introduction
Php workshop L0 Introduction
Mohammad Tahsin Alshalabi
Lesson 109 23 aug13-1430-ay
Lesson 109 23 aug13-1430-ay
Codecademy Ren
√ Web designing company in mumbai
√ Web designing company in mumbai
Css Founder
Lesson 01
Lesson 01
Gene Babon
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-12-173-252-450
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-12-173-252-450
Justin Ezor
20 tips and tricks
20 tips and tricks
fallenhero1777
Lesson 111 24 aug13-1430-ay
Lesson 111 24 aug13-1430-ay
Codecademy Ren
Front End Best Practices
Front End Best Practices
Holger Bartel
How to manage a big scale HTML/CSS project
How to manage a big scale HTML/CSS project
Renoir Boulanger
Lesson 01
Lesson 01
Gene Babon
Why Blogs Are Better
Why Blogs Are Better
Tris Hussey
Week 1 - How the Web Woks + Wordpress 101
Week 1 - How the Web Woks + Wordpress 101
Drake Martinet
Introduction to Wordpress (Research Based)
Introduction to Wordpress (Research Based)
Anjum Hashir
Customizing microsoft word ui
Customizing microsoft word ui
Corthall
HTML Lesson 2
HTML Lesson 2
Danny Ambrosio
Building Websites with WordPress UBC Summer 2012
Building Websites with WordPress UBC Summer 2012
Tris Hussey
How to Resolve one Very Annoying Blog Spacing Issue
How to Resolve one Very Annoying Blog Spacing Issue
Julie Anne
Techtalk
Techtalk
hijonathan
Adobe Q1 2016 Quarterly Earnings
Adobe Q1 2016 Quarterly Earnings
Adobe
матрёшка
матрёшка
Serhiy_
More Related Content
What's hot
HTML CSS and Web Development
HTML CSS and Web Development
Rahul Mishra
Thinkful - Frontend Crash Course - Intro to HTML/CSS
Thinkful - Frontend Crash Course - Intro to HTML/CSS
TJ Stalcup
Php workshop L0 Introduction
Php workshop L0 Introduction
Mohammad Tahsin Alshalabi
Lesson 109 23 aug13-1430-ay
Lesson 109 23 aug13-1430-ay
Codecademy Ren
√ Web designing company in mumbai
√ Web designing company in mumbai
Css Founder
Lesson 01
Lesson 01
Gene Babon
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-12-173-252-450
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-12-173-252-450
Justin Ezor
20 tips and tricks
20 tips and tricks
fallenhero1777
Lesson 111 24 aug13-1430-ay
Lesson 111 24 aug13-1430-ay
Codecademy Ren
Front End Best Practices
Front End Best Practices
Holger Bartel
How to manage a big scale HTML/CSS project
How to manage a big scale HTML/CSS project
Renoir Boulanger
Lesson 01
Lesson 01
Gene Babon
Why Blogs Are Better
Why Blogs Are Better
Tris Hussey
Week 1 - How the Web Woks + Wordpress 101
Week 1 - How the Web Woks + Wordpress 101
Drake Martinet
Introduction to Wordpress (Research Based)
Introduction to Wordpress (Research Based)
Anjum Hashir
Customizing microsoft word ui
Customizing microsoft word ui
Corthall
HTML Lesson 2
HTML Lesson 2
Danny Ambrosio
Building Websites with WordPress UBC Summer 2012
Building Websites with WordPress UBC Summer 2012
Tris Hussey
How to Resolve one Very Annoying Blog Spacing Issue
How to Resolve one Very Annoying Blog Spacing Issue
Julie Anne
Techtalk
Techtalk
hijonathan
What's hot
(20)
HTML CSS and Web Development
HTML CSS and Web Development
Thinkful - Frontend Crash Course - Intro to HTML/CSS
Thinkful - Frontend Crash Course - Intro to HTML/CSS
Php workshop L0 Introduction
Php workshop L0 Introduction
Lesson 109 23 aug13-1430-ay
Lesson 109 23 aug13-1430-ay
√ Web designing company in mumbai
√ Web designing company in mumbai
Lesson 01
Lesson 01
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-12-173-252-450
Deck 893ff61f-1fb8-4e15-a379-775dfdbcee77-12-173-252-450
20 tips and tricks
20 tips and tricks
Lesson 111 24 aug13-1430-ay
Lesson 111 24 aug13-1430-ay
Front End Best Practices
Front End Best Practices
How to manage a big scale HTML/CSS project
How to manage a big scale HTML/CSS project
Lesson 01
Lesson 01
Why Blogs Are Better
Why Blogs Are Better
Week 1 - How the Web Woks + Wordpress 101
Week 1 - How the Web Woks + Wordpress 101
Introduction to Wordpress (Research Based)
Introduction to Wordpress (Research Based)
Customizing microsoft word ui
Customizing microsoft word ui
HTML Lesson 2
HTML Lesson 2
Building Websites with WordPress UBC Summer 2012
Building Websites with WordPress UBC Summer 2012
How to Resolve one Very Annoying Blog Spacing Issue
How to Resolve one Very Annoying Blog Spacing Issue
Techtalk
Techtalk
Viewers also liked
Adobe Q1 2016 Quarterly Earnings
Adobe Q1 2016 Quarterly Earnings
Adobe
матрёшка
матрёшка
Serhiy_
Aimopp For Presentation
Aimopp For Presentation
Jinky Quizon
Dropbox
Dropbox
lorenasanchezsuarez1101
3 d pie chart circular puzzle with hole in center process 12 stages style 2 p...
3 d pie chart circular puzzle with hole in center process 12 stages style 2 p...
SlideTeam.net
貓纜驚奇
貓纜驚奇
dondonma
LeAP Leadership Accelerator Program
LeAP Leadership Accelerator Program
E2EPeoplePractices
Cora quizon-ok
Cora quizon-ok
Jinky Quizon
Diversifying Your Digital Marketing Efforts | SMX East 2013
Diversifying Your Digital Marketing Efforts | SMX East 2013
97th Floor
Guia de estudio mapa
Guia de estudio mapa
Marjorie Reveco Saravia
Market briefing- London
Market briefing- London
The Economist Media Businesses
New Technologies That Save Time & Money - HLA 2009
New Technologies That Save Time & Money - HLA 2009
Sarah Houghton
24 04 2015 Икт в метод работе
24 04 2015 Икт в метод работе
отдел образования
Charcoal drawing portfolio 2013
Charcoal drawing portfolio 2013
Sharlena Wood
Presentation for aec
Presentation for aec
Gloriannexcelsis
Universidad nacional de san agustín: su historia de vergüenza
Universidad nacional de san agustín: su historia de vergüenza
lerikrat
ציפיות הלקוח, תפיסת השירות של המחר
ציפיות הלקוח, תפיסת השירות של המחר
hachamd
October Newsletter
October Newsletter
Erica Sinicropi
The Mall of the World
The Mall of the World
Marina Kolesnichenko
Entrepreneurial Journeys - Part 1
Entrepreneurial Journeys - Part 1
Rajesh Lalwani
Viewers also liked
(20)
Adobe Q1 2016 Quarterly Earnings
Adobe Q1 2016 Quarterly Earnings
матрёшка
матрёшка
Aimopp For Presentation
Aimopp For Presentation
Dropbox
Dropbox
3 d pie chart circular puzzle with hole in center process 12 stages style 2 p...
3 d pie chart circular puzzle with hole in center process 12 stages style 2 p...
貓纜驚奇
貓纜驚奇
LeAP Leadership Accelerator Program
LeAP Leadership Accelerator Program
Cora quizon-ok
Cora quizon-ok
Diversifying Your Digital Marketing Efforts | SMX East 2013
Diversifying Your Digital Marketing Efforts | SMX East 2013
Guia de estudio mapa
Guia de estudio mapa
Market briefing- London
Market briefing- London
New Technologies That Save Time & Money - HLA 2009
New Technologies That Save Time & Money - HLA 2009
24 04 2015 Икт в метод работе
24 04 2015 Икт в метод работе
Charcoal drawing portfolio 2013
Charcoal drawing portfolio 2013
Presentation for aec
Presentation for aec
Universidad nacional de san agustín: su historia de vergüenza
Universidad nacional de san agustín: su historia de vergüenza
ציפיות הלקוח, תפיסת השירות של המחר
ציפיות הלקוח, תפיסת השירות של המחר
October Newsletter
October Newsletter
The Mall of the World
The Mall of the World
Entrepreneurial Journeys - Part 1
Entrepreneurial Journeys - Part 1
Similar to Introduction to HTML5+CSS
Class1slides
Class1slides
Alexis Goldstein
GDI Seattle Intro to HTML and CSS - Class 1
GDI Seattle Intro to HTML and CSS - Class 1
Heather Rock
Going native with html5 web components
Going native with html5 web components
James York
Lesson 1: Introduction to HTML
Lesson 1: Introduction to HTML
Olivia Moran
Html:css crash course (4:5)
Html:css crash course (4:5)
Thinkful
HTML language
HTML language
Anna Rita Colella
Rakshat bhati
Rakshat bhati
Rakshat bhati
HTML & CSS.ppt
HTML & CSS.ppt
vaseemshaik21
Leran html
Leran html
johir kan123
Importance of HTML
Importance of HTML
PSK Technolgies Pvt. Ltd. IT Company Nagpur
INTRODUCTIONS OF HTML
INTRODUCTIONS OF HTML
SURYANARAYANBISWAL1
Raju
Raju
Shiva Krishna Chandra Shekar
Intro to HTML & CSS
Intro to HTML & CSS
Syed Sami
introdution-to-html.ppt
introdution-to-html.ppt
ChemOyasan1
HTML for absolutely begginers
HTML for absolutely begginers
Tanbin Islam Siyam
Web development using HTML and CSS
Web development using HTML and CSS
SiddhantSingh980217
HTML.pptx
HTML.pptx
vikasmittal92
Web Designing Training in Ambala ! BATRA COMPUTER CENTRE
Web Designing Training in Ambala ! BATRA COMPUTER CENTRE
jatin batra
An Seo’s Intro to Web Dev, HTML, CSS and JavaScript
An Seo’s Intro to Web Dev, HTML, CSS and JavaScript
Troyfawkes
Presentation 1 [autosaved]
Presentation 1 [autosaved]
AbdulrahmaanDhagacad
Similar to Introduction to HTML5+CSS
(20)
Class1slides
Class1slides
GDI Seattle Intro to HTML and CSS - Class 1
GDI Seattle Intro to HTML and CSS - Class 1
Going native with html5 web components
Going native with html5 web components
Lesson 1: Introduction to HTML
Lesson 1: Introduction to HTML
Html:css crash course (4:5)
Html:css crash course (4:5)
HTML language
HTML language
Rakshat bhati
Rakshat bhati
HTML & CSS.ppt
HTML & CSS.ppt
Leran html
Leran html
Importance of HTML
Importance of HTML
INTRODUCTIONS OF HTML
INTRODUCTIONS OF HTML
Raju
Raju
Intro to HTML & CSS
Intro to HTML & CSS
introdution-to-html.ppt
introdution-to-html.ppt
HTML for absolutely begginers
HTML for absolutely begginers
Web development using HTML and CSS
Web development using HTML and CSS
HTML.pptx
HTML.pptx
Web Designing Training in Ambala ! BATRA COMPUTER CENTRE
Web Designing Training in Ambala ! BATRA COMPUTER CENTRE
An Seo’s Intro to Web Dev, HTML, CSS and JavaScript
An Seo’s Intro to Web Dev, HTML, CSS and JavaScript
Presentation 1 [autosaved]
Presentation 1 [autosaved]
More from Ramses Cabello
Accessibility First
Accessibility First
Ramses Cabello
Adobe Illustrator – Minimal introduction
Adobe Illustrator – Minimal introduction
Ramses Cabello
Till Altmann - Industrial Designer in Unisto (Switzerland)
Till Altmann - Industrial Designer in Unisto (Switzerland)
Ramses Cabello
HTML+CSS Resources
HTML+CSS Resources
Ramses Cabello
Meet the grids - Web design using Grids
Meet the grids - Web design using Grids
Ramses Cabello
CSS - Style your site
CSS - Style your site
Ramses Cabello
More from Ramses Cabello
(6)
Accessibility First
Accessibility First
Adobe Illustrator – Minimal introduction
Adobe Illustrator – Minimal introduction
Till Altmann - Industrial Designer in Unisto (Switzerland)
Till Altmann - Industrial Designer in Unisto (Switzerland)
HTML+CSS Resources
HTML+CSS Resources
Meet the grids - Web design using Grids
Meet the grids - Web design using Grids
CSS - Style your site
CSS - Style your site
Recently uploaded
定制(RMIT毕业证书)澳洲墨尔本皇家理工大学毕业证成绩单原版一比一
定制(RMIT毕业证书)澳洲墨尔本皇家理工大学毕业证成绩单原版一比一
lvtagr7
2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
yuu sss
办理学位证(NUS证书)新加坡国立大学毕业证成绩单原版一比一
办理学位证(NUS证书)新加坡国立大学毕业证成绩单原版一比一
Fi L
PORTFOLIO DE ARQUITECTURA CRISTOBAL HERAUD 2024
PORTFOLIO DE ARQUITECTURA CRISTOBAL HERAUD 2024
CristobalHeraud
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
Fi sss
毕业文凭制作#回国入职#diploma#degree澳洲弗林德斯大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
毕业文凭制作#回国入职#diploma#degree澳洲弗林德斯大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
ttt fff
How to Empower the future of UX Design with Gen AI
How to Empower the future of UX Design with Gen AI
yuj
Dubai Calls Girl Tapes O525547819 Real Tapes Escort Services Dubai
Dubai Calls Girl Tapes O525547819 Real Tapes Escort Services Dubai
kojalkojal131
Design principles on typography in design
Design principles on typography in design
nooreen17
昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档
昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档
208367051
Call In girls Bhikaji Cama Place 🔝 ⇛8377877756 FULL Enjoy Delhi NCR
Call In girls Bhikaji Cama Place 🔝 ⇛8377877756 FULL Enjoy Delhi NCR
dollysharma2066
3D Printing And Designing Final Report.pdf
3D Printing And Designing Final Report.pdf
SwaraliBorhade
Architecture case study India Habitat Centre, Delhi.pdf
Architecture case study India Habitat Centre, Delhi.pdf
Sumit Lathwal
Design Portfolio - 2024 - William Vickery
Design Portfolio - 2024 - William Vickery
WilliamVickery6
group_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdf
neelspinoy
Call Us ✡️97111⇛47426⇛Call In girls Vasant Vihar༒(Delhi)
Call Us ✡️97111⇛47426⇛Call In girls Vasant Vihar༒(Delhi)
jennyeacort
Call Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts Service
Call Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts Service
jennyeacort
Call Girls Meghani Nagar 7397865700 Independent Call Girls
Call Girls Meghani Nagar 7397865700 Independent Call Girls
ssuser7cb4ff
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025
Rndexperts
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025
Rndexperts
Recently uploaded
(20)
定制(RMIT毕业证书)澳洲墨尔本皇家理工大学毕业证成绩单原版一比一
定制(RMIT毕业证书)澳洲墨尔本皇家理工大学毕业证成绩单原版一比一
2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
办理学位证(NUS证书)新加坡国立大学毕业证成绩单原版一比一
办理学位证(NUS证书)新加坡国立大学毕业证成绩单原版一比一
PORTFOLIO DE ARQUITECTURA CRISTOBAL HERAUD 2024
PORTFOLIO DE ARQUITECTURA CRISTOBAL HERAUD 2024
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
毕业文凭制作#回国入职#diploma#degree澳洲弗林德斯大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
毕业文凭制作#回国入职#diploma#degree澳洲弗林德斯大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
How to Empower the future of UX Design with Gen AI
How to Empower the future of UX Design with Gen AI
Dubai Calls Girl Tapes O525547819 Real Tapes Escort Services Dubai
Dubai Calls Girl Tapes O525547819 Real Tapes Escort Services Dubai
Design principles on typography in design
Design principles on typography in design
昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档
昆士兰大学毕业证(UQ毕业证)#文凭成绩单#真实留信学历认证永久存档
Call In girls Bhikaji Cama Place 🔝 ⇛8377877756 FULL Enjoy Delhi NCR
Call In girls Bhikaji Cama Place 🔝 ⇛8377877756 FULL Enjoy Delhi NCR
3D Printing And Designing Final Report.pdf
3D Printing And Designing Final Report.pdf
Architecture case study India Habitat Centre, Delhi.pdf
Architecture case study India Habitat Centre, Delhi.pdf
Design Portfolio - 2024 - William Vickery
Design Portfolio - 2024 - William Vickery
group_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdf
Call Us ✡️97111⇛47426⇛Call In girls Vasant Vihar༒(Delhi)
Call Us ✡️97111⇛47426⇛Call In girls Vasant Vihar༒(Delhi)
Call Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts Service
Call Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts Service
Call Girls Meghani Nagar 7397865700 Independent Call Girls
Call Girls Meghani Nagar 7397865700 Independent Call Girls
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025
Introduction to HTML5+CSS
1.
INTRODUCTION TO HTML5 +
CSS ramses.cabello@gmail.com @ramsescabello
2.
why the hell do
you have to learn HTML5 + CSS ?
3.
why the hell do
you have to learn HTML5 + CSS ? YOU ARE A DESIGNER.
4.
Ok. So now... What
is HTML ?
5.
Ok. So now... What
is HTML ?
6.
Computers don’t think, but
YOU DO!.
7.
HTML is the
language used by you to write websites and therefore help computers communicate.
8.
Computers translate HTML into
our language using a tool called Browser.
9.
What is the
structure of HTML language?
10.
<head> HTML is like you.
11.
Website Title Author Description <head> HTML is like
you.
12.
Website Title Author Description <head> The content of
the web. <body> HTML is like you.
13.
HTML is like you. CSS
defines your style.
14.
HTML is like you. CSS
defines your style.
15.
Just in case
you missed out.
16.
HTML defines the
content. Hello World!
17.
HTML defines the
content. CSS defines the style. Hello World!
18.
before we get
started! 1 Get paper & pen 2 Download a great Open Source editor www.brackets.io 3 Have a lot of patience. Learning takes time. You can do it.
19.
html syntax <html> Name of
the function Function starts Function ends
20.
html syntaxhtml syntax every
beginning has an end. <html> content </html>
21.
<body> <p>Hello</p> </body> html syntaxhtml syntax BE
CLEAN! Indent all your code.
22.
<body> <p>Hello</p> </body> html syntaxhtml syntax BE
CLEAN! Indent all your code.
23.
html syntax Sample tag:
Paragraphs <p>Here you would write all the text from the paragraph</p>
24.
html syntax Sample tag:
Images <img src=”name.jpg” alt=”” />
25.
html syntax Sample tag:
Images <img src=”name.jpg” alt=”” /> Some HTML tags close themselves. Inside a tag you can have variables.
26.
html syntax Sample tag:
Links <a href=”url” alt=””> Name of the link </a>
27.
html online resources www.google.com
28.
html online resources http://www.w3schools.com/html/default.asp
29.
html online resources http://tympanus.net/codrops/
30.
let’s get started! http://bit.ly/EjemploHTMLProduccionGrafica
Download now