Actividad de evaluación segundo corte
Resultado de
aprendizaje 1.3. Construye hojas de estilo en cascada
(CSS) de acuerdo con las especificaciones del World Wide Web Consortium (W3C
)
• Texto.
• Enlaces.
• Listas.
• Tablas.
•
Formularios.
Actividad
Retoma el sitio planeado en el resultado de aprendizaje 1.1 y las
páginas programadas en el resultado de aprendizaje 1.2
1. Integra
estilo a cada una de las páginas del sitio
2. Utiliza
archivos externos para integrar css a las páginas
3. Los
archivos css que utilices intégralos en una sola carpeta
4. Los
archivos de imagen o de audio si es el caso, intégralos en una carpeta
5. Los
archivos html, intégralos en una carpeta aparte
6. Debe
ser fácil de navegar en el sitio
7. Desde
cualquier parte del sitio se debe ser capaz de regresar al inicio
8. En alguna parte del sitio debe haber, listas y/o tablas, mismaas que debentener estilo
|
INDICADORES |
% |
C R I T E R I O S |
||||
|
Excelente |
Bueno |
Suficiente |
Insuficiente |
||
|
Uso de los elementos CSS en HTML |
15 |
• Utiliza la etiqueta <style> de HTML en de la sección <head> del documento para
incluir CSS dentro del mismo documento. • Utiliza la etiqueta <link> para
enlazar documentos CSS en un archivo externo con un documento HTML. • Utiliza comentarios en las CSS de acuerdo
con la sintaxis especificada por el propio lenguaje. Utiliza la inserción directa de CSS en los elementos
HTML |
• Utiliza la etiqueta <style> de HTML
en de la sección <head> del documento para incluir
CSS dentro del mismo documento. • Utiliza la etiqueta <link> para
enlazar documentos CSS en un archivo externo con un documento HTML. Utiliza comentarios en las CSS de acuerdo con la
sintaxis especificada por el propio lenguaje. |
• Utiliza la etiqueta <style> de HTML
en de la sección <head> del documento para incluir
CSS dentro del mismo documento. • Utiliza la etiqueta <link> para
enlazar documentos CSS en un archivo externo con un documento HTML. |
Falta alguna característica entre las siguientes: • Utiliza la etiqueta <style> de HTML
en de la sección <head> del documento para incluir CSS dentro del mismo
documento. • Utiliza la etiqueta <link> para
enlazar documentos CSS en un archivo externo con un documento HTML. |
|
|
Definición de tipografía y
apariencia del texto e hipervínculos |
30 |
Establece la tipografía del
texto de las páginas desarrolladas mediante el uso
de las siguientes propiedades CSS: • font-family • font-size • font-weight • font-style • font-variant • font • Establece la apariencia del texto de las páginas
desarrolladas mediante el uso de las siguientes propiedades CSS: • text-align • line-height • text-decoration • text-transform • vertical-align • text-indent • letter-spacing • word-spacing • white space • Aplica estilos a la primera letra del texto para
mostrarla como letra capital mediante el uso del pseudo elemento:
first-letter. • Modifica el tamaño de letra, color y decoración del
texto en los enlaces mediante el uso de las siguientes propiedades CSS: • text-decoration • font-weight • Aplica diferentes estilos a un mismo enlace en función de su
estado: enlace no visitado, enlace visitado, enlace en el que se para el
puntero del ratón por encima y enlace activo en ese momento, mediante el uso
de las siguientes propiedades CSS: • :link • :visited • :hover • :active • Personaliza el aspecto de los enlaces para que
incluyan un pequeño icono a su lado mediante el uso de las siguientes
propiedades CSS: • background • background-image • Además, demuestra cómo convertir algunos enlaces en
botones mediante el uso de código CSS
|
Establece la tipografía del
texto de las páginas desarrolladas mediante el uso de las
siguientes propiedades CSS: • font-family • font-size • font-weight • font-style • font-variant • font • Establece la apariencia del texto de las páginas
desarrolladas mediante el uso de las siguientes propiedades CSS: • text-align • line-height • text-decoration • text-transform • vertical-align • text-indent • letter-spacing • word-spacing • white space |
• Establece
la tipografía del texto de las • páginas desarrolladas mediante el uso de las siguientes
propiedades CSS: •
font-family • font-size • font-weight • font-style • font-variant • font • Establece la apariencia del texto de las páginas
desarrolladas mediante el uso de las siguientes propiedades CSS: • text-align • line-height • text-decoration • text-transform • vertical-align • text-indent • letter-spacing • word-spacing • white space |
Omite algunos de los
siguientes atributos: Establece la tipografía del
texto de las páginas desarrolladas mediante el uso de las siguientes
propiedades CSS: • font-family • font-size • font-weight • font-style • font-variant • font • Establece la apariencia del texto de las páginas
desarrolladas mediante el uso de las siguientes propiedades CSS: • text-align • line-height • text-decoration • text-transform • vertical-align • text-indent • letter-spacing • word-spacing • white space |
|
|
Uso de CSS en listas,
tablas y formularios |
30 |
• Controla
la posición y el tipo de viñeta que muestran las listas mediante el uso de las siguientes
propiedades CSS. • list-style-type • list-style-image • list-style • Define la viñeta automática que se mostrará cuando
no se pueda cargar la imagen en las listas. • Define las propiedades de las tablas mediante el uso de las
siguientes propiedades CSS: • border-spacing • border-collapse • empty-cells • caption-side • Mejora el aspecto de las tablas añadiéndoles color a
cada fila presentada. • Modifica los botones de los formularios para que se
muestre como enlaces mediante el uso de código CSS. • Alinea y formatea los elementos <input> y <label>
de los formularios agregando elementos <div> que encierre a cada campo del formulario mediante el
uso de código CSS. Agrega código CSS a los
formularios para resaltar el campo en el que el usuario introduce los datos
mediante el uso de la pseudo-clase: focus. |
• Controla
la posición y el tipo de viñeta que muestran las listas
mediante el uso de las siguientes propiedades CSS. • list-style-type • list-style-image • list-style • Define las propiedades de las tablas mediante el uso
de las siguientes propiedades CSS: • border-spacing
• border-collapse • empty-cells • caption-side • Modifica los botones de los formularios para que se
muestre como enlaces mediante el uso de código CSS. • Alinea y formatea los elementos <input> y <label>
de los formularios agregando elementos <div> que encierre a cada campo
del formulario mediante el uso de código CSS. |
• Controla
la posición y el tipo de viñeta • que muestran las listas mediante el uso de las siguientes
propiedades CSS. • list-style-type • list-style-image • list-style • Define las propiedades de las tablas mediante el uso
de las siguientes propiedades CSS: • border-spacing • border-collapse • empty-cells • caption-side • Modifica los botones de los formularios para que se
muestre como enlaces mediante el uso de código CSS. |
Omite algunas de las
características: • Controla la posición y el tipo de viñeta que
muestran las listas mediante el uso de las siguientes propiedades CSS. • list-style-type • list-style-image • list-style • Define las propiedades de las tablas mediante el uso de las
siguientes propiedades CSS: • border-spacing • border-collapse • empty-cells • caption-side • Modifica los botones de los formularios para que se
muestre como enlaces mediante el uso de código CSS. |
|
|
Depuración del código CSS COEVALUACIÓN |
15 |
• Verifica
que las páginas web se ejecutan correctamente en el navegador. • Identifica los posibles errores de ejecución que
pudieran presentar las páginas web y los corrige. • Realiza la comprobación de las páginas mediante el
servicio de validación de CSS en web |
• Verifica
que las páginas web se ejecutan correctamente en el navegador. Identifica los posibles
errores de ejecución que pudieran presentar las páginas web y los corrige. |
• Verifica
que las páginas web se ejecutan correctamente en el navegador. |
Las páginas web carecen de
una ejecución óptima. |
|
|
Presentación de resultados
|
10 |
• Presenta
la información descrita en los apartados anteriores en formato digital
(elaborados en un procesador de texto y/o presentador gráfico), con
estructura (caratula, objetivo y contenido) • Cumple con los criterios de contenido y presentación
establecidos. • Redacta documento aplicando las reglas
ortográficas y gramaticales. • Incluye referencias empleadas. Presenta el documento impreso
limpio, respetando la estructura definida para su diseño. |
• Presenta
la información descrita en los apartados anteriores en
formato digital. • Cumple con los criterios de contenido y presentación
establecidos. • Redacta documento aplicando las reglas ortográficas
y gramaticales. Incluye referencias
empleadas. |
• Presenta
la información descrita en los apartados anteriores en
formato digital. • Cumple con los criterios de contenido y presentación
establecidos. |
Incumple con alguna actividad
entre las siguientes: • Presenta la información descrita en los apartados
anteriores en formato impreso y digital. • Cumple con los criterios de contenido y presentación
establecidos. • Redacta documento aplicando las reglas ortográficas
y gramaticales. Incluye referencias
documentales y/o electrónicas empleadas. |
|
Comentarios
Publicar un comentario