SlideShare a Scribd company logo
Professional Web Design Tips & Tricks
Here are 12 great tips and tricks from professional web designers:

   1. Put Important Information Near the Top

      Organize your pages from the top down. Important info should be easy to find.

   2. Limit Length of Pages

      Two or three screens should be the maximum length of any page.

   3. Make Navigation Simple

      Be consistent in your placement of navigational tool, i.e. menus, buttons, etc.

   4. Make Images As Small As Possible

      Reduce physical size of images in Paint program before placing in your web
      page.

   5. Use Web Palette (216 colors)

      This keeps files small and makes images look good on all monitors and
      systems.

   6. Use GIF and JPEG Properly

      Use JPEG for photos and GIF for everything else.

   7. Avoid Busy Backgrounds

      Text should be easy to read. Make sure you have enough contrast.

   8. Use ALT Parameter (low-res and/or text) for Images

      This is important for people viewing your pages with older computers.

   9. Avoid Excessive Animation

      Don’t animate images unless you have a good reason – it can be very
      irritating.
10. Use Tables to Format Text and Images

   This is the best way to control your layout.

11. Use Common Fonts

   This ensures that everyone sees your page as you designed it.

12. Don’t Center Entire Pages

   Use this only for titles and special situations.

More Related Content

Similar to Professional web design tips and tricks

15 guidelines to effective presentations
15 guidelines to effective presentations15 guidelines to effective presentations
15 guidelines to effective presentationsApurupa Devi Valluru
 
Web Design 101
Web Design 101Web Design 101
Web Design 101
T.S. Lim
 
Typography and Colors for GUI Designers
Typography and Colors for GUI DesignersTypography and Colors for GUI Designers
Typography and Colors for GUI Designers
Ravi Bhadauria
 
Usability and Accessiblity
Usability and AccessiblityUsability and Accessiblity
Usability and AccessiblityDarren Jackson
 
Creating Power Point Presentations | www.sampleassignment.com
Creating Power Point Presentations | www.sampleassignment.comCreating Power Point Presentations | www.sampleassignment.com
Creating Power Point Presentations | www.sampleassignment.com
Sample Assignment
 
Advance Webpage Design.pptx
Advance Webpage Design.pptxAdvance Webpage Design.pptx
Advance Webpage Design.pptx
ConpereyILS
 
Learn ios design
Learn ios designLearn ios design
Learn ios design
gayatrichauhan
 
Handout: Good Practice For Mobile Internet Sites
Handout: Good Practice For Mobile Internet SitesHandout: Good Practice For Mobile Internet Sites
Handout: Good Practice For Mobile Internet Sitesmobilewebslides
 
File types pro forma
File types pro formaFile types pro forma
File types pro forma
Cam Stannard
 
Designing responsive web design in FIGMA
Designing responsive web design in FIGMADesigning responsive web design in FIGMA
Designing responsive web design in FIGMA
Fibonalabs
 
Delivering Effective Power Point Presentations
Delivering Effective Power Point PresentationsDelivering Effective Power Point Presentations
Delivering Effective Power Point Presentations
Khan Mohammad Mahmud Hasan
 
File types
File typesFile types
File types
Bradley Cox
 
Basic Web Design In Dreamweaver
Basic Web Design In DreamweaverBasic Web Design In Dreamweaver
Basic Web Design In Dreamweaver
jcharnin
 
10 tips for getting the most out of keynote
10 tips for getting the most out of keynote10 tips for getting the most out of keynote
10 tips for getting the most out of keynote
John Smith
 
Imaging and Design for Online Environment
Imaging and Design for Online EnvironmentImaging and Design for Online Environment
Imaging and Design for Online Environment
Ped Barbosa
 
wallpaper for ipad
wallpaper for ipadwallpaper for ipad
wallpaper for ipadwindway91
 
File types
File typesFile types
File types
Demi Jay
 
20 Website Tips for Professional and Effective Web Design
20 Website Tips for Professional and Effective Web Design20 Website Tips for Professional and Effective Web Design
20 Website Tips for Professional and Effective Web Design
Brandie Davis
 
Digital graphics file formats
Digital graphics file formatsDigital graphics file formats
Digital graphics file formats
Lee Morrell
 
Advanced presentation skills
Advanced presentation skillsAdvanced presentation skills
Advanced presentation skills
Calu Roque
 

Similar to Professional web design tips and tricks (20)

15 guidelines to effective presentations
15 guidelines to effective presentations15 guidelines to effective presentations
15 guidelines to effective presentations
 
Web Design 101
Web Design 101Web Design 101
Web Design 101
 
Typography and Colors for GUI Designers
Typography and Colors for GUI DesignersTypography and Colors for GUI Designers
Typography and Colors for GUI Designers
 
Usability and Accessiblity
Usability and AccessiblityUsability and Accessiblity
Usability and Accessiblity
 
Creating Power Point Presentations | www.sampleassignment.com
Creating Power Point Presentations | www.sampleassignment.comCreating Power Point Presentations | www.sampleassignment.com
Creating Power Point Presentations | www.sampleassignment.com
 
Advance Webpage Design.pptx
Advance Webpage Design.pptxAdvance Webpage Design.pptx
Advance Webpage Design.pptx
 
