// Tutorial //

How To Set Up Your HTML Website Project

Published on July 28, 2020 · Updated on August 9, 2021
Default avatar
By Erin Glass
Senior Manager, DevEd
How To Set Up Your HTML Website Project

The first thing to do when creating a new website project is to create a project directory (or folder) to store all the files that will be created in the process. This tutorial will walk you through the steps of setting up folders and files necessary for building your website with HTML.

For this website project, we can continue using the html-practice project directory and index.html file we created earlier in the tutorial series. (If you have not been following along this tutorial series and need instructions for setting up a project directory and index.html file, please see our earlier tutorial in this series Setting Up Your HTML Project.

Note: If you decide to choose your own name for the directory, make sure to avoid character spaces, special characters (such as !, #, %, or others), and capital letters, as these can cause problems later on.

Next, we’ll format the index.html file to serve as the website’s homepage. The first step in formatting a web document is to add the <!DOCTYPE html> declaration to the first line. Make sure your index.html file is clear and then add <!DOCTYPE html>to the first line of the document.

This declaration tells the browser which type of HTML is being used and is important to declare as there are multiple versions of HTML. In this declaration, html specifies the current web standard of HTML, which is HTML5.

Next, we’ll add the <html> element by adding opening and closing <html> tags. The <html> element tells the browser that all content it contains is intended to be read as HTML. Inside this tag, we will also add the lang attribute, which specifies the language of the webpage. In this example, we will specify that our site is in English using the en language tag. For a full list of language tags, visit the IANA Language Subtag Registry.

Your document should now look like this:

<!DOCTYPE html>
<html lang="en">
</html> 

From this point forward, all content that we add to our website will be added between the opening and closing <html> tags.

We will begin adding content to our site in the next tutorial.


Want to learn more? Join the DigitalOcean Community!

Join our DigitalOcean community of over a million developers for free! Get help and share knowledge in our Questions & Answers section, find tutorials and tools that will help you grow as a developer and scale your project or business, and subscribe to topics of interest.

Sign up

Tutorial Series: How To Build a Website with HTML

This tutorial series will guide you through creating and further customizing this website using HTML, the standard markup language used to display documents in a web browser. No prior coding experience is necessary but we recommend you start at the beginning of the series if you wish to recreate the demonstration website.

At the end of this series, you should have a website ready to deploy to the cloud and a basic familiarity with HTML. Knowing how to write HTML will provide a strong foundation for learning additional front-end web development skills, such as CSS and JavaScript.

About the authors
Default avatar
Senior Manager, DevEd

Open source advocate and lover of education, culture, and community.

Still looking for an answer?

Was this helpful?
Leave a comment

This textbox defaults to using Markdown to format your answer.

You can type !ref in this text area to quickly search our full set of tutorials, documentation & marketplace offerings and insert the link!