Hi, everyone! The code begins with good mentors in life. question? working on my first website which is on GoDaddy hosting. Having a problem with pexels.com. So I can put this free photo on my website. -using an editor called Komodo editor. Using FileZilla also.for hosting upload.
<!DOCTYPE html>
<html>
<title>Camping in Sonoma County</title>
<img src= "pexels-photo-134634-1.jpeg.>"width="250" height="400">
<h1 style="color:black;">Welcome to Cristina Forestville Camp grounds.</h1>
<body style="background-color:purple;">
If the photo is hosted by pexels.com, then you need to include the fully qualified domain name and not just the image name. There’s also a typo in your code (remove the .> from the end of your image path):
If your photo is on your web host, then double check the path to that image as well. It should be a relative path (relative to the html file that’s loading the image).
If the image is in the same directory as the html file it’s not required of him to add the full file path. He is missing an “alt” attribute which is required under W3C Standards, if you don’t want to write one out just add alt=“” so you comply with standards without a lot of extra effort. Thoughts?
If it’s being served from the same domain then a relative path is all that’s required. A URL is more abstract than a directory and the image can be on a completely different machine so long as they are accessed via the same FQDN.
I’d say you should direct this to the OP. It’s not at all related to the question, but it’s certainly good info.
He asked for help inserting an image, he was also missing an alt tag which is required by W3C Standards. I think it’s related and we should be teaching this to all new developers.
Hi. Cool ! is this good? Well it didn’t work. what next.?
<img src="www.https://pexels.com alt=“pexels-photo-134634-1.jpeg” width=“250” height=“400”>
And if you look at the photo on that page you can see that it has its own url, which is https://static.pexels.com/photos/374845/pexels-photo-374845.jpeg. Maybe they prevent you from linking to it for the purpose of embedding, but otherwise, that’s the URL you want to use.
(EDIT: to add - that if you can’t link to it there, because they don’t want you to, you will need to re-host the picture somewhere else for yourself)
@r1chard5mith is right, I think. The url your using links to an html page and not the actual image file.
A quick codepen demo shows how the www.pexels.com url is failing and the static.pexels.com url is working. Thankfully, it looks like they do allow “hot-linking”.
That code does not meet syntax standards. Write like this: <img src="https://images.pexels.com/photos/374845/pexels-photo-374845.jpeg?w=1260&h=750&auto=compress&cs=tinysrgb" alt="" />
Remember that the src attribute requires the link to be in quotes.
I’ve studied the W3C HTML Specification (HTML Standard), I’ve had a lot of practice and focus on writing standards compliant code at all times. It just takes a lot of time and practice, you’ll get better as you continue doing more projects. Also I noticed you were trying to put the page URL and not the direct image URL, you have to put a direct URL to the image, a page URL won’t work. That being said I think reading the W3Schools HTML Tutorial (HTML Tutorial) might be beneficial for you and you’d have a stronger understanding while working on the challenges here. Good luck on your future progress here and let us know if you have any further questions
