Joomla na tabletach i smartfonach

[kacper1972]

A dokładnie przeglądanie witryny.

Wasze sposoby rozwiązania następującego problemu.

Na PC wywołać sub-menu można na dwa sposoby, pierwszy to jest narządzając myszką na pozycję, wtedy rozwinie się submenu. Drugi mniej wygodny dla PC zastosowany na zapleczu w Joomla 3.0 trzeba kliknąć na pozycję główną i jest submenu.

Gdzie jest problem? Na tabletach nie ma czegoś takiego jak najechanie myszką, jest tylko dotknięcie czyli kliknięcie. Przykład menu jest jednym z wielu, dalej rożnego rodzaju panele, chmurki i tp. Tego na tabletach i smartfonach nie ma.

Na początku potrzeba klikania na pozycje menu w zapleczu joomla 3,0 była dziwna - ale jest wyjaśnienie klik rozwijam submenu.

Jakie macie na to pomysły jestem ciekaw waszych opinii na ten problem

pz

[zwiastun]

Sposoby na rozwiązanie są już dostępne w kilku frameworkach, m.in. ramie projektowej Gavern od Gavicka czy JAt3 z joomlaart. :)

[Dziudek]

Ja chciałbym jeszcze zauważyć, że są dwa rozwiązania tego problemu - jedno z nich to całkowita zmiana menu na urządzeniach mobilnych, a druga to wykorzystanie pewnego zachowania przeglądarek mobilnych, które powoduje, że w wypadku elementów linków z przypisanym :hover dopiero drugie dotknięcie powoduje przejście do zawartości linka, przy czym trzeba zastosować pewien myk, mianowicie trzeba dodać pusty atrybut onmouseover do linków. W Meet Gavern rozwiązaliśmy to z użyciem poniższego kodu:




// main element for the iOS fix - adding the onmouseover attribute
// and binding with the data-dblclick property to emulate dblclick event on
// the mobile devices
jQuery('.gk-main-menu li a').each(function(i, el) {
el = jQuery(el);


el.attr('onmouseover', '');


if(el.parent().hasClass('haschild') && jQuery(document.body).attr('data-tablet') != null) {
el.click(function(e) {
if(el.attr("data-dblclick") == undefined) {
e.stop();
el.attr("data-dblclick", new Date().getTime());
} else {
var now = new Date().getTime();
if(now - el.attr("data-dblclick") < 500) {
window.location = el.attr('href');
} else {
e.stop();
el.attr("data-dblclick", new Date().getTime());
}
}
});
}
});


dzięki temu menu w Meet Gavern na tabletach da się obejrzeć bez przechodzenia do menu trybu mobilnego :)

- - - Updated - - -

Aaaa i byłbym zapomniał - menu na tabletach powinno zawierać jeszcze jeden mechanizm - ustawiania pozycji submenu tak by pojawiło się w odpowiednim miejscu w momencie gdy wykracza poza obszar strony, gdyż może się zdarzyć, że np. 2 submenu wystaje poza ekran na tablecie po rozwinięciu, ale tutaj również odsyłam do kodu źródłowego naszego frameworka Gavern a dokładniej do tego pliku: https://github.com/GavickPro/Meet-Gavern/blob/master/meet_gavern/js/gk.menu.js

[kacper1972]

Jak pisałem menu jest tylko przykładem, najczęściej używanym.

@Dziudek
Popatrz na takie ciekawe rozwiązanie ze waszej stajni News Show Pro GK4, na PC bardzo fajnie wygląda animacja zdjeća, kursor nad obrazkiem i zdjęcie się przechyla, niestety to nie pracuje na smartfonach , nie pisze że to jest źle, niestey mobilność i dodtykowość wymaga kombinacji, nie wystarczy zastosowac tylko Responsive Web Design rozumianej jako skalowanie i zmiana układu, niestety trzeba zastąpić czymś niektóre funkcje, czyli nie mówimy tylko o małych ekranach ale też o braku onmouseover. Bo patrząc na wasz wspomniany moduł trzeba dopisać coś takiego.
jednko kliknięcie palcem zdjęcie się przechyla, drugie klikniecie palcem otwiera dalej treśc - a w takim razie czy użytkownik przyzyczajny do pojedyczych dotknięć nie będzie wprowadzony w błąd skoro raz kliknołem i tylko tyle się stało, to moze nie przechodzi się dalej? moze lepiej zrezygnować z tej ciekawej animacji na tablety i smartfony?

