Le darían una mirada a mi sitio? valoro su opinión

[lucasan]

Hola amigos, no pongo mi sitio en "sugerencias para tu web" porque no es opinión de diseño lo que busco, sino de accesibilidad y usabilidad, y se que aquí están quienes saben al respecto

Nunca le había sacado tiempo a mi sitio (nunca hay tiempo para lo propio) pero ya me apenaba no tener uno, "en casa de herrero..."

Es realemnte simple mi sitio pero me gustaría conocer su opinión al respecto por favor.

http://planoriginal.com

Gracias y saludos.

Actualización: Lo revisé con el Hera, me marca dos errores en el CSS pero no los encuentro... Me dice que uso textos con medidas absolutas, pero eso no es cierto y el otro ni idea que será.

Por otro lado, aún no he creado contenido para la sección Artículos, así que no hay mucho que ver por ese lado.

Saludos.

[Daniel Ulczyk]

Empecé por las imágenes... muchas tienen todavía la etiqueta ALT vacía

[lucasan]

Iniciado por Daniel Ulczyk

Empecé por las imágenes... muchas tienen todavía la etiqueta ALT vacía

100% cierto, aún estoy peleando con eso, las imágenes las estoy llamando con una función que las extrae en sus diferentes tamaños, pero no toma el atributo alt.

Si le encuentro solución les cuento; sino lo único que veo por hacer es tratar que las imágenes no tengan una carga significativa, sino que sean solo ornamentales.

Daniel Ulczyk, gracias por tu observación.

De resto como la ven?

[Mikmoro]

De los dos errores, el primero se debe a que Hera usa la validación CSS 2, no la CSS 2.1 a la que estamos acostumbrados (porque sale por defecto hace mucho tiempo), así que no te preocupes.

El segundo:
"Se detectaron unidades absolutas (in|cm|mm|pt|pc) o tamaños de fuente definidos en px en los valores de las hojas de estilo."

Y sí, esto ocurre aquí:
.photo-meta-data span { font-size: 13px; }

en la hoja style.css.

El resto miraré luego un poco a ver qué se ve.

[p3rikl3s]

Me gusta la página. Tiene buena accesibilidad y usabilidad, como dicen vulgarmente, "directo al grano". Además el diseño esta muy bueno. Te felicito !.

Nota: Todo desarrollador / diseñador debe cuidarse de los errores ortográficos: Forma incorrecta :"Contactenos". Forma correcta: "Contáctenos".

Saludos.

[Daniel Ulczyk]

Considerá, además, la inclusión del tag <noscript>; para cuando el navegador tenga JavaScript deshabilitado o para aquellos que no lo soporten.

[lucasan]

Iniciado por Mikmoro

El segundo:
"Se detectaron unidades absolutas (in|cm|mm|pt|pc) o tamaños de fuente definidos en px en los valores de las hojas de estilo."

Y sí, esto ocurre aquí:
.photo-meta-data span { font-size: 13px; }

en la hoja style.css.

Wow, que ojo Mikel, no lo había visto, ese código no es mio y aunque lo "revisé" parece que no fue suficiente.

Solucionado!

Iniciado por p3rikl3s

Me gusta la página. Tiene buena accesibilidad y usabilidad, como dicen vulgarmente, "directo al grano". Además el diseño esta muy bueno. Te felicito !.

Gracias

Iniciado por p3rikl3s

Nota: Todo desarrollador / diseñador debe cuidarse de los errores ortográficos: Forma incorrecta :"Contactenos". Forma correcta: "Contáctenos".

Cierto, y aunque suelo tener buena ortografía se me pasó esa.

Solucionado, gracias!

Aún sigo con el problema del atributo alt en las imágenes generadas por la función.

[lucasan]

Iniciado por Daniel Ulczyk

Considerá, además, la inclusión del tag <noscript>; para cuando el navegador tenga JavaScript deshabilitado o para aquellos que no lo soporten.

No uso JavaScript para funciones importantes o que afecten la navegación, es mas solo lo uso para el slider; como podría usar la etiqueta <noscript> en ese caso?

Gracias.

[Mikmoro]

Algunos asuntos importantes en cuanto a la accesibilidad:

