Przesunięcie menu na prawą stronę w wersji mobilnej

Odpowiedz Nowy wątek
2018-03-08 13:02
1

Witam,

Złapałem się na tym, że jak na telefonie przeglądam forum i chce przejść na mikroblogi to po kliknięciu menu mam:

screenshot-20180308125759.png

Strasznie to niewygodne, ze klikam z prawej, a menu dostaje z lewej i jeszcze jest to tak blisko siebie, że mam problem z precyzyjnym tapnięciem na odpowiedni link...
Może to wina moich paluchów, ale wydaje mi się, że lepiej by było jakby w mobilnej wersji menu pojawialo się po prawej stronie z większym paddingiem, np. coś takiego:

screenshot-20180308130142.png

Pozostało 580 znaków

2018-03-08 15:15
1

To i tak będzie źle wyglądało, bo marnuje przestrzeń i zasłania wszystko z góry do dołu. Gdyby te itemki zrobić poziomo, to by niczego nie zasłaniały, ew. zwijać je jak zakładki na desktopie, jesli wszystkie nie mieszczą się w jednej linii.

To samo, jeśli chodzi o listę opcji w ustawieniach profilu. U mnie wygląda to tak:

menu.png

Sporo miejsca w pionie zajmuje ta lista – dobre 200px dałoby się zaoszczędzić, przez co nie trzeba by tyle przewijać. W zakładce Ustawienia jest to samo.

  • menu.png (0,08 MB) - ściągnięć: 10

Pozostało 580 znaków

2018-03-08 15:22
0

Ale na mobile, to menu: Forum, Mikroblogi, Praca, Pastebin, Kompendium, Czat zmienia się w przycisk i to jest ok, chodzi o to, że IMO to co się rozwija nie jest wygodne do obsługi palcem, jak kliknę kciukiem z prawej i dostaje listę z lewej w dodatku taką "małą" to już tym samym kciukiem nie jestem wstanie kliknąć precyzjnie linka...

Zupełnie nie rozumiem, czemu dajesz screena z "desktopowej" wersji, bo do niej się nie odnoszę

Widok, który podał @furious programming występuje od 1090px szerokości. Niektóre k'krowy' smartfony mają tyle. - theacid 2018-03-08 16:07
Mobile urządzenia to też tablety – te mają większe rozdziałki, niż krowiaste smartfony. - furious programming 2018-03-08 16:08

Pozostało 580 znaków

2018-03-08 16:03
0

Moja rozdziałka jest od dawna uznawana za desktopową – na monitorze mam mniej pikseli w poziomie niż na tablecie.

Dlaczego o tym wspominam? Bo pokazałeś kolejne miejsce, w którym zajmowana jest nadmiernie przestrzeń w pionie. IMO warto również i o tym porozmawiać, jeśli już poruszony został temat reorganizacji menu.

Panczo napisał(a):

[…] chodzi o to, że IMO to co się rozwija nie jest wygodne do obsługi palcem, jak kliknę kciukiem z prawej i dostaje listę z lewej w dodatku taką "małą" to już tym samym kciukiem nie jestem wstanie kliknąć precyzjnie linka...

Z tym się zgadzam – dziwne to, nieintuicyjne.


edytowany 4x, ostatnio: furious programming, 2018-03-08 16:05

Pozostało 580 znaków

2018-03-08 16:06
0

No ale to jest rozwijane, a nie widoczne cały czas...

Pozostało 580 znaków

2018-03-08 16:08
1

Polecam ściągnąć repozytorium, przygotować zmianę w CSS i zaproponować ją na forum do oceny (najlepiej ze screenami przed/po) :)


edytowany 1x, ostatnio: Marooned, 2018-03-08 16:08

Pozostało 580 znaków

2018-03-08 16:20
1

@Marooned: screen przed/po masz w pierwszym poście.

Moja wiedza z front-endu nie pozwala mi na zmianę w samym CSS forum, ale te screeny to nie jest zabawa w programie graficznym, tylko dodanie bezpośrednio styli w kodzie strony (w narzędziach developerskich):

Przed:

<div class="active">
        <a href="https://4programmers.net/Forum">Forum</a>
 </div>

Po:

<div class="active" style="text-align: right;">
        <a style="padding: 1em; display: inline-block;" href="https://4programmers.net/Forum">Forum</a>
 </div>

Czyli div zawierający element menu dostał

text-align: right;

A sam odnośnik:

padding: 1em; 
display: inline-block;

więcej nie pomogę, bo nie potrafię i nie wiem czy to jest zgodne ze sztuką...

Pozostało 580 znaków

2018-03-08 22:05
0

Jeszcze się zastanowiłem czy nie lepiej zamiast dorównywać do prawej, praktyczniejsze nie byłoby wyśrodkowanie, poglądowy screen:
screenshot-20180308220340.png

Jakby nie patrzeć wyrównanie nie jest tak istotne, ale padding ma istotny wpływ na obsługę paluchami...

W dalszym ciągu sporo miejsca się marnuje i sporo zawartości zasłania. :P - furious programming 2018-03-08 22:21
Nie mogę zrozumieć Twojego toku myślenia, jaki sens jest przejmowaniem się ile coś miejsca zajmuje w sytuacji gdy rozmawiamy o czymś co użytkownik musi odkryć aby zobaczyć? - Panczo 2018-03-08 22:24
To że musi coś zobaczyć, wcale nie oznacza, że musi zasłaniać cały ekran. Taka sama sytuacja miała miejsce w Windows z systemowym menu (klikało się Starti jeb – cały ekran durne kafelki), z którego na szczęście szybko zrezygnowano. - furious programming 2018-03-08 22:38
@Panczo: może chodzi o wrażenie? Niby i tak nawiguje się po menu, ale można i nie po nim. A jak ktoś nie kliknie w któryś odnośnik, to nie chce mu się klikać w ikonkę menu drugi raz, żeby zamknąć, tylko chce od razu popatrzeć na stronę (abstrahuję od tego, czy menu zamyka się automatycznie, gdy utraci focus). - Silv 2018-03-08 22:43
@Silv: tak, samo się zamyka po utracie fokusa. Na wersji szerokiej (desktopowej) też. - furious programming 2018-03-08 22:52

Pozostało 580 znaków

2018-03-09 07:20
1

Dzięki za propozycje zmian. Padding jest definitywnie do poprawy. Dodałem już zadanie na to. Będę informował o postępach prac :)

Pozostało 580 znaków

2019-03-04 19:55
2

Poprawka leży już na repo i wkrótce będzie na produkcji.

Pozostało 580 znaków

Odpowiedz
Liczba odpowiedzi na stronę

1 użytkowników online, w tym zalogowanych: 0, gości: 1, botów: 0