SlideShare a Scribd company logo
1 of 29
HTML, CSS, Javascript
   Best Practices
Presenter: Dang Minh Tuan
About me
• Just a “Web Standard” lover
• Nick: zmt , zmt264, ohisee, ohisee.com
  (ddth.com, diendanphp.com …)
HTML, CSS, Javascript and MVC
• Model = HTML
HTML, CSS, Javascript and MVC
• View = CSS
HTML, CSS, Javascript and MVC
• Controller = Javascript (or browser?)
HTML , CSS and Javascript
           Best Practices




• Best Practices = nguyên tắc thực hành?
Oh! It’s so simple. Where can we go
                 further?
• CSS Framework: YUI Grids, Blue Print ...
• Javascript Framework: Jquery, YUI ...
• Build your own?
How to build a web site using CSS?
• Top-down (optimize-oriented) or Bottom-up
  (modul-oriented)?
• 5 minutes demo?
So...
• What’s the Good? The best? The Ugly?
• It’s your Answers.
Any questions?



• Thank you for your attention




                   • More: Ohisee.com

More Related Content

Viewers also liked

build your own php extension
build your own php extensionbuild your own php extension
build your own php extensionhazzaz
 
social network game
social network gamesocial network game
social network gamehazzaz
 
how startups can benefit from launch community
how startups can benefit from launch communityhow startups can benefit from launch community
how startups can benefit from launch communityhazzaz
 
speed up ntvv2 by php ext module
speed up ntvv2 by php ext modulespeed up ntvv2 by php ext module
speed up ntvv2 by php ext modulehazzaz
 
EAV in Magento
EAV in MagentoEAV in Magento
EAV in Magentohazzaz
 
zingmepracticeforbuildingscalablewebsitewithphp
zingmepracticeforbuildingscalablewebsitewithphpzingmepracticeforbuildingscalablewebsitewithphp
zingmepracticeforbuildingscalablewebsitewithphphazzaz
 

Viewers also liked (8)

build your own php extension
build your own php extensionbuild your own php extension
build your own php extension
 
social network game
social network gamesocial network game
social network game
 
how startups can benefit from launch community
how startups can benefit from launch communityhow startups can benefit from launch community
how startups can benefit from launch community
 
Hurricanes and social media are similar
Hurricanes and social media are similarHurricanes and social media are similar
Hurricanes and social media are similar
 
Zing
ZingZing
Zing
 
speed up ntvv2 by php ext module
speed up ntvv2 by php ext modulespeed up ntvv2 by php ext module
speed up ntvv2 by php ext module
 
EAV in Magento
EAV in MagentoEAV in Magento
EAV in Magento
 
zingmepracticeforbuildingscalablewebsitewithphp
zingmepracticeforbuildingscalablewebsitewithphpzingmepracticeforbuildingscalablewebsitewithphp
zingmepracticeforbuildingscalablewebsitewithphp
 

Similar to HTML CSS JS Best Practices Guide

Getting started with dev tools (4/10/17 DC)
Getting started with dev tools (4/10/17 DC)Getting started with dev tools (4/10/17 DC)
Getting started with dev tools (4/10/17 DC)Daniel Friedman
 
Child Themes, Starter Themes, and Frameworks... Oh My!
Child Themes, Starter Themes, and Frameworks... Oh My!Child Themes, Starter Themes, and Frameworks... Oh My!
Child Themes, Starter Themes, and Frameworks... Oh My!Julie Kuehl
 
Website anatomy - What makes a good website?
Website anatomy - What makes a good website?Website anatomy - What makes a good website?
Website anatomy - What makes a good website?Zakery Kates
 
Getting started with dev tools (05 09-17, santa monica) upload
Getting started with dev tools (05 09-17, santa monica) uploadGetting started with dev tools (05 09-17, santa monica) upload
Getting started with dev tools (05 09-17, santa monica) uploadThinkful
 
How to Build a Powerful Small Business Website
How to Build a Powerful Small Business WebsiteHow to Build a Powerful Small Business Website
How to Build a Powerful Small Business WebsiteReal Time Web Marketing
 
Building a Powerful Small Business Website
Building a Powerful Small Business WebsiteBuilding a Powerful Small Business Website
Building a Powerful Small Business WebsiteReal Time Web Marketing
 
The web standards gentleman: a matter of (evolving) standards)
The web standards gentleman: a matter of (evolving) standards)The web standards gentleman: a matter of (evolving) standards)
The web standards gentleman: a matter of (evolving) standards)Chris Mills
 
Understand front end developer
Understand front end developerUnderstand front end developer
Understand front end developerHsuan Fu Lien
 
