Optimización del uso de internet en la gestión cultural

NUEVAS TECNOLOGÍAS APLICADAS
A LA GESTIÓN CULTURAL

Optimización del uso de
internet en la gestión
cultural

Javier Leiva Aguilera
www.javierleiva.info

Madrid, 12-14 de noviembre de 2007

Optimización del uso de internet
en la gestión cultural

Fundamentos de diseño y
construcción de webs

Javier Leiva Aguilera. Madrid, 12-14 de noviembre de 2007

Fundamentos de diseño y construcción de webs

HTML
Para publicar información y distribuirla globalmente, se necesita un lenguaje
entendido universalmente, una especie de lengua franca de publicación que todas
las computadoras puedan comprender potencialmente. El lenguaje de publicación
usado por la World Wide Web es el HTML (acrónimo de HyperText Markup
Language, Lenguaje para el Formato de Documentos de Hipertexto)
World Wide Web consortium. Especificación html 4.01. Traducción de Con clase.
http://html.conclase.net/w3c/html401-es/cover.html



HTML

Etiqueta Atributo



HTML
¿Cómo funciona?

<
/>
=''xx''



HTML
<html>
<head>
<title>Estructura básica de un documento html</title>
</head>
<body>
</body>
</html>



HTML
<html>

Pistoletazo de salida
Indicamos cómo debe interpretarse lo que viene a continuación



HTML
<head>

Cabecera de la página
Exclusivo para el navegador
Contiene el título del documento



HTML
<title>

<head>
<title>Este es el título de mi página web</title>
</head>



HTML
<body>



HTML
Encabezados

h1 h2 h3 h4 h5 h6


HTML
Elementos de bloque

<p>
<div>
<br />


HTML
Comentarios



Documentan el proyecto
No se ven


HTML
Enlaces
<a>

Son la esencia de la web
Hacen realidad la idea de hipertexto



HTML
Enlaces
<a>

Pueden ser:
Internos: <a name
Externos: <a href



HTML
Enlaces
<a>

Elementos de un enlace:
<a
Tipo --> name/href
Protocolo --> http, ftp, mailto...
URL
Título --> title
Ancla
</a>


HTML
<img />



HTML
<img />

Elementos de una imagen:
<img
Ruta --> src
Texto alternativo --> alt
Título --> title
/>



HTML
<li>

Pueden ser:
Ordenadas --> ol
Desordenadas --> ul



HTML
<table>

Exclusivamente para datos tabulares

No debe usarse para la presentación



HTML
Elementos de énfasis

<b> <i> <em> <strong>
<cite>



HTML
<form>

-------------------->
--------------------> Etc.



HTML
Caracteres especiales

No siempre podemos estar seguros de que todo el mundo lea nuestros
acentos, eñes...
Hay solución: codifiquemos!

