FinWebDesign :.: PHP projektini

[alker]

Moro, olen väsäillyt tässä parisen kuukautta PHP projektiani FinWebDesigniä.

Idea:
Idea tuli kaverilta, joka etsiskeli paikkaa mistä löytäisi Suomalaisten tekemiä sivupohjia. Kerroin hänelle pari sivua mistä löytää.(esim. Hemiplace.com) Mutta hänen mielestään joku voisi tehdä sellaiseen missä olisi paljon sivupohjia ilman että kiertelesi ympäri WWW:eetä.(INTERNET) Siitä se idea sitten lähti.
Ideana on Suomalaisten tekemiä sivupohjia lisätä yhteenpaikkaan.

Toteutus:
Toteutus tuli tehtyä pala palalta. Ihan kun kokaisin isoa piparkakku taloa todella pienillä pipareilla. Tällä hetkellä piparkakku on jo 80% tehty. Toteutin projektin ilman sivupohjien muokkausta ja paskalla sivupohjalla. Myöhemmin sivustolle on tullut pieniä päivityksiä joista kerron blogissani.

Tervetuloa testaamaan systeemiä!
http://finwebdesign.dy.fi/
Ps. Jossain vaiheessa hankin domainin.
Ja sivupohjia ei ole vielä kauheasti sivustolla! Niitä nyt vain lisäämään.
PsEND

[temu92]

Lukijat, suosittelen käymään täällä ensin: http://www.ohjelmointiputka.net/keskust ... 631&sivu=1

[TheDuck]

Jotkut eivät sitten opi ikinä. Tämähän on se vanha, tietoturvattomaksi todettu roskaläjäsi, jossa on vain uusi vielä paskempi ulkoasu. Btw, sain monestakin kohtaa syötettyä koodia sivulle ja mitään pituuksia ei näy olevan rajoitettu (kts. etusivu)

EDIT: ja btw se on design, ei desing

[alker]

Jotkut eivät sitten opi ikinä. Tämähän on se vanha, tietoturvattomaksi todettu roskaläjäsi, jossa on vain uusi vielä paskempi ulkoasu. Btw, sain monestakin kohtaa syötettyä koodia sivulle ja mitään pituuksia ei näy olevan rajoitettu (kts. etusivu)

EDIT: ja btw se on design, ei desing

Lol? Hah nyt repes.. AIka hienoo koodia sulla.. AAAAAAAAAAAAAAAAAAAA

[TheDuck]

Hmm? Millehän repeilet, sillekkö että sivustosi sallii pirun pitkät merkkijonot? Ja koodilla en toki tarkoittanut tuota...

[alker]

Hmm? Millehän repeilet, sillekkö että sivustosi sallii pirun pitkät merkkijonot? Ja koodilla en toki tarkoittanut tuota...

Noniin... Tadaa voin hyväksyä sen sun "sivupohjan" tai en. Valitsen en . Eli nykyään ei suoraan mene nuo jutut.

[Pettis]

Sivupohjien laatu ei mielestäni ainakaan vielä kovin kummoinen ole, enkä välttämättä lähtisi ylistämään itse sivupohjasivustonkaan ulkoasua. Perus-leiska kuitenkin ja täyttää asiansa.

Kiinnittäisin kuitenkin huomiota siihen, että esimerkiksi esikatselukuvat voisivat olla eri kuvia (pienempiä) kuin suuremmat esikatselukuvat ja ne taas vielä erit kuin alkuperäinen. Ihan vain sen vuoksi, että mielestäni kuvien skaalaaminen selaimessa ei ole fiksua. Eikä eri muotoisten kuvien skaalaaminen samaan muotoon / kokoon tee niistä yhtään sen parempia.

Mielestäni iFramen käyttäminen tuossa kommentointisysteemissä ei myöskään ole järkevää, sillä se ei taida skaalautua pystysuunnassa mikäli kommentteja tulee lisää. Erilliset pienemmät pyöriteltävät laatikot sivustoilla ovat mielestäni ärsyttäviä. Koittaisin myös saada ulkoasun venymään pystysuunnassa ja olemaan vain tarpeellisen pitkä.

