Add Image Gallery Content Flashcards
terminar
finish up
Vamos a terminar este articulo de la lista y añadir el resto de ellos.
Let’s finish up this list item and add the rest of them.
leyenda
caption
Voy a añadir una leyenda justo debajo de esta imagen usando el elemento párrafo.
I’m going to add a caption just below this image using the paragraph element.
abrir
open up
Así que voy a abrir un párrafo y yo voy a decir
So I’m going to open up a paragraph and I’m going to say
experimentación
experimentation
experimentación con color y textura, para describir esta imagen.
experimentation with color and texture to describe this image.
Como dije / cambiar el tamaño
Like I said/ resize
Ahora, como he dicho, vamos a cambiar el tamaño de estas imágenes más adelante.
Now, like I said, we’re going to resize these images later on.
todavía nos gustaría / ver la imagen a tamaño completo.
we’d still like /see the full size image.
Pero nos gustaría todavía que los visitantes del sitio sean capaz de hacer clic, y vean la imagen a tamaño completo.
But we’d still like site visitors to be able to click- and see the full size image.
añadir un enlace alrededor
add a link around
Vamos a añadir un enlace alrededor de esta imagen, y la leyenda a la imagen de tamaño completo.
Let’s add a link around this image, and caption to the full size image.
Y podemos hacerlo de esta manera.
And we can do that like this.
Así que dentro de nuestro articulo de la lista y justo
So just inside of our list item and just
antes de nuestra imagen- voy a añadir
before our image- I’m going to add
ancla
anchor
un elemento de anclaje con el hipervínculo
an anchor element with the hyperlink
ruta de acceso
path
Se dará cuenta de que esta es la misma ruta exacta de archivos como la fuente para nuestra imagen.
You’ll notice that this is the exact same file path as the source for our image.
Eso es porque en este caso, estamos vinculando a la imagen directamente.
That’s because in this case, we’re linking to the image directly.
Ahora necesitamos poner nuestra ancla de cierre
Now we need to put our closing anchor
justo después de nuestro párrafo.
just after our paragraph.
sangrar
indent
Y luego, finalmente, necesitamos sangrar estas dos líneas.
And then finally we need to indent these two lines.
Ahora hasta este punto / uno a la vez.
Now up until this point/one at a time.
Ahora hasta este punto, hemos estado sangrando líneas una a la vez.
Now up until this point- we’ve been indenting lines one at a time.
Pero si usted necesita sangrar multiple líneas,
But if you need to indent multiple lines-
hay realmente
there’s actually
hay realmente una tecla de acceso directo sólo por eso.
there’s actually a shortcut key just for that.
Podemos resaltar las líneas que queremos sangrar.
We can highlight the lines that we want to indent.
Y entonces, si estás en un Mac,
And then- if you’re on a Mac-
corchete cuadrado
square bracket
presione Comando y luego corchete cuadrado.
press Command and then square bracket.
Y sí estás en Windows, puede presionar Control y corchete.
And if you’re on Window,- you can press Control and square bracket.
Ahora, por supuesto, hay dos corchetes.
Now, of course, there are two square brackets.
Así que, dependiendo sobre cual usted presione se determinará de qué manera el texto es sangrado.
So depending on which one you press will determine which way the text is indented.
Así que en mi Mac, al presionar Cmd + ]
So on my Mac- by pressing Cmd+]
o cierre de corchete cuadrado - será sangrará el texto.
or closing square bracket- it will indent the text.
práctico/fácil de manejar
handy
Eso es muy practico si usted necesita sangrar un montón de líneas.
That’s very handy if you need to indent lots of lines.
marcado
markup
Ahora, eso es todo el marcado que vamos a necesitar para cada articulo en nuestra galería de imágenes.
Now, that’s all the markup that we’ll need for each item in our image gallery.
Ahora, sólo necesitamos copiar y pegar este
Now- we just need to copy and paste this
varias veces para agregar el resto de nuestras imágenes.
several times to add the rest of our images.
Una vez que hemos copiado y pegado cada uno,
Once we’ve copied and pasted each one,
modificaremos cada uno así esa lo vincula a una nueva imagen. Así que, vamos a hacer eso ahora.
we’ll modify each one so that it links to a new image. So, let’s do that now.
completo / teniendo cuidado
entire/being careful
Primero, voy a resaltar este articulo de la lista completo, siendo cuidadoso
First- I’m going to highlight this entire list item- being careful
para no resaltar cualquier otro código que no voy a necesitar, y
not to highlight any other code that I won’t need, and
en mi Mac voy a presionar Cmd + C- y si estas
on my Mac I’m going to press Cmd+C- and if you’re
portapapeles
clipboard
en Windows, usted puede pulsar Ctrl + C para copiarlo a tu portapapeles. Y
on Windows- you can hit Ctrl+C to copy it to your clipboard. And
grupo/puñado . monton de veces
bunch ….. bunch of times
Necesito esto cuatro veces, para un total de cinco, así que voy a pulsar enter un montón de veces
I need this four times- for a total of five- so I’m going to hit Enter a bunch of times
sólo para hacer un poco de espacio para trabajar así tu puedes ver claramente lo que está pasando.
just to make some space to work so you can clearly see what’s going on.
Y luego me voy pegar los contenidos de mi portapapeles mediante pulsar Cmd + V.
And then I’m going to paste the contents of my clipboard by hitting Cmd+V.
Si estás en Windows usted puede pulsar Ctrl + V. Así que voy a pegarlo una vez,
If you’re on windows you can hit Ctrl+V. So I’m going to paste it once-
sangrado
indentation
y te darás cuenta que yo en realidad he copiado algun sangrado aquí
and you’ll notice that I’ve actually copied some indentation here
Así que vamos a ver si puedo volver a copiar eso, y
So let’s see if I can recopy that- and
luego pegarla de nuevo para que sólo copie el código y no el sangrado adicional.
then paste it again so that it only copies the code and not the extra indentation.
Necesito copiarlo 3- 4- y un total de 5
I need to copy it 3- 4- and a total of 5
así que nosotros en realidad acabamos de copiar eso cuatro veces- para un total de cinco articulos de la lista.
so we actually just copied that four times- for a total of five list items.
Voy a eliminar este espacio extra porque no lo necesitaremos.
I’m going to delete this extra space because we won’t need it.
Y ahora-,estamos listos para modificar cada articulo de la lista.
And now- we’re ready to modify each list item.
Así que, si abrimos nuestra carpeta de imágenes- te darás cuenta de que estos no son secuenciales. Pasamos de 1, 2-
So- if we open our images folder- you’ll notice that these are non sequential. We go from 1, 2,
saltar/omitir
skip
y luego saltar a 6- 9 y 12. Sin embargo- eso es completamente intencional.
and then skip to 6- 9- and 12. However- that’s completely intentional.
es siempre mejor
its always best
Cuando usted está haciendo una portafolio es siempre mejor editarlo y sólo incluir (dejar) tu mejor trabajo
When you’re making a portfolio its always best to edit it and only leave in your best work
Así que hay otras cosas que son creadas aquí
So there are other things that are created here
pero estas son las que quiero mostrar.
but these are the ones that I want to show.
Así que tenemos que modificar cada articulo de la lista.
So we need to modify each list item.
Así que vamos a modificar el HREF- y también vamos a modificar la fuente de modo que ellas coincidan……. (de modo que)
So we’ll modify the HREF- and we’ll also modify the source so that they match.
Así que hay la segunda imagen.
So there’s the second image.
La tercera imagen va a ser seis en este caso.
The third image is going to be six in this case.
La cuarta imagen será nueve. Y entonces nuestra imagen final- vamos a decir- 12.
The fourth image will be nine. And then our final image- we’ll say- 12.
A continuación - necesitamos cambiar cada uno de nuestras leyendas.
Next- we need to change each one of our captions.
inexacta
inaccurate.
De lo contrario, todas ellas seran las misma, lo cual es bastante aburrido e inexacta.
Otherwise- they’ll all be the same- which is pretty boring and inaccurate.
mezcla/fusion
blending
Así que nuestra segunda imagen, voy a decir, jugar con los modos de fusión en Photoshop.
So our second image- I’ll say- playing with blending modes in Photoshop.
Y, por supuesto, usted va querer digitar descripciones que coincidan con sus propias imágenes.
And- of course- you’ll want to type descriptions that match your own images.
Mi segunda imagen, voy a decir, tratando de crear un estilo de los años ochenta de resplandores.
My second image- I’ll say- trying to create an eighties style of glows.
goteo
drip
En mi siguiente imagen, que voy a decir, goteos creados
In my next image- I’ll say- drips created
cepillos/pinceles
brushes
utilizando pinceles de Photoshop. Y, finalmente,
using Photoshop brushes. And then finally
mi última leyenda dirá, creando formas usando la repetición.
my last caption will say- creating shapes using repetition.
Vamos a seguir adelante y guardar esto- y luego vamos a abrir nuestra vista previa y
Let’s go ahead and save this- and then we’ll open up our preview and
desplácese hacia abajo
scroll down
refrescar la página. Y si nos desplázamos hacia abajo-
refresh the page. And if we scroll down-
verás ahora que todas nuestras imágenes están presentes. Y por debajo de ellas,
you’ll now see that all of our images are present. And below them-
hay también una leyenda para cada imagen. Ahora,
there’s also a caption for each image. Now-
si voy adelante y hago clic en cualquiera de estas imágenes,
if I go ahead and click on any one of these images-
me va a mostrar el enlace a la imagen,
it will show me the link to the image-
o la imagen actual de si misma yo debería decir, en una nueva página.
or the actual image itself I should say- in a new page.
Si hago clic en el botón Atrás puedo volver a la página web que estoy creando.
If I click the Back button I can go back to the website that I’m creating.
Estamos a punto de terminar con la estructura pero hay unos pocos
We’re just about finished with the structure but there’s a few
terminar con esto
wrap this up
más cosas que tenemos que hacer para terminar con esto.
more things that we need to do to wrap this up.