Keskustelu: Nettisivujen teko: Mielipiteitä? SounsChilds uutta leiskaa

Moi,

Täällä jonkin verran kommetointiin taannoin SoundChilds nimisen portaalin käyttäjäliittymää ja leiskaa. Nyt on yritetty leiskaa parannella, ja vedos on nähtävissä tässä: http://www.soundchilds.net/index_v2.php, joka on varsinaisen etusivun luonnos Näillä näkymin alakulmiin tulee vielä pyöristykset biisilista ja storen listaukset puuttuvat. Tuo sivu on toistaiseksi lähes ainoa uudella koodilla.

Koska alkuperäinen aiheeseen liittyvä keskusteluavaus on käsittääkseni jo suljettu, ajattelin pistää uuden postin. Kiitos jo etukäteen kommenteista, mieleipiteistä ja parannusehdotuksista.

-Mika aka SC

En nyt tiedä mista tässä on kyse, mutta ensimmäiseksi mieleen tulee mainossivun vaikutelma johon eksytään vahingossa... :|

Onhan tuo periaateessa ihan jees, mutta pari asiaa pistää silmään pahemmin kuin tuhat neulaa:

- Sivu tuntuu sortuvan samaan kuin amöriikkalaiset megaportaalit: Etusivu sullotaan täyteen linkkejä ja värikkäitä kuvia, jolloin käyttäjä ei pysty hahmottamaan kokonaisuutta ja hämmentyy. Ainakin itselläni iski heti mielikuva välkkyvästä ja ärsyttävästä popup-sivusta.

- Mainokset voisi heittää pois. Mielestäni ne vain lisäävät sivun yleistä sekaisuutta. Ja kannattaa harkita, onko niistä loppujen lopuksi niin suurta taloudellista hyötyä?

- Miksi HTML-koodin keskeltä löytyy doctype-määrittely ja toinen html-tagi? Muutenkin koodi tuntuu hedelmäsalaatilta johon on sekoitettu raakaa lihaa.

Mazuli kirjoitti:

En nyt tiedä mista tässä on kyse, mutta ensimmäiseksi mieleen tulee mainossivun vaikutelma johon eksytään vahingossa... :|

Itse asiassa näin onkin:) Kyseessä on siis ennen kaikkea indiemusan levittämistä varten ajateltu portaali ja tuo sivu on domainin uusi indeksisivu ja siis tarkoitettu ennekaikkea satunnaisesti sivulle tulevalle vierailijalle.

Käytännössä portaalia useammin luekava varmaan merkkaa oman sivunsa tai esim. forumin sivun kirjamerkkeihinsä. Huom! Muut sivut ovat käytännössä edelleen lähes kaikki "vanhan leiskan" mukaisia joka oli sivulla käyneiden suuren enemmistön mielestä liian räikeä väreiltään ja aivan mahdoton navigoitava, joten niistä ei sen enempää. Ajatukseni oli yrittää saada tämä vedossivu ensin hyväksi ja soveltaa sen leiskaa sitten muualle.

Turatzuro kirjoitti:

Onhan tuo periaateessa ihan jees, mutta pari asiaa pistää silmään pahemmin kuin tuhat neulaa:

- Sivu tuntuu sortuvan samaan kuin amöriikkalaiset megaportaalit: Etusivu sullotaan täyteen linkkejä ja värikkäitä kuvia, jolloin käyttäjä ei pysty hahmottamaan kokonaisuutta ja hämmentyy. Ainakin itselläni iski heti mielikuva välkkyvästä ja ärsyttävästä popup-sivusta.

- Mainokset voisi heittää pois. Mielestäni ne vain lisäävät sivun yleistä sekaisuutta. Ja kannattaa harkita, onko niistä loppujen lopuksi niin suurta taloudellista hyötyä?

- Miksi HTML-koodin keskeltä löytyy doctype-määrittely ja toinen html-tagi? Muutenkin koodi tuntuu hedelmäsalaatilta johon on sekoitettu raakaa lihaa.

