SlideShare ist ein Scribd-Unternehmen logo
1 von 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/

Weitere ähnliche Inhalte

Andere mochten auch

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
 

Andere mochten auch (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
 

Mehr von 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
 

Mehr von 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
 

Kürzlich hochgeladen

"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ..."I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...Zilliz
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAndrey Devyatkin
 
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
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...DianaGray10
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CVKhem
 
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbu
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu SubbuApidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbu
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbuapidays
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Jeffrey Haguewood
 
Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024The Digital Insurer
 
A Beginners Guide to Building a RAG App Using Open Source Milvus
A Beginners Guide to Building a RAG App Using Open Source MilvusA Beginners Guide to Building a RAG App Using Open Source Milvus
A Beginners Guide to Building a RAG App Using Open Source MilvusZilliz
 
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
 
Artificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyArtificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyKhushali Kathiriya
 
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingEdi Saputra
 
Navi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Navi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot ModelNavi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Navi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot ModelDeepika Singh
 
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...apidays
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProduct Anonymous
 
Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...
Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...
Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...apidays
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MIND CTI
 
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
 
AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024The Digital Insurer
 

Kürzlich hochgeladen (20)

"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ..."I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of Terraform
 
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
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CV
 
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbu
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu SubbuApidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbu
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbu
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
 
Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024
 
A Beginners Guide to Building a RAG App Using Open Source Milvus
A Beginners Guide to Building a RAG App Using Open Source MilvusA Beginners Guide to Building a RAG App Using Open Source Milvus
A Beginners Guide to Building a RAG App Using Open Source Milvus
 
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
 
Artificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyArtificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : Uncertainty
 
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
 
Navi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Navi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot ModelNavi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Navi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot Model
 
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 
Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...
Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...
Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 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
 
AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 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/