Dobra koniec sielanki

http://blog.piotrows.pl

Proszę o wytykanie błędów, możliwych poprawek, fame, bluzgi, wszystko mile widziane.
Każda rada będzie nie ocenione i przydatna.

Całość zakodowana przeze mnie więc cudów na polu html się nie spodziewać
Blog przeniesiony z .... brrr... WP.... na Laravel 5.1

Wydajność wg. mnie jest nieporównywalnie dużo większa i o to mi chodziło. Bez zbędnych śmieci.

• + validator ok.
• - https://developers.google.com/speed/pagespe...&tab=mobile
  Jakby tak chociaz skompresowac te dane, to wiedz ze gdy padnie mi transwer strona sie bedzie czytac kilka sekund szybciej. (O te marne 10+kb )
• - to od komentarzy coś długo czyta, chyba z 5s. (Lekkie czepianie się, no bo kto niby w tyle odpowie..), ale cache czy cos by sie przydalo. O ile sie da, bo cos gdzies ten system widzialem u kogos tylko nie wiem czy sie da do jego dodać D
• + artykuły są ok
• dooobra, tu juz sam nie wiem czy czepianie się, ale mnie osobiście odstraszają kolory na podobe
  grejpfrutu.
• placeholder="" byś mógł dodać w wyszukiwarce , oczywiście z jakąś wartością. Bo ten biały prostokąt inputa brzydki

Poprawiłem wyszukiwarkę, dodałem też atrybut require żeby nie słać bez sensu puste wyszukiwanie
Komentarze tak mają, z tym chyba nic nie zrobię ale jeśli ktoś ma rozwiązanie na przyspieszenia Disqus to chętnie się dowiem

co do kompresji to wszystko jest kompresowane. Zmniejszyłem logo pierwotne do mniejszego obrazka co da parę KB
Kolory Nie dyskutuję o gustach. Wg. mnie jest lekko i czytelnie i o to miało chodzić

Czekam dalej na wytykanie

Tak na szybko.

Nie ma kodu, to pewnie pytasz o front i funkcjonalność. Przy zmianie języka nie ładuje się obcojęzyczna wersja wpisu, tylko strona główna. Dzieje się tak mimo, iż odpowiednik w języku angielskim istnieje. I tak przy okazji hasła "komentarze", "brak komentarzy" itd. zostawiłeś bez tłumaczenia .

Gdzie są kategorie? Przydałaby się też pozycja "podobne wpisy", w widoku pojedynczego wpisu.

Masz literówkę w placeholderze "wpisz frazę wyszukowania". No i mogę przeszukiwać, wpisując tylko 3 spacje, 2 spacje i % itd.

Tyle, bo w chwili obecnej coś poprawiasz "Be right back."

- Co do tłumaczenia to wyszedłem z założenia że to tylko taki przełącznik pomiędzy wersjami językowymi całego bloga. Miałem wcześniej przy tytule wpisu flagę jeśli było tłumaczenie, ale zrezygnowałem z tego. Nie nie widziałem sensu zastosowania tego.
Napisy "komentarz" itp. to niestety wina Disqus... nie jestem chyba w stanie zmusić go do tego aby pobierał tłumaczenia dla tego elemenu

- Kategorie - będą
- Podobne wpisy - są - muszę je tylko dobrze przemyśleć i pododawać.
- Literówka poprawiona właśnie jak było Be right back

Całkiem spoko, ale niestety czcionka Raleway nie ma polskich znaków, co widać np. tutaj: http://prntscr.com/8peoio. Na jednej ze swoich stron też chciałem ją kiedyś zastosować ale przez ten brak polskich znaków musiałem szukać innej

Co do speed testu to wynik jest całkiem przyzwoity i nim raczej bym się nie martwił

Chyba pójdę Twoim przykładem i przepiszę moje strony na jakiś swój system

Co do czcionki to wiem, zdaję sobie z tego sprawę, a z drugiej strony taki mały pierdołek Polecasz coś w zastępstwie? Coś co się będzie komponowało z Lato i było w miarę podobne do Raleway?

