Calidad del c digo fuente en p ginas web .


21 views
Uploaded on:
Category: Food / Beverages
Description
Calidad del código fuente en páginas web. Lluís Codina UPF Noviembre 2007 Máster Interuniversitario UB/UPF Gestión en Contenidos Digitales. Triple presión. Uso de estándares: Procesamiento robusto Compatibilidad Protección de la inversión Accesibilidad: Web sin barreras
Transcripts
Slide 1

Calidad del código fuente en páginas web Lluís Codina UPF Noviembre 2007 Máster Interuniversitario UB/UPF Gestión en Contenidos Digitales

Slide 2

Triple presión Uso de estándares: Procesamiento robusto Compatibilidad Protección de la inversión Accesibilidad: Web sin barreras Ampliación de la audiencia Imperativo lawful Web semántica/Hipertexto semántico: Procesamiento "inteligente" Nueva generación web (¿la web 3.0?) L. Codina : Máster Interuniversitario UB/UPF Gestión de Contenidos Digitales

Slide 3

La paradoja El respeto por los estándares implica: La creación de páginas se aleja de los usuarios Deben ser conscientes de aspectos técnicos que risks podían obviar Una posible solución: Impedir que editen código fuente La contradicción: Pero el programming WYSIWIG create errores Obliga an actualizar el programming Problemas generalizados con editores anteriores al año 2005 Conversión retrospectiva Dificultades técnicas Altos costes en tiempo o en dinero (o ambos) L. Codina : Máster Interuniversitario UB/UPF Gestión de Contenidos Digitales

Slide 4

En síntesis Imperativo dad ra nuevos sitios nuevos: Asegura la inversión, facilita el mantenimiento, and so forth (múltiples ventajas, algunas ya señaladas) En realidad sería irracional no crear sitios nuevos que cumplan los estándares Recomendable para sitios anteriores: Al menos: planificar la conversión retrospectiva L. Codina : Máster Interuniversitario UB/UPF Gestión de Contenidos Digitales

Slide 5

Dimensiones en la calidad del código fuente D1. Código libre de errores: documentos bien formados D2a. Separación de contenido y presentación: documentos compatibles y fácilmente transformables D2b. Buenas prácticas: documentos con marcado semántico L. Codina : Máster Interuniversitario UB/UPF Gestión de Contenidos Digitales

Slide 6

Código libre de errores Casuística (ejemplos): Elementos no cerrados Elementos mal anidados Ausencia de elementos obligatorios Uso de elementos depreciados Estándares recomendados: XHTML Strict CSS Chequeo: Editores de páginas web Validadores en línea Analizadores (p.e. DigiDoc Spider) L. Codina : Máster Interuniversitario UB/UPF Gestión de Contenidos Digitales

Slide 7

Separación de contenido y presentación Problemas típicos: Uso de tablas para estructurar la presentación (design) Uso de elementos semánticos para dar formato (hx) Estándar recomendado: XHTML: contenido CSS: presentación Chequeo: Editores Validadores en línea Analizadores en línea L. Codina : Máster Interuniversitario UB/UPF Gestión de Contenidos Digitales

Slide 8

Buenas prácticas Codificación semántica: Uso de metadatos. Ejemplos: Elementos: title , meta , DC , … Atributos: id , alt , refer to , class , name , rel , rev , … Metadatos vinculados: RDF Marcado semántico. Ejemplos: abbr , address , acronym , blockquote , … h1 , h2 , ... Chequeo: Análisis automático Análisis "manual" L. Codina : Máster Interuniversitario UB/UPF Gestión de Contenidos Digitales

Slide 9

Conclusiones - I El código fuente , y no solamente su interpretación por un agente de usuario, es un componente de la calidad de un sitio. Tecnologías implicadas : Editores de páginas Sistemas de gestión de contenidos Agentes de usuario L. Codina : Máster Interuniversitario UB/UPF Gestión de Contenidos Digitales

Slide 10