Osa sivuista on kohtuu tyhjän näköisiä. Kannattaa miettiä, että tarviiko kaikki oman sivunsa, vai voiko niitä yhdistellä. MIkäli ei voi yhdistellä, niin kannattaa miettiä että miten sivuista sais vähemmän tyhjän näköisiä. Blogissa esimerkiksi lyhyt tekstin pätkä kirjoituksesta voisi olla ihan hyvä ajatus.

Suoraa tekstiä, mutta kerroinkin vain oman mielipiteeni. Mukavaa, että kiinnostusta web-projekteihin löytyy ja olet ilmeisesti tuota tehdessä oppinut kivasti asioita. Toivottavasti sivustolla olleet tietoturvaongelmatkin on nytten historiaa. Jää nähtäväksi, että kuinka suosittu ja pitkäikäinen sivustostasi tulee.

[alker]

Sivupohjien laatu ei mielestäni ainakaan vielä kovin kummoinen ole, enkä välttämättä lähtisi ylistämään itse sivupohjasivustonkaan ulkoasua. Perus-leiska kuitenkin ja täyttää asiansa.

Kiinnittäisin kuitenkin huomiota siihen, että esimerkiksi esikatselukuvat voisivat olla eri kuvia (pienempiä) kuin suuremmat esikatselukuvat ja ne taas vielä erit kuin alkuperäinen. Ihan vain sen vuoksi, että mielestäni kuvien skaalaaminen selaimessa ei ole fiksua. Eikä eri muotoisten kuvien skaalaaminen samaan muotoon / kokoon tee niistä yhtään sen parempia.

Mielestäni iFramen käyttäminen tuossa kommentointisysteemissä ei myöskään ole järkevää, sillä se ei taida skaalautua pystysuunnassa mikäli kommentteja tulee lisää. Erilliset pienemmät pyöriteltävät laatikot sivustoilla ovat mielestäni ärsyttäviä. Koittaisin myös saada ulkoasun venymään pystysuunnassa ja olemaan vain tarpeellisen pitkä.

Osa sivuista on kohtuu tyhjän näköisiä. Kannattaa miettiä, että tarviiko kaikki oman sivunsa, vai voiko niitä yhdistellä. MIkäli ei voi yhdistellä, niin kannattaa miettiä että miten sivuista sais vähemmän tyhjän näköisiä. Blogissa esimerkiksi lyhyt tekstin pätkä kirjoituksesta voisi olla ihan hyvä ajatus.

Suoraa tekstiä, mutta kerroinkin vain oman mielipiteeni. Mukavaa, että kiinnostusta web-projekteihin löytyy ja olet ilmeisesti tuota tehdessä oppinut kivasti asioita. Toivottavasti sivustolla olleet tietoturvaongelmatkin on nytten historiaa. Jää nähtäväksi, että kuinka suosittu ja pitkäikäinen sivustostasi tulee.

HUH! Miten jaksat kirjotella noin paljon Sivupohjia sinne haluaisinkin. Missä muualla olet nähnyt tyhjää kun blogissa. Auttaa vaan hitosti nuo kun kertoo että missä ongelmia löytyy Joo tuo iFrame on tällä hetkellä aika pikainen valinta. Myöhemmin häviää toi iFrame

[esa94]

Hmm? Millehän repeilet, sillekkö että sivustosi sallii pirun pitkät merkkijonot? Ja koodilla en toki tarkoittanut tuota...

Noniin... Tadaa voin hyväksyä sen sun "sivupohjan" tai en. Valitsen en . Eli nykyään ei suoraan mene nuo jutut.

TheDuck löysi sivuilta ainakin yhden potentiaalisen javascript-injektiomahdollisuuden kun sitä pikaisesti tutkimme.

Lisätutkiskelulla voisi löytyä muutakin. Enkä testannut sitä edellistä vielä kunnolla.

[alker]

Hmm? Millehän repeilet, sillekkö että sivustosi sallii pirun pitkät merkkijonot? Ja koodilla en toki tarkoittanut tuota...

Noniin... Tadaa voin hyväksyä sen sun "sivupohjan" tai en. Valitsen en . Eli nykyään ei suoraan mene nuo jutut.

TheDuck löysi sivuilta ainakin yhden potentiaalisen javascript-injektiomahdollisuuden kun sitä pikaisesti tutkimme.

Lisätutkiskelulla voisi löytyä muutakin. Enkä testannut sitä edellistä vielä kunnolla.

Oliko se tuo Email? Jos oli niin ei oo se koodi toiminu ollenkaan

