Diferencias

Muestra las diferencias entre dos versiones de la página.

--- clase:daw:diw:1eval:tema01 [2022/01/19 08:30]
admin [Colores]
+++ clase:daw:diw:1eval:tema01 [2023/01/04 10:30]
admin [Normas y estilos de diseño]
@@ Línea 12: / Línea 12: @@
   * Los títulos <h1> no tienen porque destacar ya que a veces no son importantes ya que es obvio el título. <h1> es para que el buscador sepa que eso es importante.
   * Las esquinas cuadradas indican seriedad. Las Esquinas muy muy redondeadas son muy informales.(border-radious)
-  * Para enfatizar en vez de un mayor tamaño de letra, usa negrita. Pero para desenfatizar, una un color le letra gris en vez del negro del texto.
+  * Para enfatizar en vez de un mayor tamaño de letra, usa negrita. Pero para desenfatizar, usa un color de letra gris en vez del negro del texto.
   * Nunca usar un carrusel. [[https://shouldiuseacarousel.com/]]
@@ Línea 25: / Línea 25: @@
   * [[https://learnui.design/blog/why-beginning-designers-dont-need-grids-type-scales-color-theory.html|Why Beginning Designers Don't Need to Learn Grids, Type Scales, or Color Theory (and other “Designer Dogma”)]]
   * [[https://digitalsynopsis.com/design/useful-ui-ux-design-tips/|Short, Useful Design Tips For UI/UX Designers]]: Ejemplos sencillos de como mejorar el diseño. Del creador del libro anterior.
+  * {{ :clase:daw:diw:1eval:the_7_most_common_ui_mistakes.pdf |The 7 most common UI mistakes}}: Ejemplos sencillos de como mejorar el diseño. Del creador del libro anterior. [[https://ckarchive.com/b/v8u3hrhxdoqnx|ref]]
   * [[https://learnui.design/blog/color-in-ui-design-a-practical-framework.html|Color in UI Design: A (Practical) Framework]]
   * {{ :clase:daw:diw:1eval:color_cheatsheet_v1-3.pdf |UI Color Cheatsheet.pdf}}
   * [[https://www.indiehackers.com/post/send-me-your-landing-page-and-i-will-give-you-ui-ux-feedback-79752ca8f6|Send me your Landing Page and I will give you UI/UX Feedback]]: La gente envía su página web y un diseñador cuenta como mejorar el diseño.
+  * [[https://twitter.com/erikdkennedy/status/1328771593934290944|50+ practical UI/UX design tips (1 each weekday)]]
   * Usabilidad en base a los estilos de los iconos:
     * {{ :clase:daw:diw:1eval:filled-in_vs._outline_icons_the_impact_of_icon_style_on_usability..pdf |Filled-in vs. Outline icons: The impact of icon style on usability}}
@@ Línea 148: / Línea 150: @@
 Padding o Margin:
-px, 4px, 8px, 12px, 16px, 20px, 24px, 32px, 40px, 48px, 64px, 80px, 96px, 128px, 160px, 192px, 224px, 256px, 320px, 480px, 640px
+px, 4px, 6x, 8px, 10px, 12px, 16px, 20px, 24px, 32px, 40px, 48px, 64px, 80px, 96px, 128px, 160px, 192px, 224px, 256px, 320px, 480px, 640px
 Tamaño de fuente:
@@ Línea 210: / Línea 212: @@
 ==== Ejercicio 5 ====
+Mira el siguiente artículo [[https://graffica.info/un-cambio-de-imagen-para-la-formacion-profesional-en-la-comunitat-valenciana/|Un cambio de imagen para la Formación Profesional en la Comunitat Valenciana]] y la siguiente web [[https://portal.edu.gva.es/fpvalenciana/|FP Valenciana]].
+Comenta lo siguiente:
+  * ¿Resultan útiles las animaciones?
+  * ¿Resultan útiles los colores?
+  * ¿Que está mal en el buscador?
+  * ¿Cuando se usan mayúsculas?¿Es necesario?
+==== Ejercicio 6 ====
 Crea un sistema de tamaños creando varias clases CSS para las siguientes propiedades:
   * margin-top
@@ Línea 228: / Línea 240: @@
   * color
   * background-color
-==== Ejercicio 6 ====
+==== Ejercicio 7 ====
 Busca en varias web e indica si algunas de ellas cumple o no cumple alguno de las reglas, principios o mitos de la usabilidad (experiencia de usuario).
-==== Ejercicio 7 ====
+==== Ejercicio 8 ====
 Crea la siguiente página web [[https://nemo.wickedtemplates.com/|Wicked Teplates || Nemo]]. Si la página no está accesible tienes una copia aqui: {{ :clase:daw:diw:1eval:wicked_teplates_nemo.zip |}}

logongas

Herramientas de usuario

Herramientas del sitio

Diferencias

Herramientas de la página