Conclusiones - II Ventajas generales (otra visión): Contenido good con: Diferentes agentes de usuario Futuros agentes de usuario Futuras formas de procesamiento y explotación Extraordinaria facilidad de mantenimiento Optimización SEO Accesibilidad Para el profesional: Plus de competitividad diferencial L. Codina : Máster Interuniversitario UB/UPF Gestión de Contenidos Digitales

Slide 11

Conclusiones - III Requerimientos: Familiaridad con los estándares web: Lenguajes de marcado (XML, XHTML) Formatos de presentación (XSL, CSS) Metadatos Validación Uso de tecnologías adecuadas: Producen código fuente sin errores Analizan el código fuente Separan contenido de presentación Políticas de control de calidad: Libros de estilo Auditorias y evaluación L. Codina : Máster Interuniversitario UB/UPF Gestión de Contenidos Digitales

Slide 12

Fuentes: Selección básica John Allsopp . Microformats : Empowering your markup for Web 2.0. Berkeley: Friendsof , 2007 Rachel Andrew & Dan Shafer. HTML Utopia: Designing without tables utilizing CSS. Collingwood: Sitepoint , 2006 Andy Budd . CSS Mastery : Advanced Web Standarsd Solutions . Berkeley: Friendsof , 2006 Nigel Chapman; Jenny Chapman . Web Design: An entire presentation. Chichester : Wiley, 2006 Paul Haine . HTML Mastery : Semantics , Standars , and Styling . Berkeley: Friendsof , 2006. Loot Huddleston . XML . Hoboken: Wiley, 2007 Shirley Kaiswer . Convey First Class Web Sites: 101 Essential agendas . Collingwood: Sitepoint , 2006 Abdrew Kirkpatrick . Web Accessibility: Web Standards and Regulatory Compliance . Berkeley: Friendsof , 2006 Jesús Tramullas ( coord .). Tendencias en documentación computerized . Gijón : Trea , 2006 Ed Tittel et al. Acing XHTML. San Francisco: Sybex , 2002. Christopher Walton . Organization and the Semantic Web . New York: Oxford, 2007 Jeffrey Zeldman . Planning with web norms ( second version ). Berkeley: New Riders , 2007 L. Codina : Máster Interuniversitario UB/UPF Gestión de Contenidos Digitales

Slide 13

Sitios web significativos The Web Standard Project http://www.webstandards.org/A List Apart http://www.alistapart.com/CSS Zen Garden http://www.csszengarden.com/Microformats http://microformats.org/L. Codina : Máster Interuniversitario UB/UPF Gestión de Contenidos Digitales

Slide 14

Anexo 1: Elementos depreciados applet basefont focus dir textual style isindex menu s strike u Alternativas: usar elementos XHTML o CSS http://www.codehelp.co.uk/html/deprecated.html L. Codina : Máster Interuniversitario UB/UPF Gestión de Contenidos Digitales

Slide 15

Anexo 2: Atributos depreciados adjust alink foundation bgcolor clear conservative shading fringe hspace Link name noshade nowrap estimate begin content sort esteem vlink width vspace Alternativas: CSS for deplored qualities http://www.punkchip.com/2007/02/css-expostulated traits 1/L. Codina : Máster Interuniversitario UB/UPF Gestión de Contenidos Digitales

Slide 16

Anexo 3: Elementos semánticos h n name legend interface meta alternative q select thead tfoot title abbr acronym address blockquote inscription refer to code dd dfn dl dt L. Codina : Máster Interuniversitario UB/UPF Gestión de Contenidos Digitales

Slide 17

Anexo 4: Atributos semánticos alt refer to class hreflang id name lang longdesc rel rev synopsis title L. Codina : Máster Interuniversitario UB/UPF Gestión de Contenidos Digitales

Slide 18

Anexo 4: Microformatos hCalendar hCard rel-permit rel-nofollow rel-tag VoteLinks XFN XMDP XOXO ("ecks gracious ecks goodness") Lista de microformatos: http://microformats.org/wiki/Main_Page L. Codina : Máster Interuniversitario UB/UPF Gestión de Contenidos Digitales

Recommended
View more...