[esa94]

Oliko se tuo Email? Jos oli niin ei oo se koodi toiminu ollenkaan

Puhu välillä niin, että siitä saa selvää o_O

[Astigma]

Nyt loppuu tämä. Jos vielä homma jatkuu tällaisena, niin ketju menee lukkoon. Asiallista palautetta saa antaa, mutta asiattomat viestit johtavat banneihin foorumeilta.

[alker]

*** TIETOTURVA RISKIT ***
Eli ilmoitelkaapas tietoturva riskejä sivustolta. Näin minun työni helpottuisi ja saisin enemmän aikaa virheiden korjaamiseen. Ilmoitelkaa niitä pois!
-Alker

[alker]

Uusi leiska tullut sivustolle. Toivottavasti pidätte.

[Zero]

Taidat olla Firefox-käyttäjä?
Leiskasi räjähti kun kokeilin Operan ja IE:n uusimmilla versioilla, mutta Firefoxilla näkyy oikein.



Validaattori palauttu 14 virhettä.

[alker]

Taidat olla Firefox-käyttäjä?
Leiskasi räjähti kun kokeilin Operan ja IE:n uusimmilla versioilla, mutta Firefoxilla näkyy oikein.

[KUVA]

Validaattori palauttu 14 virhettä.

hmm... huomasin saman... Pitää keksiä eri tyyli tuota käytäessäni...
Edit:Koskaan kone ei voi tietää onko sivusto oikein vai väärin. Ja tuo validaattori ei kerro kaikkia oikeita tyylejä
Edit2: Muokkasin sivupohjaa niin, että toimii oikein firefoxilla ja ie:llä ... Vaikka leiska on erillainen niin sen pitäisi toimia oikein..

[Koodiapina]

Koskaan kone ei voi tietää onko sivusto oikein vai väärin.

Siksi kannattaakin kirjoittaa virheetöntä koodia, tosin sekään ei aina varmista tukea kaikille selaimille. Nähdäkseni homma perustuu varsinaisen virheettömyyden lisäksi myös tiettyjen ongelmakohtien välttämiseen, lähinnä CSS-koodissa, jossa jotkin merkinnät saatetaan ymmärtää eri tavalla. Nykyselaimet osaavat lukea (X)HTML:n oikein pienistä virheistä huolimatta.

Ja tuo validaattori ei kerro kaikkia oikeita tyylejä

Ei validaattori arvostele sivupohjasi hienoutta, vaan kertoo onko sen koodissa virheitä

[Henkru]

Avasimpa nyt sivusi lähdekoodin ja katsoin mitä se oli syönnyt. Muutama kohta osui silmään, mitä toivon että korjaisit.

1. <br> tagia ei tule käyttää tilansaamiseen/venyttämiseen.

Code: Select all

<br/>
<br/>
<br/>
<br/>
...
<br/>

2. <br/> ei ole validia
Olet kyllä oikeassa siinä että lyhyetä elementit pitää lopettaa, mutta ennen /-merkkiä tulee väli.

Code: Select all

<br />
<img />
jne

3. Doctype puuttuu
Tarkoituksesi on näköjään XHTML:llää kirjottaa. XHTML-dokumentin pitää alkaa XML määrittelyllä, jonka jälkeen tulee DOCTYPE-määrittely.
Esim.

Code: Select all

<?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

ja html tagi on muotoa

Code: Select all

<html xmlns="http://www.w3.org/1999/xhtml">

4. <center>-tagia ei ole määritelty XHTML:ssä
Keskittämiseen kannattaa käyttää CSS:sää.
Elementin keskitys:

Code: Select all

margin-left: auto;
margin-right: auto;
(pituus pitää olla määritelty)

Tekstinkeskitys:

Code: Select all

text-align: center;

5. <link>-tagi kuuluu <head>-tagin sisään

Code: Select all

<head>
    <title>Sivu</title>
    <link rel="stylesheet" type="text/css" href="theme.css" />
</head>

6. Sisimmät tagit pitää sulkea aina enen ulompaa

Code: Select all

<div>
  <p>
    Jipikajei
    <a href="#">#</a>
  </p>
</div>

