My first website. I don't understand picture dimensions. Advice?

Thank you for your time.

I am starting a show on youtube that is a parody of The Walking Dead.

I don't know how to size my Jpeg appropriately so that it fills my homepage. The website, for now, will only be one page deep and simply contain links to the Youtube videos I'm making.

Eventually the site will be more complex, but I have no idea what size I should ideally make my home page Jpeg to fill the screen without going over.

Essentially I want only the picture below to show up when people go to the site, and nothing else (for now). But I don't know what size to make it in order for it to fit for any viewer.

Here is what the picture looks like:

http://www.w3schools.c​om/css/

^^^
Thanks, but that's what I was afraid of.

MikeFairbanks wrote in post #16078017
I don't know how to size my Jpeg appropriately so that it fills my homepage. The website, for now, will only be one page deep and simply contain links to the Youtube videos I'm making.

Eventually the site will be more complex, but I have no idea what size I should ideally make my home page Jpeg to fill the screen without going over.

Essentially I want only the picture below to show up when people go to the site, and nothing else (for now). But I don't know what size to make it in order for it to fit for any viewer.

There isn't a one size fits all to answer your questions. Laptops and desktops all have different screen resolutions and there is no way to fully anticipate whether users will have the browser full screen or not. People are also viewing sites on phones, tablets, and TVs. The best approach to handle this is responsive design, which resizes content as the viewport changes. You could then make your image as large as you want, but then size it down as the viewport shrinks.

I am not a fan of a completely full screen image, mainly because there isn't a lot of ways to get around it without either complex code or large files sizes for images. I instead pic a max width...like 1600px or something along those lines. You can then size your photo to have a 1600px width. In the CSS, set the max width of your image to 1600px and the width to be 100% of its parent element, which is probably the body in this case. Would look something like this...

img {
    width:100%;
    max-width:1600px;
}