SlideShare a Scribd company logo
1 of 9
How to make website
better ?
Nguyễn Huy Hùng
Contents
 1. Subjects that I’ll talk in this seminar
 Sprite
 Using tags effectiveness
 Response website.
2. Write in techblog
-Display: inline , block , inline-block ,
-Float: left vs text-align: center + display: inline-block.
-power of Clear: both
-Border-radius in IE7
Think and think
 Nowaday, people who makes Website always follow
MVC standard but when we think about the website’s
speed, we only think about increase the speed in
Model and Controller, but the View is also important, it
takes 1/3 in MVC model.
 A good website is a website that has not only good
Model and Controller but also good View.
1.Sprite
 An image sprite is a collection of images put into a
single image.
 A web page with many images can take a long time to
load and generates multiple server requests.
 Using image sprites will reduce the number of server
requests and save bandwidth.
 Demo
2.Use tags effectiveness
 Use minimum number of tags , but quality is best
 Demo
3.1 Good website, can be
better?
 A good website can be better ?
 Demo a good website
3.2 Response Web and Better
 The website can be better when we use response
website
 Responsive web design (RWD) is a web design
approach aimed at crafting sites to provide an optimal
viewing experience-easy reading and navigation with a
minimum of resizing, panning, and scrolling-across a
wide range of devices (from mobile phones to desktop
computer monitors
 Demo
 Can be made better ???
3.3 Server for mobile
 The best thing is when we have a separate server for
mobile that has the same databases.
 Use very easily http://mobilewebrockstar.com/detect-
mobile-browser/ , it help to detect when use mobile to
view , after redirect to version mobile.
References
 END , thanks for watching
References :
 http://www.stephentgilbert.com/mediaqueries/
 http://www.1stwebdesigner.com/css/create-a-responsive-
website-video-tutorial/
 https://github.com/sebarmeli/JS-Redirection-Mobile-Site
 http://izwebz.com/

More Related Content

Viewers also liked

Game Development with Pygame
Game Development with PygameGame Development with Pygame
Game Development with PygameFramgia Vietnam
 
Some ways to DRY in Rails
Some ways to DRY in Rails Some ways to DRY in Rails
Some ways to DRY in Rails Framgia Vietnam
 
Functional Programming With Elixir
Functional Programming With ElixirFunctional Programming With Elixir
Functional Programming With ElixirFramgia Vietnam
 
View, Store Procedure & Function and Trigger in MySQL - Thaipt
View, Store Procedure & Function and Trigger in MySQL - ThaiptView, Store Procedure & Function and Trigger in MySQL - Thaipt
View, Store Procedure & Function and Trigger in MySQL - ThaiptFramgia Vietnam
 
Build public private cloud using openstack
Build public private cloud using openstackBuild public private cloud using openstack
Build public private cloud using openstackFramgia Vietnam
 

Viewers also liked (7)

Game Development with Pygame
Game Development with PygameGame Development with Pygame
Game Development with Pygame
 
Dreamers defense
Dreamers defenseDreamers defense
Dreamers defense
 
HTML5 DRAG AND DROP
HTML5 DRAG AND DROPHTML5 DRAG AND DROP
HTML5 DRAG AND DROP
 
Some ways to DRY in Rails
Some ways to DRY in Rails Some ways to DRY in Rails
Some ways to DRY in Rails
 
Functional Programming With Elixir
Functional Programming With ElixirFunctional Programming With Elixir
Functional Programming With Elixir
 
View, Store Procedure & Function and Trigger in MySQL - Thaipt
View, Store Procedure & Function and Trigger in MySQL - ThaiptView, Store Procedure & Function and Trigger in MySQL - Thaipt
View, Store Procedure & Function and Trigger in MySQL - Thaipt
 
Build public private cloud using openstack
Build public private cloud using openstackBuild public private cloud using openstack
Build public private cloud using openstack
 

More from Framgia Vietnam

Audited activerecord - QuanHV
Audited activerecord - QuanHVAudited activerecord - QuanHV
Audited activerecord - QuanHVFramgia Vietnam
 
Client side validations gem - KhanhHD
Client side validations gem - KhanhHDClient side validations gem - KhanhHD
Client side validations gem - KhanhHDFramgia Vietnam
 
Backbone.js and rails - BanLV
Backbone.js and rails - BanLVBackbone.js and rails - BanLV
Backbone.js and rails - BanLVFramgia Vietnam
 
Jenkins and rails app - Le Dinh Vu
Jenkins and rails app - Le Dinh VuJenkins and rails app - Le Dinh Vu
Jenkins and rails app - Le Dinh VuFramgia Vietnam
 
Canvas in html5 - TungVD
Canvas in html5 - TungVDCanvas in html5 - TungVD
Canvas in html5 - TungVDFramgia Vietnam
 
Memory management in cocos2d x - Le Duy Vu
Memory management in cocos2d x - Le Duy VuMemory management in cocos2d x - Le Duy Vu
Memory management in cocos2d x - Le Duy VuFramgia Vietnam
 
JMS and ActiveMQ - VuNV 201307
JMS and ActiveMQ - VuNV 201307JMS and ActiveMQ - VuNV 201307
JMS and ActiveMQ - VuNV 201307Framgia Vietnam
 
Jquery validate - TuanNA
Jquery validate - TuanNAJquery validate - TuanNA
Jquery validate - TuanNAFramgia Vietnam
 
Continuous integration - ThangTD
Continuous integration - ThangTDContinuous integration - ThangTD
Continuous integration - ThangTDFramgia Vietnam
 
Seminar globalize3 - DungNV
Seminar globalize3 - DungNVSeminar globalize3 - DungNV
Seminar globalize3 - DungNVFramgia Vietnam
 
Introduction to Tornado - TienNA
Introduction to Tornado - TienNAIntroduction to Tornado - TienNA
Introduction to Tornado - TienNAFramgia Vietnam
 
Some Tricks in Using Terminal - KienDT
Some Tricks in Using Terminal - KienDTSome Tricks in Using Terminal - KienDT
Some Tricks in Using Terminal - KienDTFramgia Vietnam
 

More from Framgia Vietnam (15)

An idea - NghiaLV
An idea - NghiaLVAn idea - NghiaLV
An idea - NghiaLV
 
Audited activerecord - QuanHV
Audited activerecord - QuanHVAudited activerecord - QuanHV
Audited activerecord - QuanHV
 
Delegate - KhanhLD
Delegate - KhanhLDDelegate - KhanhLD
Delegate - KhanhLD
 
Client side validations gem - KhanhHD
Client side validations gem - KhanhHDClient side validations gem - KhanhHD
Client side validations gem - KhanhHD
 
Backbone.js and rails - BanLV
Backbone.js and rails - BanLVBackbone.js and rails - BanLV
Backbone.js and rails - BanLV
 
Jenkins and rails app - Le Dinh Vu
Jenkins and rails app - Le Dinh VuJenkins and rails app - Le Dinh Vu
Jenkins and rails app - Le Dinh Vu
 
Canvas in html5 - TungVD
Canvas in html5 - TungVDCanvas in html5 - TungVD
Canvas in html5 - TungVD
 
Auto it - AnhPC
Auto it - AnhPCAuto it - AnhPC
Auto it - AnhPC
 
Memory management in cocos2d x - Le Duy Vu
Memory management in cocos2d x - Le Duy VuMemory management in cocos2d x - Le Duy Vu
Memory management in cocos2d x - Le Duy Vu
 
JMS and ActiveMQ - VuNV 201307
JMS and ActiveMQ - VuNV 201307JMS and ActiveMQ - VuNV 201307
JMS and ActiveMQ - VuNV 201307
 
Jquery validate - TuanNA
Jquery validate - TuanNAJquery validate - TuanNA
Jquery validate - TuanNA
 
Continuous integration - ThangTD
Continuous integration - ThangTDContinuous integration - ThangTD
Continuous integration - ThangTD
 
Seminar globalize3 - DungNV
Seminar globalize3 - DungNVSeminar globalize3 - DungNV
Seminar globalize3 - DungNV
 
Introduction to Tornado - TienNA
Introduction to Tornado - TienNAIntroduction to Tornado - TienNA
Introduction to Tornado - TienNA
 
Some Tricks in Using Terminal - KienDT
Some Tricks in Using Terminal - KienDTSome Tricks in Using Terminal - KienDT
Some Tricks in Using Terminal - KienDT
 

Recently uploaded

Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024The Digital Insurer
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoffsammart93
 
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationGenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationMichael W. Hawkins
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024The Digital Insurer
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Scriptwesley chun
 
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationRadu Cotescu
 
Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...Enterprise Knowledge
 
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...apidays
 
🐬 The future of MySQL is Postgres 🐘
🐬  The future of MySQL is Postgres   🐘🐬  The future of MySQL is Postgres   🐘
🐬 The future of MySQL is Postgres 🐘RTylerCroy
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProduct Anonymous
 
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptxHampshireHUG
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerThousandEyes
 
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, AdobeApidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobeapidays
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfsudhanshuwaghmare1
 
GenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdfGenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdflior mazor
 
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdfUnderstanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdfUK Journal
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Miguel Araújo
 
Artificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsArtificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsJoaquim Jorge
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024The Digital Insurer
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024Rafal Los
 

Recently uploaded (20)

Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
 
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationGenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day Presentation
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Script
 
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organization
 
Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...
 
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
 
🐬 The future of MySQL is Postgres 🐘
🐬  The future of MySQL is Postgres   🐘🐬  The future of MySQL is Postgres   🐘
🐬 The future of MySQL is Postgres 🐘
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, AdobeApidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
 
GenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdfGenAI Risks & Security Meetup 01052024.pdf
GenAI Risks & Security Meetup 01052024.pdf
 
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdfUnderstanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
 
Artificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsArtificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and Myths
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
 

How to make website better ? - HungNH

  • 1. How to make website better ? Nguyễn Huy Hùng
  • 2. Contents  1. Subjects that I’ll talk in this seminar  Sprite  Using tags effectiveness  Response website. 2. Write in techblog -Display: inline , block , inline-block , -Float: left vs text-align: center + display: inline-block. -power of Clear: both -Border-radius in IE7
  • 3. Think and think  Nowaday, people who makes Website always follow MVC standard but when we think about the website’s speed, we only think about increase the speed in Model and Controller, but the View is also important, it takes 1/3 in MVC model.  A good website is a website that has not only good Model and Controller but also good View.
  • 4. 1.Sprite  An image sprite is a collection of images put into a single image.  A web page with many images can take a long time to load and generates multiple server requests.  Using image sprites will reduce the number of server requests and save bandwidth.  Demo
  • 5. 2.Use tags effectiveness  Use minimum number of tags , but quality is best  Demo
  • 6. 3.1 Good website, can be better?  A good website can be better ?  Demo a good website
  • 7. 3.2 Response Web and Better  The website can be better when we use response website  Responsive web design (RWD) is a web design approach aimed at crafting sites to provide an optimal viewing experience-easy reading and navigation with a minimum of resizing, panning, and scrolling-across a wide range of devices (from mobile phones to desktop computer monitors  Demo  Can be made better ???
  • 8. 3.3 Server for mobile  The best thing is when we have a separate server for mobile that has the same databases.  Use very easily http://mobilewebrockstar.com/detect- mobile-browser/ , it help to detect when use mobile to view , after redirect to version mobile.
  • 9. References  END , thanks for watching References :  http://www.stephentgilbert.com/mediaqueries/  http://www.1stwebdesigner.com/css/create-a-responsive- website-video-tutorial/  https://github.com/sebarmeli/JS-Redirection-Mobile-Site  http://izwebz.com/