Tarot for the Web

A Guide for DIY-ing Your Website

Embodying The Fool:

5 minute read

If you’re designing and building your own website for the first time, HELL YEAH! Crafting an experience in a digital space is exciting, fun, and can equally be overwhelming and like “wtf am I doing?”.

This guide is here to help you build your website with more flow and ease. This is like a “where do I start?” for folx who have never ever created a website. I must say this by no means is an exhaustive list of everything that goes into crafting a website. This resource has very “The Fool" like tarot energy. Worth noting as a web designer that I do not think that you’re a fool for DIY-ing your website :)

I feel like I need to mention this now: I highly recommend that you have your brand identity in place before crafting your site. Your brand identity includes your logo, color palette, and fonts. These elements create a cohesive look and feel for your website. Without a brand identity, you’ll likely spin your wheels and burn yourself out when creating your website. This doesn’t mean that you necessarily have to pay a brand designer, especially if you’re just getting your business started. Pearler has a fabulous DIY brand resource that’s about $50 USD. Check it out!

Ok, so let’s begin…

STEP 1 - Define Your Website Goals

Start by answering these questions, like literally write the answers down. You don’t have to answer them in order.

Why do I need a website?
How will a website serve me and my business?
What are the must haves? For example, will my website visitors need to book with me or buy products?
What is my annual budget for a website? Including booking/scheduling, ecommerce, analytic, membership tools. Most website builders have separate or additional pricing for schedulers and e-commerce.
How often will I need to update my website? If you’re selling physical or digital products or have services that change frequently, you’re going to have to make changes to your website to reflect these new products and/or services.
How tech literate am I? You could start a free trial on a website builder to test your knowledge. Most offer a limited free trial. Your level of tech literacy will guide you to which platform builder is going to best suit your knowledge. For example, SquareSpace is a drag and drop builder which makes it easier for those that have no front end coding abilities.
Also, at this time, I like to see if the domain I want is available, and how much it will cost. If you know what website builder you’ll be using, you can likely purchase your domain through them.
If you’re an erotic or an adult content business, you’ll likely have to use Wordpress.org and a third-party hosting provider for your web hosting and domain. Learn more about Wordpress.org.
Woo Tip: Use Mercury (Wednesday) or Sun day to answer these questions.

Answering the above will help you identify your short term and long term website goals as well as identify if you can design and build your website or if you need to call in support. Additionally, answering these questions will help you explore what your options are, meaning which website platform is right for you or if building from scratch is the route to go.

STEP 2 - Plan Your Site Structure & Navigation

Begin to think about what web pages you need. For example “home” is a web page, “about” is a web page. Refer to your website must-haves in Step 1 to identify web pages needed. For your first website, you likely don’t need more than ten web pages. This doesn’t include landing pages.

Identifying your web pages will help you determine what your primary and secondary navigation will be. For example, on Hex Codes and Woo website has “All Services” as the primary navigation, and “Website Design & Build” as a secondary navigation.
Try to minimize your website navigation. Having too many options is overwhelming for visitors. Keeping your primary navigation to 5-8 options is best.
You want your web visitors to be able to find what they’re looking for on your website. Meaning, if you offer services, having a navigation title of “Services” or “Offerings” clearly states what your web visitors will find on that web page when they select that navigation.
Look at your competitor websites to see how they’ve structured their site.
Woo Tip: I like doing this on Saturn (Saturday) day since web navigation is about the structure of the website, it’s the bones.

Step 3 Gather Inspiration

Create a pinterest board, or a dedicated place, where you collect other websites you love; make sure to note what you love about them. The more specific you can be about what you love the better as this will clarify aspects of your website. So when it comes time to designing and building it, you know what you want. Remember tho to be realistic about your abilities. If you see a really dope design, you could always hire someone, like meeee, to do it!

It’s helpful to look at your competitor’s website and/or businesses that are in the same field/industry.
Woo Tip: Gather inspo on Jupiter (Thursday) or Venus (Friday) day!

STEP 4 - Write Your Website Copy

Draft website copy

Begin to think through and write the copy for your website. Based on the web pages that you identified in Step 2, draft copy for those pages. And draft the copy in a google doc or word processor. Don’t write directly in the website platform builder.
Really think about what your audience wants to read and hear.
Most people scan web pages, so you probably need less words than you think.
I know AI is super popular for copy writing these days, BUT try to do it yourself or hire someone. Your writing is unique, and I think this will attract more people to you than anything AI can write.
If you can afford to hire an SEO person, consider doing so. Their specialized knowledge and experience will improve your website's ranking in search engine results. I recommend working with Bex from Summon and Sell, check them out!
Woo Tip: I like doing this Mars (Tuesday) and Mercury (Wednesday) day.

STEP 5 - Sketch & Plan Your Design

Sketch your website and identify content, imagery, media needed

Look at the inspiration you gathered in Step 2. Specifically look at the layout of the inspiration you gathered.
Break each web page down by sections. For example, hero/header is a section. For the first version of your website, having a home page with 4-6 sections is good enough.
Try to design (sketch) mobile first. Majority of people access the internet on their mobile devices, meaning if your website is gnarly AF, people won’t get to experience it! So look at your website inspo,and see how it looks on mobile and then compare to desktop. How does the website layout respond from mobile to desktop?
Start to sketch it out! I like to do this with pencil and paper because I can move fast, it allows me to iterate quickly, and get all my ideas out of my head.
Woo Tip: I like to do this on Moon (Monday) or Venus (Friday) day!

STEP 6 - Build & Launch!

You’re ready to build!

Identify a launch date and make a plan by working backwards from that date.
Set a daily or weekly goal of what you need to accomplish so you can launch on the date you set.
There are SO MANY amazing YouTube tutorials explaining “how to…” for websites. YouTube is your friend!
Be patient and kind to yourself. Crafting a website is not easy, remember you’re The Fool. Try to bring as much joy and fun to the process. Take breaks, move your body, and hydrate when frustrated.
Your website is a living a document, so don’t put a lot of pressure on yourself for it to be perfect (looking at you, Virgo placements).

Keep in mind that your website can be launched in phases. And, of course, you can always tweak, refine, and evolve it over time!

If you need help, I offer Witching Hour, a 60 minute website collaboration and problem solving session. Learn more on my booking page. To get 22% off, share the secret password with me “Embodying The Fool”.

Take supreme care <3 & Stay Weird

Hey cute weirdo, I’m Emma!

Head Web Witch at Hex Codes and Woo. Welcome to my Blog! So glad you’re here. If you have any questions or want to connect, please reach out and follow me on Instagram 👇🏻

@hex.codes.and.woo