Dodałem tagi na dole (najczęściej używane),
- poprawiłem kilka błędów z obsługą linków eng.
- dodałem podstawowe mikroformaty
- zmieniłem napisy "komentarze" na bardziej neutralne - ikonkę ale coś mi nie leży i pewnie się zmieni.
- w kilku najnowszych postach widać "proponowane arty" i tagi.

Co do speedtest to nie martwię się. Wg. mnie strona i tak śmiga


Co do kategorii to zastanawiam się czy jest sens. Są tagi, Tagi będą dodawane od ogólnych do bardziej szczegółowych, więc klikając na tag można znaleźć interesujące pozycje z danej "kategorii"
Aczkolwiek przemyślę jeszcze to.

Jakieś inne sugestie?

Dostosowywałeś pod mobile też?
U mnie nie ładuje jakiś grafik przy tematach. Oprocz tego pojawia sie jakiś prostokat ktory za chwile znika przy tematach. A input z szukajki wychodzi mi poza kontener. No i wspomniane fonty psuja troche efekt. A kolory nie zgodze sie sa całkiem fajne

Btw font nie czcionka :]

Ogólnie pod mibilne tak, nie było tam wiele zabiegów ale zawsze coś tam...

O jakich grafikach mówisz? Prostokąt? Możesz jakiegoś screena zapodać?
Co do input szukajki to też bym prosił o jakiś screen.

Font j.w. do znalezienia coś podobnego co będzie pasowało.

Brakuje trochę listy wpisów (archiwum), teraz chcąc odszukać jakiś wpis trzeba się przeklikać przez wszystkie podstrony.

Od tego jest wyszukiwarka Ja szybciej zapamiętam +/- tytuł wątku niż kiedy był napisany

Jasne, planowałem je dorzucić ale nie miałem wczoraj możliwości wejścia na kompa, ok to te namierzone grafiki to svg z komentarzy, ale to pewnie wina mojego samsunga, a ten kwadrat to nie ukrywasz tego elementu co odpowiada za powrót scrollem do góry, niestety nie da się go uchwycić na ss.

Dobrze widzę używasz Lato? to dodaj latin-ext, bo Lato ma PL

Co do Lato to tak. A jest gdzieś problem z pl znakami? Bo nie zauważyłem.

Co do tego SVG to też planuję to zmienić tylko na razie nie wiem na co. Muszę coś wymyślić co się będzie komponowało.
Możesz jaśniej ad. tego "powrotu do góry" ? Bo mam wrażenie że mówimy innym polskim

Faktycznie jest jeszcze problem z Lato, ale różnice są tak niewielkie, że ciężko je zauważyć: http://prntscr.com/8qer4j

Co do Raleway to użyłem po prostu Ariala Z tym, że ja go używam w tekście a nie w tytułach więc nie zależało mi jakoś szczególnie na dużym podobieństwie

no np tu https://www.google.com/fonts#UsePlace:use/Collection:Lato

Ok, ok

https://screencloud.net/v/Bi1N wrzucam z desktopu bo na mobile tak jak pisałem na ss tego nie uchwyce

@freemp3 wrzuciłem obecnie wszystko na Lato, będę dopieszczał to powoli
@com font ok, co do tego przycisku, to nie za bardzo mam jak to sprawdzić.
Ale nie da się go kliknąć ? czy po prostu go gdzieś przesuwa?

jak zescrolluje to pojawia się na parę chwil po czym znika i tak co scrolluje na fonie, wiec tak nie da się w niego kliknąć ale też nie wiadomo o co chodzi bo się coś pojawia i znika
Daj mu display none dla mobajli

ahaa... Ten button dostawał opacity jak się dalej jechało. Zerknij teraz czy jest ok.

2/10 bo odpisałem

- bardzo ubogie tagi
- brak kategorii
- brak archiwum
- wyszukiwarka (input) na górze mogła by się wysuwać po najechaniu, mniej kliknięć

konstruktywna ocena

- Tagi - będę uzupełniał powoli, przeniosłem z WP tylko treści i nic więcej. Więc linkowane arty i tagi będą się uzupełniać
- Kategorie - Hmm... Chyba wprowadzę jednak skoro to tak ludziom potrzebne.
- Archiwum - Tu nie widzę sensu bo i po co ?
- Wyszukiwarka - rozważę. W sumie można dodać feature JS (non-js będzie zachowane)

