Sitecheck portfolio HTML/CSS

Zo, het is weer eens tijd voor een ouderwetse, onvervalste sitecheck!

De laatste week heb ik hard gewerkt om een nieuwe versie van mijn website in elkaar te knutselen. Dit keer géén Flash maar html/css…
Voor mij de eerste site die ik met deze combi heb opgebouwd. De code zal dan ook niet perfect zijn. Suggesties om die te verbeteren hoor ik dan ook graag.
Nog een reden om Flash vaarwel te zeggen is dat ik een blog heb willen intregeren. In Flash zie ik dat niet zo gauw gebeuren.
Het ontwerp is dit keer iets minder minimalistisch als de vorige, hoewel ik ook hier zoveel mogelijk ‘to the point’ heb willen vormgeven.

Problemen waar ik nu nog tegenop loop:

  • De knoppen in het portfolio (sliding-doors techniek) zijn onzichtbaar in IE op de PC (mac niet getest).
  • Het plaatje link boven het menu (mijn handtekening) wordt in IE niet goed weergegeven. Ik denk dat de DIV van het menu er overheen loopt.
  • Na het invullen van de gegevens van het contactformulier heb ik graag dat naar een andere pagina wordt gelink ('uw informatie is succesvol verzonden, bla bla). Hoe dit moet weet ik niet. Wellicht met Javascript?

Nou, laat maar horen!

Link

Minimaal. Ik ben altijd voor een minimale site maar dit is wel een beetje te denk ik. Kan er, gezien de summiere inhoud, weinig over zeggen.

Leuke strakke site. Leuk patroontje op de achtergrond. Ik vind wel dat je rollover-tekst misschien wat té licht wordt als je erover gaat. Voor de rest zéker een dikke pluim waard voor je eerste xhtml/css site!

En je formulier, wanneer is dat operationeel?

Stijlvol en to the point. Pure klasse. Een hele verbetering tov de Flash website. De background is ook super. Voelt heel naturel aan.

Is dit echt je eerst XHTML/CSS website? I take me hat off for you sir 8)

Hey Bjorn,

Gaaf patroon op de achtergrond. Heb je die zelf gemaakt? :stuck_out_tongue: Verder zou het netjes zijn, en volgens mij ben je daar nog mee bezig, dat als je het formulier invult en klikt op verzenden, je niet naar een witte pagina gaat waar staat &Result = verzonden.

Verder staat er bij die pagina biografie een foto van je, ik zou deze net als bij je portfolio links van de tekst plaatsen, en niet zoals nu erboven.

Verder lekker simpel en duidelijk!

Zelf ga ik altijd uit van een super luie internetter die alles meteen wil zien en zowat nergens op hoeft te klikken, maar ben beetje bang aan het worden of wij minimalistische webdesigners de internetters gewoon te lui aan het maken zijn. :smiley:

ziet er erg stijlvol uit, knap gedaan. wat ik een beetje vreemd vindt is dat de site aan de onderkant geen begrenzing heeft. Het loopt tot in het oneindeige door maar er gebeurt niets, Nou komt er wel een blog op, wat naar beneden zal groeien maar de andere pagina's blijven wel leeg.

lekker strak, maar index2.html weg en gelijk naar de portfolio. :)

update: ow en zorgen dat niemand kan reageren, dat is een beetje teveel blog en niet echt zakelijk

Heel mooie, rustige site. Heel simpel, inderdaad mooie achtergrond. Ook gewoon heel overzichtelijk. :) Vind alleen de sidebar op de blog- en contactpagina niet zo mooi ...

[size=9:c9560c33b8]<zeurmodus>Abonneren moet met dubbel n en niet met dubbel b</zeurmodus>:P[/size:c9560c33b8]

[quote:c9560c33b8=“iBert”]Een hele verbetering tov de Flash website.[/quote:c9560c33b8]

Daar ben ik het niet mee eens… Die flash website vond ik ook heel mooi.:slight_smile: Minstens net zo goed als deze.

@ Deform: Het formulier is operationeel... alles moet werken.

@Jesper:
Dat ding dat je zit wanneer je een reactie stuurt is niet fraai nee. Maar ik weet niet hoe ik zo’n redirect maak.
Biografie heb je wellicht gelijk in… ik kijk ernaar.

@ EagerB0bNerd:
Ik ben uitgegaan van een schermresolutie van 1024 x 768. Ik heb geprobeerd zoveel mogelijk rekening te houden met die hoogte van 768 pixels. Ik ga er vanuit dat mensen die op een hogere resolutie werken niet meteen hun venster fullscreen hebben.
Ik heb geen grote en brede site nodig om mijn content te presenteren

@HS-L
Meteen op de 1e pagina van het portfolio beginnen is wellicht niet zo’n gek idee… het introplaatje doet mij ook wat geforceerd aan.
Ik doe trouwens puur en alleen bloggen over illustratie-gerelateerde zaken. Veel collega’s van mij hebben tegenwoordig zo’n blog. Ook potentiele klanten kijken hierna. Ik wil op die manier meer inzicht kunnen geven in mijn werkwijze etc.

@Appleflap:
Je zeurt niet… goed dat je het mij zegt! Spelfouten komen erg knullig over en moeten daarom meteen weggehaald worden.

