Kommentarer på Taekwon-Do nettside

[MikkelRev]

Ønsker kommentarer på en Taekwon-Do side jeg holder på med. Innholdsmessig er den langt fra ferdig, og kommer antakelig aldri til å bli det heller. Ligger foreløpig mest i hovedmenyen på ITF også på Chon-Ji, Dan-Gun, Do-San, Won-Hyo, Yul-Gok og Toi-Gye.

 

Tanken er at alle kan registrere seg og bidra. Men ikke som Wikipedia, normale registrerte brukere har i motsetning til moderatorer ikke full tilgang til å adde og endre på alt.

 

Vurderer også et domene, taekwon.it og tkd-pedia.org har vært foreslått.

 

http://honefosstkd.freehostia.com/

[HauksA]

Rødfargen på de to T'ene ved "Dictionary" i den øverste fanen er ganske forstyrrende, gradienten under føler jeg er for stor (hvis du må ha gradient synes jeg den burde starte helt på toppen). Den "TaekwonIT!"-linken bør du også flytte et annet sted, da vil du ha en veldig ren og oversiktelig navigeringsfane. Jeg sitter på en seksti år gammel IE på denne pc'en, og siden funker ikke så bra her (ikke at du skal bry deg om det)

[MikkelRev]

Der sider du noe, burde lagt inn en autoban-funksjon for IE-brukere Den er best med en webkit browser (chrome/safari/rockmelt/flock). Gradienten vises ikke riktig i IE9 og ikke i det hele tatt i IE<9. Aner ikke hvor jeg ellers burde hatt tittellinjen. Har forøvrig endret dictionary-ikonet.

 

Forresten peiling hvordan jeg kan få amazonbaren til å flytte seg litt lenger til høyre, og gjøre den en anelse høyere og bredere? har prøvd å sette width og height på amazonbaren uten at det hjalp.

[MikkelRev]

Oi, sjekket nettsiden min på skolen med IE8 nå, og den fungerte jo ikke i det hele tatt!

 

Edit: har lagd varsel for IE<9-brukere med beskjed om å skifte til en skikkelig browser, eventuelt oppgradere. Tror ikke jeg kommer til å gidde å gjøre noe mer med den saken, foreløpig ihvertfall.

Endret 14. mars 2011 av MikkelRev

[emilkje]

Oi, sjekket nettsiden min på skolen med IE8 nå, og den fungerte jo ikke i det hele tatt!

 

Edit: har lagd varsel for IE<9-brukere med beskjed om å skifte til en skikkelig browser, eventuelt oppgradere. Tror ikke jeg kommer til å gidde å gjøre noe mer med den saken, foreløpig ihvertfall.

 

Det er fundamentalt feil å stenge ut brukere basert på nettleseren (bortsett fra IE6 - den skal ut). Det er greit at nettsiden degraderes diskret, men å stenge ut eller ikke ha en fungerende side for IE7 / 8 brukere er bare galt. Hva er det som ikke fungerer? Jeg har ikke win selv, men vil gjerne hjelpe med å fikse dette.

 

Hvis header animasjonen ikke fungerer så er vel det like greit. Vær VELDIG forsiktig med å bruke bevegelighet i et design. Det er en grunn til at «text-decoration: blink» ikke støttes av flere moderne nettlesere.

 

Du har også problemer med brukervennlighet. Da med tanke på følgende punkter:

1. Piler i menyen som symboliserer at det er en drop-down meny
   
2. Forferdelig lite lesbar typografi (overskrifter)
   
3. Uheldig plassering av menyelementer på høyre side. Folk med store skjermer vil få et problem med å finne disse.
   
4. "Logoen" forstyrrer en god del med dens bevegelige egenskaper.
   

 

Eksperimenter gjerne også med farger Taekwon-Do er mer spenstig enn dette håper jeg Hvis det er «det svarte beltet» du har basert deg på, så forstår jeg temaet, men dette kan utnyttes mer samt kombineres med andre elementer uten at det mister mening. Tvert imot.

 

EDIT: Typo

Endret 15. mars 2011 av emilkje

[MikkelRev]

Ang. IE<9: Jeg har kun prøvd den på en skole-PC med IE8. Der fungerte ingenting av ajax og jquery, og hele forsiden så ut som et totalt kaos. Javascript var enabled.

 

Headeranimasjonen (pkt 4) var bare noe gøy jeg la inn da jeg eksperimenterte litt med css3 Har med vilje lagt den kun på forsiden (index.php), for skjønte at det fort kunne bli formye da jeg hadde den på hver page refresh.

 

1. Hva er problemet med pilene? Det går også an å trykke på selve kategorinavnene, da kommer alle tilhørende sidene på en egen side.

2. Jo ser den... (selv om jeg selv har inge problemer med å lese det )tanken er å gi det en asiatisk "look n' feel".

3. Hmm... det har jeg ikke tenkt på, noen forslag?

 

 