A dlaczego o ten temat tak gnębię - bo zmiany w świecie idą w kierunku>>> mobilności, Google pisze mobiole first, IBM Rozwiązania mobilne., ilość sprzedawanych tabletów i smartfonów jest ogromna. Transfer danych rośnie w sieciach komórkowych szybciej niz sms i głosu.

W Gavernie są sufiksy tak jak w Vertexie czy innych ramach - akurat na Vertexie zrobiłem to tak: też
Moduł dla PC jest wyświetlany, zaś za pomocą sufiksa wyłączyłem moduł na tablety i smartfony i gra muzyka w to miejsce mozna dać inny moduł który lepiej się sprawdza na mobilnych też sufix

Co do menu i skalowania - z menu też trzeba uważać, akurat testowałem to na ramie gantry Gantry - tam są kolejne przejścia, pełne menu, menu bez sublinii i menu mobilne, ale czasami jak się da za dużo pozycji głównych w menu to czasami się zdarza, że mamy dwie linie menu.

W sumie to cała rewolucja mobilna mi pasuje - znów zacznie się przez jakieś czas poszukiwanie dobrych profesjonalnych rozwiązań a nie allegro za 139 zł

[ugly kid joe]

A dlaczego o ten temat tak gnębię - bo zmiany w świecie idą w kierunku>>> mobilności, Google pisze mobiole first,

tylko, ze mobile first nie oznacza, że aplikacje mają w taki sam sposób wchodzić w interakcję z użytkownikiem na ekranach mobilnych, jak na ekranach pc.

ostatnią rzeczą jaką bym chciał to wgapiać się w ekranik z animacjami i doczytywać co to za treść, kryje się pod funkcją wykonania jakiejś zaprogramowanej akcji.

mobie first oznacza pewną funkcję ... tylko. chyba, że mówimy o aplikacjach mobilnych, którymi joomla! nie jest, nie był i nie będzie.

[kacper1972]

W rozumieniu google oznacza to dokładnie, że kluczowym jest dla nich dostoswanie swoich rozwiązań do urzadzeń mobilnych - patrze linia nexus, Android - oni promują mobilność, dla nich mobilnośc jest najważniejsza na dziś.

Zobacz jak wiele elementów na stronach działa z wykorzystaniem funkcji najechania myszą, nie mowa tylko o menu to tylko wierzchołek
pz

[ugly kid joe]

ale joomla! to nie google. google dla funkcji webowych, wydaje aplikacje na urządzenia mobilne, które projektowane są tylko pod tym kątem. nie znaczy to, że jakikolwiek cms będzie projektowany jako aplikacja na telefon.

[kacper1972]

e no..... nie przesadzaj joomla 3.0, na Joomla day polska była wyraźna mowa, że joomla 3.0 to pierwszy cms optymalizowany pod mobilne

[ugly kid joe]

a ty chociaż rozróżniasz czym jest strona optymalizowana pod urządzenia mobilne, a czym aplikacja na urządzenia mobilne ?

[kacper1972]

Muszę ciebie zmartwić - doskonale wiem co jest czym. I juz siedząc w WC przeglądam internet:lol:. W domu na dziś mam 7 urządzeń łączących sie z internetem w tym tylko dwa komputery. Więc wiem o czym piszę. Wiem też że coraz więcej ludzi korzysta z przeglądania stron przez mobilne urządzenia. To co świetnie się sprawdzało na PC niekoniecznie się sprawdza na tablecie czy smartfonie.

Co oznacza dla Google mobile first i o nowej strategii koncernu
http://www.brighthand.com/default.asp?newsID=16235&news=Google+Android+OS+CEO+Eric+Schmidt+Mobile+Fir st

Tutaj kolejny ciekawy link o tym co nas czeka.

http://www.internetevolution.com/document.asp?doc_id=252838
Fajna ikonografika

Tak szybki wzrost zainteresowania konsumentów musi skutkować z naszej strony innym podejściem do projektowania stron, zapomnij o tym, że masz tylko PC. Tworząc stronę na dziś koniecznie musisz wziac pod uwagę mobilne urządzenia. Popatrz co robią kluby:
Rocketheme - Gantry i nowe szablony już są w RWD
Joomlart - T3 - tez
Shape5 - Vertex
Gavick Polska - - też responsywny układ szablonów i wyżej wspomniana rama
Themexpert także resposive
SmartAddons i ich solid framework też jest w RWD
Nie wspomnę o Yootheme i jego Solid Framework i kilku innych