1.- Me resulta casi imposible navegar sin ratón (con el teclado) porque no puedo saber dónde estoy (es mejor usar resaltes bien claros en :focus (o :active para IE).
2.- La caja central, el bloque principal de presentación e información sobre la web, con javascript desactivado es sencillamente inútil. Un bloque demasiado relevante como para que no funcione en absoluto en ausencia de javascript.
3.- El diseño es estático, y como tal no se adapta en absoluto a otras resoluciones que no sean 1024 (diría yo).
4.- La forma elegida hace que con sólo dos aumentos de zoom en la letra se parte todo (CTRL+)

Iré comentando más cosas si puedo.

[p3rikl3s]

Mikmoro tiene razón. Es duro pero tiene razón y además es necesario para quede bien el trabajo.

Saludos.

[lucasan]

Iniciado por p3rikl3s

Mikmoro tiene razón. Es duro pero tiene razón y además es necesario para quede bien el trabajo.

Saludos.

Por supuesto, por eso preguntè es necesario aprender de quienes saben mucho mas que uno.

Gracias Mikel, estoy pensando en como mejorarlo y ya estaré por acá de nuevo.

[lucasan]

Bueno, solucionado lo del :focus y :active gracias Mikel.

Ahora estoy en dilemas con ese Slider...

Se ve muy bonito, pero no puedo ponerle el atributo alt a las imágenes y no puede usarse sin Js.

Pensaré como mejorarlo o lo remuevo.

Alguna sugerencia?

Gracias a todos.

[p3rikl3s]

Que tal si lo haces en Flash ?

[lucasan]

Iniciado por p3rikl3s

Que tal si lo haces en Flash ?

Estas hablando en serio? en flash sería 1000 veces menos accesible.

[Daniel Ulczyk]

Iniciado por p3rikl3s

Que tal si lo haces en Flash ?

Las barreras a la Accesibilidad Web que presentan este tipo de objetos, son bastante difíciles de superar.

No me parece una recomendación del todo acertada.

[eulerss]

Que tal si lo haces en Flash ?

si se quejan que con JS puede presentar problemas con flasha aun mas a mi entender

recomendacion: dejalo como lo tienes, el slider me gusta, (de hecho por ahi te pedire el codigo del mismo)

cuando cambias de seccion, sería bueno que se resaltará un poco mas, para tener bien definido en que sección te encuentras

la parte de Contáctenos pondría un poco mas pequeño el tamaño de la fuente

la parte de contacto de igual forma a mi entender el tamaño de la fuente esta algo grande, algun efecto a la hora de llenar el formulario no estaría nada mal

saludos

pd. me gusto el diseño

[Mikmoro]

Iniciado por p3rikl3s

Es duro pero tiene razón.

No pensaba que fuera duro. En cualquier caso, escribo como lo veo porque lucasan me conoce (nos conocemos), como para saber que toda crítica es constructiva e intento aportar mi visión para lo que busca: hacerlo lo más accesible posible (o simplememente mejorarlo, si es posible).
Igual empiezo a sonar de verdad a cascarrabias y no me he dado cuenta

P.D.: aunque no lo he dicho porque no era el objeto de la consulta, a mi también me gusta el diseño.

[lucasan]

Iniciado por eulerss

recomendacion: dejalo como lo tienes, el slider me gusta, (de hecho por ahi te pedire el codigo del mismo)

Cuando quieras te lo paso

Iniciado por eulerss

cuando cambias de seccion, sería bueno que se resaltará un poco mas, para tener bien definido en que sección te encuentras

En serio? yo crei que estaba bien la diferencia, voy a revisarlo.

Iniciado por eulerss

la parte de Contáctenos pondría un poco mas pequeño el tamaño de la fuente

No eres el primero que me lo dice, voy a bajarle el tamaño.

Iniciado por eulerss

algun efecto a la hora de llenar el formulario no estaría nada mal

Soy un poquitin tapado para el Js, así que de efectos muy poco, pero lo estudiaré.

Iniciado por eulerss

pd. me gusto el diseño

Gracias!

Iniciado por Mikmoro

No pensaba que fuera duro. En cualquier caso, escribo como lo veo porque lucasan me conoce (nos conocemos), como para saber que toda crítica es constructiva e intento aportar mi visión para lo que busca: hacerlo lo más accesible posible (o simplememente mejorarlo, si es posible).
Igual empiezo a sonar de verdad a cascarrabias y no me he dado cuenta

P.D.: aunque no lo he dicho porque no era el objeto de la consulta, a mi también me gusta el diseño.

Claro Mikel, aquí ya sabemos que las críticas son para construir, y se los agradezco enórmemente; igual, como que es defecto de colegas, yo a veces soy un poco duro para decir las cosas.

Y me agrada que te haya gustado el diseño.

Bueno. Sigo peleando con la función y el atributo "alt" y pensando como hacer mas accesible el slider.

[lucasan]

Bueno, solucionado el problema que tenía con la función que llama las imágenes, ya todas tienen su atributo alt="" y title="" correctamente.

Solucionado lo del :focus y :active (igualmente teclas de acceso para los enlaces principales)

Cosas por solucionar:

1. Hacer el Slider mas accesible (aún no se como)
2. Disminuir el tamaño del texto en Contáctenos
3. A mediano plazo, una hoja de estilo para dispositivos móviles.

Cosas a las que no pienso dar soporte por ahora:

1. Pantallas con resoluciones menores a 1024px (mayores solo verán espacio en blanco a los lados, pero no es mucho inconveniente), un diseño fluido no me conviene al tener tan poco contenido, se va a desbordar.

2. Que se descuadre la página al hacer Ctrl+ repetidamente (a mi me aguantó hasta 4 veces sin descuadrarse mucho)

Bueno, muchas gracias a todos, de verdad me han enriquecido mucho sus comentarios y sugerencias.

Si tienen mas, bienvenidas sean.

Saludos

[Mikmoro]

Iniciado por lucasan

Cosas a las que no pienso dar soporte por ahora:[/B]

1. Pantallas con resoluciones menores a 1024px (mayores solo verán espacio en blanco a los lados, pero no es mucho inconveniente), un diseño fluido no me conviene al tener tan poco contenido, se va a desbordar.

Esto es una clarísima elección personal, aunque creo que eres consciente de que es menos accesible. Si es así, perfecto.

Iniciado por lucasan

2. Que se descuadre la página al hacer Ctrl+ repetidamente (a mi me aguantó hasta 4 veces sin descuadrarse mucho)

No sé qué diferencias puede haber entre mi navegador y el tuyo (FF2 con 1024), pero ya con un aumento el menú se sale de su sitio y empieza a no estar tan claro que es el menú, pero con dos ya no se puede usar porque queda encima del formulario de búsqueda, etc. ¿No te ocurre eso?

[facundocorradini]

Un pequeño aporte, en tus datos de contacto pones "contacto[at]planoriginal.com".

Sé que es para evitar el spam, pero creo que una gran parte de tus potenciales clientes no entenderán... tal vez usando una @ como imagen lo puedas arreglar.

[Daniel Ulczyk]

Iniciado por lucasan

(...) las imágenes las estoy llamando con una función que las extrae en sus diferentes tamaños, pero no toma el atributo alt.

Veo que has podido solucionar el tema del texto alternativo para las imágenes

Tengo algunas consideraciones para el siguiente escenario:
Navegar mediante el teclado con CSS deshabilitado.
Con buen criterio has implementado un enlace del tipo:

Código html:

<li class="saltar-contenido">
<a href="#contenido" title="Ir directo al contenido">Ir al contenido</a>
</li>
 

Lo cual es bastante útil.

Lo que debo hacer notar, es que el usuario se encuentra con un enlace:

Código html:

<div id="stripNavL0" class="stripNavL">
<a href="#">Left</a>
</div>
 

El cual es poco significativo bajo estas condiciones, ya que el href se encarga del evento (movimiento) del Slider -función JavaScript- hacia la izquierda y además existe la contrapartida Right.

Opino que este es un buen lugar para implementar una solución a tu inquietud:

Iniciado por lucasan

No uso JavaScript para funciones importantes o que afecten la navegación, es mas solo lo uso para el slider; como podría usar la etiqueta <noscript> en ese caso?

Aquí hay que utilizar el tag <noscript>, haciendo mención a que existen eventos manejados por JavaScript y en ausencia de esa funcionabilidad el enlace es inútil.

Lo anterior no es el contenido correcto; pero en línea con ello hay que trabajar sobre él.

[Mikmoro]

Creo que puede haber una forma no excesivamente complicada de conseguir que tu slide sea accesible.
A ver si este fin de semana me puedo poner un poco con la idea que tengo y te cuento si lo consigo.

[lucasan]

Iniciado por lucasan

Cosas a las que no pienso dar soporte por ahora:

2. Que se descuadre la página al hacer Ctrl+ repetidamente (a mi me aguantó hasta 4 veces sin descuadrarse mucho)

Bueno, parece que lo debo añadir a mi lista de si, pero no por ahora, ando corto de tiempo y para ser honesto no se ahora como hacerlo, me toca pensar como.

Ahora es medida en WCAG 2.0 para alcanzar el nivel AA.

Iniciado por Mikmoro

Esto es una clarísima elección personal, aunque creo que eres consciente de que es menos accesible. Si es así, perfecto.


No sé qué diferencias puede haber entre mi navegador y el tuyo (FF2 con 1024), pero ya con un aumento el menú se sale de su sitio y empieza a no estar tan claro que es el menú, pero con dos ya no se puede usar porque queda encima del formulario de búsqueda, etc. ¿No te ocurre eso?

Eso me sucede con 4 veces que lo hago, mi resolución es de 1280 x 1024, deb eser por eso. Pero igual, como dije arriba, lo pondré en sala de espera, debo hacerlo, pero aun no se como; me tocará pensar la forma.

Iniciado por facundocorradini

Un pequeño aporte, en tus datos de contacto pones "contacto[at]planoriginal.com".

Sé que es para evitar el spam, pero creo que una gran parte de tus potenciales clientes no entenderán... tal vez usando una @ como imagen lo puedas arreglar.

Tienes razón, creo que usaré lo que me dices, he visto que lo hace facebook, pone los emails en imágen, aunque igual me pone a pensar en la accesibilidad, debería usar el mismo email como texto alternativo, para quienes tengan las imágenes deshabilitadas o navegadores de texto, y ese texto alternativo igual lo puede tomar un crawler y bienvenido el SPAM vamos a ver que implemento. Gracias.

Iniciado por Daniel Ulczyk

Veo que has podido solucionar el tema del texto alternativo para las imágenes

Tengo algunas consideraciones para el siguiente escenario:
Navegar mediante el teclado con CSS deshabilitado.
Con buen criterio has implementado un enlace del tipo:

Código html:

<li class="saltar-contenido">
<a href="#contenido" title="Ir directo al contenido">Ir al contenido</a>
</li>
 

Lo cual es bastante útil.

Lo que debo hacer notar, es que el usuario se encuentra con un enlace:

Código html:

<div id="stripNavL0" class="stripNavL">
<a href="#">Left</a>
</div>
 

El cual es poco significativo bajo estas condiciones, ya que el href se encarga del evento (movimiento) del Slider -función JavaScript- hacia la izquierda y además existe la contrapartida Right.

Opino que este es un buen lugar para implementar una solución a tu inquietud:

Aquí hay que utilizar el tag <noscript>, haciendo mención a que existen eventos manejados por JavaScript y en ausencia de esa funcionabilidad el enlace es inútil.

Lo anterior no es el contenido correcto; pero en línea con ello hay que trabajar sobre él.

Cierto lo que mencionas, voy a poner <noscript> pero tambien voy a revisar el Js a ver de donde salen esos enlaces left y right, ya que no los uso puedo eliminarlos, solo que el Js no es precisamente mi fuerte

Iniciado por Mikmoro

Creo que puede haber una forma no excesivamente complicada de conseguir que tu slide sea accesible.
A ver si este fin de semana me puedo poner un poco con la idea que tengo y te cuento si lo consigo.

He pensado dos cosas básicamente:

1. Alternativa con CSS jugando con displays; el rollo está en como detectar el Js y así usar una u otra opción, voy a buscar info al respecto.

2. No se si sea posible, pero he pensado en detectar si hay o no Js habilitado en el navegador y así mostrar uno u otro contenido (hacer un contenido alternativo); pero no hacerlo con display, ya que al deshabilitar el CSS se verán los dos contenidos

Buscaré si hay la forma de detectar Js con PHP, si es posible será fácil lograr loq ue pienso.

A todos, mil, pero mil gracias, de verdad. Sigo pendiente.

[Mikmoro]

Iniciado por lucasan

1. Alternativa con CSS jugando con displays; el rollo está en como detectar el Js y así usar una u otra opción, voy a buscar info al respecto.

No, no creo que sea necesario: es mejor usar javascript no invasivo, que no interfiera de verdad. En cuanto pueda lo miro.

Hasta entonces, mira cómo está hecho esto, y no uso javascript:

http://www.araudi.net/forosdelweb/ta...s_activo4.html

Ya me explicaré mejor.

[p3rikl3s]

Iniciado por lucasan

Estas hablando en serio? en flash sería 1000 veces menos accesible.

Hola, cuando dije que deberías considerar flash, lo dije en serio. Hoy en día, es bastante probable que una pc con acceso a internet goze en su haber con los plugins para flash. Claro, reconozco que javascripts es un lenguaje interpretado por cualquier navegador por defecto, pero pienso que resulta ser más "peligroso" y a veces limitado - en cuanto a estética - que flash. En mi caso, muchas veces opto por desactivar el javascripts de mis navegador - sobre todo en mi trabajo - por cuestiones de seguridad.

No soy un gran experto en la materia, solo soy un humilde forista, y esta es mi opinión. Ahora se las dejo a ustedes.


Saludos.

[lucasan]

Iniciado por p3rikl3s

Hola, cuando dije que deberías considerar flash, lo dije en serio. Hoy en día, es bastante probable que una pc con acceso a internet goze en su haber con los plugins para flash. Claro, reconozco que javascripts es un lenguaje interpretado por cualquier navegador por defecto, pero pienso que resulta ser más "peligroso" y a veces limitado - en cuanto a estética - que flash. En mi caso, muchas veces opto por desactivar el javascripts de mis navegador - sobre todo en mi trabajo - por cuestiones de seguridad.

No soy un gran experto en la materia, solo soy un humilde forista, y esta es mi opinión. Ahora se las dejo a ustedes.


Saludos.

Hola p3rikl3s, gracias por tu opinión, si es muy probable que los navegadores comunes tengan flash activado, pero existen otro tipo de navegadores, como los de texto o los lectores de pantalla, de eso se trata la accesibilidad, de no discriminar (o hacer lo mas que se pueda ) a tus usuarios, ya sea por limitaciones del mismo o de hardware o dispositivos.

Gracias por tu opinión, es para mi igualmente valiosa, al igual que la intención sincera que tienes de aportar

[Aresillo]

Buenas Lucasan, un placer tus intervenciones y tu compromiso con la accesibilidad (as usual)
Me pregunto el porqué de tratar por todos los medios el spam...
Tanto spam te puede llegar en caso de que pongas tu dirección?? que pasa si pones una imagen y en el enlace el mailto:? eso te lo cogen también los robots??

Gracias!

Por cierto, muy chula la web... yo tengo que hacerme una también...pero como bien decías, en casa del herrero, cuchillo de palo..

[lucasan]

Hola Aresillo, gracias por tu comentario.

Y como respuesta a tu duda, si, los crawlers agarran lo que se encuentran a su paso, sea un mailto: o un [email protected].

Hay técnicas para encriptarlos, en búsqueda de eso ando actualmente.

Cierta vez hice la prueba, cree una cuenta X y la puse en un sitio web, la cantidad de spam recibida fue monumental (nunca me habian ofrecido tanto viagra en la vida )

Incluso, nada de raro tendría que los crawlers actuales ya reconozcan el [at] que puse y lo sustituyan por una @, no es muy dificil de hacer con expresiones regulares, y de eso si que saben esos tipos.

Que grato tenerte por aca, saludos.

[Aresillo]

Pues cuando encuentres el método me lo pasas.. ok?
Permanezco en la retaguardia.. leyéndoos..

Ares