Actualizadas al 20 de septiembre de 2011
Dada la diversidad de formas y formatos para publicar post (o "entradas") estamos haciendo un esfuerzo por homologarlos de modo que los formatos de publicación de nuestros post mantengan un visualización coherente y amigable con el usuario (con el visitante lector de nuestros post). Emitimos este Manual debido a que no hay un cuerpo editorial que regule, previamente a su publicación, las colaboraciones de todos nuestros autores/as. Manteniendo la plena libertad de expresión de cada autor/a, y abogando por la responsabilidad de cada uno ante un espacio de información y divulgación que es colectivo, emitimos las siguientes Reglas de Formato para publicar en el Blog de los Bolivarianso en México.
1) EL TITULO
El título debe ser de corta extensión.
2) EL CUERPO DEL MENSAJE
El cuerpo del mensaje puede ser tan extenso como se quiera sin embargo en la página principal se mostrarán sólo los dos primeros párrafos de cada texto de autor, así como la primera imagen (foto, caricatura o gráfico) del mismo. Para ello se deben respetar las etiquetas HTML de formato incrustadas en nuestra ventana de edición pensadas para tal fin. Regla 2.2.1
Primero utilizaremos la pestaña "Edición de HTML" (en la esquina superior derecha) en nuestra página de edición, al darle click aparecerá la ventana de edición en donde veremos dichas etiquetas HTML.
2.1) ETIQUETAS HTML PREDEFINIDAS
Dentro del cuerpo del mensaje, con la pestaña "Edición de HTML" activa, se mostrarán de manera predefinida dos etiquetas HTML de formato.
2.1.1) ETIQUETA div (para Fuente o Autor)
La primera etiqueta HTML se utiliza para señalar el autor o la fuente del texto que publicaremos. En nuestro ejemplo la Fuente de la cual extrajimos la info es Aporrea.org, y la etiqueta HTML de formato para presentar este dato se llama div.
Todas las etiquetas HTML tienen una redacción de apertura y una de cierre, un div de apertura y un div de cierre. Por ello, en este caso, el texto que queremos mostrar en nuestro post debe colocarse entre estas dos.
2.1.2) ETIQUETA div ATRIBUTO class
Para este caso nuestra etiqueta div tiene un atributo llamado class, el cual a su vez tiene un valor denominado post-footer. Todo lo anterior se escribe de la siguiente manera.
Cuando haya que referir una Fuente, escribiremos la redacción como en el ejemplo, modificando sólo la leyenda Aporrea.org por el nombre de la Fuente utilizada.
Ejemplos:
Fuente: La Jornada | Afp
Fuente: Rebelión.org
Fuente: Wikipedia.org
Cuando la info sea de un autor específico y no de una empresa u organización, usaremos la siguiente redacción.
Autor: Jaime López (México)
Autor: El rebelde (Perú)
Si los autores del texto a publicar somos nosotros mismos, eliminaremos esta leyenda junto con su etiqueta div ya que se publica en automático el nombre o pseudónimo del autor del post.
Otros ejemplos de referir una Fuente son asociando un portal y luego un autor específico:
Fuente: Youtube.com | Canal de FundcionDeudaInterna
Fuente: Youtube.com | felvalen
2.2.1) ETIQUETA span (para hacer expandible el cuerpo del texto)
La segunda etiqueta HTML es importantísima y se utiliza para presentar en la página principal del blog sólo los dos primeros párrafos de cada nuevo texto. Los usuarios interesados podrán leer el texto completo del post desde la página principal ingresando al link "Continuar leyendo este artículo..." o dando click al titulo del post, dicha leyenda aparece en automático al utilizar esta etiqueta HTML correctamente.
Colocamos los dos primeros párrafos del texto que queremos publicar. Después del segundo párrafo colocamos la apertura de esta etiqueta HTML llamada span. El cierre de la misma lo colocaremos hasta el final del texto a publicar.
2.2.2) ETIQUETA span ATRIBUTO class
Para este caso nuestra etiqueta span tiene un atributo llamado class, el cual a su vez tiene un valor denominado fullpost. Todo lo anterior se escribe de la siguiente manera.
3) ETIQUETAS (tags) PARA MOTORES DE BUSQUEDA
Es necesario utilizar las otras "Etiquetas", las de la casilla inferior derecha de la ventana de edición (ahora en la nueva versión de blogger esta casilla se muestra en la parte inferior izquierda). Sirven para que los buscadores, es decir, los motores de búsqueda de internet, ubiquen nuestro artículo o texto con mayor facilidad y lo asocien a temáticas afines.
3.1) ETIQUETAS PREDEFINIDAS
Ya existen varias "Etiquetas" predeterminadas para nuestro bolg. Si el texto habla sobre un caso en México, en la casilla colocamos la palabra México. Si el texto contiene incrustado un video, colocamos la palabra videos. Pueden crearse otras nuevas.
Podemos visualizar las etiquetas que ya han sido utilizadas en el blog si damos click al link "Mostrar todo", el cual se encuentra en azul a la derecha de la casilla de "Etiquetas". Pueden colocarse tantas como sea necesario para la referencia de nuestro texto.
3.2) ETIQUETAS OBLIGATORIAS
Por convención siempre colocaremos las etiquetas de nacionalidad(es) y las de contenido multimedia (audios o videos).
Si la nota publicada es sobre un asunto en Venezuela, agregamos la etiqueta "Venezuela". Si fuera un asunto entre dos países, agregamos las etiquetas de los paises involucrados. Si el post contiene un video, agregamos la etiqueta "Videos". Si tiene un audio incrustado, agregamos la etiqueta "Audios".
4) TEXTO PLANO
Se debe insertar texto plano, sin preconfiguraciones de formato, como en el caso de cuando de copia desde un archivo de microsoft office (word) y se pega en el editor de blogger. Se deben eliminar las etiquetas de formato que pudiera traer el texto de word.
5) PUBLICACIÓN DE IMÁGENES O FOTOS
Las imágenes insertadas en los post no deben ser demasiado grandes, de modo que no abarquen toda el área del post ya que no resulta agradable ni cómodo a la vista del espectador o usuario. Después revisaremos cómo hacer que el usuario o visitante de nuestro Blog pueda expandir una imagen, acción muy útil cuando hay que ver detalles de tablas o mapas.
Aunque la importancia de cada imagen incrustada depende del contexto del post, recomendamos no exceder los siguientes valores
| Si se trata de un cartel o mapa | 600 máx 500 óptimo |
| Si se trata de una foto | 300 máx 200 óptimo |
5.1) URL DE IMÁGENES EN INTERNET
Todas las imágenes que se visualizan en internet tienen una URL. La imágen del ejemplo tiene la siguiente URL:
5.2) ETIQUETA HTML img
Para incrustar esa imágen debemos utilizar la etiqueta HTML img, se escribe de la siguiente manera:
Como se puede ver, en el atributo src le colocamos la URL de la imagen. La etiqueta HTML img se cierra con una diagonal al final del mismo corchete.
5.3) ETIQUETA img ATRIBUTOS height, width
Podemos utilizar los atributos de la etiqueta HTML img que sirven para dimensionar la imagen, utilizaremos height para definir la altura y width para definir la anchura.
5.4) MARCO CON PIE DE FOTO
Hemos diseñado un marco para ser utilizado en las imágenes incrustadas en nuestros textos, ver ejemplo. Para utilizarlo debemos escribir el siguiente código HTML:
5.4.1) PIE DE FOTO
Si queremos colocarle un pie de foto a nuestra imagen, al código HTML que ya tenemos le agregaremos lo siguiente
Hemos diseñado la etiqueta HTML piefoto especialmente para nuestro Blog. Colocaremos el texto que corresponde al pie de foto de nuestra imagen entre la etiqueta de apertura y la de cierre. En este caso nuestro pie de foto es "Patricia Villegas, presidenta de TeleSUR".
El resultado es el siguiente, primero el código HTML de la imágen incrustada y después a renglón seguido el código HTML del pie de foto:
5.4.2) MARCO DE IMAGEN O FOTO
Finalmente para mostrar nuestra imagen con marco utilizaremos la etiqueta HTML div asignándole los siguientes atributos
class="marco1"
style="clear: both; float: right; margin: 0pt 0px 0pt 10px; text-align: center; width: 200px;"
Cerramos la etiqueta HTML div hasta el final del código HTML que ya teníamos, de modo que el marco asignado abarque tanto la imagen como el pie de foto. La redacción HTML queda como sigue
Este código HTML una vez publicado, se ve así, ver ejemplo.
Es importante hacer notar que para que no haya distorciones al visualizar la imagen enmarcada, el ancho del marco y el ancho de la foto deben escribirse con los mismos valores. En este ejemplo el valor width es de 200.
5.4.3) ATRIBUTO style float
Si queremos que la imagen enmarcada no aparezca a la derecha del texto, sino a la izquierda, entonces cambiamos right por left en la variable float del atributo style. La redacción quedaría como sigue
6) PUBLICACIÓN DE VIDEOS
Al publicar videos (youTube, DailyMotion, etc) debemos publicar una imágen previa del video (jpg, png, gif, etc) la cual será mostrada en la página principal del Blog. Es fácil insertar imágenes desde el editor de blogger usando el botón de "inserta imagen". Ya insertada la colocaremos del lado izquierdo del texto a publicar. Si fuera necesario dentro de la redacción de apertura de img, etiqueta HTML para incrustar imágenes, colocaremos el atributo style="float:left;"
Respetando la regla 2.2.1 el código HTML del video se deberá colocar después de la redacción de apertura span. De modo que en la página principal del Blog se verá la imagen que anuncia al video y el texto introductorio al mismo, pero no el video en sí, es decir, no se verá el reproductor del video. Éste se verá cuando el usuario de click en la leyenda "Continuar leyendo este artículo..." o dando click al titulo del post. Eso evitará que se cargue la memoria caché del usuario y no se ralentice la navegación por el Blog.
Ver Ejemplo 1
Ver Ejemplo 2
No hay comentarios:
Publicar un comentario