Help File

First, Download and Install the Following Apps:

  1. a) Any Code Editor [Brackets or Notepad++] - for editing html5, css3, and javascript, etc.
    2. Brackets is mostly polished, can manage multiple files at one time, and has a dark theme option.
    Notepad++ is a solid bare basic app, but I recommend trying Brackets first.
    Brackets
    Notepad++
  2. b) Audacity - An audio editing program capable of producing and editing mp3 files.
    3. Audacity
  3. c) Gimp - A powerful Photoshop alternative
    4. Gimp can add an alpha channel (transparent background) to images. This program's features can be overwhelming, but if the goal is to only add a transparent background to an image that already has a basic white background, simply open the image in Gimp and click 'Colors > Colors to Alpha'. Then just 'File > Export As..' and export the image as a png file.
    Gimp
    Alternatively, you can download free transparent background images from HiClipart.

Sign up for ChatGPT at this link.

I kept having errors signing up by email, but signing in with my Google Account worked.

ChatGPT Sign-up Link

Hosting Your Files on the Web for Easy Access to All Your Devices.

One way might be easy is paying for a Web Host provider like Godaddy which is about $20 per year for the domain name and about $12 monthly for web hosting.

Video Tutorial

If you want it on the web for your personal convenience and do not care about others viewing your page, you can host it for FREE from a computer at home. NOTE: Anything you post is still made public.

Supplemental Video Tutorial
  1. Step 1) Set a static IP on the computer which will run your website.
  2. Step 2) Be able to log into your router and access the port forwarding/triggering controls. (Some routers provided by the Internet Service Provider does not allow for this, but you can buy your own which is not too expensive.)
  3. Step 3) Open Port 80 for TCP in your router to the Static IP you set in Step 1.
  4. Step 4) Install Apache Xampp.
    5. Apache Xampp
  5. Step 5) Navigate to C:\xampp\htdocs on your computer, delete the sample website files from this directory and paste in your own.
  6. Step 6) With Apache running, you should be able to type in your public IP to access the page. You can find this by Googling, "What is my IP?" NOTE: Your public IP will change from time to time.

This will be good enough for personal use, but if you want to register a free domain continue:

  1. Step 6) Register for a free domain from either Freenom or a cheap one from Namecheap. You can buy a .decent address from Namecheap instead of .com for $40 for ten years.
    2. Freenom
    Namecheap
  2. Step 7) You will enter the IP of where your site is hosted [Your Public IP] on the account where your domain name is located [Godaddy, Namecheap, Freenom etc]. This is just a summary and there are few other steps to this, but it is well documented online. Just search, "How to set up a domain name." Now when your domain is typed, it should take you to your site.

NOTE: If your website is being flagged because it is not SSL certified, proceed to Step 8. If you are sharing your site with anybody other than close friends and family, proceed to Step 8 for the security and protection.

  1. Step 8) Create a free account on CloudFlare. Then you will do similarly as you did in Step 7 except the domain name will point to CloudFlare and CloudFlare will point to your home's public IP address.
    2. CloudFlare

More Optional

  1. Step 9) Automate Updating Your Public IP - Your home's public IP will change from time to time which will cause the site to go down, when that happens you will just log into CloudFlare (or where your domain is located if you are not using CloudFlare) and update your home's public IP address.

    2. You can sign up for 'No IP' and follow additional steps that are out of the scope of this help file. You basically download an app to your PC that will monitor when your home's public IP changes and updated it automatically.

    In theory, it will work by 1) installing the app, 2) pointing your domain to Cloudflare, 3) pointing Cloudflare to NoIP and 4) NoIP to your home's public IP address. If you pay NoIP $2 each month, you can get your SSL certificate from them and take Cloudflare out of the equation.

Make Quality Text-To-Speech mp3 files

This site has a 3,000 word limit per day unless you purchase a subscription, but it creates high quality mp3 files in multiple languages.

https://ttsmp3.com/

Find Quality Transparent PNG Files.

https://www.cleanpng.com/

https://www.hiclipart.com/

https://pixabay.com/

https://www.pngaaa.com/

Convert srt to lrc.

Go Transcript - Subtitle Converter

Other Common Helpful Hints

If you are displaying the site over the web, make sure the following code is in the header of your html5 code, so that letters are displayed properly.

<meta charset="UTF-8">

Double-check the paths to your directories if audio and image files are not loading.

If you are hosting your HTML files, make sure there is always an index.html file which will be your home page.

If you want your website to be mobile-friendly and have a responsive design, meaning it will look nice both on mobile phones and desktop computers, it will require a lot more work and is a broad category, but I will try to summarize the best I can. You will first need to move all of your styling to a separate file like 'style.css' then link to your style sheet in the head of the HTML5 doc instead of placing your code there. You will three different style sheets, one for desktop computers, one for tablets and one for phones. You will code in certain commands that will adapt to using the correct CSS file depending on the size of your screen. W3 Schools is a good resource.

W3 Schools