8 Quick Tips to Start Designing Websites


It seems that almost everyone has a website. If you are in business, a website is vital, and for everyone else, a site can be a great way to make some extra money. Creating and designing a web site from scratch isn’t easy.

There are folks who spent a lot of time in school trying to master this skill, but still many average, untrained individuals want to design their own site. While some of these sites come out amateurish, others are successful doing their own web design in a polished, professional manner.

If you are someone thinking about doing your own web design, the following quick web design tips and a copy of Adobe Photoshop should help you along greatly. These 8 quick web design tips won’t make you a master, but they should help you to get a sleek, quality site off the ground.

Sketch it out before you start

White Board

Image from: Gary Lambert

Before you even turn your computer on, sit down with a pencil and some pieces of paper and sketch out what you want your site to look like. It will be much easier to create your page in Photoshop if you already know exactly what you want.

Get a template and use a grid

By using a grid, you can make sure that your page and all of the elements on it are neatly lined up. If you are off by even a pixel or two, your site may otherwise look sloppy. Snap elements into your grid to be sure it is all orderly and neat.

Learn shortcuts

Tips and Tricks used by Professionals

Image from Photoshop Crash Course eBook

You can do a lot with Photoshop, and you can do even more with keyboard shortcuts. As you learn how to do design, everything will be even more frustrating as you scroll through menus to find what you need. There is a shortcut for almost everything!

Stay organized

checklist photo

As you make changes, save often, and save old drafts. You never know if you may end up wanting to go back to a previous version later. Be sure to save them with names that let you know if something is an original, a final, or the fourth draft.  

Make your history longer

undo levels

Before you do anything else, go to your Photoshop preferences and increase the value for the History. As you are learning Photoshop and design, you may need to go 30 steps back to find where you first goofed, but your history probably won’t let you go back that far by default.  

Pick up the pen tool

useful complete Adobe photoshop pen tool guide

If you are newer to Photoshop, the Pen Tool can be scary. It is also a great resource, so start to get acquainted with it, since it could make your life a bit easier. It can help when masking images or adding illustrations, among other things.

Be subtle

You probably want the elements on your site to POP, so it is tempting to make visual elements harsh and bold to make sure that they will stand out. If you use a little self-control, especially with contrast and gradients, you will make a polished professional site, and your emphasized elements will still be noted.

Personalize Photoshop 

Photoshop Learning Tutorial and Shortcuts

Image from Photoshop Shortcuts for Professionals

As you create your website, Photoshop is your workspace. Just like with your desk, you want to make sure that it is organized so things you need often are at hand, and tools you nearly never used are properly tucked away. Hide away menus that are not of any use to you, and consider toying around with the default settings so that even more is already your way.

Note from the editor: This article is provided by Kevin Moor who writes for different sites, which inter alias are working to find better disk cleaner. Mr Moor is solely responsible for all the content. 

create free website wix below post

Further Related Readings

  1. Nimsrules April 1, 2012 at 12:02 am

    These are fabulous tips. “Keep it subtle and simple” – a key element to minimalism. I have a request though, can you please share how to resize and align the social count buttons you’ve included in ‘Share the Love’?

    1. Tayyab April 2, 2012 at 5:26 am


      you can use one of these if you need these buttons on a blog: http://www.designzzz.com/wordpress-social-bookmarking-addons-plugins/

  2. Gurvinder SIngh Patialvi April 1, 2012 at 12:21 am

    This is very nice tutorial. Nice Tips

  3. tmartinezjr April 4, 2012 at 10:10 am

    Awesome tips, but where can I get a template or grid to make sure everything’s neatly lined up?

    1. Tayyab April 4, 2012 at 5:13 pm

      You just need to enable it in your software. The command is likely to be in View Menu>Use Grid.

  4. rowmim June 1, 2012 at 12:40 pm

    This is very good tutorial for beginners. Cheers!

  5. bestjobstore June 1, 2012 at 12:42 pm

    nice article but do you give some tips about how can i convert photoshop image into html page .

    1. Tayyab June 2, 2012 at 7:11 am

      You can use “Save for Web and Devices” command in File menu.

Comments are closed.

Copyrights © 2016 - Designzzz. All Rights Reserved