Easy but useful

Favicon icon

The icon for your webpage. Mine is a cake I drew. Appears in URL bars and browser tabs.

Put this code at the top where your meta data/title/stylesheets are.

<link rel="shortcut icon" type="image/jpg"  href="your image link here"/>

Load HTML pages using jQuery

Don't edit every page individually - us jQuery so you can edit them independently and affect every other page in doing so. Useful for stuff like headers, footers and other persistent elements.

Setup

1) Put jQuery on your site. There's two ways: Libraries (CDNs) or downloading it. Libraries are the easiest way (copy and paste).

If downloading: Follow instructions on its site here.

If doing copy pasta, use hosted libraries like here or here to put at the top of your page. Simply copy pasta the link in between the quotation marks like below, then place it where your other script sources are under your stylesheets:

2) Take your entire element (i.e, header) and copy + paste it into a new html page. Save.

Next...

There's two ways again to do this. You can either make a separate .js file, or you can just paste it on each page using it. The fomer is more ideal, but I'll go into both here.

1) If Making a .js file, open notepad and copy pasta the code below into it, then save it as a .js file.
here
2) If just pasting, put the script on all your pages that have the element (i.e header); you need this script for it to work. Copy, pasta and replace with the name of your element. Since this example is using a header, these must be put on all pages. Once done, you will only have to edit the navbar html page for it to affect all pages.

Load it.

$(function(){
$("#footer").load("navbar.htm"); 
});

Put the div where you want it loaded on your page.

Troubleshooting

Check the names of your elements. Are they correct and consistent?
Is the script on the same page?
Is your html page to be loaded correctly saved?

Meta data - let people find your page/describe your pages!

Meta data is the copy pasta at the top of a page that tells crawlers (like Google) what data is on that page. You can even use them to see previews of your webpage whilst searching!

This is a quick-start guide, so if you want in-depth information and more tags, a quick duckduckgo search will do.

Just take this

You can put it at the top of each of your pages to describe them.

My one looks like this. You can feel free to use it as a base. I'm pretty sure I copy pasta'd it from somewhere too...

<title>VenCake</title>
<link rel="shortcut icon" type="image/jpg" href="images/some vencake.png"> Put your favicon icon here.
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1"> Responsive stuff.
<meta property="og:url" content="https://vencake.neocities.org/"> Self-explanatory.
<meta property="og:type" content="article"> The type of content you have on the page.
<meta property="og:title" content="Vencake"> Title of your site.
<meta property="og:description" content="Personal expressive hub with a focus on games & creativity." > Describe the page!
<meta property="og:image" content="#" /> Snapshot of your webpage - put it here! It's what is shown when shared on e.g. FB.
<meta property="twitter:card" content="summary_large_image"> How it appears on twitter. Yuck,

Header