PS. Wybacz że zmusiłem Cię do odpisania

Ok teraz jest git i widze pl znaki juz też sa, na kompie nie bylo widac ale na komie bardzo

Na stronie masz 10 ostatnich wpisów, wszystkie z wypisem dłuższym lub krótszym. Aby przejrzeć jakie masz te wszystkie wpisy trzeba klikać na "Poprzednie" i tak nie wiadomo nawet jak długo.
Wprowadzenie archiwum powoduje, że od razu widać jak często są te wpisy, widać ile ich jest w danym roku/miesiącu, widać tytuły, można szybko przejrzeć wszystko pod kątem interesujących treści. Gdy blog jest rozbudowany to przeglądanie wszystkiego za pomocą przycisku Poprzednie to dość słaby UX.

A co powiesz na stronę stylu spis treści? Wyglądałoby to tak:
data - tytuł wpisu
I tak po np. 100 wpisów / strona

Dodatkowo można by było podzielić to wg. kategorii jeśli już będą.

Klasyczne podejście do Archiwum mi się nie podoba i takiego na pewno nie wprowadzę. Niesie to tylko przekaz ile wpisów w danym okresie było - nic więcej. I tak trzeba wejść w miesiąc żeby zobaczyć co było napisane.

Pyton_000, to co zrobisz to tylko zwiekszenie ilosci wpisow na stronie. - i tu wielki minus na mobilne urządzenia

Zobacz np. Jak ma http://z3s.pl (po prawej stronie archiwum).
Wchodzisz na strone glowna to masz normalny spis.
Ale sa archiwa, gdy chcesz zobaczyc co sie dzialo w jakims okresie np. Grudzien 2014 to klikasz i bach, caly spis masz z tego okresu.
Bo dla przykladu mogles byc odciety w tym okresie od internetu, czy miec brak czasu.

Dodatkowo zobacz ile osobą by to moglo ulatwic.
Ty nie chcesz, ale wiecej osob chce. Twoj blog ale jak wolisz - tak to wygodniej wiele, moze nawet by ci serwer moglo odciazyc, zakladajac ze tak ciagle ktos bedzie klikal > > > > (...) >... a tak to raz i jest caly okres. +++ oczywiscie do komfortu ktory ulatwi szybsza nawigację.

I trzy, że można zobaczyć jak autor się rozwinął z tematyką od kiedyś do teraz wedlug mnie. Jakosc jak sie zwiekszyla itd.

No i w dodatku mozna przez to sprawdzic "częstotliwosc" wydawamia wpisów.

KsaR chyba mnie nie zrozumiałeś.

Chodzi o dedykowaną stronę gdzie będą tylko daty i tytuły (mogą być pogrupowane np. datami, kategoriami itd).
Poza tym Dla mnie taka forma Archiwum nie niesie żadnej treści. Co mi po datach, ja szukam contentu.
To content jest kluczem a nie to kiedy został napisany/

Co do argumentu odciążenia serwera to tu bym się nie martwił Paginacja wpisów jest w cache więc obciążenie prawie zerowe

Co do częstości wydawania wpisów. To opisałem w poprzednim poście. I dalej twierdzę że jestem nie przekonany co do archiwum

Nie do końca się zgodzę. Jeżeli szukam rozwiązania z zakresu chociażby CSS, to rozwiązanie datowane na 2010, jest pewnie nieaktualne .

Co do archiwum, to jak na dłoni widać, czy warto taki blog dodać do obserwowanych - bo często pojawiają się w nim interesujące mnie treści, bo jest bieżąco uzupełniany, a ostatni wpis nie pochodzi z marca 2014 .

Moglem nie zrozumiec

A jak tu z okresami będzie ? Bedzie sie dalo wybrac dany miesiac i rok? Jak tak to fajnie
(Mając na uwadze 2-3 argumenty ktore wyzej nt. Temat wymienilem)

Co do obciazenia, ehhh chcialem cie przekonac. Ale ... Czas uzytkownika jest takze cenny ,

