Het lukt niet om een plaatje te plaatsen op mijn website

wilmah · 08 sep 2010, 12:19

Hallo,

Ik heb de cursus Website maken gevolgd, maar nu lukt het me niet om een plaatje te plaatsen. Ik werk met Vista op een Engelstalige laptop.
Ik krijg steeds een kader met een blokje erin, maar geen afbeelding.

Ik heb al van alles geprobeerd o.a.:

<IMG SCR="C:/users/owner/documents/website maken/images/stamboom.jpg">

<Img scr="images/stamboom.jpg">

>Img scr="stamboom.jpg">

Wat doe ik fout?

Groetjes, Wilma

ultddave · 08 sep 2010, 13:45

Ik neem aan dat je een index.html pagina hebt, en je wilt daar een foto op tonen?

Als je dat wilt doen op je PC, zou ik gewoon de foto "stamboom.jpg" in dezelfde map als de index.html file zetten.

En dan kan je in de index.html file, deze code gebruiken:
<img scr="stamboom.jpg" alt="stamboom" />

Of als je een submap "images" hebt, kan je die daar inzetten. (Dat is het beste)

En dan kan je in de index.html file, deze code gebruiken:
<img scr="./images/stamboom.jpg" alt="stamboom" />

Ook kan je best eens nakijken of het bestand wel degelijk "stamboom.jpg" heet.

Mvg,
Dave

wilmah · 08 sep 2010, 14:09

Hallo Dave,

Bedankt voor je reactie. Wat jij vertelt heb ik ook gedaan want zo werd het uitgelegd in de cursus.
Ik heb een map website maken gemaakt en daarin de index.html pagina en ook het plaatje stamboom gestopt. Verder heb ik nog in de map Website maken een map images gemaakt en het plaatje daarin gekopieerd.
Nu heb ik jouw htmlcodes gekopieerd om het nog eens te proberen. Jij had bij de laatste een extra punt. Dus ik dacht misschien is dat het wel. Ik blijf een kader krijgen met een blokje erin. Wat je ook wel eens bij het surfen op het web krijgt als het plaatje maar niet komt.

Wilma

ultddave · 08 sep 2010, 14:38

Zo moet het inderdaad. Vreemd dat het niet werkt. Kan je anders eens de broncode kopieren en hier plakken?

Want normaal gezien moet dat werken als de foto stamboom.jpg (zeker dat het .jpg is, en niet bijvoorbeeld .png?) heet.

Jij had bij de laatste een extra punt.

Een punt wordt gezien als "huidige map". Je mag dat in principe weglaten.

Misschien ter informatie: Je kan ook twee puntjes gebruiken:

../test/

dat wil zeggen "Ga een map hoger. En open dan de map test". Dus twee puntjes, laat je toe om een map hoger te gaan.

(In dit geval is dat uiteraard niet nodig)

Mvg,
Dave

wilmah · 08 sep 2010, 15:29

Hallo Dave,

Ik weet niet wat je precies wat je met broncode bedoelt maar ik neem aan dit:
<html>
<head>
<title>
Wilma's web weetjes
</title>
</head>
<body bgcolor="00BF30">
<p><h1 align="center">Wilma's web weetjes</h1></p>
<br>
<br>
<p><h3>Genealogie</p>
<img scr="/images/stamboom.jpg" alt="stamboom" />
<p>Remedial teaching</p>
<p>Myelitis Transversa</h3></p>
</body>
</html>

Ik ben nog maar net begonnen zoals je ziet.

In mijn map images zit een plaatje stamboom wat een gif bestand is en een plaatje stamboom wat een jpeg bestand is. Tenminste als ik er met de muis op ga staan verschijnt dat in beeld. Verder heb ik ze van internet afgehaald opgeslagen en een nieuwe naam gegeven namelijk stamboom.
Misschien is dat het probleem da tik ze een neiuwe naam gegeven heb?
Ik zal nog eens proberen ze op te slaan en met de oorspronkelijk naam op te halen.

Groetjes, Wilma

wilmah · 08 sep 2010, 18:50

Ook met de oorspronkelijke namen van de plaatjes lukt het niet.

Wat is de reden dat je op sommige websites soms ook geen plaatjes ziet maar een kader met een blokje erin?

Dat is dan misschien dezelfde reden waarom het bij mij niet werkt.

groetjes, Wilma

ultddave · 08 sep 2010, 18:58

Ik weet niet wat je precies wat je met broncode bedoelt maar ik neem aan dit:

Inderdaad, dat is de broncode.