[quote:c0f1018f95="MacBjorn"]- De knoppen in het portfolio (sliding-doors techniek) zijn onzichtbaar in IE op de PC (mac niet getest).[/quote:c0f1018f95] [url=http://alistapart.com/articles/eatcake]Deze techniek[/url] is interessanter voor jouw doeleinde. Zo hou je nog maar één pagina over.

[quote:c0f1018f95=“MacBjorn”]- Het plaatje link boven het menu (mijn handtekening) wordt in IE niet goed weergegeven. Ik denk dat de DIV van het menu er overheen loopt.[/quote:c0f1018f95]
Probeer dit even:[code:1:c0f1018f95]div#navigation
{
background: url(images/achtergr_menu.jpg) no-repeat #FFF 0 0;
width: 600px; height: 70px;
}[/code:1:c0f1018f95]

[quote:c0f1018f95=“MacBjorn”]- Na het invullen van de gegevens van het contactformulier heb ik graag dat naar een andere pagina wordt gelink ('uw informatie is succesvol verzonden, bla bla). Hoe dit moet weet ik niet. Wellicht met Javascript?[/quote:c0f1018f95]

Dat doe je met PHP. Je maakt een formuliertje aan, en als action attribuut zet je een volgende pagina. Je vraagt de variabelen op vanuit de vorige pagina met $_REQUEST, en mailt de gegevens met dit scriptje.

Oh ja, die mooie achtergrond, kan je die niet laten doorlopen in beide richtingen?

Nu zie ik zo’n witte stroken aan elke zijde …

@ EL Mystica

dan moet je niet zo’n groot scherm hebben! lol

Macbjorn petje af

ziet er erg mooi uit. Rustig en overzichtelijk. Ik merk wel dat ik de behoefte heb om nog een keer op je werk te klikken om ze nog groter te zien, maar dat ligt aan je werk. Moet je maar niet zo mooi schilderen

:wink:

[quote:23ab81d5ab="MacBjorn"]@HS-L Ik doe trouwens puur en alleen bloggen over illustratie-gerelateerde zaken. Veel collega's van mij hebben tegenwoordig zo'n blog. Ook potentiele klanten kijken hierna. Ik wil op die manier meer inzicht kunnen geven in mijn werkwijze etc.[/quote:23ab81d5ab]

bloggen is ook niet erg, maar zou zorgen dat mensen niet teveel kunnen reageren, je krijgt namelijk of lof of veel familie en vrienden die vertellen dat de site zo mooi is en dat ze trots op je zijn. heel leuk, maar dat zou ik niet in het openbaar willen zien.

:slight_smile:

[quote:dcd83a9994="EL Mystica"]Oh ja, die mooie achtergrond, kan je die niet laten doorlopen in beide richtingen?.[/quote:dcd83a9994]

Ding is 1600 pixels lang… waarom zou je je venster zo groot trekken als je toch weet dat er buiten de witte kolom niets meer te zien is? :smiley:

@HS-L
Klopt, dat soort dingen wil ik ook liever niet. Maar ik ga deze site ook niet aan de grote klok hangen bij de familie. Verder vind ik het niet zo erg als ‘leken’ zeggen dat ik mooie schilderijtjes maak. Zolang het maar bij een enkele reaktie blijft.

mhh… er zit geen beveiliging op het formulier die ervoor zorgt dat je de items moet invullen… Daar moet ik nog eens goed naar kijken.

Strakke site!. Helaas doet de portfolio het inderdaad niet in IE 6. Ik denk dat het komt door de floatende knopen icm met negatieve afstanden. IE wil nooit goed relatieve waarden berekenen. Als alles met absolute posities kan gaat het beter.

[quote:9d79be8a59="MacBjorn"][quote:9d79be8a59="EL Mystica"]Oh ja, die mooie achtergrond, kan je die niet laten doorlopen in beide richtingen?.[/quote:9d79be8a59]

Ding is 1600 pixels lang… waarom zou je je venster zo groot trekken als je toch weet dat er buiten de witte kolom niets meer te zien is? :D[/quote:9d79be8a59]

Je kunt hem wel oneindig lang maken. Dan moet je links een aparte bg hebben waar de shadow op staat, met aan de linkerkant dus een pattern die loopt vanaf rechtsboven richting links. Dus laag met shadow, en laag met pattern.

En aan de rechterkant een aparte bg met shadow, en dan een achtergrond met pattern die loopt vanaf linksboven naar rechts.

Snappie?

Hey Bjorn, goed gedaan man! Alles is proper en overizichtelijk, echt to the point.

Na het invullen van het mailform krijg je nog altijd die code die je in flash gebruikt.
Je mag gewoon die mail actie in een nieuwe php pagina plakken met jouw site opmaak.

Hey Konijn!

Dat heb ik ook gedaan. Dus het in elkaar zetten van die forms was easy. Alleen het doorsturen naar een ‘bedankt’ pagina in mijn ‘oude’ site was een actionscriptje. PHP stond hier buiten.

[quote:88c240a845=“iBert”][code:1:88c240a845]div#navigation
{
background: url(images/achtergr_menu.jpg) no-repeat #FFF 0 0;
width: 600px; height: 70px;
}[/code:1:88c240a845][/quote:88c240a845]

Helaas… dit werkt niet.

ziet er mooi uit bjorn! er moeten nog een paar dingetjes opgelost worden zodat het helemaal naar je wens is, maar dat komt wel goed.

[quote:3e6891d786="MacBjorn"]Hey Konijn!

Dat heb ik ook gedaan. Dus het in elkaar zetten van die forms was easy. Alleen het doorsturen naar een ‘bedankt’ pagina in mijn ‘oude’ site was een actionscriptje. PHP stond hier buiten.

[quote:3e6891d786=“iBert”][code:1:3e6891d786]div#navigation
{
background: url(images/achtergr_menu.jpg) no-repeat #FFF 0 0;
width: 600px; height: 70px;
}[/code:1:3e6891d786][/quote:3e6891d786]

Helaas… dit werkt niet.[/quote:3e6891d786]

Het #nav element overlapt het logo. Zo zou het moeten werken:[code:1:3e6891d786]#nav {
width: 100%;
margin: 0 auto;
background: transparent;
}[/code:1:3e6891d786]