WordPress web designers
WordPress Web Design Workflow
A Guide to Starting a New Project
Logo, Fonts, Colors, and Assets
Are you starting a new WordPress web design project? If so, you’ll want to make sure you follow a streamlined process from start to finish. In this article, we’ll walk you through our recommended workflow for starting a new project. We’ll cover everything from logo design to fonts and colors, and we’ll also show you how to import assets into your WordPress site. Let’s get started!
There are some basic rules you should follow before starting the website project. It will make things a lot easier and ultimately save time in the designing process.
- ZLogo
- ZFont
- ZColors
- ZAssets
Logo
One of the first steps in any web design project is creating a logo. If you’re working with a client, they may already have a logo that they want you to use. In other cases, you may need to create a new logo from scratch. Either way, it’s important to have a clear understanding of the client’s branding before you begin designing the site.
If you’re creating a new logo, start by brainstorming some ideas. Once you have a few concepts that you like, begin refining them until you arrive at a final design. Remember to keep the client’s branding in mind throughout the process. After all, the logo is one of the first things visitors will see when they come to the site.
You could hire someone on Fiverr for a low fee or use Canva Free; some other free online apps are available on the internet.
If you hire someone to design the logo please make sure to get the source files so you can edit them later. The best is when the logo is vector-based in order to be scalable.
Source file format should be png, jpg, PSD (Photoshop), Ai (Adobe Illustrator)
The most important thing you need to know about WordPress logos is the size and dimensions; make sure your logo fits in a square that’s 250px wide by 150 px tall, or at least close enough
Useful Links
Font
The right font can make a big difference in the overall look and feel of your site. When choosing fonts, you’ll want to consider both style and readability. You don’t want to use a fancy script font that’s difficult to read, but you also don’t want to use a plain sans-serif font that looks boring.
When selecting fonts, it’s also important to consider how they’ll work with the colors you’ve chosen for your site. You don’t want to use two similar fonts that will compete with each other, or two contrasting fonts that will be difficult to read. Instead , try to find a balance between the two.
Finally, make sure you have enough font variations to cover all the different elements on your site. You’ll need a heading font, a body font, and perhaps even a separate font for your navigation menu. By having a few different fonts to choose from, you can create a more cohesive overall design.
Know Your Audience. Who is your target audience? Are they younger or older adults?
Take your time choosing a font. It’s something you don’t want to change later. Although technically, it’s possible depending on what WordPress theme you are using.
I recommend using a font pair from Google Fonts. They have a lot available. A website called “Font Pair” presents you with an idea about font combinations.
Alternatively, you can upload your own font to WordPress.
Useful Links
Colors
Color philosophy
The color red is known for its vibrant and exciting qualities, which can be used to attract attention or promote a sense of urgency. Red also stimulates the appetite, so it’s perfect if your site sells food! Black on white text typically makes content more readable than pure black backgrounds because dark colors make words harder to see against lighter ones.
The website coolors.co is an excellent resource for colors. See trendy colors and what color palettes peoples are using.
I recommend putting together a color palette on Coolors, not more than 4-6 colors. You can save the color palette for later use and even export it as an image file for your reference. Don’t forget to make a note of the color hex code.
Useful Links
Assets
What kind of website are you making? Asking this question will help to identify the best assets to use. Spy on other websites in the same niche and get some inspiration.
Don’t download images from Google Image. They are trademark protected, use stock photos websites, they provide royalty-free images.
PRO Tips
Use Google Chrome extensions
some super tools are available to spy on other websites.
-
Hoverify (paid)
- has a rich feature
- similar to Inspect in Google Chrome, but easier to understand
- identify the color hex code
- see with what tools the website was built
- responsive view
- take screenshot
-
What font (free)
- activate it and hover over a font and see the font name.
-
ColorZilla (free)
- color picker