Nei, har ikke basert meg på noen spesielle temaer, utenom at jeg vil at siden skal virke ryddig, pen og moderne, og gjerne litt sexy og asiatisk også Noen forslag?

[emilkje]

Ang. IE<9: Jeg har kun prøvd den på en skole-PC med IE8. Der fungerte ingenting av ajax og jquery, og hele forsiden så ut som et totalt kaos. Javascript var enabled.

 

Headeranimasjonen (pkt 4) var bare noe gøy jeg la inn da jeg eksperimenterte litt med css3 Har med vilje lagt den kun på forsiden (index.php), for skjønte at det fort kunne bli formye da jeg hadde den på hver page refresh.

 

1. Hva er problemet med pilene? Det går også an å trykke på selve kategorinavnene, da kommer alle tilhørende sidene på en egen side.

2. Jo ser den... (selv om jeg selv har inge problemer med å lese det )tanken er å gi det en asiatisk "look n' feel".

3. Hmm... det har jeg ikke tenkt på, noen forslag?

 

 

Nei, har ikke basert meg på noen spesielle temaer, utenom at jeg vil at siden skal virke ryddig, pen og moderne, og gjerne litt sexy og asiatisk også Noen forslag?

 

Når ingenting fungerer i en nettleser som fortsatt brukes (untatt IE6) så ringer det en bjelle om at noe er fryktelig feil. Jeg har ikke kikket på kildekoden og som sagt så har jeg ikke IE tilgjengelig, men ajax og basislayout fungere i alle nettlesere. Jeg kan komme tilbake til dette hvis du ikke finner ut av det.

 

Hver page refresh hadde tatt livet av meg ja, men synes fortsatt det er for mye selv for hovedsiden. Dette er jo en smakssak, men en liten tommelregel er at så lenge elementet / animasjonen ikke har noen reell funksjon i et design, så bør den heller ikke være der. "Less is more" - Robert Browning.

 

1. Problemet med pilene er at den antyder at noe skal dukke opp når brukeren holder musepekeren over. Det er ingen regel som sier dette, men snarere en konvensjon opparbeidet over år med UI design.

 

2. Emnebetonet typografi trenger ikke gå ut over lesbarhet. Det er en grunn til at enkelte fonter er gratis. Jeg skal ikke tvinge deg til å kjøpe en kommersiell font, men ting kommer skjeldent i pose og sekk.

 

3. Jeg ville plassert alt innholdet i en konteiner med fast bredde slik at innholdet ikke skaleres basert på brukerens skjermbredde. Dette hjelper deg også med å holde fast bredde på avsnitt. Jeg mener standarden for god lesbarhet er 72 ord +/- per linje. Dette er det noe uenigheter om, men en rimelig maksgrense bør være tilstede. Slik nettsiden din er nå så blir mange avsnitt kun én linje på større skjermer. Den svarte stripen kan godt skalere med nettleservinduet, men innholdet bør være fast (Det finnes så klart unntak til regelen - men disse inneholder som regel mye innhold).

 

Et annet alternativ vil være å la nettsiden skalere med vinduet til et visst punkt. Tips: css: max-width

 

Håper dette hjelper

[MikkelRev]

Tar en ting om gangen. Har nå satt hele innholdet minus topp og bunn i en wrapper på 900px bredde. På min 15,6" wide ser det helt feil ut, det er altfor trangt, spesielt på forsiden og Techniques-sider som feks http://honefosstkd.freehostia.com/page.php?pid=70&sid=163

Har jeg gjort noe feil i mitt forsøk?

[emilkje]

Grunnen til at alt ser så trangt ut er at alle elementer er over-dimensjonert. Mink størrelse og vekt på brødteksten (ikke ha bold / strong på hele brødteksten - da blir jo poenget med utheving borte), samt gi den mer luft mellom linjene. Når det gjelder høyremenyen så er den også i overkant stor.

 

Jobb litt med størrelsesforhold, så skal du se at den blir ikke så krampeaktig på en 15". Jeg har selv 15" og bruker nesten alltid 960 eller 1000 px i bredde, og har ingen problemer med dette.

 

Eksamen: http://skole.emilkjelsrud.com/webdesign_eksamen/

Endret 16. mars 2011 av emilkje

[MikkelRev]

Har nå skiftet font på h1-overskriften, men tviler på du synes den er noe mer leselig. Lastet ned fra dafont.com under asian look. Ingress-tekster pleier jo alltid å være med tykk skrift i blader? Har gjort skriften og høyremenyen hakket mindre, så nå ser forsiden ok ut med wrapperen. Bortsett fra på Techniques-sidene, der er det fortsatt veldig trangt. Kunne selvsagt løst det delvis med mindre bilde, men det strider litt mot prinsippet synes jeg. Kunne også flyttet teknikkbeskrivelsen (som nå er til høyre for bildet) under bildet, men synes det blir mindre oversiktlig. Ellers har jeg flyttet social ikonene og søkebaren opp i tittellinjen, uten at jeg er særlig overbevist, og har endret hovedmenyen fra click til hover.

