Publishing Your HTML Resume to the Web

In this course, you will build websites locally on your computer and then publish them to a live web server using FTP.

This workflow is one of the foundational concepts of web design.

A website is ultimately a collection of files stored on a server and viewed through a browser.

Modern apps often hide these systems from users, but web design requires understanding how files, folders, servers, and browsers work together.

Part 1: Setting Up Your Local Workspace

Step 1: Create a Sites Folder

Inside your user folder on your computer, create a folder named:

Sites

This folder will contain all of your website projects for the semester.

Step 2: Create Your Resume Project Folder

Inside the Sites folder, create a new folder named:

resume

Your folder structure should now look like this:

Sites/
  resume/

This folder is called your project root.

Everything related to this project should stay inside this folder.

Part 2: Creating Your Homepage

Step 1: Open the Project in Phoenix Code

Launch Phoenix Code.

Choose:

File -> Open Folder

Open the resume folder you created.

Step 2: Create index.html

Inside the resume folder, create a new file named:

index.html

Your homepage file must be named exactly:

index.html

Not:

Index.html
index.HTML
index.html.txt
resume.html

Web servers are very strict about filenames.

Step 3: Add Starter HTML

Paste the following code into your document:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Your Name</title>

  <style>
    body {
      font-family: Arial, sans-serif;
      max-width: 700px;
      margin: 40px auto;
      line-height: 1.6;
      padding: 20px;
    }

    h1 {
      margin-bottom: 10px;
    }

    h2 {
      margin-top: 40px;
    }
  </style>
</head>
<body>

  <h1>Your Name</h1>

  <p>Email: you@example.com</p>

  <h2>Education</h2>

  <p>Add your education information here.</p>

</body>
</html>

Save the file.

Part 3: Previewing Your Page Locally

Before uploading your website, you should preview it on your own computer.

This lets you check your work before publishing it online.

Step 1: Locate index.html

Find your index.html file inside your resume folder.

Example:

Sites/
  resume/
    index.html

Step 2: Open the File in a Browser

Double-click the file or right-click and choose a browser such as:

Safari
Chrome
Firefox

Your webpage should open in the browser.

Local Preview vs. Live Website

At this stage, the page exists only on your computer.

This is called a local file.

A local file may have an address that begins with:

file:///

A live website uses an address beginning with:

https://

Saving a file on your computer does not automatically publish it online.

To make the page public, you must upload it to a web server.

Part 4: Creating Your RWU Hosting Account

Before you can publish your website, you must create your RWU hosting account.

RWU provides your hosting account through your web or digital media course.

Step 1: Go to the RWU Hosting Portal

Open a browser and visit:

https://rwu.me

Step 2: Order Hosting

On the homepage, click:

Order Hosting

This opens the RWU Hosting account page.

Step 3: Choose the Correct Hosting Package

Locate the hosting package for your course section.

For DSGN 300, select:

Dsgn 300

Click:

Order Now

Step 4: Complete the Account Setup Process

Follow the on-screen instructions to create your hosting account.

You may need to:

log in with your RWU credentials
confirm account information
submit the hosting request

Step 5: Wait for Your Confirmation Email

After your hosting account is created, you should receive an email with the subject:

New Account Information

This email contains:

your domain name
hosting username
FTP information
account details

Keep this email. You will need it throughout the semester.

Important

Your hosting account may take a short time to become active after setup.

If your website does not work immediately, wait a few minutes and try again.

Part 5: Accessing Your RWU Hosting Account

RWU provides you with a web hosting account.

This hosting account stores the files that make up your live website.

Step 1: Find Your Setup Email

You should receive an email with the subject:

New Account Information

This email contains:

your hosting username
your domain name
hosting account details

Keep this email. You will need it throughout the semester.

If you cannot find the message:

search for “New Account Information”
search for rwu.me
check Junk Mail and Focused/Other inbox tabs

Step 2: Go to the RWU Hosting Portal

Open a browser and visit:

https://rwu.me

Step 3: Open the Client Area

In the top navigation bar, click:

Home

This opens the client dashboard.

The page address may include:

clientarea.php

Step 4: Find Your Hosting Account

Locate the section labeled:

Your Active Products/Services

You should see your hosting account listed there.

Step 5: Open cPanel

Click:

Log in to cPanel

This opens the hosting control panel for your account.

Part 6: Understanding public_html

Inside cPanel, open:

File Manager

Locate the folder named:

public_html

This is your public web folder.

Anything placed inside public_html can be viewed in a web browser.

Example:

public_html/index.html

becomes:

https://yourdomain.rwu.me

Part 7: Connecting with FTP

FTP stands for File Transfer Protocol.

FTP allows you to transfer files from your computer to the web server.

For this course we recommend:

Cyberduck
Transmit for Mac
FileZilla

Cyberduck is recommended because it is free and works on both Mac and Windows.

Step 1: Open FTP Accounts in cPanel

Inside cPanel, open:

FTP Accounts

You should see your FTP account information listed.

Step 2: Download the Cyberduck Configuration File

Under:

Configuration Files

click:

FTP Configuration File

for Cyberduck.

This automatically configures the connection settings for your hosting account.

Step 3: Open the Configuration File

Open the downloaded configuration file.

Cyberduck should launch automatically and prepare the connection.

Step 4: Connect to the Server

Click:

Connect

You may be prompted to enter your hosting password.

After connecting, you should see:

your local computer files
your remote web server files

This is one of the most important ideas in web publishing:

Local Computer -> Remote Web Server

Step 5: Open public_html on the Server

On the remote server, open:

public_html

This is where your website files belong.

Step 6: Upload Your Website Files

Upload the contents of your resume folder into public_html.

Correct:

public_html/index.html

Incorrect:

public_html/resume/index.html

unless specifically instructed otherwise.

Part 8: Testing Your Live Website

After uploading your files, visit your assigned web address in a browser.

Example:

https://yourdomain.rwu.me

If everything is working correctly, your webpage should appear online.

Part 9: Common Problems

403 Forbidden Error

Usually means:

no index.html exists
files were uploaded to the wrong folder
files are not inside public_html

Broken Images

Usually caused by:

incorrect file paths
missing image files
uppercase/lowercase filename mismatch

CSS Not Working

Usually means:

CSS file was not uploaded
incorrect path to stylesheet
filename mismatch

Website Did Not Update

Possible causes:

wrong file uploaded
browser cache
file saved locally but not uploaded again

Remember:

Edit locally
Save
Upload again
Refresh browser

Important File Naming Rules

Use:

lowercase letters
hyphens instead of spaces
proper file extensions

Correct:

about.html
profile-photo.jpg
style.css

Incorrect:

About Page.html
Profile Photo.JPG
style.CSS

Web servers are much stricter than most modern apps.

Small filename mistakes can break a website completely.

Submission

You will submit the live public URL to your uploaded webpage.

Do not submit the HTML file itself unless instructed otherwise.

Your webpage must be publicly accessible online.