Revision 730959 of How to build a website

<p>When learning web design, many people wish to build their own website as soon as possible. To smooth your path, we've narrowed down the minimum knowledge you'll need.</p>

<p>We suggest you read these articles linked to in the table below. Start with Row 1, then Row 2, and so on, and move from left to right within a row. If you have difficulty with a term, please use our <a href="/en-US/docs/Glossary">glossary</a>.</p>

<table class="standard-table">
 <thead>
  <tr>
   <th scope="row" style="text-align: center;">&nbsp;</th>
   <th scope="col" style="text-align: center;">Theoretical<br />
    knowledge</th>
   <th scope="col" style="text-align: center;">Technical<br />
    knowledge</th>
   <th scope="col" style="text-align: center;">Practical<br />
    knowledge</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <th scope="row" style="text-align: center;">1</th>
   <td style="vertical-align: top;"><strong><a href="/en-US/docs/Learn/Thinking_before_coding">Begin your web project</a></strong><br />
    <em>In this article we discuss the first, indispensable step in any project: think about why you're undertaking the project, and define your goals.</em></td>
   <td style="vertical-align: top;">&nbsp;</td>
   <td style="vertical-align: top;">&nbsp;</td>
  </tr>
  <tr>
   <th scope="row" style="text-align: center;">2</th>
   <td style="vertical-align: top;"><strong><a href="/en-US/docs/Learn/How_the_Internet_works">How the Internet works</a></strong><br />
    <em>This article explains what the Internet is and how it works.</em></td>
   <td style="vertical-align: top;">&nbsp;</td>
   <td style="vertical-align: top;">&nbsp;</td>
  </tr>
  <tr>
   <th scope="row" style="text-align: center;">3</th>
   <td style="vertical-align: top;"><strong><a href="/en-US/docs/Learn/page_vs_site_vs_server_vs_search_engine">Understanding the difference between a webpage, a website, a web server and a search engine</a></strong></td>
   <td style="vertical-align: top;"><strong><a href="/en-US/docs/Learn/What_is_a_web_server">What is a web server?</a></strong><br />
    <em>In this article we are discussing web servers: what they are, how they work, and why they matter.</em></td>
   <td style="vertical-align: top;"><strong><a href="/en-US/docs/Learn/What_software_do_I_need">Which software do I need (and what does it do)?</a></strong><br />
    <em>In this article we explain what software you need for editing, uploading, and viewing a website.</em></td>
  </tr>
  <tr>
   <th scope="row" style="text-align: center;">4</th>
   <td style="vertical-align: top;"><strong><a href="/en-US/docs/Learn/Understanding_links_on_the_web">Understanding links on the web</a></strong><br />
    <em>In this article, we discuss in detail what links are, since they're one of the main reasons for the Web.</em></td>
   <td style="vertical-align: top;">&nbsp;</td>
   <td style="vertical-align: top;">&nbsp;</td>
  </tr>
  <tr>
   <th scope="row" style="text-align: center;">5</th>
   <td style="vertical-align: top;"><strong><a href="/en-US/docs/Learn/Understanding_URLs">Understanding URLs and their structure</a></strong><br />
    <em>This article explains what URLs are (Uniform Resource Locators) and how they're structured.</em></td>
   <td style="vertical-align: top;"><strong><a href="/en-US/docs/Learn/Understanding_domain_names">Understanding domain names</a></strong><br />
    <em>In this article we go over domain names: what they are, how they are structured, and how to get one.</em></td>
   <td style="vertical-align: top;">&nbsp;</td>
  </tr>
  <tr>
   <th scope="row" style="text-align: center;">6</th>
   <td style="vertical-align: top;"><strong><a href="/en-US/docs/Learn/Anatomy_of_a_web_page">Anatomy of a webpage</a></strong><br />
    <em>When you're making your own website, it's good to be aware of some common layouts</em>.</td>
   <td style="vertical-align: top;">&nbsp;</td>
   <td style="vertical-align: top;"><strong><a href="/en-US/docs/Learn/How_much_does_it_cost">How much does it cost to do something on the web?</a></strong><br />
    <em>Getting involved on the web isn't as cheap as it looks. In this article we discuss how much you may have to spend and why.</em></td>
  </tr>
  <tr>
   <th scope="row" style="text-align: center;">7</th>
   <td style="vertical-align: top;"><a href="/en-US/docs/Learn/The_basics_of_web_design">Beyond design, the basics of web design</a></td>
   <td style="vertical-align: top;">&nbsp;</td>
   <td style="vertical-align: top;"><strong><a href="/en-US/docs/Learn/Choose,_Install_and_set_up_a_text_editor">Choose, install, and set up a text editor</a></strong><br />
    <em>In this article we highlight some things to think about when installing a text editor for web development.</em></td>
  </tr>
  <tr>
   <th scope="row" style="text-align: center;">8</th>
   <td style="vertical-align: top;">&nbsp;</td>
   <td style="vertical-align: top;">&nbsp;</td>
   <td style="vertical-align: top;"><strong><a href="/en-US/docs/Learn/Set_up_a_basic_working_environment">Set up a basic working environment</a></strong><br />
    <em>This article gets your workstation set up for building your website.</em></td>
  </tr>
  <tr>
   <th scope="row" style="text-align: center;">9</th>
   <td style="vertical-align: top;">&nbsp;</td>
   <td style="vertical-align: top;"><strong><a href="/en-US/docs/Learn/HTML/Write_a_simple_page_in_HTML">Write a simple page in HTML</a></strong><br />
    <em>Learn how to create a simple web page.</em></td>
   <td style="vertical-align: top;"><strong><a href="/en-US/docs/Learn/Open_a_file_in_a_browser">Open a file in browser</a></strong><br />
    <em>This article explains the various ways to access a file in a web browser, and why it is important to do it the right way.</em></td>
  </tr>
  <tr>
   <th scope="row" style="text-align: center;">10</th>
   <td style="vertical-align: top;">&nbsp;</td>
   <td style="vertical-align: top;"><strong><a href="/en-US/docs/Learn/HTML/HTML_tags">What are HTML tags &amp; how to use them</a></strong><br />
    <em>This article covers <a class="glossaryLink" href="https://developer.mozilla.org/en-US/docs/Glossary/HTML" title="HTML: The HyperText Markup Language (HTML) is a descriptive language specifically designed to structure web pages.">HTML</a> basics: what tags are and how to use them.</em></td>
   <td style="vertical-align: top;"><strong><a href="/en-US/docs/Learn/Upload_files_to_a_web_server">Upload files to a web server</a></strong><br />
    <em>This article shows how to use FTP tools to publish your site online.</em></td>
  </tr>
  <tr>
   <th scope="row" style="text-align: center;">11</th>
   <td style="vertical-align: top;">&nbsp;</td>
   <td style="vertical-align: top;">&nbsp;</td>
   <td style="vertical-align: top;">
    <p><strong><a href="/en-US/docs/Learn/Checking_that_your_web_site_is_working_properly">Checking that your website is working properly</a></strong><br />
     <em>This guide outlines basic strategies to catch and fix common website errors.</em></p>
   </td>
  </tr>
 </tbody>
