<?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>Oh! Gráfico &#187; tips</title>
	<atom:link href="http://www.ohgrafico.com/tag/tips/feed" rel="self" type="application/rss+xml" />
	<link>http://www.ohgrafico.com</link>
	<description>Blog de diseño gráfico</description>
	<lastBuildDate>Mon, 19 Sep 2011 15:00:19 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.2.1</generator>
		<item>
		<title>Recomendaciones en el diseño de un blog</title>
		<link>http://www.ohgrafico.com/recomendaciones-en-el-diseno-de-un-blog</link>
		<comments>http://www.ohgrafico.com/recomendaciones-en-el-diseno-de-un-blog#comments</comments>
		<pubDate>Sat, 26 Sep 2009 02:18:14 +0000</pubDate>
		<dc:creator>kozmica</dc:creator>
				<category><![CDATA[Diseño web]]></category>
		<category><![CDATA[blogging]]></category>
		<category><![CDATA[blogs]]></category>
		<category><![CDATA[recomendaciones]]></category>
		<category><![CDATA[tips]]></category>

		<guid isPermaLink="false">http://www.ohgrafico.com/?p=744</guid>
		<description><![CDATA[Además del diseño gráfico los blogs o el blogging también me encanta, y para que un blog triunfe su diseño es pieza clave. Este diseño se puede catalogar en diseño web y claro que entra dentro del enorme mundo de lo que es el diseño gráfico.]]></description>
			<content:encoded><![CDATA[<p><img class="aligncenter size-full wp-image-1067" title="recomendaciones-diseño-blog" src="http://www.ohgrafico.com/wp-content/imagenes/recomendaciones-diseño-blog.jpg" alt="recomendaciones-diseño-blog" width="400" height="200" /></p>
<p>Además del diseño gráfico los blogs o el <em>blogging</em> también me encanta, y para que un blog triunfe su diseño es pieza clave. Este diseño se puede catalogar en <strong>diseño web </strong>y claro que entra dentro del enorme mundo de lo que es el diseño gráfico.</p>
<p>Antes ya hablé de los <a href="http://www.ohgrafico.com/errores-mas-comunes-en-el-diseno-de-un-blog">errores más frecuentes en el diseño de un blog</a>, pero en esta nota les voy dar algunas <strong>recomendaciones para el buen diseño de tu blog</strong> desde mi punto de vista.</p>
<p><img class="aligncenter size-full wp-image-1068" title="contenido-ancho-blog" src="http://www.ohgrafico.com/wp-content/imagenes/contenido-ancho-blog.gif" alt="contenido-ancho-blog" width="400" height="268" /></p>
<ul>
<li><strong>Que el espacio de contenido sea más ancho que el de las columnas o sidebars.</strong> No estoy hablando de portadas de blog tipo magazine, puesto que la estructura es muy diferente, pero en una estructura estándar siempre hay que procurar que el espacio que le vas a dejar a tus posts sea más ancho que el que ocupan otros elementos, tu contenido es lo más importante. Yo recomendaría un ancho mínimo de 500 pixeles, para incluir imágenes que no sean tan pequeñas y que el texto no se vea muy apretado.</li>
</ul>
<p><span id="more-744"></span></p>
<p><img class="aligncenter size-full wp-image-1069" title="encabezado-sin-scroll" src="http://www.ohgrafico.com/wp-content/imagenes/encabezado-sin-scroll.gif" alt="encabezado-sin-scroll" width="365" height="179" /></p>
<ul>
<li><strong>Que el encabezado no ocupe demasiado espacio verticalmente</strong> y deje ver el contenido sin tener que ir hacia abajo en el blog para poder verlo. Así cuando un visitante entre a nuestro blog podrá ver el contenido sin tener que hacer <em>scroll</em>, recuerda que la resolución pequeña más usada es de 1024 x 768px, toma en cuenta esas medidas al diseñar tu blog. Además si usas publicidad tienes que procurar que esta quede también visible en cuanto entres al sitio.</li>
</ul>
<p><img class="aligncenter size-full wp-image-1070" title="menu-header-visible" src="http://www.ohgrafico.com/wp-content/imagenes/menu-header-visible.gif" alt="menu-header-visible" width="400" height="268" /></p>
<ul>
<li><strong>Incluye un menú para las páginas del blog que sea fácilmente distiguible</strong> de otros links, que no se pierda, lo mejor es en la parte superior, en el encabezado (header) o al comienzo de la columna lateral.</li>
<li><strong>Que se note que los enlaces son <a href="recomendaciones-en-el-diseno-de-un-blog">enlaces</a>.</strong> Preferentemente con otro color haz que los enlaces sean diferentes del texto en general, también puedes subrayarlos ya que los usuarios promedio en general esperan que sea así.</li>
</ul>
<p><img class="aligncenter size-full wp-image-1071" title="contraste" src="http://www.ohgrafico.com/wp-content/imagenes/contraste.gif" alt="contraste" width="360" height="119" /></p>
<ul>
<li><strong>Procura contraste entre el texto y el fondo.</strong> No tiene que ser simplemente blanco y negro pero busca que no se pierda, tanto en el texto como con los enlaces y titulares. Te dejo esta herramienta online que te ayuda a checar el contraste: <a href="http://www.snook.ca/technical/colour_contrast/colour.html">Colour Contrast Check</a> (fijate especialmente que en el campo de resultados <em>Are colours compliant?</em> diga YES!).</li>
</ul>
<p><img class="aligncenter size-full wp-image-1072" title="delimitar-entradas" src="http://www.ohgrafico.com/wp-content/imagenes/delimitar-entradas.gif" alt="delimitar-entradas" width="400" height="268" /></p>
<ul>
<li><strong>Delimita bien las áreas.</strong> Sobre todo en portada que quede bien claro cuando termina un post y cuando comienza otro, esto puede ser logrado simplemente con una línea de separación o con un buen tamaño y color de los enlaces de título.</li>
</ul>
<p><img class="aligncenter size-full wp-image-1073" title="imagenes-demasiado-grandes" src="http://www.ohgrafico.com/wp-content/imagenes/imagenes-demasiado-grandes.gif" alt="imagenes-demasiado-grandes" width="400" height="268" /></p>
<ul>
<li><strong>Cuida que las imágenes no sean demasiado grandes</strong>, es decir más grandes que el área de tu post porque luego se empalmarían con la sidebar o descuadrarían todo el diseño. Puede que ahora esté perfecto pero recuerda eso a la hora de cambiar de theme o plantilla, busca tus posts con imágenes y anota cuánto miden las más anchas, toma eso de referencia como el mínimo de ancho que deberá de tener de ahí en adelante, a menos que pienses en redimensionarlas todas&#8230;</li>
<li><strong>Mantenlo ligero.</strong> Puede que tu blog se vea super, con muchos efectos e imágenes pero para un visitante nuevo pudiera ser una tortura esperar a que cargue la página. Para esto nunca utilices imágenes en formato BMP, prefiere GIF o incluso JPG (a excepción del logotipo, en ese caso siempre prefiero PNG). Visita tu blog desde otra computadora que no sea la tuya, así verás cuanto tiempo espera un visitante para que abra la página, ¿abre muy lento? a optimizar se ha dicho.</li>
<li><strong>¿Se ve igual en firefox que en IE?</strong>, pues espero que sí. Ya sabemos que IE es el dolor de cabeza de los diseñadores web porque es un navegador que no cumple con los estándares, por eso en algunos casos es imposible lograr algunos detalles que en otros es pan comido, sin embargo sigue siendo el navegador más usado y es mejor checar en ambos navegadores que el sitio se vea lo mejor posible. Ten ambos navegadores abiertos cuando estes editando el diseño de tu blog y a cada cambio que hagas lo checas en los 2.</li>
<li><strong>Valida tu CSS y HTML.</strong> Un blog que está correctamente estructurado desde su código es mejor tratado por los robots o spiders de los navegadores, si tu blog valida será mejor interpretado e indexado, además es muestra de profesionalismo y del empeño que le pones a tu blog. ¿Cómo saber si valida?, accede al validador de la w3c: <a href="http://validator.w3.org/">The W3C Markup Validation Service</a>, solo escribes la dirección de tu blog en el campo de Address y le das enter o presionas el botón Check. <em>Si estas en blogger ni te apures, la estructura de la plataforma nunca te va a permitir que valide</em>.</li>
</ul>
<p>Espero que les hayan gustado estas sencillas recomendaciones que harán que tu blog sea más agradable para los visitantes e incluso para ti mismo. Claro que todo es desde mi punto de vista y cada blog es un mundo muy diferente, pero creo que los puntos que traté son aplicables a la mayoría.</p>
<p>Seguro tienes otra sugerencia, ¡anímate a agregar tu recomendación en los comentarios!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.ohgrafico.com/recomendaciones-en-el-diseno-de-un-blog/feed</wfw:commentRss>
		<slash:comments>15</slash:comments>
		</item>
		<item>
		<title>El drama de conseguir trabajo como diseñador</title>
		<link>http://www.ohgrafico.com/el-drama-de-conseguir-trabajo-como-disenador</link>
		<comments>http://www.ohgrafico.com/el-drama-de-conseguir-trabajo-como-disenador#comments</comments>
		<pubDate>Sat, 20 Jun 2009 08:35:37 +0000</pubDate>
		<dc:creator>kozmica</dc:creator>
				<category><![CDATA[Apuntes]]></category>
		<category><![CDATA[tips]]></category>

		<guid isPermaLink="false">http://www.ohgrafico.com/?p=828</guid>
		<description><![CDATA[En NFG! publicaron un completo artículo sobre &#8220;El Largo y Tortuoso Camino para conseguir Empleo como Diseñador&#8220;, , si andas un poco perdido respecto a como conseguir trabajo en el [...]]]></description>
			<content:encoded><![CDATA[<p>En <em>NFG! </em>publicaron un completo artículo sobre &#8220;<a href="http://nfgraphics.com/el-largo-y-tortuoso-camino-para-conseguir-empleo-como-disenador/">El Largo y Tortuoso Camino para conseguir Empleo como Diseñador</a>&#8220;, , si andas un poco perdido respecto a <strong>como conseguir trabajo en el mundo del diseño </strong>recomiendo que lo leas.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.ohgrafico.com/el-drama-de-conseguir-trabajo-como-disenador/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

