• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Strona do oceny - pierwsze Portfolio

Cloud VPS
0 głosów
589 wizyt
pytanie zadane 23 lutego 2017 w Nasze projekty przez Skejtik Nowicjusz (140 p.)

Cześć, od jakiegoś czasu tworze już strony i postanowiłem postawić swoje pierwsze portfolio - wiem, że nie posiada przyjaznych adresów, etc. musze to poprawić, z resztą ciągle coś w niej poprawiam - zachęcam do przedstawienia mi swoich opinii :) Pozdrawiam

PORTFOLIO

2
komentarz 23 lutego 2017 przez szacho Gaduła (3,810 p.)
Podawanie wieku (tym bardziej młodego) ogranicza liczbę potencjalnych klientów - niestety, ale dla wielu osób wciąż jest to wyznacznik dojrzałości i doświadczenia
1
komentarz 23 lutego 2017 przez niezalogowany

 jest to wyznacznik dojrzałości i doświadczenia

imo ciężko się nie zgodzić

5 odpowiedzi

+3 głosów
odpowiedź 23 lutego 2017 przez Ivan Maniak (60,650 p.)
  • html[lang=pl] No OK, może się nie znam.
  • Potrafisz HTML5, a prawie w ogóle nie korzystasz z dobrodziejstw HTML5.
  • Według mnie za dużo div-ów, można by to w łatwy sposób skrócić.
  • Na "stronie głównej" nawigacja powinna być nawigacją. A już oczywistym faktem jest zrobienie z niej listy. No i do tego .main idealnie pasuje na tag main
  • I znów HTML5: nie zamykamy tagów nie wymagających zamknięcia />
  • No i ostatnie stricte związane z HTML5: span dla paragrafu? Opis w Skills idealnie pasuje jako paragraf. Najmniej odpowiednim tagiem jest span. Nawet div jest lepszy od tego span-a w tamtym miejscu.
  • Ikonki są nie dostępne. Polecam: Font Awesome Accessibility
  • Outline dokumentu nie istnieje.
  • Dlaczego usuwasz kropkę i wpisujesz '-' jak tekst w listach? Szkoda, że czytniki ekranowe są mądre i nie czytają jako "minus html5" (Sprawdzane na NVDA)
  • Podstrony nie mają swoich tytułów, unikalnych tytułów.
  • Liczbę requestów po style/skrypty można by skrócić co najmniej o połowę. Na pierwszy odstrzał idzie jeden z fontów. Możesz pobierać parę fontów w jednym requescie.
  • tabindex dla ikon po prawej stronie nawala. 
  • Pusty tag to smutny :( i bezużyteczny tag. Jak chcesz sobie dodać tło to zrób to za pomocą 1) pseudoklas w CSS-ie 2) dodaj ten tag z poziomu JS-a i odpowiednio go ukrywaj za każdym razem. Tak samo z liniami pod h2 w Skills
    <span id="bg"></span>
  • Pominę fakt, że ikonki ikonki oraz "Wik.G" mają słaby kontrast. Oj... jednak się nie udało. A no i jeszcze nawigacja ma za słaby kontrast
  • Nie lepiej wrzucić favicon-ke do głównego katalogu i nie martwić się o nią? Mogę się mylić, ale przeglądarki mogą wysyłać requesta pod ./favicon.ico nawet, gdy istnieje link[rel=icon], czyli masz jednego bezużytecznego requesta.
  • W tagach masz "portfolio webdesigner", a ani razu nie wspomniałeś o tym na stronie. Nie kłam Googla ;)
  • Oczywiście img[alt] nie ma opisu zdjęcia, ale to już klasyka :)
+1 głos
odpowiedź 23 lutego 2017 przez Damian11131 Stary wyjadacz (13,490 p.)
Całkiem niezła, podoba mi się.
+1 głos
odpowiedź 23 lutego 2017 przez xmentor Nałogowiec (49,520 p.)
<html lang="PL">

Strona jest w języku angielskim.

chrome=1

Chrome Frame, umarł.

Na podstronie index.html, masz 3 znaczniki h1, a powinien występować tylko jeden.

Pliki .js lepiej przenieść przed zakończeniem ciała dokumentu.

Fonty można pobrać jednym linkiem:

https://fonts.googleapis.com/css?family=Kanit:800,800i|Pangolin|Permanent+Marker

<span id="bg"></span>

Pusty element, który robi za tło. Lepiej użyć :before/:after

body .footie footer .zero .media a #git i