</table>

<p>These are the basics necessary for your very first website, but if you want to have a more advanced, professional website, please keep reading:</p>

<table class="standard-table">
 <thead>
  <tr>
   <th scope="row" style="text-align: center;">#</th>
   <th scope="col" style="text-align: center;">Theoretical<br />
    knowledge</th>
   <th scope="col" style="text-align: center;">Technical<br />
    knowledge</th>
   <th scope="col" style="text-align: center;">Practical<br />
    knowledge</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <th scope="row" style="text-align: center;">12</th>
   <td><a href="/en-US/docs/Learn/What_do_people_need_for_viewing_my_website">What do people need for viewing my website?</a></td>
   <td>&nbsp;</td>
   <td>&nbsp;</td>
  </tr>
  <tr>
   <th scope="row" style="text-align: center;">13</th>
   <td>&nbsp;</td>
   <td><strong><a href="/en-US/docs/Learn/CSS/Using_CSS_in_a_web_page">Using CSS in a web page</a></strong><br />
    <em>This article explains how to set up a webpage in order to be able to make it pretty with <a class="glossaryLink" href="https://developer.mozilla.org/en-US/docs/Glossary/CSS" title="CSS: CSS (Cascading Style Sheets) is a declarative language used to control the presentation and appearance of web pages.">CSS</a>.</em></td>
   <td>&nbsp;</td>
  </tr>
  <tr>
   <th scope="row" style="text-align: center;">14</th>
   <td><strong><a href="/en-US/docs/Learn/What_is_accessibility">What is accessibility?</a></strong><br />
    <em>This article introduces the basic concepts behing web accessibility.</em></td>
   <td><strong><a href="/en-US/docs/Learn/CSS/CSS_properties">What are CSS properties and how to use them?</a></strong><br />
    <em>CSS specifies how a webpage should look. This article show off how to create CSS rules along with selectors and properties to apply styles to HTML elements or groups of elements.</em></td>
   <td>&nbsp;</td>
  </tr>
  <tr>
   <th scope="row" style="text-align: center;">15</th>
   <td><strong><a href="/en-US/docs/Learn/Design_for_all_types_of_users_101">Design for all types of users 101</a></strong><br />
    <em>This articles provides the basics tips and tricks to design web sites for any kind of users.</em></td>
   <td><a href="/en-US/docs/Learn/CSS/Basic_text_styling_in_CSS">Basic text styling in CSS</a></td>
   <td>&nbsp;</td>
  </tr>
  <tr>
   <th scope="row" style="text-align: center;">16</th>
   <td>&nbsp;</td>
   <td><a href="/en-US/docs/Learn/Using_images">Using images</a></td>
   <td>&nbsp;</td>
  </tr>
  <tr>
   <th scope="row" style="text-align: center;">17</th>
   <td><a href="/en-US/docs/Learn/Common_pitfalls_to_avoid_in_web_design">Common pitfalls to avoid in web design</a></td>
   <td><a href="/en-US/docs/Learn/Basics_of_UX_Design">Basics of User eXperience (UX) Design</a></td>
   <td><a href="/en-US/docs/Learn/Design_of_navigation_menus">Design of navigation menus</a></td>
  </tr>
 </tbody>
</table>

<p>&nbsp;</p>