Miten itse yksikertaistaisit(te) ja tehostaisit(te) navigointia/ulkoasua? Täytyy harkita noita Adsense -mainoksia vielä.

Koodissa on tosiaan vielä karsittavaa. Kiitos noista huomioista.

Ja kiitos kummallekin kommentista
-Mika

No tarkoitin lähinnä sivuja, joihin eksyy kun vaikka kirjoittaa domainin jota ei ole olemassa jne...
Mutta kiitos selvennyksestä..

Ah, tykkää :) Sen kummemmin tutkimatta ja tarkastelematta ensivaikutelma on erittäin hieno.

Ulkonäkö on ihan OK, siinä missä firmojen sivuillakin. Ei liikaa turhaa tavaraa eikä rumaa taustakuvaa, hyvä :)

HTML kaipaa siistintää ja validointia. Et voi includettaa kokonaista HTML-sivua keskelle kaikkea. Lisäksi jotkin CSS-linkitykset ovat pielessä.

CSS-validaattori huutaa punaisena tuhatta ja sataa virhettä ja varoitusta. Scrollbarit olisi minusta hyvä jättää rauhaan (nehän eivät useimmissa selaimissa edes muutu, kun eivät standardiin kuulu, eli sitä suuremmalla syyllä).

Lisäksi, kun kerran käytät CSS:ää, niin käytä sitä myös taittoon. Taulukot pois, skaalautuvuutta lisää. Ei taida pysyä vaakascrolli piilossa 800x600-resoluutiolla.

Edelliseen SoundChildsin versioon nähden parannukset on valtavat käytettävyyden kannalta. Nyt tuolta sivulta selviää mitä tuolla sivulla on ja miten siellä seikkaillaan.

Aikaisemmin mainitut mainokset ei juurikaan haittaa nuo googlen mainokset sen verran kevyitä ja selkeitä tuossa lopussa. No olihan tuossa alussakin näköjään mainos, jota aluksia luulin kuuluvan otsakkeeseen, mutta eipä sekään nyt niin karmeasti haittaa, vaikka nyt kiva olekkaan.

Mukava saada lukea että ulkoasu ja peruskäytettävyys näyttää nyt paremmin onnistuneelta. Alkuperäisessä hain retrohenkistä leikkimielisyyttä (mutta ilmeisesti tuli lyötyä aika pahasti yli:D).

Puhtaaseen css -taittoon olisi kyllä mielenkiintoa, mutten tiedä riittävätkö rahkeet osaamisen suhteen. Pitää vähän tutkia. Onko kellään tiedossa hyviä linkkejä, joilla selvennetään esim asemointiin liittyvää css:aa?

Kiitos taas kommenteista.
-Mika

Linkkejä ei taida olla, mutta Jukka K. Korpelan CSS-tyylit kirjasta voisi olla apua. ISBN: 951-846-195-3

-Logo kelpaa sellaisenaan, turha ruveta vaihtelemaan sitä javascriptillä

-Mitä järkeä on laittaa iframeen mainos, joka sisältää vain kuvan ja linkin!
-Javascriptia saa kirjoittaa virheettömästikin
-Kokonaista html-sivua ei edelleenkään pitäisi liittää keskelle sivua
-Validaattorien käyttäminen on sallittua:

http://jigsaw.w3.org/css-validator/validator?uri=http://www.soundchilds.net/index_v2.php&usermedium=all
http://validator.w3.org/check?uri=http://www.soundchilds.net/index_v2.php

Mihin tarvitaan näin montaa meta-tagia (ja miksi ne ovat isolla ja kaikki muut tagit pienellä):

