Japanese webhosting I've never built a website before. What do I do to get started?

First, a few words about what you need to build a website.

  1. A web browser. You already have one, or you wouldn't be able to read this.

    A browser takes a page written in HTML (Hypertext Markup Language) and, based on the instructions in that HTML, builds a page for you to read.

    HTML is based on 'tags', which we will discuss further, but as an example, <b>bold text</b> will result in bold text. The tags wrap around the text, and there is a begin tag and an end tag.

  2. A text editor. That's what you will use initially to make your web pages.
    You can use Notepad, which comes with all Windows systems.
    On Linux, you can use vi, vim, emacs, etc.

    If you want to be far more productive, you can use better text editors. Our recommendation is Crimson Editor.
    And when you're looking to make better web pages, with more features, you will probably want a WYSIWYG ('What you see is what you get') HTML editor. Some examples are:
    You can even use Microsoft Word to make web pages, although the HTML that it produces is almost incomprehensible.

  3. A 'web server'. That's where we come in. We provide that web server, and that's actually what 'web hosting' is. When someone types in the address of your website, his browser looks up where it is, and goes to our web server to provide the content.

  4. Some way of getting the web pages from your computer, where you design them, to the web server. For that, you use an FTP (File Transfer) program.

    We recommend Core FTP Lite, and the examples that follow will assume that's what you've installed.

Japanese webhosting How do I build a web page?

We will build two web pages, step by step.

  1. A very basic web page

    • Copy this into your text editor:

      This is the most basic web page it's possible to write

    • Save it as 'basic.html'
    • In explorer, double-click the file.
    • It should open in your browser. VoilĂ ! You've made a web page. It should look like this page
    • Make further changes yourself, and see what happens in the browser (you will have to refresh the browser, with control-R)

  2. Still basic, but adding a few HTML tags

    For this, rather than have you type all the HTML in, click here to open basic2.html.

    In your browser, go to
    View - Page Source, then File - Save Page As
    and save it as basic2.html

    Open basic2.html in your text editor.
    Print it off, and compare what you see in the HTML with what's in your browser.

    As above, make changes and see what happens in your browser.

  3. Now let's get that web page that you've experimented with up on your web server.

    Open up your FTP program. In this discussion, it's assumed that you're using Core FTP Lite. Enter the following:

    Site Name: This is just for your reference, especially if you commonly FTP to more than one site.
    We use 'WAZU'
    Host/IP/URL: Your host name, e.g. mydomain.com
    Username: As supplied to you by us during sign-up
    Password: As supplied to you by us during sign-up

    With all other settings at the default, when you press 'connect' you should have access to your site as below:

    Core FTP Lite
    Double click in the right pane on 'public_html'. That's where your files will go.

    Browse in the left pane to where your saved file 'basic2.html' is.
    Hint: You can set up your FTP preferences to remember both of these locations.
    Click the right facing arrow in the left pane to transfer the file to the webserver.

    Now, you can access that file by typing http://www.mydomain.com/basic2.html into your browser. If you can't, it might not have the right permissions. In the FTP right pane, right-click on basic2.html. This will show you who can read or write to the file. At the bottom is a numerical value. You can check the boxes, or simply put 644 into the value box. Click OK and ensure that you can see the changed permissions.

    Hint: If you have a file named 'index.html' or 'default.html', that page will load whenever anyone goes to your website. So they don't need to type 'www.mydomain.com/index.html', they simply type 'www.mydomain.com'.

  4. What's next?

    Now you know how to make a basic web page and it get it on the web server so that it's able to be viewed by the world. There's much more to learn. For example:

    • The pages we've made are not standards compliant. They don't have DOCTYPE declarations, they don't specify which character sets they work with, and a few other useful things. Have a look at the source code of this page, and you will get an idea of what's involved.

    • CSS (Cascading Style Sheets) are a means of providing a common HTML base across all of the pages in a web site. If you decide to change the font, for example, you just do it on the CSS sheet, and all of the pages will reflect that. When you consider that wazu.jp has about 2,000 pages, you can see how important this is. It would be impossible to change each one by hand.

      CSS sheets also provide many enhancements in formatting, some of which are impossible with straight HTML. For an example, have a look at the style sheet behind this page.

    • Databases, e-commerce, flash, and much else.

      Again, the tutorials and books are your friend. You will find that much of what you want to do can be done from the control panel on your site. You can set up blogs, mailing lists, forums, without writing any HTML at all. Experiment! You can always delete and start over ...

  5. It's good practice to ensure that your HTML validates. That is, that it conforms with HTML standards.

    To see what happens when HTML does not validate, click on this link. What a mess! But we knew that, didn't we?

    To see what happens when a page does validate, let's check this web site's 'About' page. Click here for the result.