Ulkoasuseikkoja
-Teksti ei kannata olla heti elementin reunassa kiini. Vaikka esim. 3-5px rakoa. Katso CSS:n padding.
-"Kuusi uusinta sivupohjaa" kohdassa myös hiukan rakoa sivupohjien reunoille.
-Mitä h*lv. Sivun korkeus hipoo pilviä vaikka mitään sisältöä ei ole. <br> tageja enemmän, kun laki sallii.
-Jokaista lausetta ei tarvitse laittaa omalel riville. Näyttää hölmöltä.
-Iframe ei ole suotavaa.
-Esikatselu thumb kuvia voisi hiukan miettiä, Nyt ne ovat aika rumat IMO.
-Valkoinen tausta ja musta teksti toimii, mutta hiukan loppuun kulutettu IMO.

Käytettävyysseikkoja

1. Rekisteröytymis-sivu
-Jos jokin tiedoista on väärin olisi suotavaa, että virheilmoitus näkyy samalla sivulla (mieluiten kyseisen tekstikentän kohdalla) ja jo syötetyt oikeat tiedot eivät häviäisi. Sama myös kirjautumisen kanssa.
2. Sivupohjat
-Sivupohjien selaaminen on hiukan tökkivää.

Sekalaista
-Mielestäni tuo vaihdot on aika turha, jos joku noista oikeasti tykkää ilmottakoon siitä minulle. Omille sivuille saa kyllä mainontaa paremmin.
-Parempi esikatselutoiminto olisi kiva. Sivupohjan saisi auki ihan selaimella. EIkä sitä tarvitse erikseen ladata.
Ohjelmointiputka: HTML:stä XHTML:ään
Web Developperin raamattu
-Muutama lisäosa firefox:iin jotka hiukan helpottavat sivujen testausta: Web Developer ja Firebug

Lyhykäisena sanoisin, että heitä koko soppa vessanpönttöön. Joskus kannatttaa aloittaa ihan puhtaalta pöydältä vaikka nykyisen eteen ollaan nähty vaivaa. Kokemusta on. Tee toimiva ja kaikilla selaimilla oikein näkyvä sivupohja. Viilaa sitä hetken aikaa ja testaa että se varmasti toimii. Heittele erilaista sisältöä ja katso kuinka se reakoi. Mieti mikä olisi paras ja fiksuin tapa toteuttaa erilaiset toiminnot (käyttäijen hallinta, sivupohjien hallinta jne) ja sen jäleen vasta toteuta.
Nämä nyt ovat omat näkymykseni sivustasi. Toivottavasti oli edes joku hyöty. En ole mikään 100% Web Developer konkari ; ) joten, jos postissani on jtn korjattavaa niin oikaiskaa ihmeessä.

EDIT:

Pieni typo

[temu92]

Tekstinkeskitys:

Code: Select all

tex-align: center;

Pilkunviilaus:

Code: Select all

text-align: center;

Kirjotusvirhe over there. ;)

[alker]

Avasimpa nyt sivusi lähdekoodin ja katsoin mitä se oli syönnyt. Muutama kohta osui silmään, mitä toivon että korjaisit.

1. <br> tagia ei tule käyttää tilansaamiseen/venyttämiseen.

Code: Select all

<br/>
<br/>
<br/>
<br/>
...
<br/>

2. <br/> ei ole validia
Olet kyllä oikeassa siinä että lyhyetä elementit pitää lopettaa, mutta ennen /-merkkiä tulee väli.

Code: Select all

<br />
<img />
jne

3. Doctype puuttuu
Tarkoituksesi on näköjään XHTML:llää kirjottaa. XHTML-dokumentin pitää alkaa XML määrittelyllä, jonka jälkeen tulee DOCTYPE-määrittely.
Esim.

Code: Select all

<?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

ja html tagi on muotoa

Code: Select all

<html xmlns="http://www.w3.org/1999/xhtml">

4. <center>-tagia ei ole määritelty XHTML:ssä
Keskittämiseen kannattaa käyttää CSS:sää.
Elementin keskitys:

Code: Select all

margin-left: auto;
margin-right: auto;
(pituus pitää olla määritelty)

Tekstinkeskitys:

Code: Select all

text-align: center;

5. <link>-tagi kuuluu <head>-tagin sisään

Code: Select all

<head>
    <title>Sivu</title>
    <link rel="stylesheet" type="text/css" href="theme.css" />
</head>

6. Sisimmät tagit pitää sulkea aina enen ulompaa

Code: Select all

<div>
  <p>
    Jipikajei
    <a href="#">#</a>
  </p>
