Diferencias

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

--- clase:daw:diw:1eval:tema01 [2024/09/21 21:51]
admin
+++ clase:daw:diw:1eval:tema01 [2025/04/14 19:33] (actual)
admin [Botones]
@@ Línea 2: / Línea 2: @@
+====== Frameworks ======
+Veamos la encuesta anual de framewoks más usados: [[https://2024.stateofcss.com/en-US/tools/#css_frameworks|State of CSS 2024: Libraries & Tools]]
+{{:clase:daw:diw:1eval:css-frameworks.png?700|}}
+{{:clase:daw:diw:1eval:css-preprocesors.png?700|}}
 ===== Normas y estilos de diseño =====
@@ Línea 52: / Línea 59: @@
 <note tip>
-El libro que se va a usar como ejemplo dirante el curso es  [[https://refactoringui.com/book/|Refactoring UI: The Book]] {{ :clase:daw:diw:1eval:libro |l}}
+El libro que se va a usar como ejemplo dirante el curso es  [[https://refactoringui.com/book/|Refactoring UI: The Book]] {{ :clase:daw:diw:1eval:lib |l}}
 Hay material sobre el libro en:
@@ Línea 89: / Línea 96: @@
     * [[https://logongas.github.io/color-schemes-generator/?p0=22-78-26&p1=23-83-31&p2=26-90-37&p3=32-95-44&p4=38-92-50&p5=43-96-56&p6=46-97-65&p7=48-97-77&p8=48-96-89&minLightness=5&maxSaturation=95&rotate-hue=10&ecuacion=parabola&tasa-crecimiento=8|Amarillos]]
     * [[https://logongas.github.io/color-schemes-generator/?p0=264-67-35&p1=263-69-42&p2=263-70-50&p3=262-83-58&p4=258-90-66&p5=255-92-76&p6=252-95-85&p7=251-95-92&p8=251-91-95&minLightness=5&maxSaturation=95&rotate-hue=10&ecuacion=parabola&tasa-crecimiento=8|Morados]]
+    * [[https://logongas.github.io//color-schemes-generator/index.html?p0=217-33-17&p1=215-25-27&p2=215-19-35&p3=215-16-47&p4=215-20-65&p5=213-27-84&p6=214-32-91&p7=210-40-96&p8=210-40-98&minLightness=5&maxSaturation=95&rotate-hue=10&ecuacion=parabola&tasa-crecimiento=8|Gris pizarra]]
 Para crear el color alternativo usa:
@@ Línea 161: / Línea 169: @@
 </note>
+==== Ejemplos ====
+  * **Página de Login**
+{{:clase:daw:diw:1eval:botones-itaca.png|}}
+Los 2 botones son iguales, cuando realmente queremos que pulsen "Entrar", así que uno debería ser primario y el otro secundario.
+  * **Página de cookies de una web.**
+{{:clase:daw:diw:1eval:botones-valencia-bonita.png|}}
+Ahora si que está claro cual quiere que pulsemos pero el botón de "Más información" nunca interesa que lo aprieten, así que debería ser terciario. Por otro lado ¿Realmente les interesa que pulsemos en el de "Rechazar y Subscribirme por 0,75€ Por mes"?
+  * **Abrir un enlace en WhatsApp.**
+{{:clase:daw:diw:1eval:botones-whassapp.jpeg|}}
+Aquí está bien porque hace uso de la función peligrosa, además que no quiere influir sobre que botón deberías pulsar.
+  * **Iniciar un trámite en una administración pública.**
+{{:clase:daw:diw:1eval:botones-expediente.jpg?400|}}
+Le da la misma importancia a seguir con el trámite que cancelarlo.
+  * **Diálogo**
+{{:clase:daw:diw:1eval:boton-sino.png|}}
+Tienen la misma función el "Si" y "No", cuando el "Si" debería ser peligroso ( ya que es borrar el trámite).
 ===== Sistema de tamaños =====
@@ Línea 177: / Línea 217: @@
 Border radious:
-px, 2px, 4px, 6px, 8px, 16px
+px, 2px, 4px, 6px, 8px, 12px, 16px
 Obviamente se puede elegir los tamaños que se deseen pero se tiene que tener en cuenta que a mayor tamaño , mas debe ser el incremento entre uno y otro.

logongas

Herramientas de usuario

Herramientas del sitio

Diferencias

Herramientas de la página