Lesson 1 - Basics of Web, Web Hosting, and WordPress (National Park or State Park Website) - Minnesota’s Real World Website Classes & Mentorship

THIS WEEK’S LESSON: LEARNING ABOUT THE WEB!

Basic Website Vocabulary & Average Salaries:
Follow Along Link: https://share.getcloudapp.com/nOukXjwO (Click to Zoom)

Basics of Website Building Tools:
Follow Along Link: https://share.getcloudapp.com/Z4ukAgJe (Click to Zoom)

*WordPress is used by 63.1% of all websites that use a content management system. This is 43.1% of all websites via w3techs.com.
https://w3techs.com/technologies/details/cm-wordpress

INTRODUCTION TO WEB HOSTING

-Setting Up our own Web Hosting Environment
-Setting Up our own WordPress Website on our own Web Host

First of all… What is a Web Host?
In very basic terms, Web Hosting is a server/computer that you can pay monthly to store your website files on, so that it can be accessed by everyone on the internet 24/7. Without a Web Host, your website will not be online for anyone to access.

Turn Key Websites vs Our Own Web Host
Turn Key Websites Websites such as Square Space, Shopify, etc typically include this Web Hosting as part of the entire website plan that you are paying monthly for, and you typically pay per website. However, if we pay monthly for our own Web Host from a Web Hosting Provider, in many cases we can now host unlimited websites for no extra cost. We also learned earlier that the Free version of WordPress.com we used earlier in this class is very limited by not giving us access to plugins and adding extra functionality to your website unless we start paying to unlock it… This is how WordPress offers their own way of paid accounts and web hosting, by charging you to use plugins. However, this is where the power of having our own shared web host is often the way to go, where we can now create unlimited websites for the same cost… Today we will be setting up our very first shared web hosting account, and create our own free unrestricted version of WordPress where we can now use plugins to add so much more website functionality!

Web Hosting Packages/Options
Web Hosts offer various packages depending on how large of website(s) you have, the amount of total traffic you have (measured as bandwidth), and how powerful the server is that you are hosting it on. You can pay for your own dedicated server that only your website(s) will then use which can costs hundreds of dollars per month, however you can also use what is called shared web hosting which is often more common, where your web hosting account is technically sharing with other web hosting accounts, and you are essentially sharing the costs of a server/computer, such as only $10/month. Depending on your project, website, or client requirements, you as the web developer will need to make the best decision to move forward with, and in most cases event for clients, shared web hosting is very common.
Visual Example: https://share.getcloudapp.com/v1uxoPAq

Ongoing Costs Moving Forward
We no longer have the cost of a book in this class, and so as web developers, one of the most important tools we could have is our own web host. If we continue down this path of web, this is a necessity. You can typically find web hosts for around the $10/month range (you can find cheaper however you get what you pay for typically applies here).

CHOOSING A WEB HOST

If you do already have your own web host, and you can install WordPress, feel free to continue using your own web host. Please just let me know what type of environment you do have to work with. You just want to make sure that whatever you do have for web hosting, you can have unlimited websites. After reviewing new web hosts annually, this is by far the best deal we have come across lately, you can pay for an entire year for under $40 last time we checked:

Explore Hostinger Premium Shared Hosting Plan for ONLY $2.99/mo *NEW & RECOMMENDED*
https://www.hostinger.com/web-hosting

FREE WEB HOSTING TRIAL

We did however, also find a web host that will actually give students a FREE 3 month trial as well… This company is called Site Ground and you must use your HTC email address when signing up. You can change this later however for now you do need our .edu email address to sign up. After the trial, you would then need to start paying for the service, figure roughly $10-15/month to continue hosting all of your websites, possibly even websites for family, friends, and even clients that are paying you… Having your own web host opens up an extremely large door of possibilities… After our class is over, and you decide that web is not for you, you can always save all of your websites to your desktop and cancel your web hosting plan. Use the link below to access this free 3 month trial program with Site Ground:

However, the actual savings is extremely minimal if you do plan to continue exploring building websites in the future… This will give you 3 free months of a trial, however then you will be paying a full rate of $14.95/month (Last time I checked) versus just starting a plan for only $4.95/month ish from the start, plus you will need to move all of your websites etc it really is more of a hassle to use the free trial, however here are the details below if you’d like to try it out. Otherwise, all you will want to do is look for a hosting plan that will allow you to have multiple websites, and not just one website. Usually this is the not the cheapest plan, but the next plan up…

