iPhone: Opera Mini versus Safari (test de renderizado)

@ 13 . abril . 2010

Opera Mini 5 acaba de salir en la App Store, y sinceramente más que ventajas le encuentro falencias. El principal objetivo de un navegador en el iPhone o iPod Touch no es la velocidad, sino el renderizado correcto de cualquier página web, es decir, que la página web se vea lo más exacta posible a como se diseñó y como se vería en un computador de escritorio, para que el usuario del iPhone no vea menos que los demás o vea otra cosa.

Si bien Opera Mini 5 es más veloz que Safari, su renderizado deja muchas cosas que desear.

Safari:
Safari iPhone CSS render
Opera Mini 5:
Opera Mini iPhone CSS render

Videos: Claramente se puede observar que una misma página se ve muy diferente. En Primer Lugar Opera Mini no reconoce el JavaScript del vídeo de YouTube en el primer Post, por lo que solo muestra texto, en cambio Safari muestra una imagen Thumbnail con un icono indicando que es un video de YouTube y un enlace para abrirlo en la App de YouTube.

Si eres una persona que acostumbra visitar blogs y páginas con videos, con Opera sufrirás de no poder abrirlos por ningún lado.

Texto: Otra vital diferencia es el ancho y tamaño de los párrafos de texto que sale sin hacer ningún zoom. En Safari como podrán ver este esta correctamente renderizado y hasta es legible, pero en Opera Mini no se lee nada, son puntos negros muy pequeños y estan en un ancho erróneo al que deberían estar, con un espacio en blanco a la derecha. Ni el título del post sale del tamaño que debería estar.

CSS3: En Safari podemos ver como el CSS3 se renderiza correctamente, esquinas redondeadas, el font con brillo / sombra como lo tengo diseñado, todo se muestra correctamente. En Opera mini no se ve nada de CSS3, es como si fuera Internet Explorer.

JavaScript: En Safari el JavaScript no da problemas. En Opera Mini este directamente no funciona o lo hace a medias. Ningún AdSense se muestra (la publicidad) y el widget de twitter que tengo en la barra lateral en Opera Mini solo sale un mensaje y no se actualiza nada.

Vista Landscape / Panóramica

Safari:
iPhone Safari Landscape
Opera Mini 5:
iPhone Opera Mini Landscape

Vista Landscape, o vista panóramica es cuando rotamos el celular de manera horizontal.

En Opera Mini la vista panorámica falla completamente, la página no ocupa el ancho de la pantalla y deja a la derecha un gran espacio en blanco.

De la misma manera si empiezas con la página en landscape, esta ocupa todo el ancho, pero si luego vuelves a vista normal, esta sale cortada por ser más ancha, es decir no hay redimensionamiento alguno.

El título del post se ve terriblemente pequeño en Opera Mini, y se ve una gran diferencia.

Creo que Apple ha aprobado Opera Mini sólo para demostrar que Safari es superior y podamos comparar.

Autor del post: DanielSemper: @aeromental + Facebook

frade

Safari rlz!
Iluvatar

Al parecer opera 5 deja bastante que desear… pero te puedo asegurar que el opera 10 con un celular con symbian es bastante bueno.
el opera 5 esta diseñado para celulares de mas bajas prestaciones… cuando opera lo optimice para funcionar con el ipod o iphone, seguro lo sacan del store porque sera mucha competencia para safari
x,

que tal Daniel,una ligera duda:
“El título del post se ve terriblemente pequeño en Safari”
mmm no habras querido decir en opera mini?
saludos!
Jørge

Ojala que pronto corrijan las fallas en Opera ya que se me hace un buena opción aunque tengan un mal comienzo.
hhh

Veo que hace el test sobre su propia página web. Seguro que lo tiene bien codificado para que pueda ser visto correctamente por cualquier browser? Se lo pregunto porque acabo de entrar en youtube con Opera Mini 5 y veo videos instantáneamente y correctamente tanto con la pantalla en vertical como en horizontal…
DanielSemper

hhh,

Aeromental esta codificado correctamente con XHTML y CSS (y un poco de CSS3), no hay nada raro y es visible sin problemas ni muchas diferencias en cualquier browser, ya sea Internet Explorer, Opera, Safari (Pc, Mac y iPhone), Firefox, Chrome, etc.

Te recomiendo probar de visitar otros blogs y detectarás las mismas falencias.
hhh

Gracias. He probado de otra manera. Opera Mini 5 en un teléfono de otra marca (no Iphone eso es), y me pasa exactamente igual. Las páginas webs que veo incluído youtube se muestran correctamente mientras su blog se muestra con las mismas falencias que describe arriba.