Cóż za potwór, lepiej zainwestować chwilę czasu by nauczyć się jakiejś metodologii nazewnictwa -  ułatwi stylowanie i kod będzie przejrzysty.

komentarz 24 lutego 2017 przez Skejtik Nowicjusz (140 p.)
strona pierwotnie jest pisana w SASSie :) stąd ten "potwór" dzięki za opinie!
+1 głos
odpowiedź 24 lutego 2017 przez niezalogowany

Podoba mi się ten retro-neonowy styl yes

Ciekawe animacje

Trochę pusto na stronie głównej

Elementy stopki mają za mały kontrast względem tła


<html lang="PL">

lang to w tym przypadku raczej en


<meta charset="UTF-8"/>

bez / na końcu - to nie XHTML


<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

Jedyną poprawną wartością dla content w tym przypadku to "IE=edge" Chrome frame

(btw http-equiv można z powodzeniem wysyłać jako nagłówki HTTP )


<meta name="keywords" content="portfolio, webdesign, front-end developer, front-end, webprogramming, portfolio webdesigner, portfolio">

Z keywordów możesz zrezygnować, google nie używa ich od wielu lat


Skrypty przerzuć na koniec strony - nie spowalniasz wtedy renderowania (w obecnym przypadku, przeglądarka musi poczekać aż ściągnie JSa - i dopiero ruszy dalej z parsowaniem)


<link href="https://fonts.googleapis.com/css?family=Permanent+Marker" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Kanit:800,800i" rel="stylesheet"> 
<link href="https://fonts.googleapis.com/css?family=Pangolin" rel="stylesheet">

fonty można załadować jednym requestem


<ul class="nav navbar-nav navbar-right navitiles">
    <a href="skills.html"><li class="active"><span>Skills</span></li></a>
    <a href="me.html"><li><span>Me</span></li></a>
    <a href="projects.html"><li><span>Projects</span></li></a>
</ul>

ul > li - takie ułożenie sprawia, że dana treść jest listą


<h1><i>How I create my stuff</i></h1>

<i> w tym miejscu to chyba nie najlepszy pomysł, po prostu użyj stylów dla h1


<div class="desc">
	<span>
		I'm an upcoming Front-End developer from Poland.<br>
		I specialize myself in doing modern Websites and Web Aplications based on many technologies such as AJAX etc.
		Here is some stuff I feel familiar with.
	</span>
</div>

To powinien być <p>aragraph


<ul>
    <li>-HTML5</li>
    <li>-CSS3</li>
    <li>-SASS</li>
    <li>-Bootstrap</li>
    <li>-Responsive</li>
    <li>-JavaScript</li>
    <li>-jQuery</li>
</ul>

Jeśli już musisz zastosować niestandardowe wypunktowanie - użyj pseudo-elementu ::before


<a target="_blank" href="https://codepen.io/WIKG/#">
   <span id="codepen">
       <i class="fa fa-codepen" aria-hidden="true"></i>
   </span>
</a> 

Link powinien mieć treść - chociażby ukrytą

target blank


Większości divów można się pozbyć


Tytuły stron powinny opisywać treść na stronie "co jest na stronie - nazwa strony" np "Projects - Wiktor Gała"

tytuły stron - ibb polecam


alt="pictureOfABoss"

po prostu "Picture of a Boss" - atrybut alt jest dla ludzi (w tym przypadku to chyba the Boss)


body .footie footer .zero .media a #codepen i:hover

Korzystając z "fluent english" - http://thesassway.com/beginner/the-inception-rule

Może warto by się zainteresować jakąś metodologią pisania CSSa? (np BEM)


Jeszcze to podrzucę -> http://internet-bez-barier.com/glowne-zasady-stosowania-naglowkow/


Aż się miło CRy robi, gdy strona ładnie wygląda : )

Powodzenia dalej

0 głosów
odpowiedź 23 lutego 2017 przez seba Dyskutant (8,900 p.)
W opisie siebie brakuję przecinków

Podobne pytania

+1 głos
2 odpowiedzi 446 wizyt
pytanie zadane 21 października 2016 w Nasze projekty przez kieryk123 Początkujący (300 p.)
+5 głosów
4 odpowiedzi 912 wizyt
pytanie zadane 17 października 2016 w Nasze projekty przez Sebastian Westfal Obywatel (1,020 p.)
0 głosów
3 odpowiedzi 547 wizyt
pytanie zadane 28 kwietnia 2016 w Nasze projekty przez gascoigne Nowicjusz (120 p.)

93,457 zapytań

142,452 odpowiedzi

322,722 komentarzy

62,837 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj

Kursy INF.02 i INF.03
...