Har prøvd med forskjellige bakgrunnsfarger på body, både faste og gradiente, men fant ingenting som traff.

 

Btw, her er gamle versjonen av nettsiden: http://moosul.freehostia.com/form.php?form_id=10&t=0&view=1&serie_id=1#teknikk

Endret 17. mars 2011 av MikkelRev

[MikkelRev]

Har nå pyntet litt mer på designet. Kommentarer?

Vet det er en del css-bugs her og der som jeg ikke har fått til å fikse ennå.

[Dimethyltryptamine]

bare en liten detalj, uansett hvor stor jeg gjør nettleseren så må jeg fremdeles scrolle.

 

[MikkelRev]

Vet, det er en av de mange css-bugs'ene jeg ikke har klart å bli kvitt. Klarer ikke få toppen til å strekke seg 100%. ul.topnav er satt til 97%, men setter jeg den til 100%, blir det bare enda bredere horisontal scrolling + et tomrom på høyre side.

[agrimsrud]

Problemer med horisontal scrolling kommer gjerne når man kombinerer width:100% med padding eller margin. Total bredde blir da mer enn 100% av nettleservinduet, som gir scrolling.

 

For din del gjelder dette .topnav og .headertitle. I stedet for å sette padding på elementer med 100%, kan man sette margin på elementer under dette. Prøv noe sånt som:

 

ul.topnav{width:100%;padding:0;}

ul.topnav:first-child{margin-left:40px;}

 

div.headertitle{width:100%;padding:0;}

div.headertitle:first-child{margin-left:10px;}

 

Når det er sagt, så synes jeg du kan jobbe litt mer med typografi og plassering av elementer. Forsiden virker litt tilfeldig komponert. Bra med innledning ("All about techniques, history..."), men denne kan kanskje utheves og gjøres mer sentrert og synlig?

 

Fin bruk av @font-face, og kudos for semantisk og gyldig HTML5!

[MikkelRev]

Tusen takk, tipset ditt funket som bare det (med et par modifikasjoner)! Har også uthevet innledningsteksten på forsiden, linet up teksten litt mer og endret kalender-ikonet til en ikke bare viser riktig dato en gang i året . Tja, synes fremdeles det kan se litt rotete ut, men vet ikke. Fant også ut at det kanskje ikke er lurt å bruke en 100% stretch-bakgrunn, siden mange browsere ikke støtter det. Ut av andre bugs jeg har:

 

1. Jeg finner meg selv stadig i å finjustere på posisjonen til trekantene i 3D ribbon-headeren, fordi enkelte browsere flytter de litt ned eller litt bort. Bruker nå Ubuntu, og de er velplasserte i Firefox 3.6, men i Chromium 10 er de en anelse for langt nede.

2. Social iconene oppe i høyre hjørne vises hvis du går inn på en side, feks http://honefosstkd.freehostia.com/page.php?pid=20&sid=2, men forsvinner på forsiden.

3. Et digert intet under footeren på sider i Chromium, feks hvis du klikker på linken i pkt.2 og scroller helt ned under footeren, kommer det et stort tomrom.

4. blockquote:before og :after funker ikke i Chromium (sjekk feks forsiden, der skal det være noen store hermetegn foran og bak teksten).

5. I References-listen, kommer "1."-bulletten på høyre side istedetfor til venstre foran teksten i Chromium. Se f.eks. http://honefosstkd.freehostia.com/page.php?pid=72&sid=231#231

Endret 27. mars 2011 av MikkelRev

[Dimethyltryptamine]

bakgrunnen oppfører seg rart når jeg bruker menyen

 

http://www.youtube.com/watch?v=qUhblLii-OM

[MikkelRev]

bra observasjon, den effekten skjedde nemlig kun i noen browsere. Har prøvd å finne en ny bakgrunn, men klarer ikke bestemme meg, så la like godt inn en feature i footeren så brukeren selv kan velge. Eneste jeg må bestemme er hva jeg skal ha som default.

[Thomas.]

Bakgrunnen du har nå er i hvertfall helt forferdelig. Er du nøtt til å ha sånne mønster? Hva med å prøve en ren farge isteden? Blir fort mye ryddigere.

Ellers var siden din rotete, ikke tiltrekkende og vanskelig å navigere på.

 

Hvorfor skal folk gidde registrere seg å bruke din side, når dem kan bruke wikipedia uten å registrere seg?

[Dimethyltryptamine]

 

tomrom under footer.

 

"last updated" litt rart plassert.

 

 

google chrome 12.0.712.0 dev

Endret 27. mars 2011 av lordbost

[MikkelRev]

Sånn, nå tror jeg footer og bakgrunn skal være i orden.

 

@Thomas, setter pris på tilbakemelding, men istedetfor å bare si at siden min er stygg og dårlig, hadde det hjulpet om du hadde konkretisert litt mer og gjerne kommet med tips til forbedringer. Wikipedia har et veldig annet formål, bruksområde og brukergruppe enn denne siden.