Czestosc, hmm dobra rzecz. Mozesz spojrzec ile bylo wydane wtedy, a wtedy zeby sie ew. Przyzwyczaic ile bedzie w miesiacu mniej-wiecej do czytania

Jak dla mnie pomysł całkiem zacny Osobiście też nie trawie tego typu archiwum. Jak byś dodał sortowanie według daty lub kategorii (tak jak napisałeś) to każdy byłby zadowolony. Osoba, która szuka po dacie znalazła by okres, który ją interesuje. Natomiast sortowanie po kategoriach umożliwi przeglądnięcie wpisów według konkretnego tematu
Ewentualnie można się też pokusić o sortowanie według tytułów wpisów

jestem w stanie wiele zrozumieć... rozumiem że ktoś niema poczucia koloru... zresztą ja też go nie mam, ale dlaczego ta strona jest akurat różowa. Miałeś do wyboru kolor tyle kolorów... mogłeś wybrać kolor ładny, brzydki, a Ty musiałeś akurat wybrać ten trzeci

Sazin sazian (up )jak masz stałe IP to podaj specjalnie dla Ciebie zrobię wersję czarno białą

PS. Moja żona zgadza się z Twoim komentarzem

wcale się nie obrażam za to "a"
oczywiście że mam stałe IP: 127.0.0.1

jeszcze garść drobnych uwag:
-obok lupki przydałby się pole do wpisywania bo tak to trochę nie wiem czy tak to miało być czy mi się coś zepsuło
-lupka ma brzydki hover i nie pasuje pasje to ujowego koloru tła
-to samo z hoverem napisu "Lekkie Blogowanie "
-w wersji en niema nic w "Popular Tags"
-w "Polecane" wywaliłbym to http:// i efekt przesunięcia przy hover

Na mobile :
- zdjęcia wychodzą za kontener np 5-przydatnych-paczek-dla-laravel-cz-1
- link “Back to top” dziwnie się zachowuje, najpierw pokazuje się kwadrat a po czasie strzałka

Podstrona Sitemap też daje radę.

Często tak mam, że gdy trafiam na jakiś wpis z wyszukiwarki to jak już jestem na nowo-zobaczonym blogu to chcę przejrzeć czy przypadkiem jeszcze tu jest coś ciekawego. Przeglądanie tylko za pomocą jednego przycisku po 10 wpisów na stronie powoduje, że po trzeciej przestaję.

Rzut okiem na "spis treści" jest bardzo pomocny.

A mi MEGA podoba się cała oprawa Żadnych uwag nie mam. Lekka, przyjemna dla oka i ładnie zpasowana z blogiem.

Powinieneś zostać frontem

@Forti nie strasz z tym frontem

Ostatnio trochę dodałem, trochę zmieniłem.

- Top poprawiony
- Dodany form kontaktowy
- Archiwum


Archiwum udało się chyba w miarę wygodnie zaprojektować. Różne pomysły były, ale po małej konsultacji z @nospor została taka wersja.

Dobra, pod presją w końcu zmieniłem kolory

Archiwum bardzo fajne, duży plus

Follow-UP.

• Obecna kolorystyka znacznie lepsza od poprzedniej.
• https://zblogowani.pl/code/160x50/silver/328491/btn.png ten obrazek byś mógł wgrać lokalnie, nie wczytało mi go na początku. (Chrome) Musiałem go otworzyć przez źródło strony, wejść pod ten link i zaakceptować ostrzeżenie o SSL - dopiero się wyświetla.
• Archiwum jest ok - właśnie czegoś takiego brakowało

BTW, W Angielskiej wersji w wyszukiwarce masz "Search" a w Polskiej "Wpisz frazę wyszukiwania" :-P

Ad kolorystyki to już mi kilka osób to powiedziało Ehh jak widać opór nie zawsze popłaca

Co do obrazka to dziwne.
Archiwum taa

Zostało z wczesnej wersji dev. Dzięki za uwagę Do poprawki.

Mały update.