Obecnie trwanie przy rozwiązaniu zgodonym tylko z PC to właśnie błąd czy jeszcze można sobie na to pozwolić?

Nagle dla mnie Joomla 3.0 stałą się bardzie wygodna bo mogę jadąc autobusem wygodnie wprowadzać zmiany, leże na kanapie trzymam tableta i w komfortowych warunkach edytuję stronę, no wprowadzanie tekstu to makabra. No zostają jeszcze inne pomieszczenia :D do zabawy z Joomla 3.0.

Ale chodzi o to by naszym klientom, użytkownikom dostarczać jak najlepszy produkt, aby nie okazało się ze klikają na coś i coś działa inaczej niz sobie założyliśmy lub nie działa, albo user sie namęczy aby coś zobaczyć.

[souacz]

Na tabletach nie ma czegoś takiego jak najechanie myszką, jest tylko dotknięcie czyli kliknięcie. Przykład menu jest jednym z wielu
A o mulitouch Kolega słyszał lub gestach? Wystarczy kliknąć dwoma palcami lub "swypnąć" od DL do GP przez pozycję menu (co jest wygodniejsze na mniejszych ekranach lub mniej czułych digitizerach) i mamy wywołaną funkcję "hover". Działa na 100% na systemowej przeglądarce na ICS. Nie dotyczy wszystkich menu np. flash, tam różnie bywa ale łatwo taką funkcje dodać na etapie projektowania. Jest też jakaś przeglądarka, nie pamiętam która, chyba Dolphin HD ale głowy nie dam, dodająca małe strzałki przy tych pozycjach menu, które są rozwijalne. Klikamy na strzałkę i mamy submenu.


wprowadzanie tekstu to makabra
Jest tyle różnych klawiatur, że naprawdę nie ma problemu by jakąś dobrać. Sam używam najnowszej Swype Beta, można ją pomniejszać, dzielić na dwie części umieszczone po bokach i wreszcie używać do miziania paluchem po ekranie. Na klawiaturze Swype piszę dużo szybciej niż na komputerowej i nie popełniam tylu literówek. Są tez klawiatury dołączane w postaci futerałów. Warunek: musi mieć prawy Alt i trzeba zainstalować aplikację "Polska klawiatura programisty" z Google Play. Edytorów kolorujących i podświetlających składnię też trochę jest, podobnie różnych narzędzi dla webmasterów w stylu Firebuga. Klient FTP to przede wszystkim Any Ftp. Mam już na koncie jedną stronkę zrobioną w J! prawie całkowicie na tablecie 9.7", tak samo przeze mnie administrowaną. Prawie bo szablon robiłem jednak na kompie. Uparłem się kiedyś, że taką zrobię, na początku było ciężko ale jakoś się przemogłem, spróbujcie - niezła zabawa!

Sorka za off-top

[seal6]

Tutaj jest bardzo fajny dodatek do WordPressa http://www.wiziapp.com , który byłby rozwiązaniem kwestii mobilności- trochę więcej niż mobilna templatka. Niestety nie spotkałem się z czymś podobnym na Joomla.

[zwiastun]

Bo chyba nie spróbowałeś znaleźć:
Mobile (http://extensions.joomla.org/extensions/mobile/mobile-display/11722?qh=YTo0OntpOjA7czo2OiJtb2JpbGUiO2k6MTtzOjc6I m1vYmlsZXMiO2k6MjtzOjg6Im1vYmlsYW50IjtpOjM7czo4OiJ tb2JpbGl6ZSI7fQ%3D%3D). Jest już od 2010 roku. I nie jedyny.

[seal6]

Znam tą aplikacje i jej używam od dawna. Ale to co wkleiłem - wizi- to tak naprawdę dodatek który potrafi zrobić aplikację do pobrania i zainstalowania na smartphonie. jest jeszcze takie coś http://weeverapps.com/ ale to też z tego co widzę nie powoduje że (tak jak w wizi) mamy do czynie z aplikacją którą można pobrać z AppStore. Niby pierdoła i mało ważna ale ludzie mają zaufanie do takich aplikacji.