<META HTTP-EQUIV="CONTENT-TYPE" CONTENT="text/html; charset=iso-8859-1">
<META NAME="DESCRIPTION" CONTENT="BUY-PROMOTE-SELL mp3, multimedia, software and related stuff at SoundChilds. SoundChilds is an e-shopping and marketing portal for distributing cool stuff related to a modern life style. 6500+ product categories. Originally developed and setup by Mr. Mika Kotikoski (MikaK). [Note Also: Sound Childs, SoundChildren and Sound Children]">
<META NAME="KEYWORDS" CONTENT="SoundChilds, Music, Mp3, Multimedia, MfLI, MikaK, Mika Kotikoski, Indie, Artist, Sound Child, Sound Children, SoundChildren, Sound Childs, Charts, Loud Lounge, Forum, Network, Promo, Revolution, Marketing, Mlm, work home business opportunity, Online Store, Shop, Paypal, IPN, Payment Gateway, Electronic Payment, Digital Distribution, Drm, Teens, MTV, Rolling Stone, Billboard, Future Music, Computer Music, Clubs, Concerts, Mix, Remix, Dj, Rap, Dance, House, Hip Hop, Breakbeats, Trance, Electronic, Soul, Rock, Jazz, Classic, Computer, PC, Mac, Game, Coppa, Parental Advisory, Adult, Sex, Erotic">
<META NAME="ROBOTS" CONTENT="INDEX, NOFOLLOW">
<META NAME="ALLOW-SEARCH" CONTENT="Yes">
<META NAME="REVISIT-AFTER" CONTENT="7 days">
<META NAME="COPYRIGHT" CONTENT="Rights reserved by SoundChilds - www.soundchilds.net">
<META NAME="PAGE-TOPIC" CONTENT="BUY-PROMOTE-SELL mp3, multimedia, software and related stuff at SoundChilds. SoundChilds is an e-shopping and marketing portal for distributing cool stuff related to a modern life style. 6500+ product categories. Originally developed and setup by Mr. Mika Kotikoski (MikaK). [Note Also: Sound Childs, SoundChildren and Sound Children]">
<META NAME="AUDIENCE" CONTENT="All">
<META HTTP-EQUIV="CONTENT-LANGUAGE" CONTENT="English">
<META NAME="DISTRIBUTION" CONTENT="Global">
<META NAME="RATING" CONTENT="Safe for kids by COPPA">

<META NAME="AUTHOR" CONTENT="SoundChilds">
<META NAME="PUBLISHER" CONTENT="SoundChilds">
<META NAME="PAGE-TYPE" CONTENT="Music and multimedia by SoundChilds. SoundChilds is a mp3 and multimedia hosting and marketing portal originally developed and setup by MfLI aka Mr. Mika Kotikoski (MikaK). [Note Also: Sound Childs, SoundChildren and Sound Children]">
<META NAME="SEARCHTITLE"  CONTENT="Music and multimedia by SoundChilds. SoundChilds is a mp3 and multimedia hosting and marketing portal originally developed and setup by MfLI aka Mr. Mika Kotikoski (MikaK). [Note Also: Sound Childs, SoundChildren and Sound Children]">
<META NAME="ABSTRACT" CONTENT="Music and multimedia by SoundChilds. SoundChilds is a mp3 and multimedia hosting and marketing portal originally developed and setup by MfLI aka Mr. Mika Kotikoski (MikaK). [Note Also: Sound Childs, SoundChildren and Sound Children]">

EDIT: Nostetaan vielä esille meta-tageista löytyvät sanat, mm. Adult, Sex, Erotic

Kiitos kirjavinkistä "panttu". Ja "ville-v": Kiitos validaattori -linkeistä. kunhan saan tuon ulkoasun aivan viimeistellyksi, tsekkaan millaisen tuloksen validiointi antaa.

-Mika

Itse siistisin meta-tagit tähän muotoon:

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<meta name="description" content="BUY-PROMOTE-SELL mp3, multimedia, software and related stuff at SoundChilds. SoundChilds is an e-shopping and marketing portal for distributing cool stuff related to a modern life style. [Note Also: Sound Childs, SoundChildren and Sound Children]" />
<meta name="keywords" content="SoundChilds, Mika Kotikoski, Sound Child, Sound Children, SoundChildren, Sound Childs" />

