Website herschrijving bugs

[bekok]

Hoi,

Ik ben momenteel bezig met een website die nog in 'ouderwetse' code met frames staat te herschrijven naar het meer modernere xhtml/css werk. Het gaat om de volgende site: www.seminarsopmaat.nl en de vernieuwde versie kan je hier: www.seminarsopmaat.nl/carel vinden.
Ik heb het overgrote deel van de site al herschreven, maar er zijn nog een paar kleine technische problemen waar ik tegenaan loop. Daar zou ik jullie hulp om willen vragen. Ik zal de punten (voor zover ik ze weet) even op een rijtje zetten:

- Op de originele site staan in de header 3 plaatjes, eentje links, eentje in het midden, en eentje rechts. Het lukt me nog niet om deze op elke resolutie exact zo alligned te krijgen.
- Overflow, wanneer je bijvoorbeeld op "eerdere seminars" klikt en je naar beneden scrollt, scrollt hij door de header heen.
- Seminars worden niet mooi alligned, de afstand is nu relatief tegenover de datum, maar het moet natuurlijk mooi onder elkaar staan
- Contact, maps-plaatje wordt nog niet goed weergegeven in IE

Voor zover ik weet zijn dit de bugs die ik nog op moet lossen. Echter ik kom bij elke niet echt helemaal er uit hoe ik ze op moet lossen. Daar zou ik jullie hulp voor willen vragen . Verdere feedback en bug-meldingen zijn ook zeker welkom!

[mcDavid]

Misschien niet geheel ontopic, maar zou je deze gelegenheid niet beter aan kunnen grijpen om gelijk de layout een beetje op te kalefateren?

Wel ontopic:
- gebruik background-images ipv inline images voor je header
- overflow:hidden al geprobeerd? -edit- of de header ondoorzichtig maken
- Waarom staan die seminairs niet in een table?

[ Voor 6% gewijzigd door mcDavid op 30-11-2009 11:30 ]

[macciez]

Overflow: waarom dat gebeurt kan ik je zo niet 1 2 3 vertellen, maar het zou op te lossen zijn door een achtergrond aan je header mee te geven.
Seminars. Is dat niet aan te vullen met spaties in de code? Wat mij betreft is het ook tabular data
Contact. Heb geen IE atm, maar zoals je weet werkt het in FF.

Nog een kleine vraag/tip: waarom heb je de links in seminars zo onduidelijk gemaakt? Ik moest echt even zoeken naar de link "eerdere seminars" voordat ik doorhad dat het gewoon die tekst was.

[ Voor 4% gewijzigd door macciez op 30-11-2009 11:30 ]

[Bosmonster]

mcDavid schreef op maandag 30 november 2009 @ 11:29:
- gebruik background-images ipv inline images voor je header

En waarom zou je dat willen doen

Als ik al een tip zou willen geven, is dat het logo aanklikbaar zou moeten zijn voor de homepage (wat ook verdomd lastig wordt zonder rare trucs als je van die header een achtergrond zou maken).

[ Voor 31% gewijzigd door Bosmonster op 30-11-2009 11:42 ]

[OkkE]

Ik denk dat je met de verkeerde insteek bezig bent. Ik heb sterk het idee dat je de website in XHTML/CSS aan het maken bent "omdat het moet", terwijl de website (en je opzet/werkwijze) duidelijk nog te veel relatie hebben met frames. Ook bespeur ik een beetje het DIVitis.

Ontopic;

1) Je kunt de afbeeldingen in de header met position:absolute helemaal links en rechts zetten, en de middelste met margin:0 auto; centreren.

2) Komt omdat je header vast staat (de frame-site style waar ik het over had), die een background-color:white; geven en je ziet iig de content er niet deels door heen.

3) Seminars is imho tabulair, dus gebruik gewoon een <table>.

4) Je GoogleMaps screenshot uitlijn probleem weet ik zo 1,2,3 niet waar het vandaan komt. Een extra margin-top (of padding-top) op een element er om heen, of de elementen zelf, zou het moeten oplossen.

[mcDavid]

Bosmonster schreef op maandag 30 november 2009 @ 11:41:
[...]


En waarom zou je dat willen doen

Als ik al een tip zou willen geven, is dat het logo aanklikbaar zou moeten zijn voor de homepage (wat ook verdomd lastig wordt zonder rare trucs als je van die header een achtergrond zou maken).