</div>

Ulkoasuseikkoja
-Teksti ei kannata olla heti elementin reunassa kiini. Vaikka esim. 3-5px rakoa. Katso CSS:n padding.
-"Kuusi uusinta sivupohjaa" kohdassa myös hiukan rakoa sivupohjien reunoille.
-Mitä h*lv. Sivun korkeus hipoo pilviä vaikka mitään sisältöä ei ole. <br> tageja enemmän, kun laki sallii.
-Jokaista lausetta ei tarvitse laittaa omalel riville. Näyttää hölmöltä.
-Iframe ei ole suotavaa.
-Esikatselu thumb kuvia voisi hiukan miettiä, Nyt ne ovat aika rumat IMO.
-Valkoinen tausta ja musta teksti toimii, mutta hiukan loppuun kulutettu IMO.

Käytettävyysseikkoja

1. Rekisteröytymis-sivu
-Jos jokin tiedoista on väärin olisi suotavaa, että virheilmoitus näkyy samalla sivulla (mieluiten kyseisen tekstikentän kohdalla) ja jo syötetyt oikeat tiedot eivät häviäisi. Sama myös kirjautumisen kanssa.
2. Sivupohjat
-Sivupohjien selaaminen on hiukan tökkivää.

Sekalaista
-Mielestäni tuo vaihdot on aika turha, jos joku noista oikeasti tykkää ilmottakoon siitä minulle. Omille sivuille saa kyllä mainontaa paremmin.
-Parempi esikatselutoiminto olisi kiva. Sivupohjan saisi auki ihan selaimella. EIkä sitä tarvitse erikseen ladata.
Ohjelmointiputka: HTML:stä XHTML:ään
Web Developperin raamattu
-Muutama lisäosa firefox:iin jotka hiukan helpottavat sivujen testausta: Web Developer ja Firebug

Lyhykäisena sanoisin, että heitä koko soppa vessanpönttöön. Joskus kannatttaa aloittaa ihan puhtaalta pöydältä vaikka nykyisen eteen ollaan nähty vaivaa. Kokemusta on. Tee toimiva ja kaikilla selaimilla oikein näkyvä sivupohja. Viilaa sitä hetken aikaa ja testaa että se varmasti toimii. Heittele erilaista sisältöä ja katso kuinka se reakoi. Mieti mikä olisi paras ja fiksuin tapa toteuttaa erilaiset toiminnot (käyttäijen hallinta, sivupohjien hallinta jne) ja sen jäleen vasta toteuta.
Nämä nyt ovat omat näkymykseni sivustasi. Toivottavasti oli edes joku hyöty. En ole mikään 100% Web Developer konkari ; Tuo ) joten, jos postissani on jtn korjattavaa niin oikaiskaa ihmeessä.

EDIT:

Pieni typo

hmmm... Kiitos... Olet kuin joku validaattori. Joo... Center tagi oli sen takija, kun sivut ei ollut keskellä IE:ssä niin laitoin siihen ton center-tagin. :S
Tuo toimii kaikilla selaimmilla samanlailla tietääkseni. Ja nuo alko jutut eivät ole pakollisia vaikka suotavia ovatkin(Ne mitkä kertovat selaimelle onko Xhtml ja mikä versio jne.) Tuo rekisteröitymis juttua olen miettynyt kanssa ja se tulee lähipäivinä Ja tuo blogin sivupohja on vähän sekin sokin, tiedän :S. Tuo sivupohja systeemi pitäisi tarkistaa... Mutta siihen voi tungea php koodia ja sen kautta urkkia tietoja, jolloin tuo ei ole kannattava ratkaisu. Miten nuo sivupohjien selailu tökki. Tarvisin vähän enemmän tietoa korjatakseni virheen. Esikatselukuvat saa sivupohjan tekijä valita. Joku pieni animaatio olisi suotavaa :S Huomenna lisäilen tuon Rekisteröinti systeemi ja kirjautumis paremmaksi. Silloin voisin korjata myös virheitä, joista en tiedä. Kertokaapas niitä :S
Link-tagi on head tagin välissä se kohta etusivulta.

Code: Select all

<head>
<title>FinWebDesign :.: Sivupohjia suomalaisille</title>
<link rel="stylesheet" type="text/css" href="themes/bb-org/tyyli.css">
</head>