La Consulta: Caso 30

La Consulta Caso 30

El martes pasado terminé la web dedicada al proyecto La Consulta: Caso 30.

http://laconsulta.giusseppe.net/

Ha sido un trabajo agotador, además de autoexigente por pedirme a mí mismo que fuese realizado por primera vez sin atenerme a la típica estructura organizativa de FRAMESET que llevo usando desde que lo conocí allá por los comienzos de los años 90.

Es una estructura versátil y modular que permite dividir la pantalla (del navegador) en varios FRAMES asociados a «ventanas» en los que ir mostrando la información pertinente.

No obstante, de momento a Google Inc., el mayor dictador de las prácticas de programación HTML/Web (dictador en tanto que «dicta» las buenas prácticas de cara al posicionamiento, por ejemplo, pero las dictaduras modernas no son impositivas, al menos no de forma, aunque sí lo sean de facto), no le gusta que se usen frames pues sus herramientas de escaneo en busca de información significativa no recorre los distintos apartados de un FRAMESET, sino que se limita a buscar aquellos términos que están en la página principal.

Dice (y puede que me lo crea) que es por una cuestión de «eficacia» o velocidad pues no tiene tiempo para recorrer lo que serían muchas más páginas a clasificar o identificar. Esto será especialmente importante para quienes usan, como yo, Google Adwords, pues su SEO, Search Engine Optimization, (uno de esos infernales términos que invaden nuestro lenguaje) mejorará sustancialmente de usar a no usar los inteligentes frames.

En este proyecto más que en otros podría haber ignorado totalmentelas exigencias o demandas de ese gigante de la tecnología, pero también es cierto que quise aproximarme a esta forma «nueva» de programación (hablar de programación HTML siempre me da un poco de risa) en la que el posicionamiento de los menús, por ejemplo, se realice mediante puro CSS, pero claro, he tirado de position: fixed / absolute que luego es más difícil de redimensionar.

Ya de paso, como si eso no fuese suficiente, he querido que fuese una página «web responsive» o, lo que es lo mismo, que se vea bien en un móvil o pantallas de diversos tamaños y resoluciones. Esto es una verdadera tortura, pues son demasiadas. La mejor forma era la clásica que llevo usando décadas de posicionamientos relativos y tamaños porcentuales para todo elemento que se precie.

html5-estructura-01

¿Y qué más?

No contento con eso, decidí aprender las nuevas etiquetas del HTML5, un estandar que parece que ha mejorado bastante la creación de páginas HTML. También aposté por el CSS3, con sus capacidades de animación y dinamismo que han hecho de herramientas como JavaScript o, por supuesto, el propietario (Adobe) Flash, un recuerdo del pasado o reservadas para contadísimas cosas dentro de una web moderna.

Pero, por encima de todo, no quise olvidarme del contenido, un contenido que nadie leerá. Pero ahí está, un contenido que pensé innumerables veces imponer en un formato más analógico, más secuencial, menos interactivo, mucho más rígido y lineal: un libro en papel. Además, quizá así podría incluso venderlo o presentarlo en algún sitio o qué se yo.

Y no. No me convencía.

Ha terminado siendo lo que tenía toda la pinta que terminaría siendo:

http://laconsulta.giusseppe.net/

<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="description" content="La Consulta: Caso 30. Giusseppe Domínguez">
  <meta name="keywords" content="Proyectos,Giusseppe Domínguez,La Consulta,Arte Conteptual,Remuneración">
  <meta name="author" content="Giusseppe Domínguez">
  <title>La Consulta: Caso 30</title>
  <link rel="stylesheet" href="css/consulta.css">
  <link rel="shortcut icon" href="img/lctac30.ico">
</head>

<body>
<header>
		
 <a id="logo-header" href="index.html">
 <span class="site-name">La Consulta Caso 30</span>
 <span class="site-desc">Giusseppe Domínguez</span>
 </a> <!-- / #logo-header -->
 
 <nav>
 <ul>
 <li><a href="genesis.html">Génesis</a>
   <ul>
    <li><a href="genesis.html">a</a></li>
    <li><a href="laconsulta.html">b</a></li>
    <li><a href="origen.html">c</a></li>
   </ul></li>
 <li><a href="exodo.html">Éxodo</a>
   <ul>
    <li><a href="exodo.html">x</a></li>
    <li><a href="exodoexit.html">&omega;</a></li>
   </ul></li>
 <li><a href="levitico.html">Levítico</a>
   <ul>
    <li><a href="levitico.html">&alpha;</a></li>
    <li><a href="leviticodetalle.html">&beta;</a></li>
    <li><a href="leviticopeaton.html">&gamma;</a></li>
    <li><a href="leviticoinversion.html">&delta;</a></li>
   </ul></li>
 <li><a href="numeros.html">Números</a>
   <ul>
    <li><a href="numeros.html">1</a></li>
    <li><a href="numerosh.html">e</a></li>
    <li><a href="numeroslibro.html">&pi;</a></li>
    <li><a href="numerosapp.html">i</a></li>
   </ul></li>
 <li><a href="deuteronomio.html">Deuteronomio</a>
   <ul>
    <li><a href="deuteronomio.html">&#1488;</a></li>
    <li><a href="garbanzosfoto.html">&#1489;</a></li>
    <li><a href="garbanzosvideo.html">&#1490;</a></li>
    <li><a href="garbanzospresupuesto.html">&#1491;</a></li>
    </ul></li>
 </ul>
</nav><!-- / nav -->

 
</header><!-- / #main-header -->

<section>
 <article>
  <hgroup>
   <h1>¿Para qué sirvo?</h1>
  </hgroup>

  <a href="laconsulta.html"><img class="central" src="img/lctac30.jpg" alt="La Consulta: CASO 30" /></a>
			
  <div class="content">
   <p>Tengo un pasado variopinto pero un futuro tinto.</p>
   <p>No tengo claro el para qué sirvo ni si aquello para lo que puede que sirva es algo que sea remunerado.</p>
   <p>Es una pequeña (o no tanto) cuestión existencial.</p>
  </div>

 </article> <!-- /article -->
	
</section> <!-- / #main-content -->
 
<footer>
 <p>&copy; 2016 <a href="http://giusseppe.net" target="_blank">giusseppe.net</a></p>
</footer> <!-- / #main-footer -->

</body>
</html>
Esto no es una broma