Actividad

Desarrollador front-end [Nivel 4]

Lección 1 / Actividad 1
Facilitando el desarrollo front-end

IMPORTANTE

Para resolver tu actividad, guárdala en tu computadora e imprímela.

Si lo deseas, puedes conservarla para consultas posteriores ya que te sirve

para reforzar tu aprendizaje. No es necesario que la envíes para su revisión.

Propósito de la actividad

Proporcionar herramientas gratuitas que faciliten el desarrollo Front-End con el

fin de acelerar el proceso y posicionar al sitio web dentro de los mejores del
ramo.

Practica lo que aprendiste

1. Identifica las buenas y malas prácticas para el posicionamiento SEO off-

page:

Buenas Malas
Actividad prácticas
prácticas
Crea contenido original
Compra de links
Referencias con keywords
Genera SPAM
Usa redes sociales

2. Genera keywords para las siguientes páginas y escribe tres por cada
caso.

Keyword Keyword Keyword

Actividad
1 2 3
Venta de calzado
Blog de tecnología
Foro de política
Enciclopedia WEB
Venta de ropa
 Actividad

3. Entra al siguiente enlace y descarga el editor de texto:

https://code.visualstudio.com/c?utm_expid=101350005-
35.Eg8306GUR6SersZwpBjURQ.2&utm_referrer=https%3A%2F%2Fwww.google.com.mx%2F

1) Descarga los siguientes paquetes:

 HTML CSS Class Completion
 HTML Preview
 Color picker
 Color Hightlight
2) Crea un archivo HTML en el editor de texto especializado.
3) Escribe una nueva página web referente a tu vida, biografía, etc.
4) Escribe el resultado en el siguiente recuadro.
 Actividad

4. Relaciona las siguientes columnas:

Framework con
archivos CSS para el Boopstrap
diseño de materiales,
como sombras,
tipografía, colores.

Es muy avanzado. Es
ideal para el desarrollo
Foundation
de sitios responsivos.
Permite modificar los
archivos de estilo, lo
cual ofrece mayores
libertades a la hora de
codificar.

Es el framework más Semantic-UI

sencillo de usar gracias
a sus paquetes
integrados.

Agrega un diseño
responsivo para que las
páginas puedan
ajustarse al tamaño de Materialize
los distintos dispositivos.