How To Set Up Student Web Host Free Trial:
Sign Up Link: https://www.siteground.com/studentsprogram

YOU NEED TO USE your @hennepintech.edu EMAIL ADDRESS… They require this when signing up on their site… You can use your [email protected] however last I recall you do not need to confirm your email address, and then later on I recall students even changing their email address in their account… So just use anything @hennepintech.edu for now and that should get us into our accounts.

WRITE DOWN your password! Once you get all set up, you will be assigned a login to your Web Hosting Control Panel. PLEASE SAVE THIS LOGIN PAGE ADDRESS/URL, USERNAME, AND PASSWORD IN A SAFE PLACE. These will be the admin keys to all of your websites now moving forward.

You will be assigned a Primary Domain Name/Website Address. PLEASE SAVE THIS ADDRESS/URL AS WELL. This is the main website address that you will use to access all of your websites online moving forward. You can also pay for and add specific domain names to each of your websites down the road as well, versus using your primary domain name.

AFTER YOU ARE SET UP AND LOGGED INTO YOUR WEB HOST

After you get into your Control Panel, we will Install our very first WordPress Website which is completely unrestricted from any limits, and completely free, now that we have our very own web host. At this point feel free to always keep working ahead & expanding your knowledge, building as many websites as you’d like, exploring more about your web host, etc.

Basics of Building a Simple WordPress Page with WordPress Block Editor
Notes Link: https://share.getcloudapp.com/5zuGbRpm

Understanding WordPress Theme Customizer, Theme Widgets, Changing Themes, & Simple Contact Forms
Notes Link: https://share.getcloudapp.com/6quewA7g

Keeping track of our logins & passwords… I’ll be checking in with everyone to see how you are planning to do this!

Discussion 1 - Initial Thoughts…

*Submit Discussion into D2L

What you would like to create on the web? The World Wide Web is a BIG World! What is one thing you’d like to learn more about throughout our entire web program here at HTC?

Assignment 1: Building Our Very First Website! (State Park or National Park Website)

*Submit Assignment into D2L

Step 1: Set up a web hosting account to host all of your websites moving forward.

Step 2: Install one WordPress Website on your new web host, however when creating this, please type WordPress when it asks for the directory/folder name when creating the website.

Step 3: After you click install, this will give you a fresh new link to your new website… Open your new website and complete these very first 3 Steps…

Create your pages (For now, only create a Home and a Contact page, no content is necessary on these pages at this point).
Assign your home page to the page Home under Settings > Reading.
Create a New Menu under Appearance > Menus that includes a link to both of your new pages, Home and Contact.

Now we have our web host and first website created, and ready to focus on content! Pick your favorite park throughout the entire state of Minnesota… Or the country! And now you are going to make a website about it… Use the new skills you learn in class to build this new site, and watch our screen recording if you happen to miss class.

Step 4: Create the following pages:

Home Page (Typically a few highlights about the site)
About Page with at least 1 Photo and Paragraph/History of the park
Photo Gallery Page with at least 6 Photos
Video Page with 1 YouTube Video
Contact Page with an embedded Google map, address of the park, and a simple Contact Form.

Add all of these pages to your website Menu area as navigation to click to each page.

Feel free to use content you can find from Google, Wikipedia, etc… How about ChatGPT? I would just also always cite & give credit to any sources for any content if you copy & paste anything, however even feel free to write your own content or use your own photos…

OPTIONAL: Add a new Theme to the website as well. We often hold off on changing themes this early in the class, however always feel free to work ahead and learn as much as you can, it’ll only help you work faster & understand everything that much better in a career of web development!

If there were one thing I would have been taught earlier in college, it would be that every single piece of work you do in school could be used in your portfolio down the road… If there is a project you find exciting, and want to see how creative you can get, you are only helping yourself by improving your overall skills, experience, and future career opportunities… Writing your own content and using your own photos from a park you have been to in the past would be a really cool portfolio piece to show future potential clients…

Once you are happy with how it all looks and proud to show someone what you just made, all you need to do is submit a link into D2L. Good luck and enjoy building your first website! Many more down the road, including PAID opportunities!