css_trends
css_trendscss_trends
css_trendshazzaz
 
SEO and search plugins
SEO and search pluginsSEO and search plugins
SEO and search pluginsdotCMS
 
FITC - 2012-04-23 - Responsive Web Design
FITC - 2012-04-23 - Responsive Web DesignFITC - 2012-04-23 - Responsive Web Design
FITC - 2012-04-23 - Responsive Web DesignFrédéric Harper
 
How to Pitch a VC (Shanghai, May 2012)
How to Pitch a VC (Shanghai, May 2012)How to Pitch a VC (Shanghai, May 2012)
How to Pitch a VC (Shanghai, May 2012)Dave McClure
 
Sharing is Caring - Web Development Resources
Sharing is Caring - Web Development ResourcesSharing is Caring - Web Development Resources
Sharing is Caring - Web Development ResourcesTrevor Barnes
 
How to pich a VC (by Dave McClure)
How to pich a VC (by Dave McClure)How to pich a VC (by Dave McClure)
How to pich a VC (by Dave McClure)Ricardo Dantas
 
Building fast aspnet websites
Building fast aspnet websitesBuilding fast aspnet websites
Building fast aspnet websitesMaarten Louage
 

Similar to HTML CSS JS Best Practices Guide (20)

Getting started with dev tools (4/10/17 DC)
Getting started with dev tools (4/10/17 DC)Getting started with dev tools (4/10/17 DC)
Getting started with dev tools (4/10/17 DC)
 
Child Themes, Starter Themes, and Frameworks... Oh My!
Child Themes, Starter Themes, and Frameworks... Oh My!Child Themes, Starter Themes, and Frameworks... Oh My!
Child Themes, Starter Themes, and Frameworks... Oh My!
 
Website anatomy - What makes a good website?
Website anatomy - What makes a good website?Website anatomy - What makes a good website?
Website anatomy - What makes a good website?
 
Getting started with dev tools (05 09-17, santa monica) upload
Getting started with dev tools (05 09-17, santa monica) uploadGetting started with dev tools (05 09-17, santa monica) upload
Getting started with dev tools (05 09-17, santa monica) upload
 
How to Build a Powerful Small Business Website
How to Build a Powerful Small Business WebsiteHow to Build a Powerful Small Business Website
How to Build a Powerful Small Business Website
 
Wp 3hr-course
Wp 3hr-courseWp 3hr-course
Wp 3hr-course
 
Building a Powerful Small Business Website
Building a Powerful Small Business WebsiteBuilding a Powerful Small Business Website
Building a Powerful Small Business Website
 
The web standards gentleman: a matter of (evolving) standards)
The web standards gentleman: a matter of (evolving) standards)The web standards gentleman: a matter of (evolving) standards)
The web standards gentleman: a matter of (evolving) standards)
 
Responsive web-design
Responsive web-designResponsive web-design
Responsive web-design
 
Seo 24th june chagford
Seo 24th june   chagfordSeo 24th june   chagford
Seo 24th june chagford
 
Why your business needs Social Media Campaign
Why your business needs Social Media CampaignWhy your business needs Social Media Campaign
Why your business needs Social Media Campaign
 
Understand front end developer
Understand front end developerUnderstand front end developer
Understand front end developer
 
css_trends
css_trendscss_trends
css_trends
 
SEO and search plugins
SEO and search pluginsSEO and search plugins
SEO and search plugins
 
FITC - 2012-04-23 - Responsive Web Design
FITC - 2012-04-23 - Responsive Web DesignFITC - 2012-04-23 - Responsive Web Design
FITC - 2012-04-23 - Responsive Web Design
 
How to Pitch a VC (Shanghai, May 2012)
How to Pitch a VC (Shanghai, May 2012)How to Pitch a VC (Shanghai, May 2012)
How to Pitch a VC (Shanghai, May 2012)
 
Http _css-tricks
Http  _css-tricksHttp  _css-tricks
Http _css-tricks
 
Sharing is Caring - Web Development Resources
Sharing is Caring - Web Development ResourcesSharing is Caring - Web Development Resources
Sharing is Caring - Web Development Resources
 
How to pich a VC (by Dave McClure)
How to pich a VC (by Dave McClure)How to pich a VC (by Dave McClure)
How to pich a VC (by Dave McClure)
 
Building fast aspnet websites
Building fast aspnet websitesBuilding fast aspnet websites
Building fast aspnet websites
 

More from hazzaz

Coffee1
Coffee1Coffee1
Coffee1hazzaz
 
