<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Malaletra Blog &#187; tipografía</title>
	<atom:link href="http://malaletra.com/tag/tipografia/feed/" rel="self" type="application/rss+xml" />
	<link>http://malaletra.com</link>
	<description>Edición y Diseño + Tecnología</description>
	<lastBuildDate>Wed, 16 Mar 2011 23:44:46 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.2</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Comunicación visual en la tipografía</title>
		<link>http://malaletra.com/2009/05/06/comunicacion_visual_tipografia/</link>
		<comments>http://malaletra.com/2009/05/06/comunicacion_visual_tipografia/#comments</comments>
		<pubDate>Wed, 06 May 2009 17:54:07 +0000</pubDate>
		<dc:creator>Montserrat Martínez</dc:creator>
				<category><![CDATA[Diseño-web]]></category>
		<category><![CDATA[diseño]]></category>
		<category><![CDATA[tipografía]]></category>

		<guid isPermaLink="false">http://malaletra.com/?p=109</guid>
		<description><![CDATA[La tipografía es uno de los elementos más importantes en el proceso del diseño editorial impreso o digital. Su elección se basa en varios parámetros: como sus rasgos estéticos, el tipo de publicación, el público al que va dirigida la publicación, el formato, la estructura, entre otros. Estos elementos se encuentran dentro de un mensaje [...]]]></description>
			<content:encoded><![CDATA[<p>La tipografía es uno de los elementos más importantes en el proceso del diseño editorial impreso o digital. Su elección se basa en varios parámetros: como sus rasgos estéticos, el tipo de publicación, el público al que va dirigida la publicación, el formato, la estructura, entre otros. Estos elementos se encuentran dentro de un mensaje visual, por lo que la forma como los diseñemos y empleemos en un producto gráfico se considera una parte fundamental para transmitir o comunicar eficazmente determinada información.</p>
<p>La comunicación visual comprende todo aquello externo que ve el individuo. Por lo cual, B. Munari la divide a su vez en dos clases: casual e intencional. La comunicación casual es aquella que se interpreta libremente y existe de manera natural y la comunicación intencional es aquella que fue generada con un significado concreto para que el público pueda interpretar el mensaje de una forma determinada. La parte fundamental del diseño es la manera como se va transmitir el mensaje, para lo cual los estudios de Munari dividen el mensaje en dos partes: la información que lleva el mensaje y el soporte visual. El soporte visual son aquellos elementos visuales que se deben usar en conjunto y con mayor coherencia para la transmisión del mensaje como son la textura, la forma, la estructura, el módulo y el movimiento.</p>
<p>La comunicación visual en el diseño –ya sea impreso o digital– se sitúa en el ámbito de una comunicación intencional. Puesto que los componentes empleados en el soporte visual para generar un mensaje están fundamentados en el público al que va dirigido y en el tipo de publicación que se desea crear, por lo que a partir de dichos fundamentos se elegirán la tipografía, la maquetación, las imágenes empleadas, los colores, entre otros elementos visuales que se pueden utilizar.</p>
<p>Por lo tanto, la elección de una determinada tipografía para una publicación se basa en la personalidad que se desea transmitir al lector (a partir de sus rasgos estéticos), dado que dichos rasgos apoyan el estilo de la publicación. Las características estéticas de la tipografía se pueden analizar por las siguientes características: textura, estructura, módulo y movimiento.</p>
<ul>
<li>La textura de una tipografía puede ser de origen orgánica o geométrica.</li>
<li>La estructura es la variación del espacio en que está constituida, como el ancho y el alto de los rasgos.</li>
<li>El módulo es la unidad en que se encuentra circunscrita y su repetición conforma toda la estructura.</li>
<li>El movimiento se determina por la variedad de sus trazos, pueden ser estáticos o dinámicos.</li>
</ul>
<p>De acuerdo con lo anterior, he seleccionado algunos ejemplos de publicaciones que solamente utilizan la tipografía como parte fundamental de su diseño. Por lo que su personalidad y proyección en la publicación son fundamentales para el mensaje que transmiten:</p>
<ul>
<li><a rel="shadowbox" href="http://revista.escaner.cl/node/1117" target="_blank"><span style="text-decoration: underline;">ESCANER   CULTURAL</span></a> (Revista   cultural de arte contemporáneo y nuevas tendencias)</li>
<li><a rel="shadowbox" href="http://welovetypography.com/" target="_blank"><span style="text-decoration: underline;">we   love typography</span></a> (proyectos)</li>
<li><a rel="shadowbox" href="http://www.andrejwaldegg.com/" target="_blank"><span style="text-decoration: underline;">Andrej   Waldegg. Grafik Inc.</span></a> (proyectos)</li>
<li><a rel="shadowbox" href="http://nontype.com/index.php?page=3" target="_blank"><span style="text-decoration: underline;">{non}   TYPE</span></a> (proyectos)</li>
<li><a rel="shadowbox" href="http://blogof.francescomugnai.com/2009/04/50-great-examples-of-infographics/" target="_blank"><span style="text-decoration: underline;">Francesco   Mugnai</span></a> (trabajos)</li>
<li><a rel="shadowbox" href="http://www.nielsfyrst.dk/index.php?/project/all-juice-no-fruit/" target="_blank"><span style="text-decoration: underline;">Niels   Fyrst</span></a> (trabajos)</li>
<li><a rel="shadowbox" href="http://www.bemboszoo.com/" target="_blank"><span style="text-decoration: underline;">Bembos&#8217;zoo</span></a> (tipografía lúdica)</li>
</ul>



		<!-- Added by WP-DragToShare-eXtended Plugin -->
		<script type="text/javascript">
			dtsv.dtse_post_109_permalink = 'http://malaletra.com/2009/05/06/comunicacion_visual_tipografia/';
			dtsv.dtse_post_109_title = 'Comunicación visual en la tipografía';
		</script>
		<!-- End of WP-DragToShare-eXtended Plugin -->]]></content:encoded>
			<wfw:commentRss>http://malaletra.com/2009/05/06/comunicacion_visual_tipografia/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Doce reglas para tipografía [web]</title>
		<link>http://malaletra.com/2009/04/22/reglas_tipografia/</link>
		<comments>http://malaletra.com/2009/04/22/reglas_tipografia/#comments</comments>
		<pubDate>Wed, 22 Apr 2009 19:36:50 +0000</pubDate>
		<dc:creator>Montserrat Martínez</dc:creator>
				<category><![CDATA[Diseño-web]]></category>
		<category><![CDATA[internet]]></category>
		<category><![CDATA[diseño]]></category>
		<category><![CDATA[tipografía]]></category>

		<guid isPermaLink="false">http://malaletra.com/?p=72</guid>
		<description><![CDATA[En la búsqueda  del uso correcto de la tipografía en web me he encontrado con distintas páginas  donde dan ciertos consejos de lo que debes y no debes hacer en el momento de  elegir una tipografía. Por ejemplo, la tipografía es uno de los elementos más importantes  que debes considerar en [...]]]></description>
			<content:encoded><![CDATA[<p>En la búsqueda  del uso correcto de la tipografía en web me he encontrado con distintas páginas  donde dan ciertos consejos de lo que debes y no debes hacer en el momento de  elegir una tipografía. Por ejemplo, la tipografía es uno de los elementos más importantes  que debes considerar en el momento de diseñar porque su correcta elección  dependerá si el lector seguirá leyendo o no el artículo, cartel o una página  web. Todas las familias tipográficas tienen personalidades distintas y  aplicadas en web.</p>
<p>En la  actualidad se han desarrollado reglas específicas para el diseño editorial en  web, ya que el medio no permitió usar las que se aplicaban a los impresos.</p>
<p>No obstante,  al ser un medio que se transforma tan rápido, me hace preguntarme: ¿cuál será el  futuro del diseño editorial en el medio digital?</p>
<p>Está claro que  los principios editoriales en las páginas web se basaron mucho en los impresos.  Sin embargo, como se ha dicho, el medio no permite usar todas las reglas para  diseño impreso. Por ejemplo, la legibilidad que uno espera encontrar usando  cualquier tipografía no es posible debido a las características del píxel del  monitor, por lo que nos enfrentamos limitados al experimentar con tipografías en  la web. Cabe resaltar que se han generado nuevas tipografías exclusivamente  para monitor. Otro ejemplo, es que ya no es necesario utilizar múltiples columnas  para un artículo ya que se dispone de un scroll para poder leer un texto muy largo.  Por lo mismo, el diseño esta limitado respecto al uso de un formato horizontal.  Pero ahora con el desarrollo del e-book podríamos empezar a ver otras  posibilidades de formato, como lo hizo la revista <a href="http://www.esquire.com/" rel="shadowbox">Esquire</a> en una cubierta que realizó con  e-ink conmemorando su 75 aniversario. Esto lo podemos ver en un <a href="http://www.youtube.com/watch?v=iKS12PMdJ6w">video</a> donde la aplicación  de este medio en el diseño puede cambiar, en la cubierta se resaltan las  palabras y hasta se puede ver una animación sencilla de un carro en el  interior. Lo cual nos hace ver todo un mundo de posibilidades para diseñar en e-link.  Siempre había pensado que la escena donde sale un periódico en la película de  Harry Potter sería buenísimo que existiera y hoy lo vemos en vivo y a todo  color.</p>
<p>Sin embargo,  antes de empezar a diseñar para este nuevo medio hay que considerar las reglas  que ya se han planteado para un medio digital, las cuales han sido expuestas en  distintas páginas y blogs. A continuación haré un resumen de lo que aconsejan:</p>
<ol type="1">
<li>Aprovechar las ventajas de usar CSS para interlineados e interletrados</li>
<li>No utilizar cajas de textos muy amplios, se recomienda usar entre 12 a 15 palabras por línea</li>
<li>Los espacios blancos son muy importantes para una lectura fluida, es decir, dejarle el espacio suficiente entre las letras, palabras e imágenes</li>
<li>No usar muchas familias tipográficas, se recomienda usar sólo 2 familias para destacar los textos</li>
<li>Limitar el uso de columnas, no es lo mismo que en impresos</li>
<li>Usar jerarquías de tamaños tipográficos para destacar los títulos, subtítulos, pie de fotos o textos; algunos no recomienda usar muchos colores para destacar</li>
<li>Cuidar que el color de la tipografía no se pelee visualmente con el color del fondo y si el fondo tiene mucha textura se debe usar un color plano en la caja de texto</li>
<li>Cuidar que el diseño tipográfico no se rompa por los distintos tamaños de monitor</li>
<li>Preferentemente usar tipografías san-serif (sin patines) para textos largos</li>
<li>Las tipografías san serif sin antialias se leen mejor cuando usas tamaños de texto muy pequeñas</li>
<li>El espacio del interletrado de la Verdana o Georgia es mucho mejor que la Times New Roman o la Helvetica, es decir, no hacen que se peguen entre si las i, j y l con el texto</li>
<li>La tipografías Verdana, Georgia y Trebuchet fueron creadas para pantalla por lo que usan tamaños que se adecuan mejor al píxel del monitor</li>
</ol>
<p>Si requieren  de más información están estos vínculos que los pueden ayudar:</p>
<p><a href="http://www.webdesignerdepot.com/2009/03/5-simple-ways-to-improve-web-typography/" rel="shadowbox">5  Simple Ways to Improve Web Typography</a></p>
<p><a href="http://www.webdesignerdepot.com/2009/02/10-web-typography-rules-every-designer-should-know-2/" rel="shadowbox">10  Web Typography Rules Every Designer Should Know</a></p>
<p><a href="http://www.gizmos.es/8083/accesorios/plastic-logic-e-newspaper-el-fin-del-papel-cada-vez-mas-cerca/" rel="shadowbox">Plastic  Logic E-Newspaper, el fin del papel cada vez más cerca</a></p>
<p><a href="http://www.error500.net/articulo/plastic-logic-tinta-esquire" rel="shadowbox">Plastic  Logic y la tinta electrónica en Esquire</a></p>
<p><a href="http://www.nytimes.com/2009/02/09/technology/start-ups/09reader.html?partner=rss" rel="shadowbox" rel="shadowbox">Rival  to Amazon Kindle Finds Partners</a></p>
<p><a href="http://www.cosassencillas.com/2009/03/17/regla-medir-pantalla-disenadores/" rel="shadowbox">Reglas  de medir en pantalla para diseñadores</a></p>
<p><a href="http://tpgbuenosaires.tipografica.com/workshops/apuntes/tipografia_en_la_web.html" rel="shadowbox">Legibilidad  y comprensión en la Web</a></p>



		<!-- Added by WP-DragToShare-eXtended Plugin -->
		<script type="text/javascript">
			dtsv.dtse_post_72_permalink = 'http://malaletra.com/2009/04/22/reglas_tipografia/';
			dtsv.dtse_post_72_title = 'Doce reglas para tipografía [web]';
		</script>
		<!-- End of WP-DragToShare-eXtended Plugin -->]]></content:encoded>
			<wfw:commentRss>http://malaletra.com/2009/04/22/reglas_tipografia/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

