Go to File>Export>Save for Web (Legacy) and a window will open up:
In the upper right of the window, set the format you want to use (jpeg for continuous tone; gif for images made of large solid color, such as logos, and png if you want to use transparency)
If it's a jpg, adjust the quality to the smallest percentage that doesn't make the image look really bad (a good starting place is 60%).
In the lower right, change the pixel width to the largest size you are likely to use the image. (For this project, probably 500px.)
Click save and save the image into the images folder in your project folder. It's a best practice to include the width of the image in the name of the file (like "x300"), if only so you don't accidentally overwrite your original file.
Create a template for a standard html file:
<!DOCTYPE html>
<html lang="en-US">
<head> <!-- Instructions to the page -->
<meta charset="utf-8"> <!--Allows you to type original on Mac or PC and have all characters display correctly. (Chrome seems to always use utf-8; Firefox doesn't.) -->
<title>Name of Page</title> <!--This name shows in browser tab -->
<style>
* {margin:0; padding:0;} /* This is a reset style; "*" means it affects everything. */
Then the h element (h1, h2, etc.) you are linking to:
<h2 id="biography">Biography</h2>
(The id can be attached to almost any element, but it can only be attached to one element on a page. "#" means "id" in the link.)
Seperate and identify content by wrapping <divs> and other semantic elements, such as <nav> and <article>, around text (opening element before the text, closing it after the text).
Add color to the container elements such as <body>, <article>, and <div> using css {background-color:#hexvalue}. (You can get the hex value from the color picker in Photoshop.)
And finally center your website by adding:
<div> just below <body>,
</div> just above </body>,
and div {width:800px; margin:0 auto, padding:40px;} to the css styles at the top of the page
to wrap around all the elements on the page, reduce the width of the website and center our website on the page. Add color to the <div>'s background to see it.