Website Concepts & Workflow Tips

Understand where you are starting from

A visitor will always be judging your website from the first time they land on your Home Page. Sometimes this could be an internal page but most of the time people will land directly onto your home page. The job of a web designer is to captivate their audience with a stunning homepage layout, beautiful graphics, usable navigation links, and plenty of relatable content.

In order to achieve this, you need to found out as much as you can from your client. What are their goals and objectives for their site? Web designers often use hit and trial methods to get awesome looking layouts for their websites however, understanding layouts and its techniques will help you to build your website faster and make it look more professional.

Keep this in mind, clients won’t always contact you to start something from scratch. In most cases you will have to understand the system currently in place, and if your project is meant to challenge it, find opportunities to evolve it, or follow it as it is.

In this post we list 5 Workflow tips for web designers to assist along the way. This is part one of the Workflow tips.

  1. Define The Goal
  2. Thoughts To Paper
  3. Framework
  4. Adding a Grid
  5. Choose Your Typography

Web Design Workflow Tips

Define The Goal

1.) Define The Goal

Defining goals and objectives for your website will help you achieve clarity in your project. Besides the description of the site, you need to know what the expectations are for it. Take the time to ask yourself why you want a website and how your final site will help you accomplish your goals and provide a better user experience as a result.

Here are some suggested questions to ask below.

  • Why is it important for you to have a website?
  • What are your objectives?
  • How will you measure success?
  • Whom do you envision as your core users?
  • What do you want those users to gain by visiting your website?
  • What do you want users to do after or while they’re on your website?
  • How does your idea for a website compare with others?
  • Do you expect to make money on your website?

After you have determined your site’s goals, you can organise the route users should take to move through your site according to those goals.

2). Thoughts To Paper

Workflow - Thoughts To Paper

Put your thoughts on paper first. Think about the content, the layout and the functionality before starting to drop shadows and trying to get fancy. Design is about solving problems, and those problems can’t be resolved through gradients or shadows but rather through good layout and clear objectives.

3.) Framework

To create the look an feel of a website you need to come up with or choose a good framework that solves all the design problems. The framework is the UI that surrounds the content and helps the user perform actions and navigate through it. It includes the navigation and components like sidebars and bottom bars.

If you approach your design from this perspective, you will have a clear understanding of what your layout needs will be when designing sections beyond the homepage.

4). Adding a Grid

Add a Grid

A grid will help you to structure the layout of the different sections and help you to create responsive templates. Grids help you to achieve effective alignment and consistency with little effort. “Winging it” and relying on your gut does not scale so well. If executed properly, your designs will appear thoughtful, organized, neat and structurally sound.

5). Choose Your Typography


Exploring different typefaces and colours is part of the discovery phase of a project. Designers have been known to compare choosing fonts for design projects to choosing an outfit to wear. Think about what your clothes might say about you: based on what you wear, people might rightly or wrongly make assumptions about your style, your personality, background, or the age you wish you were. Remember for different occasions and situations, call for different apparel. For example, you wouldn’t wear a bathing suit to a job interview.

Now, what your clothes do for you, font choices serve the same purpose in web design. Typography often provides that at-a-glance first impression that people gauge and judge the rest of the design by. So in short, your font choices need to be purposeful and appropriate.

We will be adding more points to this post so keep a look out for the following Web Design Workflow tips.

  • Choosing your Colour Theme
  • Layout Concepts
    • Elements Position
    • Placing Content and Secondary Content
    • Choosing Grid System
    • Whitespace
    • Balance
  • Think in Motion – Interactive Experiences

Thanks for reading.

Website Workflow Tips – Part Two

Web Design Academy
Practical Web and Graphic Design Courses. Adobe Training. We offer a range of subjects to cover all aspects of Website Design, Web & Mobile Development and Graphic Design. We also have subjects in Search Optimisation and Social Media Marketing.

Leave a Comment

Start typing and press Enter to search

Pin It on Pinterest

A.I and Chatbotsstudy-web-design-freelance-gauteng