<?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>Blog de Art Project Group &#187; Herramientas web</title>
	<atom:link href="http://blog.artprojectgroup.com/tag/herramientas-web/feed/" rel="self" type="application/rss+xml" />
	<link>http://blog.artprojectgroup.com</link>
	<description>Diseño web profesional. SEO. Promoción web. Posicionamiento web. Diseño gráfico profesional. Edición de libros</description>
	<lastBuildDate>Mon, 24 Nov 2008 11:18:40 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0</generator>
		<item>
		<title>A vueltas con la Accesibilidad y la Usabilidad</title>
		<link>http://blog.artprojectgroup.com/a-vueltas-con-la-accesibilidad-y-la-usabilidad/</link>
		<comments>http://blog.artprojectgroup.com/a-vueltas-con-la-accesibilidad-y-la-usabilidad/#comments</comments>
		<pubDate>Mon, 24 Nov 2008 10:04:05 +0000</pubDate>
		<dc:creator>APG</dc:creator>
				<category><![CDATA[Diseño web]]></category>
		<category><![CDATA[Accesibilidad]]></category>
		<category><![CDATA[Herramientas web]]></category>
		<category><![CDATA[Normalización]]></category>
		<category><![CDATA[Usabilidad]]></category>

		<guid isPermaLink="false">http://blog.artprojectgroup.com/?p=37</guid>
		<description><![CDATA[Como ya explicamos en el artículo &#8220;Santísima Trinidad del diseño web&#8220;, por Accesibilidad entendemos la capacidad de acceso a nuestro sitio web de las personas independientemente de su grado de discapacidad (física, intelectual o técnica), mientras que por Usabilidad entendemos todo aquello que no se ha tenido en cuenta en el punto anterior, Accesibilidad web. [...]]]></description>
			<content:encoded><![CDATA[<p>Como ya explicamos en el artículo &#8220;<a title="Blog de Art Project Group" href="http://blog.artprojectgroup.com/la-santisima-trinidad-del-diseno-web/" target="_self">Santísima Trinidad del diseño web</a>&#8220;, por Accesibilidad entendemos la capacidad de acceso a nuestro sitio web de las personas independientemente de su grado de discapacidad (física, intelectual o técnica), mientras que por Usabilidad entendemos todo aquello que no se ha tenido en cuenta en el punto anterior, Accesibilidad web. Es decir, lo que pretende la Usabilidad es hacer que nuestro sitio web sea empleado por los usuarios independientemente de su grado de discapacidad.</p>
<p>Hoy en<strong> <a href="http://www.artprojectgroup.com/" class="kblinker" title="Art Project Group en Blog de Art Project Group.">Art Project Group</a> </strong>vamos a dar una nueva vuelta de tuerca al tema y vamos a analizar distintas partes de nuestro sitio web gracias a algunas herramientas on-line gratuitas.</p>
<p>Una de las cosas más importantes a la hora de afrontar la Accesibilidad y la Usabilidad es el color, para ello tenemos varias herramientas que nos pueden ser útiles:</p>
<ul>
<li>Para analizar el <span style="font-weight: bold;">contraste de color</span>: <a title="Color Contrast Analyzer Juicy Studio" href="http://juicystudio.com/services/colourcontrast.php" target="_blank">Color Contrast Analyzer Juicy Studio</a> o <a title="AccessColor - Access Keys" href="http://www.accesskeys.org/tools/color-contrast.html" target="_blank">AccessColor &#8211; Access Keys</a>.</li>
<li>Para analizar cómo se verá nuestro sitio web si tenemos <span style="font-weight: bold;">dificultad para distinguir los colores</span> (Protanopia, Dueteranopia o Tritanopia): <a title="Colorblind Web Page Filter - Color Filter" href="http://colorfilter.wickline.org/" target="_blank">Colorblind Web Page Filter &#8211; Color Filter</a> o <a title="Vischeck" href="http://www.vischeck.com/vischeck/vischeckURL.php" target="_blank">Vischeck</a>.</li>
</ul>
<p>Otra cosa a tener en cuenta es el contenido en sí:</p>
<ul>
<li>Para analizar el <span style="font-weight: bold;">tamaño</span>: <a title="GetContentSize" href="http://holovaty.com/tools/getcontentsize/" target="_blank">GetContentSize</a>, siendo recomendable menos de 200 palabras.</li>
<li>Para analizar la <span style="font-weight: bold;">redacción</span>: <a title="Readability Test" href="http://juicystudio.com/services/readability.php" target="_blank">Readability Test</a>, aquí hay tres parámetros a tener en cuenta: Gunning-Fog &#8211; años de &#8220;escuela&#8221; necesarios para entender el contenido, Flash reading ease &#8211; indica de 0 a 100 la facilidad de lectura, siendo el más alto el más fácil, y por último Flesch-Kincaid grade level &#8211; similar a Guning-Fog, pero mide desde 0 a 12.</li>
<li>Para analizar las <span style="font-weight: bold;">imágenes</span>: <a title="Image Analyser" href="http://juicystudio.com/services/image.php" target="_blank">Image Analyser</a>, tiene en cuenta los atributos Alt, Width, Height y Longdesc.</li>
<li>Para analizar la <span style="font-weight: bold;">ortografía</span>: <a title="Orangoo Spell" href="http://orangoo.com/spell/" target="_blank">Orangoo Spell</a>.</li>
</ul>
<p>Ahora vamos a analizar cómo se verá nuestro sitio web en el navegador:</p>
<ul>
<li>Para analizar la <span style="font-weight: bold;">resolución de pantalla</span>: <a title="Screen Size Tester" href="http://www.anybrowser.com/ScreenSizeTest.html" target="_blank">Screen Size Tester</a>, como mínimo debemos tener en cuenta 800&#215;600 y 1024&#215;768 píxeles.</li>
<li>Para analizar los distintos <span style="font-weight: bold;">navegadores y sistemas operativos</span>: <a title="BrowserShots" href="http://browsershots.org/" target="_blank">BrowserShots</a>.</li>
</ul>
<p>Por último veremos otras herramientas:</p>
<ul>
<li>Para analizar <span style="font-weight: bold;">nuestra accesibilidad</span>: <a href="http://www.tawdis.net/taw3/cms/es">TAW</a>, <a href="http://wave.webaim.org/">WAVE</a> o <a href="http://www.cynthiasays.com/fulloptions.asp">Cynthia</a>, aunque el que más nos gusta es <a title="HERA" href="http://www.sidar.org/hera/" target="_blank">HERA</a>.</li>
<li>Para analizar <span style="font-weight: bold;">nuestra normalización</span>, última pata de la Santísima Trinidad: <a title="W3C Markup Validation Service" href="http://validator.w3.org/" target="_blank">W3C Markup Validation Service</a>, <a title="W3C CSS Validation Service" href="http://jigsaw.w3.org/css-validator/" target="_blank">W3C CSS Validation Service</a> y <a title="W3C Link Checker" href="http://validator.w3.org/checklink" target="_blank">W3C Link Checker</a><a href="http://validator.w3.org/checklink"></a>.</li>
</ul>
<p>Para dar por terminado el artículo os vamos a recomendar algunas extensiones para Mozilla Firefox que nos serán de mucha utilidad para estos menesteres:</p>
<ol>
<li><a title="HTML Validator" href="http://users.skynet.be/mgueury/mozilla/download.html" target="_blank">HTML Validator</a>, un auténtico &#8220;todo en uno&#8221; y en español.</li>
<li><a title="Web Developer" href="https://addons.mozilla.org/es-ES/firefox/addon/60" target="_blank">Web Developer</a>, sobre todo nos permite ver y editar las hojas de estilo, pero también nos permite inhabilitarlas.</li>
<li><a title="Firebug" href="https://addons.mozilla.org/es-ES/firefox/addon/1843" target="_blank">Firebug</a>, sin palabras, en<strong> Art Project Group</strong> no seríamos nadie sin él.</li>
<li><a title="TAW3" href="https://addons.mozilla.org/es-ES/firefox/addon/1158" target="_blank">TAW3 en un click</a>, Test de Accesibilidad Web en Mozilla Firefox.</li>
<li><a title="Total validator" href="https://addons.mozilla.org/es-ES/firefox/addon/2318" target="_blank">Total Validator</a>, el que usamos en<strong> Art Project Group</strong>.</li>
<li><a title="CSS validator" href="https://addons.mozilla.org/es-ES/firefox/addon/2289" target="_blank">CSS validator</a>, el oficial de la W3C.</li>
<li><a title="Page validator" href="https://addons.mozilla.org/es-ES/firefox/addon/2250" target="_blank">Page validator</a>, el oficial de la W3C.</li>
</ol>
<p>Hay muchos más, pero eso os lo dejamos para vosotros. Si tienes alguna otra herramienta que no conozcamos coméntanosla para que la usemos y te demos nuestro veredicto.</p>
<p>Sé accesible, sé usable, sé válido, sé mejor.</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.artprojectgroup.com/a-vueltas-con-la-accesibilidad-y-la-usabilidad/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
	</channel>
</rss>