Omdat het afbeeldingen zijn die puur voor stijl gebruikt worden.

Opzich ben ik het wel met jouw advies eens, maar dat is een verandering in de functionaliteit van de site. áls die verandering erin komt, dan zijn inline-images idd weer beter..

[OkkE]

mcDavid schreef op maandag 30 november 2009 @ 12:00:
[...]


Omdat het afbeeldingen zijn die puur voor stijl gebruikt worden.

Opzich ben ik het wel met jouw advies eens, maar dat is een verandering in de functionaliteit van de site. áls die verandering erin komt, dan zijn inline-images idd weer beter..

Ik vind dat je in bepaalde gevallen best ietsjes van de "regels" mag afwijken om het gebruikersgemak te vergroten.

Daarnaast vind ik het logo sowieso ook onderdeel van de content, en dus niet (puur) stijl element.

[Bosmonster]

mcDavid schreef op maandag 30 november 2009 @ 12:00:
[...]


Omdat het afbeeldingen zijn die puur voor stijl gebruikt worden.

Denk dat je in de war bent met dingen als hoekjes, randjes, bullets, etc. Een header-afbeelding is geen stijl-element, maar een visual.

Als je in headers afbeeldingen gebruikt die compleet niet relevant zijn aan de content of je website, dan kun je je beter afvragen of je wel de juiste afbeeldingen hebt gekozen, of dat je design wel goed is.

[ Voor 24% gewijzigd door Bosmonster op 30-11-2009 12:13 ]

[bekok]

OkkE schreef op maandag 30 november 2009 @ 11:51:
Ik denk dat je met de verkeerde insteek bezig bent. Ik heb sterk het idee dat je de website in XHTML/CSS aan het maken bent "omdat het moet", terwijl de website (en je opzet/werkwijze) duidelijk nog te veel relatie hebben met frames. Ook bespeur ik een beetje het DIVitis.

Ontopic;

1) Je kunt de afbeeldingen in de header met position:absolute helemaal links en rechts zetten, en de middelste met margin:0 auto; centreren.

2) Komt omdat je header vast staat (de frame-site style waar ik het over had), die een background-color:white; geven en je ziet iig de content er niet deels door heen.

3) Seminars is imho tabulair, dus gebruik gewoon een <table>.

4) Je GoogleMaps screenshot uitlijn probleem weet ik zo 1,2,3 niet waar het vandaan komt. Een extra margin-top (of padding-top) op een element er om heen, of de elementen zelf, zou het moeten oplossen.

1) Links en rechts is zo helemaal goed gelukt! Alleen margin: 0 auto; pakt ie nog niet helemaal..
2) Ook helemaal gelukt
3) Daar ga ik zo naar kijken, maar dat moet vast lukken met tables.
4) Dit is ook een klein puntje dus dat komt sowieso goed

Hartstikke bedankt (en de rest ook), ik denk dat het helemaal goed gaat komen zo !
Oja nog even over de punten van insteek en design: ik heb de opdracht zo specifiek van mijn werkgever gekregen. Ik vind zelf ook dat er nog wat mag worden veranderd, maar dat is toekomstig werk.

[bekok]

Oh er is nog 1 bug die ik net tegen kwam: bij oudere Seminars zijn sommige tekens in de naam van een Seminar foutief, terwijl ik de juiste charset e.d. heb ingesteld..

[Spinal]

1) Kan komen door je Transitional doctype. Waarom gebruik je geen strict?
Verstuur je in ASP ook een UTF8-header, zonder header kan het alsnog als niet-UTF8 gezien worden door de browser.

[OkkE]

In PHP heb je een functie htmlentities(); waarmee "bijzondere tekens" worden omgezet naar hun HTML alternatief, denk dat zoiets er voor ASP ook wel is? Dat zou ook een oplossing kunnen zijn, al is het sowieso goed om de encoding ook op orde te maken.

[bekok]

En ook de charset is gefixed! Het enige wat nog niet goed is, is het centreren van het middelste plaatje in de header..

En ook dat is gefixed! Ik was ff vergeten dat margin: 0 auto; werkte, maar dat ik het een display: block; moest geven .

[ Voor 35% gewijzigd door bekok op 01-12-2009 08:36 ]