Suy ngam
Suy ngamSuy ngam
Suy ngamhazzaz
 
Tu dong dat hang tu he thong ban le lon nhat trung quoc
Tu dong dat hang tu he thong ban le lon nhat trung quocTu dong dat hang tu he thong ban le lon nhat trung quoc
Tu dong dat hang tu he thong ban le lon nhat trung quochazzaz
 
trung oss magento overview
trung oss magento overviewtrung oss magento overview
trung oss magento overviewhazzaz
 
su dung drupal xay dung mang xa hoi
su dung drupal xay dung mang xa hoisu dung drupal xay dung mang xa hoi
su dung drupal xay dung mang xa hoihazzaz
 
html5 css3 the future of web technology
html5 css3 the future of web technologyhtml5 css3 the future of web technology
html5 css3 the future of web technologyhazzaz
 
java script unit testing framework
java script unit testing frameworkjava script unit testing framework
java script unit testing frameworkhazzaz
 
kiem tien online
kiem tien onlinekiem tien online
kiem tien onlinehazzaz
 
web optimization
web optimizationweb optimization
web optimizationhazzaz
 
mysql optimization
mysql optimizationmysql optimization
mysql optimizationhazzaz
 
Phan mem tu do nguon mo
Phan mem tu do nguon moPhan mem tu do nguon mo
Phan mem tu do nguon mohazzaz
 
Howtobuildyourownframework
HowtobuildyourownframeworkHowtobuildyourownframework
Howtobuildyourownframeworkhazzaz
 
nguyenhainhathuy-building-restful-web-service
nguyenhainhathuy-building-restful-web-servicenguyenhainhathuy-building-restful-web-service
nguyenhainhathuy-building-restful-web-servicehazzaz
 
Node js
Node jsNode js
Node jshazzaz
 
nguyen-duc-phu-search-engine
nguyen-duc-phu-search-enginenguyen-duc-phu-search-engine
nguyen-duc-phu-search-enginehazzaz
 
02 phan-thai-trung-drupal
02 phan-thai-trung-drupal02 phan-thai-trung-drupal
02 phan-thai-trung-drupalhazzaz
 

More from hazzaz (19)

Coffee1
Coffee1Coffee1
Coffee1
 
Suy ngam
Suy ngamSuy ngam
Suy ngam
 
Tu dong dat hang tu he thong ban le lon nhat trung quoc
Tu dong dat hang tu he thong ban le lon nhat trung quocTu dong dat hang tu he thong ban le lon nhat trung quoc
Tu dong dat hang tu he thong ban le lon nhat trung quoc
 
trung oss magento overview
trung oss magento overviewtrung oss magento overview
trung oss magento overview
 
su dung drupal xay dung mang xa hoi
su dung drupal xay dung mang xa hoisu dung drupal xay dung mang xa hoi
su dung drupal xay dung mang xa hoi
 
html5 css3 the future of web technology
html5 css3 the future of web technologyhtml5 css3 the future of web technology
html5 css3 the future of web technology
 
java script unit testing framework
java script unit testing frameworkjava script unit testing framework
java script unit testing framework
 
kiem tien online
kiem tien onlinekiem tien online
kiem tien online
 
web optimization
web optimizationweb optimization
web optimization
 
mysql optimization
mysql optimizationmysql optimization
mysql optimization
 
Albus
AlbusAlbus
Albus
 
Cloud
CloudCloud
Cloud
 
Phan mem tu do nguon mo
Phan mem tu do nguon moPhan mem tu do nguon mo
Phan mem tu do nguon mo
 
redis
redisredis
redis
 
Howtobuildyourownframework
HowtobuildyourownframeworkHowtobuildyourownframework
Howtobuildyourownframework
 
nguyenhainhathuy-building-restful-web-service
nguyenhainhathuy-building-restful-web-servicenguyenhainhathuy-building-restful-web-service
nguyenhainhathuy-building-restful-web-service
 
Node js
Node jsNode js
Node js
 
nguyen-duc-phu-search-engine
nguyen-duc-phu-search-enginenguyen-duc-phu-search-engine
nguyen-duc-phu-search-engine
 
02 phan-thai-trung-drupal
02 phan-thai-trung-drupal02 phan-thai-trung-drupal
02 phan-thai-trung-drupal
 

Recently uploaded

What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024Stephanie Beckett
 
Designing IA for AI - Information Architecture Conference 2024
Designing IA for AI - Information Architecture Conference 2024Designing IA for AI - Information Architecture Conference 2024
Designing IA for AI - Information Architecture Conference 2024Enterprise Knowledge
 
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek SchlawackFwdays
 