Learn ios design
Learn ios designLearn ios design
Learn ios design
 
Handout: Good Practice For Mobile Internet Sites
Handout: Good Practice For Mobile Internet SitesHandout: Good Practice For Mobile Internet Sites
Handout: Good Practice For Mobile Internet Sites
 
File types pro forma
File types pro formaFile types pro forma
File types pro forma
 
Designing responsive web design in FIGMA
Designing responsive web design in FIGMADesigning responsive web design in FIGMA
Designing responsive web design in FIGMA
 
Delivering Effective Power Point Presentations
Delivering Effective Power Point PresentationsDelivering Effective Power Point Presentations
Delivering Effective Power Point Presentations
 
File types
File typesFile types
File types
 
Basic Web Design In Dreamweaver
Basic Web Design In DreamweaverBasic Web Design In Dreamweaver
Basic Web Design In Dreamweaver
 
10 tips for getting the most out of keynote
10 tips for getting the most out of keynote10 tips for getting the most out of keynote
10 tips for getting the most out of keynote
 
Imaging and Design for Online Environment
Imaging and Design for Online EnvironmentImaging and Design for Online Environment
Imaging and Design for Online Environment
 
wallpaper for ipad
wallpaper for ipadwallpaper for ipad
wallpaper for ipad
 
File types
File typesFile types
File types
 
20 Website Tips for Professional and Effective Web Design
20 Website Tips for Professional and Effective Web Design20 Website Tips for Professional and Effective Web Design
20 Website Tips for Professional and Effective Web Design
 
Digital graphics file formats
Digital graphics file formatsDigital graphics file formats
Digital graphics file formats
 
Advanced presentation skills
Advanced presentation skillsAdvanced presentation skills
Advanced presentation skills
 

More from Tim Tan

tanyeongchye_digitalmarketing-FEBRUARY-2023.pdf
tanyeongchye_digitalmarketing-FEBRUARY-2023.pdftanyeongchye_digitalmarketing-FEBRUARY-2023.pdf
tanyeongchye_digitalmarketing-FEBRUARY-2023.pdf
Tim Tan
 
28 ways to make money with your website
28 ways to make money with your website28 ways to make money with your website
28 ways to make money with your website
Tim Tan
 
Email Marketing Presentation 2019
Email Marketing Presentation 2019Email Marketing Presentation 2019
Email Marketing Presentation 2019
Tim Tan
 
Hostels in Singapore
Hostels in SingaporeHostels in Singapore
Hostels in Singapore
Tim Tan
 
Wordpress Workshop Outline 2018
Wordpress Workshop Outline 2018Wordpress Workshop Outline 2018
Wordpress Workshop Outline 2018
Tim Tan
 
Understanding Internet marketing
Understanding Internet marketingUnderstanding Internet marketing
Understanding Internet marketing
Tim Tan
 
5 steps-to-make-a-website
5 steps-to-make-a-website5 steps-to-make-a-website
5 steps-to-make-a-website
Tim Tan
 

More from Tim Tan (7)

tanyeongchye_digitalmarketing-FEBRUARY-2023.pdf
tanyeongchye_digitalmarketing-FEBRUARY-2023.pdftanyeongchye_digitalmarketing-FEBRUARY-2023.pdf
tanyeongchye_digitalmarketing-FEBRUARY-2023.pdf
 
28 ways to make money with your website
28 ways to make money with your website28 ways to make money with your website
28 ways to make money with your website
 
Email Marketing Presentation 2019
Email Marketing Presentation 2019Email Marketing Presentation 2019
Email Marketing Presentation 2019
 
Hostels in Singapore
Hostels in SingaporeHostels in Singapore
Hostels in Singapore
 
Wordpress Workshop Outline 2018
Wordpress Workshop Outline 2018Wordpress Workshop Outline 2018
Wordpress Workshop Outline 2018
 
Understanding Internet marketing
Understanding Internet marketingUnderstanding Internet marketing
Understanding Internet marketing
 
5 steps-to-make-a-website
5 steps-to-make-a-website5 steps-to-make-a-website
5 steps-to-make-a-website
 

Professional web design tips and tricks

  • 1. Professional Web Design Tips & Tricks Here are 12 great tips and tricks from professional web designers: 1. Put Important Information Near the Top Organize your pages from the top down. Important info should be easy to find. 2. Limit Length of Pages Two or three screens should be the maximum length of any page. 3. Make Navigation Simple Be consistent in your placement of navigational tool, i.e. menus, buttons, etc. 4. Make Images As Small As Possible Reduce physical size of images in Paint program before placing in your web page. 5. Use Web Palette (216 colors) This keeps files small and makes images look good on all monitors and systems. 6. Use GIF and JPEG Properly Use JPEG for photos and GIF for everything else. 7. Avoid Busy Backgrounds Text should be easy to read. Make sure you have enough contrast. 8. Use ALT Parameter (low-res and/or text) for Images This is important for people viewing your pages with older computers. 9. Avoid Excessive Animation Don’t animate images unless you have a good reason – it can be very irritating.
  • 2. 10. Use Tables to Format Text and Images This is the best way to control your layout. 11. Use Common Fonts This ensures that everyone sees your page as you designed it. 12. Don’t Center Entire Pages Use this only for titles and special situations.