Ñ ´`ç acute ml # ¿?



HTML
Recursos sobre html

Especificación html 4.01: http://www.w3.org/TR/html401/
Html con clase: http://html.conclase.net/tutorial/html/
Html tutorial: http://www.w3schools.com/html/default.asp



CSS
Las hojas de estilo en cascada (Cascading Style Sheets, CSS) son un lenguaje
formal usado para definir la presentación de un documento estructurado escrito
en HTML o XML (y por extensión en XHTML). El W3C (World Wide Web
Consortium) es el encargado de formular la especificación de las hojas de estilo
que servirá de estándar para los agentes de usuario o navegadores.
Wikipedia. Hojas de estilo en cascada.
http://es.wikipedia.org/wiki/Hojas_de_estilo_en_cascada



CSS
Separando contenido de presentación

|-----------------------------------Contenido------->



CSS

|--------------------------------Presentación------->



CSS

|------------------------------------Resultado------->



CSS
Aplicando estilo

elemento {propiedad:valor;}

p {font-family:arial;}



CSS Posicionamiento de elementos



CSS
Formas de aplicar estilos

En una hoja externa
Dentro del documento html
En el propio elemento



CSS
Propiedades y valores

Propiedad: se refiere a un aspecto del elemento al que se quiere dar
estilo
Valor: define la propiedad



CSS
Estilo en función del contexto

a{
a.sidebar {



CSS
Clases y pseudoclases

a{text-decoration: underline;color: #105cb6;}
a.sidebar{ text-decoration: none; }

a{text-decoration: underline;color: #105cb6;}
a:hover{ text-decoration: none; }



CSS
Bloques

#sidebar {position:absolute;top:25px;left:50px;font-
family:arial;color:#ffffff;border:1px dotted #000000;}
#sidebar a {color:#ff0000;text-decoration:underline;}

<div id=”sidebar”>
<a href=”/”>Inicio</a>
</div>



CSS
Etiquetas

Podemos asignar un identificador a una etiqueta determinada para darle
un tratamiento especial.
No se puede repetir un ID en el mismo contexto.

<p>Hola</p> =//= <p id=”destacado”>Hola</p>



CSS
Elementos en línea VS de bloque

<span id=”azulado”> -----> en línea
<div id=”azulado”> -----> de bloque



CSS
Propiedades



CSS
Recursos sobre CSS

Especificación CSS 2.1: http://www.w3.org/TR/CSS21/
Tutorial CSS: http://www.webestilo.com/css/
CSS Tutorial: http://www.w3schools.com/css/default.asp



Recursos sobre la edición
- Bloc de notas
- HtmlKit
http://www.htmlkit.com/
- Etc.



Arquitectura de la información
La arquitectura de la información es el arte y la ciencia de organizar
información para que pueda ser encontrada.
Yusef Hassan Montero

La arquitectura de la información sólo es perceptible cuando no es
correcta



Métodos de recuperación de información en una web

|----------------------------Buscando------------->



Métodos de recuperación de información en una web

|----------------------------Navegando------------->



En recuperación de información en una web

El tipo de necesidades de información condiciona la estrategia de
búsqueda del usuario.
Las necesidades de información no son estáticas: cambian conforme el
usuario avanza en su búsqueda.
Las estrategias de búsqueda no son excluyentes: el usuario las utiliza
alternativamente.



Estudios de caso



Recursos para enriquecer
nuestra web



Recuperación de
información


Recuperación de información

Buscadores

¿dónde busca un buscador?



Buscadores

¿en internet?



Buscadores

¿en si mismo?



Buscadores
Funcionamiento de un buscador

1 --> araña



Buscadores

2 --> busca
en la red



Buscadores

3 --> almacena



Buscadores

4 --> el usuario
consume



Buscadores
Tipos de buscadores



Buscadores
Tipos de buscadores

Generalistas



Buscadores
Tipos de buscadores

Verticales



Buscadores
Tipos de buscadores

Por formato



Buscadores
Opciones de búsqueda
Palabra clave
Por frase
Mediante álgebra booleana
En título
Por fechas



Buscadores
Opciones de búsqueda

Enlaces entrantes
Dominio
En URL
Etc.



Directorios

¿dónde busca un directorio?



Directorios
¿dónde busca un directorio?

¿en internet?



Directorios
¿dónde busca un directorios?

¿en si mismo?



Directorios
Funcionamiento de un directorio

1 --> humano



Directorios

2 --> propone
la inclusión



Directorios

3 --> se le asigna
un lugar



Directorios

4 --> el usuario
consume



Directorios
En un directorio...

La información se ordena en
base a categorías jerárquicas
En algunos casos se introduce
la clasificación por facetas



Directorios
Tipos de directorios



Directorios

Generalistas



Directorios

Verticales



Directorios

Por formato



Internet invisible
¿qué es?

Responde a todos aquellos contenidos de información que están disponibles en
Internet pero que únicamente son accesibles a través de páginas generadas
dinámicamente tras realizar una consulta en una base de datos.
Fornás, Ricardo. “La cara oculta de internet”. Hipertext.net
http://www.hipertext.net/web/pag237.htm



Internet invisible

Cuadro:

Isidro F. Aguillo.



Internet invisible
pues entonces... ¿cómo la localizamos?

Buscadores específicos
Directorios



Internet invisible
Algunos recursos



RSS
¿qué es?

El RSS no es otra cosa que un sencillo formato de datos que es utilizado para
sindicar (redifundir) contenidos a suscriptores de un sitio web. El formato permite
distribuir contenido sin necesidad de un navegador, utilizando un software
diseñado para leer estos contenidos RSS (agregador). A pesar de eso, es posible
utilizar el mismo navegador para ver los contenidos RSS. Las últimas versiones de
los principales navegadores permiten leer los RSS sin necesidad de software
adicional.
“RSS”. Wikipedia.
http://es.wikipedia.org/wiki/RSS



RSS
Herramientas para usarlo



Técnicas de marketing y
promoción cultural online


Técnicas de marketing y promoción cultural online

La consulta en internet

¿cómo leemos? Del papel a la pantalla



La lectura en papel

------------------------------------------------------------>
------------------------------------------------------------>
------------------------------------------------------------>



La lectura en pantalla



Técnicas para captar el interés
La pirámide invertida

Ramón Salaverría. “De la pirámide invertida al

hipertexto”. Boletín MMLab.
http://www.unav.es/fcom/mmlab/mmlab/investig/piram.htm



Títulos

Corto
Descriptivo
Fuerte contenido semántico



En el texto

No repetir información
Usar sinónimos (evitar redundancias)
Cada párrafo una sola idea
Usar títulos intermedios
Usar listas



En el texto

Mantener una jerarquía visual
Resaltar las partes importantes del texto
Aprovechar el hipertexto
No subrayar texto no enlazado
Cuidar la ortografía



Formatos de difusión
Web 1.0



Web 2.0

La comunicación ya no es unidireccional
No difundimos, conversamos
El usuario nos ayuda




Web 2.0 --> blog




Web 2.0 --> agregador social



RSS



Otros formatos de difusión

Boletines
Listas de discusión/distribución
Foros



Redes sociales


Redes sociales

Nuevas relaciones

Modelo tradicional de relaciones:

por proximidad


Redes sociales

Nuevas relaciones


Redes sociales

Nuevas relaciones

Nuevo modelo de relaciones:

por afinidad


Redes sociales

Estructura social que se puede representar en forma de uno o varios grafos en el
cual los nodos representan individuos (a veces denominados actores) y las aristas
relaciones entre ellos.

“Red social”. Wikipedia.

http://es.wikipedia.org/wiki/Red_social


Redes sociales

La tecnología...

... nos hace visible la red de las personas de nuestro entorno


Redes sociales


Redes sociales

Los seis grados


Redes sociales

Funcionamiento

Un amigo de un amigo de un amigo...


Redes sociales

Tipos

Generalistas: se basan en la amistad.
Verticales: se refieren a un tema o interés concreto


Redes sociales

Ejemplos


Redes sociales

Sacarle partido

Detectar grupos cohesionados con intereses afines a los nuestros
Difundir lo que hacemos
Recibir información de otros
Cooperar


Optimización del uso de internet en la gestión cultural

Recomendados

Recomendados

Más contenido relacionado

Similar a Optimización del uso de internet en la gestión cultural

Similar a Optimización del uso de internet en la gestión cultural (20)

Más de Javier Leiva Aguilera

Más de Javier Leiva Aguilera (20)

Último

Último (20)

Optimización del uso de internet en la gestión cultural