Human Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR SystemsHuman Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR SystemsMark Billinghurst
 
CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):comworks
 
Search Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfSearch Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfRankYa
 
"Federated learning: out of reach no matter how close",Oleksandr Lapshyn
"Federated learning: out of reach no matter how close",Oleksandr Lapshyn"Federated learning: out of reach no matter how close",Oleksandr Lapshyn
"Federated learning: out of reach no matter how close",Oleksandr LapshynFwdays
 
Vector Databases 101 - An introduction to the world of Vector Databases
Vector Databases 101 - An introduction to the world of Vector DatabasesVector Databases 101 - An introduction to the world of Vector Databases
Vector Databases 101 - An introduction to the world of Vector DatabasesZilliz
 
SAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptxSAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptxNavinnSomaal
 
AI as an Interface for Commercial Buildings
AI as an Interface for Commercial BuildingsAI as an Interface for Commercial Buildings
AI as an Interface for Commercial BuildingsMemoori
 
Powerpoint exploring the locations used in television show Time Clash
Powerpoint exploring the locations used in television show Time ClashPowerpoint exploring the locations used in television show Time Clash
Powerpoint exploring the locations used in television show Time Clashcharlottematthew16
 
DevEX - reference for building teams, processes, and platforms
DevEX - reference for building teams, processes, and platformsDevEX - reference for building teams, processes, and platforms
DevEX - reference for building teams, processes, and platformsSergiu Bodiu
 
DevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache MavenDevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache MavenHervé Boutemy
 
Commit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyCommit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyAlfredo García Lavilla
 
Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 365Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 3652toLead Limited
 
Dev Dives: Streamline document processing with UiPath Studio Web
Dev Dives: Streamline document processing with UiPath Studio WebDev Dives: Streamline document processing with UiPath Studio Web
Dev Dives: Streamline document processing with UiPath Studio WebUiPathCommunity
 
Install Stable Diffusion in windows machine
Install Stable Diffusion in windows machineInstall Stable Diffusion in windows machine
Install Stable Diffusion in windows machinePadma Pradeep
 
"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii SoldatenkoFwdays
 
Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?Mattias Andersson
 

Recently uploaded (20)

What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024
 
Designing IA for AI - Information Architecture Conference 2024
Designing IA for AI - Information Architecture Conference 2024Designing IA for AI - Information Architecture Conference 2024
Designing IA for AI - Information Architecture Conference 2024
 
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptxE-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
 
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack
 
Human Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR SystemsHuman Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR Systems
 
CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):
 
Search Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfSearch Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdf
 
"Federated learning: out of reach no matter how close",Oleksandr Lapshyn
"Federated learning: out of reach no matter how close",Oleksandr Lapshyn"Federated learning: out of reach no matter how close",Oleksandr Lapshyn
"Federated learning: out of reach no matter how close",Oleksandr Lapshyn
 
Vector Databases 101 - An introduction to the world of Vector Databases
Vector Databases 101 - An introduction to the world of Vector DatabasesVector Databases 101 - An introduction to the world of Vector Databases
Vector Databases 101 - An introduction to the world of Vector Databases
 
SAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptxSAP Build Work Zone - Overview L2-L3.pptx
SAP Build Work Zone - Overview L2-L3.pptx
 
AI as an Interface for Commercial Buildings
AI as an Interface for Commercial BuildingsAI as an Interface for Commercial Buildings
AI as an Interface for Commercial Buildings
 
Powerpoint exploring the locations used in television show Time Clash
Powerpoint exploring the locations used in television show Time ClashPowerpoint exploring the locations used in television show Time Clash
Powerpoint exploring the locations used in television show Time Clash
 
DevEX - reference for building teams, processes, and platforms
DevEX - reference for building teams, processes, and platformsDevEX - reference for building teams, processes, and platforms
DevEX - reference for building teams, processes, and platforms
 
DevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache MavenDevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache Maven
 
Commit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyCommit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easy
 
Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 365Ensuring Technical Readiness For Copilot in Microsoft 365
Ensuring Technical Readiness For Copilot in Microsoft 365
 
Dev Dives: Streamline document processing with UiPath Studio Web
Dev Dives: Streamline document processing with UiPath Studio WebDev Dives: Streamline document processing with UiPath Studio Web
Dev Dives: Streamline document processing with UiPath Studio Web
 
Install Stable Diffusion in windows machine
Install Stable Diffusion in windows machineInstall Stable Diffusion in windows machine
Install Stable Diffusion in windows machine
 
"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko
 
Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?
 

HTML CSS JS Best Practices Guide