docs: fix triangle diagram typos and improve caption clarity

Author: aashu2006

src/content/tutorials/en/variables-and-change.mdx

@@ -187,7 +187,7 @@ The code above uses [`circle()`](/reference/p5/circle) and [`triangle()`](/refer
     - [This example](https://editor.p5js.org/p5Master718/sketches/CxuLJszOL) shows how you can use triangles that overlap to create a mountain with some more detail.
 - [`triangle()`](/reference/p5/triangle) needs the location of 3 points on the canvas in order to appear. Each point has an x-coordinate and a y-coordinate value. The first two numbers are the x- and y-coordinates of the first point (x<sub>1, </sub>y<sub>1</sub>), the second two numbers are the coordinates of the next point (x<sub>2, </sub>y<sub>2</sub>), and the last two are the coordinates of the last point (x<sub>3, </sub>y<sub>3</sub>).
 
-![A labeled diagram depicting a triangle with coordinates labeled for its three corners: (x1, y1), (x2, y2), and (x3, y3). The syntax for the triangle function is displayed above the diagram as: “triangel(x1, y2, x2, y2, x3, y3);”](../images/introduction/triangle-diagram.png)
+![A labeled diagram showing a triangle with three corners at coordinates (x1, y1), (x2, y2), and (x3, y3). The syntax for the triangle function is displayed above: "triangle(x1, y1, x2, y2, x3, y3);"](../images/introduction/triangle-diagram.png)
 
 Your landscape may look very different from the code sample above. Feel free to use any of the following shapes in your sketch (click on the links to learn more): [`rect()`](/reference/p5/rect)  |  [`triangle()`](/reference/p5/triangle)  |  [`ellipse()`](/reference/p5/ellipse)  |  [`circle()`](/reference/p5/circle)  |  [`line()`](/reference/p5/line)  |  [`square()`](/reference/p5/square)  |  [`quad()`](/reference/p5/quad)  |  [`point()`](/reference/p5/point)  |  [`arc()`](/reference/p5/arc)