Upload html to internet

Lesson 17 — Uploading the website to the Internet

In the previous exercise, Solved tasks for HTML and CSS lessons 14-16, we’ve practiced our knowledge from previous lessons.

In the previous lesson, Solved tasks for HTML and CSS lessons 14-16, we finished making our website. In today’s lesson, we’re going to upload it to the Internet.

Meta tags

Although our subpages are finished, they’re still missing a very important factor in their elements. Once the website is online, internet search engines will recognize and index it. Simply put, they’ll store what is on our website in order to display our website in the search results when somebody is looking for something that we have. This is crucial for us because this is the main way that visitors will end up on our website.

What we’ll do is add information for the search engines to read on each subpage. All it will be is a short description of page’s contents — i.e. what it is about. Back in the old days, they used to also have to specify keywords, however, search engines ignore this type of tag nowadays. Adding keywords is a waste of time now, so don’t even bother messing with them. As you know, we will have to add the code into the element. Every subpage will have a different description. Our home page’s description, index.html, will look something like this:

 name="description" content="HoBi's personal programmer portfolio" />

We are already familiar with the tag, we used it to set our website’s encoding. Speaking of meta information, we are also able to add information about the website’s author:

We’ll stay in the head a little longer and set the favicon for our site. The favicon is the small icon that shows up on your web browser tab while you’re on a website. We’ll get one from iconfinder.com as always. Make sure you download one that is 16×16 pixels and in the ico format. Save it to the «images» folder and add a link to the icon in the head:

 rel="shortcut icon" href="images/icon.ico" />

Note: Some versions of Google Chrome don’t display local page favicons.

Add the meta-information to each subpage on your website. Once you have done all of that, you’re ready to upload your website to the Internet!

Uploading the website on the Internet

We’ll need a web host and a domain for our finished website. Web hosting is a space on a remote server where you can upload your website. The domain is the address through which you’ll be able to access your website. Both a web host and a domain are very cheap for ordinary websites, they usually cost a few dollars per month.

Note: There are also free hostings that are pretty low in quality, constantly bombard you with advertisements and don’t provide many important services that we’ll need later on. If you want to better yourselves and continue to learn, go for a classic web host.

Getting a domain and web hosting

Uploading the contents

We use the FTP protocol to upload files to a web host. We can use either a web application or a desktop client for that. Go with the desktop client since it’s more practical. Never use Windows Explorer or Total Commander to upload website contents. These tools do not convert source file encoding and the connection is not very stable.

Once you run the application you will need to create a new site. Use the FTP credentials that were sent to you in an email from your web host. Click File -> Site manager. from the application menu and then click the New Site button. Then, fill in the credentials (see the example image below):

Click connect and a «www» folder will open. If there is any content in it, remove it and drag-and-drop your website’s files there.

Congratulations! You now have a nice, modern website on a web host! Enter your URL address and check it out.

What next?

We have a nice looking website.

Once feel comfortable using HTML and CSS, consider learning PHP. What it allows you to do is create large dynamic websites such as e-shops, forums, content management systems, and so on. There is a substantial demand for PHP programmers and a lot of companies use it.

The website with meta-information filled in can be downloaded in the attachment below.

Did you have a problem with anything? Download the sample application below and compare it with your project, you will find the error easily.

Download

Downloaded 126x (390.97 kB)
Application includes source codes in language HTML

Источник

How to Upload Web Pages With HTML Format to the Internet

Congratulations! You’ve just completed your web page and are now ready to upload it to the Internet. Before you upload the web page, you’ll need to sign up for a hosting account (where your website will be placed), register for a domain name (web address), and have the file transfer protocol (FTP) login details for your website. You can use a FTP client within your web editor if it includes one or download a free FTP program from the Internet.

Uploading Web Page From Dreamweaver

Step 1

Select «Site» and «Manage Sites» from the toolbar in Dreamweaver. Click «New» and «Site» in the «Manage Sites» dialog box.

Step 2

Add a name for your site (under the «Basic» tab), such as «My Website.» Enter your full website address under «What is the HTTP Address (URL) of your site?» and click «Next .»

Step 3

Select «No, I do not want to use a server technology» and click «Next.»

Step 4

