<?xml version="1.0" encoding="utf-8"?>
<page xmlns="http://projectmallard.org/1.0/" type="topic" id="icons-and-artwork" xml:lang="es">

  <info>
    <credit type="author">
      <name>Allan Day</name>
      <email>aday@gnome.org</email>
    </credit>
    <credit type="author">
      <name>Jakub Steiner</name>
    </credit>
    <include xmlns="http://www.w3.org/2001/XInclude" href="legal.xml"/>
    <desc>Seleccionar y crear iconos.</desc>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Daniel Mustieles</mal:name>
      <mal:email>daniel.mustieles@gmail.com</mal:email>
      <mal:years>2011 - 2020</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Alex Puchades</mal:name>
      <mal:email>alex94puchades@gmail.com</mal:email>
      <mal:years>2015</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Nicolás Satragno</mal:name>
      <mal:email>nsatragno@gnome.org</mal:email>
      <mal:years>2013</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Benjamín Valero Espinosa</mal:name>
      <mal:email>benjavalero@gmail.com</mal:email>
      <mal:years>2011</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Jorge González</mal:name>
      <mal:email>jorgegonz@svn.gnome.org</mal:email>
      <mal:years>2009</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Rosa Elena Pérez</mal:name>
      <mal:email>rozydicemiau@gmail.com</mal:email>
      <mal:years>2014</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Oscar Rafael Arachi</mal:name>
      <mal:email>arachi910@gmail.com</mal:email>
      <mal:years>2014 - 2015</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Miguel Ajuech</mal:name>
      <mal:email>miguel.ann.28@gmail.com</mal:email>
      <mal:years>2014</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Adrián Pérez Domínguez</mal:name>
      <mal:email>adrian@aztli.org</mal:email>
      <mal:years>2015</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Celina Osorio Ochoa</mal:name>
      <mal:email>chelinoska@gmail.com</mal:email>
      <mal:years>2015</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Dario Amigon Espinoza</mal:name>
      <mal:email>daramigon@gmail.com</mal:email>
      <mal:years>2015</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Yenisei Ramírez Pérez</mal:name>
      <mal:email>yeniseirape@gmail.com</mal:email>
      <mal:years>2015</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>José Roberto Ramíres Mendoza</mal:name>
      <mal:email>aczella@gmail.com</mal:email>
      <mal:years>2015</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Bernardo Sánchez Romero</mal:name>
      <mal:email>b.sanchez.rom@gmail.com</mal:email>
      <mal:years>2015</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Emmanuel Márquez Juárez</mal:name>
      <mal:email>resident3333@gmail.com</mal:email>
      <mal:years>2015</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>David Romero Serrano</mal:name>
      <mal:email>lemi136@hotmail.com</mal:email>
      <mal:years>2015</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Omar Garcia Guzman</mal:name>
      <mal:email>garciag.omar91@gmail.com</mal:email>
      <mal:years>2015</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Edilberto Huerta Niño</mal:name>
      <mal:email>edilberto.huerta0290@gmail.com</mal:email>
      <mal:years>2015</mal:years>
    </mal:credit>
  </info>

<title>Iconos y diseño</title>

<p>Los iconos son un elemento básico en las interfaces de usuario. También constituyen una parte fundamental de las identidades de las aplicaciones. Esta página proporciona una descripción general del uso de iconos. También describe qué iconos están disponibles a través de la plataforma GNOME, presenta recursos para crear nuevos iconos e incluye algunas pautas generales sobre el uso de iconos en las interfaces de usuario.</p>

<section id="icon-styles">
<title>Estilos de iconos</title>

<p>En GNOME 3 se usan dos estilos de iconos: a todo color y simbólicos</p>

<p>Los iconos a todo color son coloridos y detallados, y están optimizados para tamaños más grandes. Se definen como SVG de 128×128px, y son más nítidos cuando se amplían en múltiplos de 128 (como 256✕256 y 512✕512). El diseño de iconos a todo color también les permite ser nítidos a 64×64px y 32×32px, pero no se recomienda hacerlos más pequeños.</p>

