First webpage


HTML House is a website that makes it easy to write short practice webpages and share them with a URL.

When you open jsbin, it will show you this HTML code (don't worry - you don't need to know what any of this means yet):

<!DOCTYPE html>
<html>
    <head>
        <title>HTMLhouse</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />

        <style type="text/css">
        body {
            font-family: Helvetica, Tahoma, Arial, sans-serif;
            font-size: 100%;
            margin: 1em;
        }
        img {
            max-width: 100%;
        }
        </style>
    </head>
    <body>
        <h1>HTMLhouse</h1>
        <p>Welcome!</p>
    </body>
</html>

and the output will look like this:

Screen Shot 2017-06-06 at 8.40.17 AM

To make your first webpage, delete everything between the <body> and </body> tags and write something you think should be shared with the Internet:

<!DOCTYPE html>
<html>
    <head>
        <title>HTMLhouse</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    </head>
    <body>
        Hello! My name is Christian and I love mango but when I eat too much it makes my lips itch which it uncomfortable.
    </body>
</html>

Your webpage will look something like this:

Screen Shot 2017-06-06 at 8.44.13 AM

Click "Publish" at the top, and you'll be taken to a public URL with your new webpage:

Screen Shot 2017-06-06 at 8.44.49 AM

You can send this to anyone on the Internet! Copy the link (highlight the URL bar and press CTRL+C), paste it in the "solution URL" box below (CTRL+P), then press the blue "Send" button to share your webpage with me (to check it off and give you points) and the rest of the class.

If you don't want the rest of the class to see what you made, click the "private" checkbox before sending it.

After you send a solution, you can see what other people have sent under the "Solutions" tab.

If you don't like HTML House or it doesn't work, there are a lot of alternatives. Here are a few you can try:


Challenge

Make your first webpage and paste the link below (super easy - just to prove you know what's going on).


Solutions

Try this challenge on your own first, then come back here to see other people's solutions.

  • christian.genco@gmail.com • over 1 year ago

    Hello!

    Like Reply 1
  • joe • over 1 year ago

    lol hi

    Like Reply 1
  • cgenco • over 1 year ago

    How do I do this?!?!?!?!?1

    Like Reply 1
  • cgenco • over 1 year ago

    this makes no sense how does this happen!?!?

    Like Reply 1

Try this challenge on your own first, then come back here to see other people's solutions.