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

Strona do oceny - pierwsze Portfolio

VPS Starter Arubacloud
0 głosów
464 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 354 wizyt
pytanie zadane 21 października 2016 w Nasze projekty przez kieryk123 Początkujący (300 p.)
+5 głosów
4 odpowiedzi 630 wizyt
pytanie zadane 17 października 2016 w Nasze projekty przez Sebastian Westfal Obywatel (1,020 p.)
0 głosów
3 odpowiedzi 400 wizyt
pytanie zadane 28 kwietnia 2016 w Nasze projekty przez gascoigne Nowicjusz (120 p.)

92,451 zapytań

141,261 odpowiedzi

319,073 komentarzy

61,853 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.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...