Ah ik zie het probleem al. Een kopieerfoutje van mij (had de code uit uw eerste post gekopieerd zonder op de schrijfwijze van "src" te letten

):

<img scr="/images/stamboom.jpg" alt="stamboom" />

<img src="/images/stamboom.jpg" alt="stamboom" />

Het is "SRC" = Source (=bron in het Engels). SCR bestaat niet, en werkt daarom niet.

Om de extensie van het bestand te zien moet je dit doen:
Start > configuratiescherm > mapopties. Tabblad "Weergave". (Ik denk View in het Engels)

En dan moet je "extensie voor bekende bestandstypen verbergen" UITvinken. (In het Engels heet dat "hide extension for known filetypes" als'k me niet vergis). En dan kan je zien of ze de extensie .jpg, .gif of .jpeg of iets anders hebben.

Maar het kan zijn, dat het veranderen van scr naar src al het probleem oplost.

Wat is de reden dat je op sommige websites soms ook geen plaatjes ziet maar een kader met een blokje erin?

Dat komt doordat de "src" attribuut van het "<img>" tag niet juist is. Dit komt door:
1 - De foto staat niet op de aangegeven plaats.
2 - De foto heeft niet dezelfde naam als aangegeven door het src attribuut.

PS: Het attribuut "alt" dat ik bij de foto plaats, is een stukje tekst dat getoond wordt als de foto niet getoond kan worden. Dus in plaats van een kader met een blokje (kruisje) erin, krijg je dan een kader met de tekst "stamboom" erin (in dit geval). Die informatie wordt ook gebruikt door google om je foto's bij 'google afbeeldingen' te tonen bij bepaalde zoekresultaten.

Mvg,
Dave

ultddave · 08 sep 2010, 19:20

Heb even nog een paar foutjes eruit gehaald in verband met de "nesting" van de tags.

<p><h3>Genealogie</p>

Kan bijvoorbeeld niet omdat je eerst <p> opent, dan open je <h3>. En dan verwacht de browser dat je dus eerst </h3> sluit, en dan pas </p> sluit.

Dit is de verbeterde code:

Code: Selecteer alles

<html> 
	<head> 
		<title> Wilma's web weetjes </title> 
	</head> 
	<body bgcolor="00BF30"> 
		<h1 align="center">Wilma's web weetjes</h1>
		<p>
			<br/> 
			<br/>
		</p>
		<h3>Genealogie</h3> 
		<p>
			<img src="/images/stamboom.jpg" alt="stamboom" />
		</p>
		<h3>Remedial teaching</h3> 
		<h3>Myelitis Transversa</h3> 
	</body> 
</html>

Er zijn in principe nog een aantal dingen die best anders gedaan worden, want de cursus hier op de site is al redelijk verouderd.

Maar die zaken zouden waarschijnlijk te ingewikkeld worden.

Mvg,
Dave

wilmah · 08 sep 2010, 22:24

Dank je, dank je, dank je Dave!

Met dit zinnetje is het me gelukt!

<img src="images/stamboom.gif">

Heb ik nog zo op alle haakjes en komma's e.d. gelet en maak ik zo'n stomme fout. Ik ben blij dat het opgelost is, want het frusteert mateloos als het steeds niet lukt. Dus nu ga ik weer vol hoop verder met het ontwerpen van mijn site.

groetjes, Wilma

nonkel fried · 16 sep 2010, 16:44

Hallo...

Ik ben met de cursus website bezig van seniorennet, en heb ook een handleiding HTML in Nederland via Internet gevonden.
ik zou graag Afbeelden plaatsen in een hyperlink om de bezoeker de mogelijheid te bieden een grotere foto te zien.
Maar het lukt mij steeds niet, telkens ik klik op de afbeelding verschijnd een internetpagina met de tekst (De webpagina kan niet worden weergegeven).
Hieronder de Broncode die ik toepas in de< body>

<a href="usa3.gif"><img src="./images/afbeelding 3.jpg"alt="afbeelding 3"
Width="150"Height="102"border="0"align="bottom"></a>  klik op
de afbeelding om een grotere foto te zien.

Kan mij iemand melden wat ik verkeerd doe, of hoe het moet ??
Hartelijk Dank
Gr: Nonkel fried

ultddave · 16 sep 2010, 19:01

Beste,

Waar staat het bestand "usa3.gif"? Als die ook in de map images staat, moet je dit veranderen:
<a href="usa3.gif">
naar:
<a href="./images/usa3.gif">

Mvg,
Dave