<meta name="robots" content="index, nofollow" />
<meta name="revisit-after" content="7 days" />

<meta name="author" content="SoundChilds" />
<meta name="copyright" content="Rights reserved by SoundChilds - www.soundchilds.net" />

SoundChilds kirjoitti:

Kyseessä on siis ennen kaikkea indiemusan levittämistä varten ajateltu portaali

keywords-megatagi kirjoitti:

Computer, PC, Mac, Game, Coppa, Parental Advisory, Adult, Sex, Erotic

Mielenkiintoista. Itse en näe näiden välillä niinkään suurta yhteyttä.

Joskus kirjastossa luin tuollaista pientä sivut esille kirjaa, joka käsitteli miten omat kotisivut saa parhaiten esille nettiin, niin siinä oli maininta, että useat hakukoneet antaa miinuksia, jos hakusanoja on meta tageissa liikaa. Kirjassa suositeltiin max. 7 hakusanaa. Lisäksi sivut saa miinusta huonoista hakusanoista kuten sex ja adult.

Toisekseen esim. Google ei lue noita tietoja ollenkaan, vaan kaikki sanat joilla tietoa etsitään pitäisi olla body tagien välissä.

Lisäski myös tekijän oikeus ilmoitukset kannattaa laittaa esille sivuun eikä metaan, koska harvapa niitä sieltä lukee, eli ei kukaan.

Kannattaisiko karsia tuollaiset wnb-hakusanat pois ennenkuin tulet kyselemään mielipidettä? Aika no-lifeä ja epätoivoista mainostusta laittaa yleisimmät hakusanat listalle. Oletko ajatellut, että joku filtteri voi mahdollisesti (en tiedä, enkä ole tutustunut moisten toimintaan) blokkia sivustosi, koska siinä on "mustalla listalla" olevia sanoja?

Suosittelen CSS taittoa ja skaalautuvuutta eri selainkoille ja resoluutioille, koska tuo kusee varmasti jos ikkunaa hieman pienentää. Muuten nämä ovat mukavat käyttää, vaikka kenties jotain räväkkyyttä voisi sivuille kehitellä lisää? 75% sivuista kun käyttää harmaasävyjä. Joku graafinen kuva vasempaan reunaan, se näyttää tyhjältä ja sivusto vaatii hieman vielä jotain pehmeää graafisuutta.

Ok. Varmaan pelkkää asiaa noihin meta-tageihin liittyen - nyt siistitty "ville-v":n ehdotuksen suuntaan.

Sivujen räväkkyydestä. Itse toivon, että chartsien ja kaupan datan lisääminen tuo tarvittavaa lisäväriä.

Kiitokset jälleen kommenteista!
-Mika

Ok... Chartsien esitysideaa olen nyt saanut luonnosteltua ja noita voi tarkastella etusivun luonnoksessa http://www.soundchilds.net/index_v2.php

Kommentit ovat edelleen erittäin tervetulleita. Kiitos jo etukäteen.

-Mika

Pikakatsaus:

+ Ulkoasun suhteen kehitys alkuperäiseen on huomattava.
+ Navigointi on nyt selkeää ja sivuille saapuessa pystyy samantien hahmottamaan sivujen tarkoituksen.
- sivut ei skaalaudu

Kiitos kommentistasi, "ajv".

Omasta mielestäni skaalautuvuus on kaksiteräinen juttu. Skaalautuva sivu istuu *kokonaisuutena* erikokoisille ruuduille ja resoluutioille paremmin. Toisaalta olen huomannut, että rivinkin/sarakkeeknkin muutos esim. linkin sijainnissa sekoittaa melko monia lukijoita. Myös itse luen mielummin "fixed" sivuja.

-Mika