Hosting Webpages in Google Drive

Get your students creating HTML, CSS, and JavaScript and use their Google Drive account to host the results.

A couple of years ago I was asked to find a way to allow students to create and host webpages for an HTML course. Needless to say it involved much configuring of web servers to allow students to safely host web pages in a simple and easy manner.

All that wouldn’t have been necessary if we’d been using Google Drive.

With Google Drive you can host HTML, CSS, and JavaScript files and make them accessible publicly. You can even share pages publicly on the web.

One limitation is that Drive doesn’t support the hosting of server-side scripting languages such as PHP and ASP, but for basic HTML and JavaScript this is a great system.

Students can create webpages using a text editor, such as Notepad on Windows, and simply upload the file with a .html extension to Google Drive.

To host webpages in Google drive do the following:

1. Upload your HTML, JavaScript, and CSS files to a folder within your Google Drive.
2. Share the folder as “Public on the web.”
3. Open the HTML file, and click the “Preview” button in the toolbar.
4. The link will look something like that show below. Send this to whomever you wish to access your website.

A Few Ideas

Consider creating a central Google Site or your own hosted webpage to link your student’s webpages and allow others in the class or school to view the work.

Javascript is an extremely flexible language and can produce everything from basic website UI interactions to complex browser games. Encourage your students to experiment.

Be Cautious

The ability for students to independently host and share public webpages is great, but is also open to abuse. Make sure the content your students are creating is appropriate and refresh their eSafety knowledge.

Make sure when you upload your HTML files Google Drive doesn’t try to convert them to Google Docs format.