Paso 5: Elegir una plantilla prediseñada

A la hora de diseñar un blog hay que tener en cuenta que puede visualizarse con distintos navegadores: Internet Explorer, Mozilla y Opera, entre otros. Sin embargo, no hay que olvidar que también ha de ser accesible y por ello ha de presentar el menor número de incompatibilidades posible mediante: los lectores de pantalla (JAWS), los navegadores de sólo texto (LYNXS) o dispositivos de salida braille.
Por ello y basándonos en una plantilla de diseño que sea compatible con lo antes dicho, en principio disponemos de cuatro opciones principales:

1. Una plantilla con el menú de navegación vertical, en el extremo derecho de la pantalla. En el código fuente, el contenido principal  estará colocado antes que el menú de navegación. Es la opción más directa y sencilla.
2. Una plantilla con el menú de navegación vertical, en el extremo izquierdo de la pantalla. En el código fuente tendremos que seleccionar todo el código entre las etiquetas <!-Begin #sidebar -> y <!-End #sidebar ->, cortarlo y pegarlo detrás del contenido principal situado entre las etiquetas <!-Begin #main -> y <!-End #main ->. De esta forma, no habrá problema para los lectores de pantalla y los navegadores que no interpretan las hojas de estilo, ya que siguen el orden del código.
3. Una plantilla con una barra de navegación colocada antes del cuerpo de la entrada. Tendremos que establecer un marcador que permita el salto de a la barra en cuestión. Para ello, proponemos el método siguiente:
• Crear un estilo en la CSS que permita ocultar texto: .ocultar {display:none;}
• Definimos el enlace que dirija al menú como oculto. P.e. <p class="ocultar"><a href="#contenido">Salto a Menú</a>
• Posteriormente, introducimos un vínculo interno contenido al comienzo del contenido principal.
4. Una opción sencilla y alternativa a la anterior, dirigida a aquellos que utilizan sólo el teclado, es la de simplemente ocultar el salto a la barra de navegación otorgándole el mísmo color que el color de fondo, estableciendo un estilo para ello: .letratransparente {font-color:#FFFFFF;}
5. Una plantilla con tablas. En caso de que maquetemos la página mediante una tabla tendremos que: 
• Insertar una imagen vacía en la celda superior izquierda.
• Indicar en el tag de cada fila de la tabla la existencia de dicha imagen y su función:
  <table>
  <tr>
  <!-- Imagen espaciadora en la celda superior izquierda ->
  <td>
  <img src="/images/1.gif" width="1" height="1" alt="">
  </td>
  <!-- Contenido principal en la primera celda, con rowspan=2 ->
  <td valign="top" align="left" rowspan="2">
  .....CUERPO DEL BLOG.....
  </td>
  </tr>
  <tr>
  <td valign="top" align="left" width="25%">
  .....BARRA DE NAVEGACIÓN.....
  </td>
  </tr>
  </table>