What Do You Want to Create?
Before you start building a website, consider what goals do you want to achieve and how can a website help you? What is the potential purpose of your website?
There are many possible experiences a website can provide. These can range from a business presentation with a few simple pages, to an e-commerce store with a shopping cart and checkout process, to an action-packed multiplayer game.
While beginner friendly website builder tools are suitable for most common use cases, they have limitations what you can accomplish with them. Therefore, it makes sense that you first figure out what kind of experience your website should provide.
Here are a few examples, to give you some ideas and demonstrate the variety of possible web experiences.
- A simple website with a few pages that inform about services of a business like a bakery, a doctor's office or your favorite Brazilian dance club. Provided information could be: images of the location, drive directions, opening hours, contact information and maybe a contact form for sending a message. Another similar use case is a portfolio site were you present yourself for getting hired.
- Single landing page for selling a (digital) product (e.g. ebook, video course, handmade crafts) or service (consulting). Basically your own Gumroad or Podia.
- An interactive novel, narrative adventure game, pick your own adventure (Gamebook) or a web comics like xkcd, Pepper and Carrot, Mr. Lovenstein Comics by Alex Norris...
- Browser games: newsground, 3D Games on Itch.io garticphone.com, skribbl.io/, ...
- Software As A Service product (SaaS): For example, productivity tools like a To-Do list or a note taking application: Trello, Todoist, Notion, Google Docs. What are products that you pay about $10 a month for?
- Some more ideas: Online forum, social networks and image sharing platforms like Instagram, Pinterest or Flickr, shopping.
- A few more examples are mentioned on the map Why learn Web Development?.
Considering Structure, Content, Aesthetics And Functionality
Ok, there are all sorts of possibilities what a website can offer. Let's assume you want to build a straightforward website with a few pages. Even in this simple case, there are many things about the content, structure and functionality to consider.
Page And Content Structure
Consider the overall page and content structure. What topics should get covered? How shall these topics be structured? For example, contact, about and imprint pages and additionally 3 pages covering main topics with 5 subtopic pages each. The entirety of pages including the hierarchy of main and sub-pages can be organized in so called sitemap which is basically a table of contents for a website.
What content should be shown and how can you obtain it? Who is writing the texts for the website, the business owner, you as the developer or do you hire a copy writer or content marketer? What about photos, videos and graphics. A business like a restaurant or dentist might want to show photos of their staff and their establishment. Are stock photo services good enough, do you produce them yourself, or do you have to hire someone?
Aesthetics & Design
Aesthetics or design is about how a website looks and feels. It includes colors, fonts, and graphic elements. The "feel" is the emotional impression a website creates, described by words like authoritative or playful. These choices influence the overall design and content decisions.
Just imagine what feelings and mood you get when visiting different locations in a city, e.g. a cozy little shop with self-made food, lively chatter and laughing in a restaurant restaurant, the smell of a bike or car repair shop, an hospital, a thrift store, a bank. Now, imagine what the respective website of each of these businesses would look and feel like.
Even though the perception of a website is mostly limited to vision and interacting with it (and optionally audio), there is still a lot that can be conveyed via visuals. A bank website might be clean with strong edges and corners and texts in a bold font which are written in a formal tone. A different website might be more playful in its formulations and by choosing soft rounded visuals with many vibrant colors. That's basically how you can think about the aesthetics, design, look and feel as well as the emotions that you want to evoke.
What do you want to convey: professionalism, fun, or something else?
Functionality
What functionality will you need? Do customers need to contact you via your website? Do want to publish blog articles or news posts? Are you the only author of these or do other non-technical people need to write these as well? Should visitors be able to comment on your articles? Can people register and log in to your service? This would require a database so that personal data can be stored permanently (persistence).
Once you know what you need, you can find out which technology will allow you to develop your desired features. That's also the why I recommend you to first familiarize yourself with the How Does The Internet Work map before moving on. A rough understanding how client and server interact and knowing in which context the languages HTML, CSS and JavaScript are used will make it easier for you to understand the tradeoffs between different technologies.
So, the next steps are planning your web project and deciding which technology you want to use to build it.