Ostatnio poprawiłem kilka drobnych rzeczy:
- Poprawki w tłumaczeniach
- Zmieniłem Top na Responsive
- Dodałem trochę oddechu dla polecanych artykułów
- Zmniejszyłem trochę czcionki tytułowe dla małych urządzeń
- Dodałem raportowanie dla Sentry (PHP i JS)
- Odpalone GZip, HTTP2
- Część lib wywaliłem z lokalnego na rzecz CDN (jquery, bootstrap js)



Będę wdzięczny za uwagi czy coś, gdzieś się jeszcze sypie.
Cenne uwagi jeśli chodzi o urządzenia mobilne bo wersja na PC wydaje mi się ok.

Hm. Ten obrazek co pisałem nadal nie działa.
(Chrome 50, android 4.3*)
Gdy go otwieram pokazuję mi błąd z SSL że strona może być niebezpieczna.
I dopiero gdy tam go wyświetle ręcznie to pokazuję mi go na stronie.
___
Przy skryptach coś wolno chodzi scrollowanie (testowałem w prawo).
___
Trochę błędów przy przykładowym artykule w validatorze:
https://validator.w3.org/nu/?showsource=yes...-bez-phpunit%2F

M.in masz cudzysłów w cudzysłowiu.

jak dla mnie zbyt duza prostota ,
ale tak osobiscie lubie 1px podkreslenia linka i widoczną wyszukiwarke (~~examine me world), hoverovanie menu jako background hoverovany, ale to szczegol,
strona mi smiga nawet na xp z 1gh

chyba nie ta epoka kolego

@KsaR z tym obrazkiem to faktycznie lipa, i na pewno go przeniosę do siebie. Widocznie mają coś z cert pokićkane. Ad. błędów Validatora to szczerze przyznam że nie testowałem Zabrakło tam po prostu htmlspecialhars

Co do sryptów i scroll to w sumie nie wiem dla czego tak się dzieje. Przetestowałem u siebie na telefonie i faktycznie ciężko to chodzi. Używam PrismJS do tego i muszę się zastanowić jak to poprawić/zmienić.

@adam_per prostota właśnie była myślą przewodnią. Do do wyszukiwarki to może dodam jeszcze takie JSowe wysuwane żeby nie przechodzić do nowej strony.

Fajnie że strona dobrze działa na starym sprzęcie Cieszy mnie to.

[UPDATE 25-05-2016]

Dobra z nowych zmian to:
- Fixnąłem błędy W3C (został 1 ale ...)
- Fixnąłem obrazek, teraz serwuje go od siebie.
- Dodałem szukajkę po kliknięciu na "szukaj", Fallback oczywiście jest
- Dodałem Autocomplete do szukajki.
- Minifikacja HTML (ale coś nie do końca działa jakbym tego chciał)

i chyba jeszcze kilka mniejszych poprawek

Co sądzicie o tej szukajce? Trafione? (PS. na poewno autocomplete trochę do poprawki pod mobilnymi bo za małe się wydaje)

h1 nie pasuje w nav. Raczej bym ograniczył nav do samego menu w tym wypadku (czyli #lekkieblogowanie-menu).

To chyba po polsku

Bezsensowny [alt] - powinien być pusty.
Wyszukiwarce brakuje label (może być .sr-only).
Czy zastanawiałeś się nad Schema.org/Blog obok/zamiast mikroformatu hAtom?

kolorowanie kodu bym zmienił, jasna zmienna na szarym tle przy jasno ustawionym monitorze nieco się rozmywa

@Comandeer HTML ok do poprawki. Co do Schema to w sumie na początku myślałem o tym i skłaniam się ku temu. Ale mikroformaty nie są moimi mocnymi stronami

@LowiczakPL jakieś propozycje?
Ew. czy zna ktoś dobrą bibliotekę do kolorowania ? Obecne stoi PrismJS ale jak ktoś już zauważył jest problem w mobilnych przy przesuwaniu kodu (muli).

Ja używam https://highlightjs.org/ . Nie jest źle na mobilnych - tylko własny build dla języków które potrzebuję.

@viking z tego co widzę nadal nie ma numerowania linii

https://github.com/wcoder/highlightjs-line-numbers.js/

do tego jakiś ciemny styl jak monokai-sublime