La belleza también está en el interior

La belleza (también) está en el interior

Interfaces Web robustas por fuera y por dentro

Miguel López GonzálezC.E.O.

Symbia IT: www.symbiait.comBlog: www.augurarte.com

http://www.symbiait.com/

http://www.augurarte.com/

www.codecamp.es | La belleza también está en el interior · Miguel López

Agenda…

• Sobre la belleza en la Web

• Belleza interior y belleza exterior. Criterios.

• Interfaces Web de calidad:

– Código semántico: Diseño sin tablas.

– XHTML Válido

– JavaScript no intrusivo.

– Validación de estándares antes de producción.

http://www.codecamp.es/


¿Qué es la belleza?

(CC) cuppini


www.codecamp.es

La belleza es inherente a la naturaleza, al ser

humano y a su entorno



propiedad de las cosas que hace

amarlas, infundiendo en

nosotros deleiteespiritual



¿qué es la belleza? Identificando sus factores

demo 1Algunas referencias diseño Web



Por fuera y por dentro

(CC) Danielo Cavalli


http://creativecommons.org/licenses/by/2.0/deed.es

http://creativecommons.org/licenses/by/2.0/


En la naturaleza

(estética –

fachada)

(CC) naama



En la naturaleza

(interior –

estructura)

(CC) audreyjm529



En las personas

(estética –

fachada)

Fuente: www. wallpapers99.com


www.codecamp.es | La belleza también está en el interior · Miguel LópezFuente: swami.blogspace.fr

En las personas

(interior –

carisma)



¿Cómo medimos, determinamos,

evaluamos…la

elleza



filosofía griegaSaber egipcio

Proporciones, cánones…

Gestalt…



En la Web…

estándaresW3C



(X)HTMLCSS,

JavaScriptXML…



¡Bonito!, todo me parece bonito…

demo 2¿diseños bonitos por dentro?



Generación drag& drop



183 tablas



45 < br>



318 < img>



60 < font>



(X)HTML



Los bits de información en la Web

• Los documentos HTML o páginas Web:

– Estructura XHTML

– Presentación CSS

– Comportamiento JavaScript



Uso semántico de (X)HTML

demo 3HTML Semántico ¡aquí y ahora!



Los números mágicos…

< t a b l e > 1 8 3 1< br> 4 5 14 *< img> 3 1 8 15< font> 6 0 0Filesize 1 3 3 Kb 18 Kb



CSS



La presentación… con CSS válido

demo 4CSS 2.1 y CSS 3.0 ¡Válidos!



JavaScript



Mitos y realidades

• JavaScript no supone una falta de accesibilidad ni un error de usabilidad que dificulta el uso de la Web.

• Siempre que se use de forma adecuada. ¿qué es un uso adecuado de JavaScript?



El comportamiento: función

• Los comportamientos (behaviours) o características dinámicas (movimiento, respuesta a acciones de los usuarios…) siguen un patrón decorator en un documento Web

• Enriquecen la experiencia de los usuarios sin mermar la estructura ni los contenidos que son el objeto de la Web.



Un mejor uso de JavaScript

• JavaScript no intrusivo (= uso semántico de eventos en XHTML).

• Separar el código y las llamadas

• Uso de manejadores de eventos vinculados al DOM y a la captura de eventos de los elementos (X)HTML



Diseño dinámico pero ¡estándar!

demo 5JavaScript no intrusivo (Unobtrusive Javascript)



Amigas, amigos… ya

terminamos…



Belleza Exterior…

Función: DCU&

Tendencias



Belleza Interior

(X)HTML VálidoCSS Válido

Uso correcto de JavaScript


¿Preguntas ?

Recuerda que en www.codecamp.es podrás encontrar todo el material de las sesiones del CodeCamp

Miguel López GonzálezC.E.O.

Symbia IT: www.symbiait.comBlog: www.augurarte.com


http://www.symbiait.com/

http://www.augurarte.com/

La belleza también está en el interior

Technology

Transcript of La belleza también está en el interior