<media type="image" mime="image/png" src="figures/icons/fullcolor-v-symbolic.svg"/>

<p>Los iconos simbólicos son simples y monocromáticos, y están diseñados para funcionar bien en tamaños más pequeños. Se definen como 16✕16px SVG y se pueden escalar a múltiplos de 16 (como 32✕32, 64✕64, 128✕128). Los iconos simbólicos generalmente tienen un color neutro, aunque su color se puede cambiar mediante programación.</p>

</section>

<section id="icon-uses">
<title>Usos de iconos</title>


<p>Los iconos de aplicaciones son el tipo de iconos más destacado. Cada aplicación debe tener su propio icono de aplicación único y bonito: es la cara de la aplicación y el primer elemento visual que ve un usuario cuando busca nuevas aplicaciones.</p>

<p>Los iconos de las aplicaciones usan el estilo a todo color. También se recomienda que las aplicaciones proporcionen una versión simbólica de su icono, que se utiliza para la función de accesibilidad de alto contraste, así como en contextos donde se requiere un icono legible de baja resolución.</p>

<p>Los iconos de la interfaz de usuario suelen usar el estilo simbólico y este es el estilo de icono principal utilizado para los controles de la interfaz de usuario. El ejemplo más común y obvio del uso de iconos simbólicos está en los botones.</p>

<p>Además de los iconos de las aplicaciones, el estilo de ícono a todo color también se puede usar en los casos en que los iconos se muestran en tamaños grandes y están destinados a ser el centro de atención. Los iconos de archivos y carpetas en un administrador de archivos son un buen ejemplo de esto.</p>

</section>

<section id="icon-resources">
<title>Iconos de almacén y crear el suyo propio</title>

<p>GNOME proporciona un conjunto de iconos estándar que las aplicaciones pueden usar. Se puede acceder directamente a través de GTK. Los nombres de los iconos siguen la <link href="https://standards.freedesktop.org/icon-naming-spec/icon-naming-spec-latest.html">especificación de iconos de Freedesktop</link>. Las versiones simbólicas de los iconos tienen el sufijo <code>-symbolic</code>, como <code>open-menu-symbolic</code>.</p>

<p>Las <link xref="icon-design">directrices de diseño de iconos</link> proporcionan más detalles sobre cómo crear sus propios iconos, incluidos los de aplicaciones.</p>

</section>

<section id="using-icons">
<title>Usar iconos en su interfaz</title>

<p>Los iconos son un elemento común de la interfaz de usuario y tienen algunas ventajas prácticas sobre las etiquetas de texto (como ser más pequeños). Al mismo tiempo, el uso excesivo de iconos puede generar confusión y una experiencia de usuario deficiente. Del mismo modo, el uso de iconos inapropiados a menudo puede dificultar el uso de una interfaz.</p>

<p>Por lo tanto, use solo iconos cuyo significado sea comúnmente reconocido. Si un icono comúnmente reconocido no está disponible, podría ser mejor usar una etiqueta de texto. Típicamente, la convención establece qué iconos son comúnmente reconocidos. Este conjunto de iconos es bastante pequeño e incluye iconos estándar como búsqueda, menú, reenviar, retroceder y compartir. Si tiene dudas, use solo iconos que se usen con frecuencia en otras aplicaciones.</p>

<p>Otras cosas que tener en cuenta al usar iconos:</p>

<list>
<item><p>Considere qué iconos serán significativos en el contexto específico de su aplicación; los usuarios de herramientas específicas estarán a menudo familiarizados con símbolos específicos de ese área.</p></item>
<item><p>Recuerde que algunos iconos sólo tienen sentido cuando están junto a otros del mismo tipo. Por ejemplo, un icono multimedia para detener es simplemente un cuadrado, y puede no identificarse como un icono de detener sin otros controles multimedia (como reproducir, pausar u omitir) visibles cercanos a él. Del mismo modo, el icono de eliminar un elemento de una lista como un signo menos (una única línea) no se reconocerá sin el correspondiente icono «+» de añadir.</p></item>
</list>

</section>

</page>