Los browsers de móviles perdonan muy poco (lo digo por experiencia propia), y normalmente el fallo está en el web site no en el browser cuando algo falla.
DanielSemper

Pues yo veo varias páginas con la misma falencia.
hhh

Bueno yo lo veo así:

Como MS IE en PC perdona un montón de fallos de codificación, el Safari Mobile lo hace para móviles

Creo que es una gran cosa que Apple es suficientemente abierto (ya está recibiendo criticas por lo contrario) como para admitir una aplicación que no haya sido programado con las herramientas propias de Apple y -aunque no es perfecto seguramente- trae algunas ventajas que a Safari Mobile falta como tabbed browsing, paginas cacheadas, velocidad, ahorro en datos (y coste), tener varios buscadores disponibles a la vez. Y Apple lo pone a disposición de los usuarios elegir entre los dos browsers cuando una vaya mejor que otro según la circunstancia. Not bad :))
DanielSemper

Una vez más te aseguro que Aeromental no trae “fallos”. Es en serio cuanod digo que osn varias págiuas mostrando estas falencias cuando se cargan en Opera Mini.

Si es que dices ver bien a Youtube, pues no es así, de hecho lo que ves es una página muy diferente de la normal de YouTube, ves una especialmente codificada para verse en móviles y es por eso que la URL cambia a m.youtube.com

Aquí no se discute el crear otra versión de tu página para móviles sino el de que se vea igual ya sea en PC o en móvil, y eso lo consigue Safari al 90% (sólo le falta flashplayer).

Y de prueba dejo screenshots tomados por otros usuarios, con texto pequeño, sin JavaScript, Áreas blancas a la derecha, sin videos, etc, etc:

El New York Times en Safari:

El New York Times en Opera Mini:

Opera.com en Safari:

Opera.com en Opera Mini:
Nicolas

Probaste cambiando las configuraciones?

Hay una opcion para el tamaño del texto (chico-mediano-grande)

Tambien esta la opcion Mobile View que quizas esta activada.

Sino es eso, entonces si tiene serios problemas con el renderizado.
DanielSemper

Tengo Mobile View en OFF y texto en Grande, y se ve igual de mal.
hhh

No veo diferencias apreciables en las páginas de NYT, Opera.com. Las otras, y la suya parecen tener problemas con frames o algo por el estilo. De acuerdo que youtube muestra automáticamente un versión móvil cuando yo escribo la url youtube.com en opera mini, pero eso es una acción que youtube pone en marcha no yo como usuario. Por algo lo harán? Quiza debe evaluar hacer algo parecido en cuanto a su blog.

Y a Safari Mobile le falta Flash Player también (aparte de lo que he mencionado arriba), pero es a proposito ya que Apple ve Flash como algo anticuado. Pero otra vez, Apple se lo deja en bandeja a los usuarios de Iphone poder disponer de dos browsers que son diferentes. A algunos lo que Opera Mini trae es bueno, para otros no lo es o da igual. Más opciones para los usuarios = los usuarios ganan, no?
Nicolas

Muy notable los screens de la propia pagina de Opera.

Se ve que con Opera mini su objeivo era acelerar lo mas posible la navegacion de contendio sin importar el diseño de las paginas.

Muy raro de Opera que tenga esa falla en el renderizado, sitios que en Opera 10.5 se ven perfectos.
Dani Shorel

Hola, no se si las diferencias entre la versión de Opera Mini para Android y para iPhone sean muchas, pero esta es mi experiencia:

Primero que todo, la letra no es diminuta e ilegible, esa solo es una presentación global de la página para que uno escoja qué parte quiere ver con zoom. Le das clic a una parte de la página y listo, la ves en todo su esplendor, con letras claras y legibles y el texto ajustado al ancho de la ventana. No puedo creer que te quedaras mirando esas letras pequeñas sin hacer clic o zoom con los dos dedos o como sea en iPhone.

Segundo, Opera si tiene vista Landscape/Panorámica. Lo que no tiene es auto-refresh luego de que giras el celular, le tienes que dar clic al botón refresh y te muestra la página en landscape, sin la barra blanca a la derecha. Si sigues navegando en landscape la página la sigue renderizando en ese modo.

También tiene el problema contrario: si ves una página en landscape y giras el celular sin presionar reload entonces los textos aparecerán muy largos.

Finalmente reitero, esta es mi experiencia en Android, ya que no tengo un iPhone.