Choose «Edit local copies on my machine, then upload to server when ready (recommended).» Then click the yellow folder. Find the folder with your HTML files, press «Select» and click «Next.»

Step 5

Select «FTP» from the drop-down list under «How do you connect to your remote server?»

Step 6

Retrieve your FTP login details and type your host name (for example, ftp://mywebsite.com), FTP login and password. Click the «Test Connection» button and «OK.» You will return to the «Manage Sites» dialog box.

Step 7

Select the new site you created and click «Done.» A list of files will display on the right with your site name and «Local view.»

Step 8

Click the «Connects to remote host» button (in the «Files» task pane) to connect to your web server. Then click the «Put Files» button to upload your files to the Internet.

Using Web Pages From KompoZer

Step 1

Open the file you want to publish in KompoZer, then select «File» and «Publish» from the toolbar.

Step 2

Type your site’s name (for example, My Website), the web address (http://www.mywebsite.com) and publishing address (ftp://mywebsite.com).

Step 3

Retrieve your FTP login details and enter your username and password. Click «Publish.» The HTML file will be uploaded onto the web.

Using a Free FTP Program

Step 1

Open FileZilla or the FTP program of your choice.

Step 2

Retrieve your FTP login details and enter the host name (for example, http://www.mywebsite.com), your username and password.

Step 3

Leave the port number empty, then click «Quick Connect» or «Connect.» Your local files will display on the left side of the window, and your web files will display on the right. Make sure you are in the «public_html» or «www» folder on the right.

Step 4

Go to the left pane and navigate to the folder where you saved the HTML files on your computer. Double-click a file to upload it to the Internet. To select multiple files, hold down the «Ctrl» or «Shift» key, right-click and select «Upload.»

Источник

How to Publish a HTML Web Page on the Internet

If you have already written an HTML web page and seen it being rendered in browser, you understand how to create a web page. But, some of you must be wondering how can I actually publish that page so that everyone can see it. In this post I will create a simple web page and put it online.

So, the HTML file saved in your computer can only be viewed by you but it needs to be kept somewhere where everyone can access it. And you need a web hosting service for that! Hosting services have a server or a computer that gives you some space for your files.

If you are new to website building you can try one of many free hosting services. I have previously used Infinity Free. You can also use codepen.io where people can see your page and the codes behind it in the same window. Github Pages is also good for hosting static web pages. I am not talking here about other plugins and CMS like WordPress but a static site that is coded by you.

1. Free Hosting Services

I will now explain how to publish your web page if you use the first option, a free hosting service. You first need to sign up for the hosting service and select a domain name for your website. Now, there are two options to upload your file:

• First, you directly go to file manager and upload the file and rename it as index.html.
• Another way you can upload is by downloading a FTP client, for example FileZilla and connect it to the server by filling in your site details like, Hostname, Username, Password and the Port Number. All these details are available in your account. When you get connected to the server you can upload your file index.html.

Either of these methods can be used to upload your file and now if you open your website you will be directed to the same index.html file. So, when you type in a website address you are directed to the index.html file. You have now published your web page on the internet and anyone can see it provided the link. You can add more HTML files or images and add their link to the index.html page. All those files get stored in the server and anyone can access it.

Most of the times, the URL of the image that you enter in your web page gets expired after some period. Its better to download those images and upload them and write the name of that image exactly in the src attribute.

You can see HTML and CSS codes for an example HTML web page:

HTML COde

Ludwig van Beethoven
  
fur elise 
  
moonlight sonata movement 1 
 

css

There is one problem with the free hosting services – they are not secure. The worst part of these hosting service is that when users visit your website, they will see a warning that its not safe and they should not add sensitive information on this site. Its very bad impression. So you can publish few pages just to see how its done, then you can use other paid hosting services.

Next we will see how to publish your web page using GitHub Pages. It works exactly like described previously but you first need to know how to use GitHub.

2. Github Pages

First, you need to create an account on GitHub. Then create a new repository and give it the name: (username).github.io. Make it public and publish it. Now you can upload the index.html file here. If you type (username).github.io in your browser, you will see your web page. You can now add more files and images and link them to your index.html page.

So, if you are familiar with GitHub its one of the best way to publish your first website.

Источник