Mozilla bugs

[ibr]

Hallo,

We hebben met 3 man een website gemaakt, genaamd www.zishi.nl

In IE 6 werkt deze site uitstekend.

Echter, als je de site met de laatste versie van Mozilla opent, krijg je de site op enkele onderdelen toch echt helemaal verkeerd te zien. B.v. de "Enter" is niet gecentreerd en de lettertype van de content is anders.

Weet iemand hoe dit kan komen? Want ik heb alle scripts nagekeken en deze klopten, in IE wordt ie dus perfect weergegeven. Als in in google op mozilla bugs zoek, krijg ik allemaal resulaten van bugs in mozilla zelf en niet in de sites die ermee bekeken worden.

Is er misschien een of andere programmatje of zoiets die zulke fouten kan achterhalen?

Bvd.

[Twisted]

http://validator.w3.org/c...p%3A%2F%2Fwww.zishi.nl%2F

[NMe]

Wat een wirwar van styles...

Je hebt wat betreft die Enter button een text-align: left staan op de omvattende table, en verder op hoger niveau niets dat de align aanpast. Die Enter-tekst wordt dus ook left aligned, by default.

Verder: heb je wel eens nagedacht over losse CSS-files? Of desnoods een inline <style>-element? Dit is echt niet onderhoudbaar meer.

[Rowanov]

Ik denk dat het eerder aan jullie code ligt en dat het vrij weinig met Mozilla te maken heeft; met een blik op je code kan ik zo al zeggen dat je met een juiste semantische opzet veel verder kan komen. Zo'n soort layout is vrij makkelijk in css.

[Alex)]

crisp zou hierover een beetje vloeken denk ik, dit is niet echt netjes gestyled, nietwaar?

[ibr]

Bedankt voor jullie aandacht, ik zal even contact opnemen met onze scripter en kijken of er nog mogelijkheden zijn. Ik ben bang dat we de hele website opnieuw moeten scripten om het gebruiksvriendelijk te houden. Ik hou jullie op de hoogte, als er nog vragen zijn horen jullie het wel.

[equationunequal]

code:

<BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR>
<BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR>
<BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR>
<BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR>

Sorry, maar dit heeft dus echt totaal niets met Mozilla te maken. Je code is een gewoon een zooitje. Ik zou gewoon overnieuw beginnen met een semantische opzet. Idd zoals hier al is gezegd: extern css bestand, correcte markup ipv. tables & valide html gebruiken. Kijk hier eens voordat je verder gaat...

[ Voor 40% gewijzigd door equationunequal op 05-09-2005 22:32 ]

[ibr]

Hankey schreef op maandag 05 september 2005 @ 22:32:

code:

<BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR>
<BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR>
<BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR>
<BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR>

Sorry, maar dit heeft dus echt totaal niets met Mozilla te maken. Je code is een gewoon een zooitje. Ik zou gewoon overnieuw beginnen met een semantische opzet. Idd zoals hier al is gezegd: extern css bestand, correcte markup ipv. tables & valide html gebruiken. Kijk hier eens voordat je verder gaat...

De scripter zegt:
Vanwaar die quote, die breaks staan er met een doel, hoe zou ik het anders moeten doen? En waarom niet gewoon zo?
Okeej, de code is niet bepaald netjes, maar hij is ook niet gemaakt om door anderen gelezen te worden, maar zoals ik het zelf handig vind, sorry dat jullie daar zo doorheen moeten ploegen.
Nog 2 dingetjes: Waarom is mijn HTML niet "valide", en wat bedoel je met een "semantische" opzet?

[BasieP]

als je kijkt naar wat validator.w3.org zegt, kan je zien waarom je site niet valid is.

html en css hebben een een aantal regels, daar moet je je aan houden, als je dat niet doet dan is het logisch dat browsers je site niet goed weergeven.

zoals gezegt:
www.w3schools.com
en probeer stuk voor stuk je fouten uit je site te halen. er staat zelfs bij hoe de fout op te lossen is, dus dat moet geen probleem zijn.

iets wat echt aan te raden is: exterene CSS file. dit is een stuk overzichtelijker. bovendien kan je deze dan ook weer laten valideren

[ Voor 14% gewijzigd door BasieP op 06-09-2005 15:12 ]

[PhoeniX-]

ibr schreef op dinsdag 06 september 2005 @ 15:02:
De scripter zegt:
Okeej, de code is niet bepaald netjes, maar hij is ook niet gemaakt om door anderen gelezen te worden, maar zoals ik het zelf handig vind, sorry dat jullie daar zo doorheen moeten ploegen.
Nog 2 dingetjes: Waarom is mijn HTML niet "valide", en wat bedoel je met een "semantische" opzet?

Als de 'scripter' niet weet wat valide en semantiek in dit verband inhoud moet hij misschien eens goed gaan zitten voor bovengenoemde linkjes.

Ik zie in de source allerhande dingen die je mijns inziens beter kunt vermijden:
- uppercase tags
- attributen zonder quotes
- foute commentaartags
- alleen gebruik van style attributen ipv. nette style header of externe .css

Deze punten (behalve de laatste) resulteren uiteindelijk in ongeldige (X)HTML.

BTW: Het betreft hier dus geen bugs in Mozilla, maar bugs in jouw site

[ Voor 7% gewijzigd door PhoeniX- op 06-09-2005 15:26 ]

[thomaske]

ibr schreef op dinsdag 06 september 2005 @ 15:02:
en wat bedoel je met een "semantische" opzet?

Semantiek - Waarom zou je?

[ Voor 4% gewijzigd door thomaske op 06-09-2005 15:26 ]

[BtM909]

PhoeniX- schreef op dinsdag 06 september 2005 @ 15:24:
[...]

- uppercase tags
- attributen zonder quotes
- foute commentaartags
- alleen gebruik van style attributen ipv. nette style header of externe .css

Deze punten (behalve de laatste) resulteren uiteindelijk in ongeldige (X)HTML.

BTW: Het betreft hier dus geen bugs in Mozilla, maar bugs in jouw site

Misschien iets meer verdiepen in de materie voordat je iets roept . Waarom zou dit geen geldige HTML zijn:

code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<title>test</TITLE>
<p ALIGN=CeNtER>Test test</P>

[ Voor 30% gewijzigd door BtM909 op 06-09-2005 15:34 ]

[killercow]

@ts:

Jullie hebben geen site gemaakt, maar jullie hebben op goed geluk stukjes code bij elkaar gegooid, het lijkt gewoon nergens op. Als ik jullie was zou ik een andere hobby kiezen of een een ander carriere pad gaan volgen.

Het argument dat de code niet bedoeld is om door anderen te worden gezien is natuurlijk bullshit, zodra jullie je code geschreven heeft hoeft nooit iemand er ooits meer mee te doen? en waar is een browser dan iets anders dan een mens die je code bekijkt?
Het enige wat ik als mens anders wil als een browser is wat entertjes en tabjes, maar voor de rest lees ik de code net zo als een gemiddelde browser.

Sorry hoor, maar als ik chaufeur of zoiets wil zijn moet ik ook weten wat ik doe, zelfs als ik voor andere mensen wil koken willen ze veelal weten of je het wel kan. (en ook dan pak je er een boek bij)

Waarom dan niet als je een website probeert te bouwen?

[MueR]

Wow. Ik moet zeggen dat deze site nogal een MS Frontpage feel heeft. Uppercase tags, rommelige arguments, geen doctype declaration, geen character encoding definitions.

ibr schreef op dinsdag 06 september 2005 @ 15:02:
De scripter zegt:
Vanwaar die quote, die breaks staan er met een doel, hoe zou ik het anders moeten doen? En waarom niet gewoon zo?

Omdat het gewoon niet netjes is. Die tekst kan je ook gewoon in een divje zetten, en netjes onder de image positioneren dmv margins.

Okeej, de code is niet bepaald netjes, maar hij is ook niet gemaakt om door anderen gelezen te worden, maar zoals ik het zelf handig vind, sorry dat jullie daar zo doorheen moeten ploegen.
Nog 2 dingetjes: Waarom is mijn HTML niet "valide", en wat bedoel je met een "semantische" opzet?

Je kan toch niet verwachten dat je door crappy code alleen goede resultaten krijgt? Dat komt altijd een keer terug en slaat het je hard in het gezicht. Zoals hier met FireFox.
Je HTML is niet valide omdat je gewoon zelf maar wat aankloot, in plaats van je aan de webstandaarden te houden. De URL van de W3Schools is hier al eens voorbij gekomen, dus die geef ik niet meer.
Ook een linkje over semantiek is al 2 keer voorbij gekomen. Ik zou (samen met je scripter, die er duidelijk verstand van heeft), het eens lekker doorlezen, en dan een Shift+Del op je huidige site uitvoeren, en vanaf scratch opnieuw beginnen.
En nog een kleine hint.. vertrouw niet te veel op javascript.. er zijn genoeg mensen die dat uit zetten.

[BasieP]

BtM909 schreef op dinsdag 06 september 2005 @ 15:33:
Misschien iets meer verdiepen in de materie voordat je iets roept . Waarom zou dit geen geldige HTML zijn:

code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<title>test</TITLE>
<p ALIGN=CeNtER>Test test</P>

*kuch*

The document located at <http://basiep.dyndns.org/x.html> was checked and found to be tentatively valid HTML 4.01 Transitional. This means that with the use of some fallback or override mechanism, we successfully performed a formal validation using an SGML or XML Parser. In other words, the document would validate as HTML 4.01 Transitional if you changed the markup to match the changes we have performed automatically, but it will not be valid until you make these changes.

j/k maar ik moest het ff posten

[ Voor 13% gewijzigd door BasieP op 06-09-2005 15:56 ]

[praseodymium]

Over de vele <br>'s: waarom wel? Je kan toch gewoon CSS gebruiken (margins ofzo)?

En eigenlijk zijn het allemaal IE6 bugs, omdat IE er wel iets van maakt (elke goed werkende browser niet). Meestal is het bij developers wel andersom (IE werkt niet goed, Gecko/KHTML/Opera/etc. wel).

[BtM909]

BasieP schreef op dinsdag 06 september 2005 @ 15:55:
[...]

*kuch*

[...]

j/k maar ik moest het ff posten

Als je volgende keer ook leest waarom het Tentatively is
(omdat ik voor het voorbeeld even geen Character Encoding heb gebruikt)

[BasieP]

BtM909 schreef op dinsdag 06 september 2005 @ 16:06:
[...]

Als je volgende keer ook leest waarom het Tentatively is
(omdat ik voor het voorbeeld even geen Character Encoding heb gebruikt)

offtopic:
done that.,. en nu? word me bericht daar minder waar van? nee dacht ik ook niet..

[snooze]

en nog iets je achtergrond is zeer resolutie onvriendelijk bekijk hem maar eens met 1280x1024 (de native resolutie van minstens 80% van de nieuw verkochte tft's) dan ziet het er gewoon niet uit.

[BtM909]

BasieP schreef op dinsdag 06 september 2005 @ 16:08:
[...]

offtopic:
done that.,. en nu? word me bericht daar minder waar van? nee dacht ik ook niet..

Wil je niet lezen of begrijp je me niet?

code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>test</TITLE>
<p ALIGN=CeNtER>Test test</P>

Resultaat:
This Page Is Valid HTML 4.01 Transitional!


Het gaat mij niet om het feit dat het valid is (wat het dus wel is ), maaar PhoeniX roept dingen die niet waar hoeven te zijn. Ik probeer dat alleen maar aan te geven

[ Voor 8% gewijzigd door BtM909 op 06-09-2005 16:15 ]

[crisp]

BasieP schreef op dinsdag 06 september 2005 @ 16:08:
[...]

offtopic:
done that.,. en nu? word me bericht daar minder waar van? nee dacht ik ook niet..

offtopic:
normaliter stuurt je webserver al een character-encoding mee in de headers

[BasieP]

BtM909 schreef op dinsdag 06 september 2005 @ 16:15:
[...]

Wil je niet lezen of begrijp je me niet?

ik begrijp je, en ik lees
blijkbaar jij niet (en crisp ook ni)

j/k maar ik moest het ff posten

nou stfu please, het was een grapje. topic gaat ergens anders over weet je nog?

[PhoeniX-]

BtM909 schreef op dinsdag 06 september 2005 @ 16:15:
Het gaat mij niet om het feit dat het valid is (wat het dus wel is ), maaar PhoeniX roept dingen die niet waar hoeven te zijn. Ik probeer dat alleen maar aan te geven

Ik zal de haakjes rond de X wel weghalen .. dan klopt m'n statement wel. Strekking van m'n bericht is dat er geen stijl is en dat ik de genoemde punten belangrijk vind voor leesbare code en xhtml compliance.

[equationunequal]

ibr schreef op dinsdag 06 september 2005 @ 15:02:
[...]

De scripter zegt:
Vanwaar die quote, die breaks staan er met een doel, hoe zou ik het anders moeten doen? En waarom niet gewoon zo?
Okeej, de code is niet bepaald netjes, maar hij is ook niet gemaakt om door anderen gelezen te worden, maar zoals ik het zelf handig vind, sorry dat jullie daar zo doorheen moeten ploegen.
Nog 2 dingetjes: Waarom is mijn HTML niet "valide", en wat bedoel je met een "semantische" opzet?

Het meeste is al gezegd hier, maar laat ik toch ook nog maar event reageren:

Die breaks achter elkaar is een extreem slordige manier om de opmaak te bepalen. Hiervoor dien je gebruik te maken van CSS. Zoek eens op positioning, margins en padding...

De code is dan misschien niet gemaakt om door mensen gelezen te worden, maar wel door browsers. Zoals al eerdere gezegd is de enige extra eis die een mens aan de code stelt dat het netjes ge-indent is zodat de code goed leesbaar is. De meeste browsers slikken je code simpelweg niet als deze brak en non-valide is...

_{Verder kan ik alleen maar aanraden om je (en je scripter) eens flink te gaan verdiepen in de materie en desnoods een opleiding te gaan volgen als je hier mee verder gaat. Als je hier geen moeite voor wilt doen: quit your day job en laat het over aan mensen die wel weten waar ze mee bezig zijn. Webdesign is meer dan het simpelweg maken van een paginatje in een WYSIWYG editor...}

[Verwijderd]

PhoeniX- schreef op dinsdag 06 september 2005 @ 15:24:
[...]

Ik zie in de source allerhande dingen die je mijns inziens beter kunt vermijden:
- uppercase tags

Deze punten (behalve de laatste) resulteren uiteindelijk in ongeldige (X)HTML.

BTW: Het betreft hier dus geen bugs in Mozilla, maar bugs in jouw site

wat is er mis met uppercase tags, ik vind dit alleen maar handiger zodat je weet wat code is en wat niet ? of mis ik hier iets, en dan nog iets, helaas zit ik op mijn werk achter proxy, had graag dat stuk over symantisch (wat betekend dat woord eigenlijk) lezen, maar ga ik vanavond doen...

[Boelie-Boelie]

In XHTML mag je niet met uppercase tags werken, in HTML wel. Er is niks mis mee, maar leer je met lowercase tags werken, ben je (en je site) misschien iets beter op de toekomst voorbereid. Maar in HTML boeit het dus eigenlijk niet.

[equationunequal]

Verwijderd schreef op donderdag 08 september 2005 @ 15:35:
[...]


wat is er mis met uppercase tags, ik vind dit alleen maar handiger zodat je weet wat code is en wat niet ? of mis ik hier iets, en dan nog iets, helaas zit ik op mijn werk achter proxy, had graag dat stuk over symantisch (wat betekend dat woord eigenlijk) lezen, maar ga ik vanavond doen...

Om het verschil tussen code en plain text te zien hebben de meeste code editors syntax highlighting. Daarnaast vind ik lowercase tags een stuk netter staan en beter leesbaar, maar dat is puur persoonlijk...

Over semantiek:

se·man·tiek (de ~ (v.))
1 leer van de betekenis van de woorden en woordgroepen => betekenisleer
2 [fil.] leer van de interpretatie van formele systemen

Semantisch correct coden betekent dat je de juiste elementen gebruikt voor de juiste doeleinden. Zo is een tabel bedoelt voor tabulaire data, een list voor een lijst of opsomming (ook menu's vallen hieronder) en h1 element als header. Als je de elementen gebruikt voor dingen vaarvoor ze niet bedoelt zijn, dus bv. een tabel voor layout doeleinden, ben je semantisch niet correct bezig...

[ Voor 8% gewijzigd door equationunequal op 08-09-2005 20:03 ]

[Little Penguin]

Zoals door andere posters al is aangegeven valt er nog wel het één en ander aan te merken op je site. De semantiek en de uitlijning zijn punten waar nogal wat aandacht aan besteed moeten worden.

Als slechts 1 browsers voldoet aan de layout die je in gedachten hebt dan is er duidelijk wat mis met je ontwerp, ik heb de site namelijk ook in Safari en Opera bekeken en ook daar is de layout niet zo als ze volgens jouw eigen idee zou moeten zijn.

Een paar tips voor je en een ieder die aan website ontwerp doet:

• Bepaal wat je wilt tonen op je site, de tekst en de onderverdeling.
• Maak simpele (kale) HTML bestanden die weinig layout bevatten maar verder wel semantisch correct zijn
• Maak een ontwerp, puur grafisch (in bijvoorbeeld photoshop) concentreer je hierbij (bijna) volledig op de weergave
• Maak op basis van je ontwerp een CSS bestand en pas zo nodig je HTML aan (voeg bijvoorbeeld <div>-elementen toe indien nodig.

De volgorde is persoonlijk, soms is het makkelijker om met het grafische ontwerp te beginnen en een andere keer is het slimmer om met het invullen van de HTML bestanden te beginnen.

Over een semantisch ontwerp:
Gebruik het element dat het beste weergeeft wat je bedoelt, een koptekst plaats je in een <h?>-element, waar bij op de plaats van het vraagteken 1 t/m 6 kan staan. 1 is het belangrijkste en 6 is minder belangrijk.
Lijstjes plaats je in eem <ul> element
Tabel data plaats je in een <table> element
Definitie lijsten plaats je in een <dl> element

Als je echt geen geschikt element meer kan vinden dan kun je altijd terugvallen op <div> en <span> elementen.

Meer informatie is er op diverse websites (zoals al door anderen aangedragen) te vinden.

N.B.
Op deze manier ontwerpen kost in het begin meer werk dan de "trial and error op Internet Explorer" methode, maar op langere termijn is het beter te onderhouden en levert het een kleinere site qua broncode op (en dus snelheid voor de gebruikers met een trage(re) internet verbinding).

Als je ontwerpt test dan verder vanaf het begin op zo veel mogelijk browsers, dat voorkomt dat je later (grote) problemen op moet lossen die je in een eerder stadium gemakkelijker had kunnen verwijderen...

[ibr]

killercow schreef op dinsdag 06 september 2005 @ 15:35:
@ts:

Jullie hebben geen site gemaakt, maar jullie hebben op goed geluk stukjes code bij elkaar gegooid, het lijkt gewoon nergens op. Als ik jullie was zou ik een andere hobby kiezen of een een ander carriere pad gaan volgen.

Het argument dat de code niet bedoeld is om door anderen te worden gezien is natuurlijk bullshit, zodra jullie je code geschreven heeft hoeft nooit iemand er ooits meer mee te doen? en waar is een browser dan iets anders dan een mens die je code bekijkt?
Het enige wat ik als mens anders wil als een browser is wat entertjes en tabjes, maar voor de rest lees ik de code net zo als een gemiddelde browser.

Sorry hoor, maar als ik chaufeur of zoiets wil zijn moet ik ook weten wat ik doe, zelfs als ik voor andere mensen wil koken willen ze veelal weten of je het wel kan. (en ook dan pak je er een boek bij)

Waarom dan niet als je een website probeert te bouwen?

Okeej... dit soort reacties is nergens voor nodig. Ik doe me niet voor als professionele scripter ofzo, ik geef toe dat ik een amateur ben, en dat mijn code rommelig en slecht is. Maar ik werk met trial and error in een IE6 browser, en ik leer alles van tutorials, dan kan het nu eenmaal fout gaan.

Ik type trouwens wel alles zelf, en ik gebruik al helemaal geen FrontPage, om maar even een misverstand recht te zetten!!!

Daarnaast wordt ook nog geinsinueerd dat ik maar wat stukjes code "door elkaar gooi op goed geluk". Ik heb wel een idee van wat ik doe, er komt misschien een moment dat mensen zoals KillerCow moeten accepteren dat nog niet iedereen op de hoogte is van webstandaarden en de beste manieren om te scripten????

Ik ben ook nog bezig met leren, lijkt me sterk dat er iemand is die vanaf het begin alles meteen goed deed....!!!

Ik snap zelf ook wel dat niet elke browser hetzelfde werkt, dit was een klein misverstand tussen ibr en mij. Ik wilde alleen wat tips over hoe je hetzelfde kunt bereiken in verschillende browsers.
Ik snap nu het belang van een nette code en alle andere tips.

Ik wil wel even benadrukken dat ik al jullei tips heel erg waardeer en serieus neem . Ik ga de site zo snel mogelijk netjes, semantisch coden. Ik ga een aantal andere browsers downen, en ik ga voortaan netjes opmaak en structuur scheiden. Dan zijn de meeste problemen waarschijnlijk zo opgelost. Dus voor de mensen die wel iets serieus te zeggen hadden BEDANKT!

De mentaliteit kan hier wel beter, sommigen gaan andere mensen wat af liggen zeiken omdat ze dingen fout doen, hallo! Forum...? Fijn dat jullie er meer verstand van hebben dan ik, maar als je je te goed voelt, reageer dan niet op de n00b....

[André]

Ik snap je punt ibr, maar je hoeft niet zo fel te reageren Natuurlijk is het forum er ook voor de mensen met minder kennis over bepaalde zaken

En killercow, jouw bewoordingen mogen ook wel wat vriendelijker

[HawVer]

Verwijderd schreef op donderdag 08 september 2005 @ 15:35:
[...]


wat is er mis met uppercase tags, ik vind dit alleen maar handiger zodat je weet wat code is en wat niet ? of mis ik hier iets, en dan nog iets, helaas zit ik op mijn werk achter proxy, had graag dat stuk over symantisch (wat betekend dat woord eigenlijk) lezen, maar ga ik vanavond doen...

Een beetje html editor heeft syntax highlighting zodat het verschil tussen html code en normale text direct leesbaar is. Verder heb ik met uppercase weinig problemen zolang je het maar consistent gebruikt. Persoonlijk vind ik lowercase overzichtelijker en makkelijker lezen, maar dat zal wel zijn omdat ik het gewend ben..

XML spy is lekker coderen. Hij checked meteen of je xml/html valid is met de ingevoerde doctype. http://www.altova.com/products_ide.html Er is al een gratis versie (home) geloof ik.

[ Voor 12% gewijzigd door HawVer op 13-09-2005 22:26 ]

[CaptBiele]

ik denk dat er genoeg aandacht aan is geschonken en de ts weer vooruit kan...
draadje mag dicht?

[BtM909]

CaptBiele schreef op woensdag 14 september 2005 @ 11:19:
ik denk dat er genoeg aandacht aan is geschonken en de ts weer vooruit kan...
draadje mag dicht?

offtopic:
Draadjes gaan alleen bij uitzonderingen op de regels dicht: Algemene gedragsregels (Netiquette) #topiceinde

[ibr]

Hoi,
Een flink aantal maandjes en stress verder, is onze uiteindelijke versie van www.zishi.nl bijna af. Er moet nog wat content op (we zijn nog bezig met een flinke database voor de medewerkers, maar dat even terzijde).
Ik vroeg me af wat jullie er nu van vinden? Is de site zelf verbeterd? Is ie ook compatibler?

Laat jullie maar eens horen.

[AtleX]

Op 1280*1024 krijg ik een horizontale repeat van de achtergrond, dat lijkt me niet de bedoeling? Verder zitten er nog wel wat foutjes in je source,

edit:

Met: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-GB; rv:1.8.0.1) Gecko/20060111 Firefox/1.5.0.1

[ Voor 63% gewijzigd door AtleX op 09-02-2006 19:03 ]

[Alex)]

Ieuw, verticale scroller. Mag dat weg?

[ibr]

AtleX schreef op donderdag 09 februari 2006 @ 19:01:
Op 1280*1024 krijg ik een horizontale repeat van de achtergrond, dat lijkt me niet de bedoeling?

Ja, maar aangezien de meeste schermen toch op lagere resoluties werken, leek het ons overbodig om het plaatje zo groot te maken. Dus leek het ons logisch om de meest gebruikte schermresolutie te gebruiken.

[ibr]

Alex schreef op donderdag 09 februari 2006 @ 19:03:
Ieuw, verticale scroller. Mag dat weg?

Hangt van je browser af, in sommigen is dat niet te zien (of resoluties, zie ook mijn vorige post).

[AtleX]

Hogere resoluties worden steeds meer gebruikt, op een 17" TFT (bijzonder populair formaat) gebruiken heel veel mensen 1280*1024. En >60% van de verkochte laptops is breedbeeld, dus bijvoorbeeld 1280*960 of 1400*1050. En je moet je plaatje niet groter maken, maar zorgen dat het gewoon mooi samenvalt met de achtergrondkleur.

[BtM909]

Sorry, als je problemen hebt dan mag je verder, maar een simpele sitecheck dat doen we nou echt niet hier

[Alex)]

ibr schreef op donderdag 09 februari 2006 @ 19:05:
[...]


Hangt van je browser af, in sommigen is dat niet te zien (of resoluties, zie ook mijn vorige post).

IE7 beta 1, maar ik vind <marquee> een van de irritantste tags die ooit is bedacht. En ik vind het knullig overkomen. Een marquee gebruik je alleen voor bijvoorbeeld beursinfo of een headlinebalk ofzo, niet als introtekst.

[crisp]

Alex schreef op donderdag 09 februari 2006 @ 20:29:
[...]

IE7 beta 1

Sites gaan testen en beoordelen in een beta-versie van een browser waarvan bekent is dat alles nog rammelt zal m.i. niet echt tot objectieve resultaten leiden

[Alex)]

Weet ik wel, maar ik vind B1 nog steeds lekkerder werken dan B2, omdat B2's CSS-ondersteuning nog niet af is.
En <marquee> bestaat al sinds IE2 ofzo, heeft dus verder niets met de browserversie te maken

[Zoefff]

ibr schreef op donderdag 09 februari 2006 @ 18:58:
Hoi,
Een flink aantal maandjes en stress verder, is onze uiteindelijke versie van www.zishi.nl bijna af. Er moet nog wat content op (we zijn nog bezig met een flinke database voor de medewerkers, maar dat even terzijde).
Ik vroeg me af wat jullie er nu van vinden? Is de site zelf verbeterd? Is ie ook compatibler?

Laat jullie maar eens horen.

Wil je het echt weten? De site ziet er op het eerste gezicht leuk uit, maar zit nog steeds behoorlijk rommelig in elkaar.

Om te beginnen is de layout niet echt flexibel. De content staat niet in het midden (links zit meer ruimte dan rechts), en als je gaat resizen gaat het al snel fout. Op een resolutie van 1024 * 786 ziet hij er inderdaad goed uit. Ga ik het venster resizen, dan krijg ik al bij 871px breed een horizontale scrollbar, terwijl dat helemaal nergens voor nodig is. Tevens blijft er links een hoop ruimte over als je verder blijft verkleinen, op een breedte van 800px zie ik niet eens alle content meer, terwijl dat nog steeds een veelgebruikte resolutie is.

Andersom, het vergroten van het venster, is ook niet echt een succes. Het achtergrondplaatje is 1024 * 786, en komt eigenlijk alleen op die resolutie tot zijn recht. Kleiner ziet er minder goed uit, groter ook. Wat je bijvoorbeeld beter had kunnen doen is de pagina de blauwe achtergrondkleur van de lucht meegeven. Knip dan de onderste helft van je plaatje af (wolkenpartij en grond), en spiegel dit horizontaal zodat je het eeuwig kan blijven herhalen. Als je dit als achtergrondplaatje op de bodem van je pagina zet, of aan de statusbalk 'vastgeplakt', dan heb je áltijd een mooie achtergrond. Zonder herhalende plaatjes.

Een ander punt. Waarom gebruik je in godsnaam een iframe voor de content? Het heeft op deze pagina absoluut geen functionele waarde, je kan dit beter oplossen met een scripttaal als PHP, of desnoods met een paar losse HTML-pagina's.

Het code-gebruik is sowieso nog erg rommelig. En dan bedoel ik niet rommelig om te lezen (dat doet er weinig toe), maar rommelig qua semantiek. Je gebruikt nog steeds tabellen waar je die helemaal niet hoort te gebruiken. Voor het menu bijvoorbeeld kan je veel beter een unordered list gebruiken.

Je komt al enigzins in de richting, maar bent er imho nog lang niet. Neem nog eens een kijkje naar bovenstaande linkjes over semantiek etc.

[Zoefff]

Goed, net tijdens m'n ontbijt even een voorbeeldje geschreven hoe ík het zou aanpakken.

Cascading Stylesheet:

html {
    height:100%;
    padding:0px;
    margin:0px;
}
body {
    height:100%;
    margin:0px;
    padding:0px;
    background:url("bg_skyline.jpg") repeat-x bottom left; 
    background-color:#4B7794;
    font-family:sans-serif;
}
h1 {
    margin:0px;
    width:485px;
    height:140px;
    background:url("bg_logo.jpg");
}
h1 span {
    display:none;
}
h2 {
    margin:0px;
    padding:10px;
}
h2.collectie {
    height:30px;
    margin:0px;
    padding:10px;
    background-color:#CC6633;
    border-top:3px solid #943308;
    border-bottom:3px solid #943308;
    text-align:center;
}
p {
    padding:10px;
    color:#808080;
    font-size:13px;
    margin:0px;
}
#container {
    position:relative;
    width:485px;
    height:100%;
    margin:0px auto;
    background-color:#FFFFFF;
    border-left:3px solid #943308;
    border-right:3px solid #943308;
}
#menu {
    position:absolute;
    padding:0px;
    margin:0px;
    top:98px;
    left:-95px;
}
    #menu li {
        list-style-type:none;
        font-weight:bold;
        font-size:13px;
        text-align:right;
    }
    #menu li.home {
        font-size:25px;
        font-weight:normal;
        margin-bottom:15px;
    }
        #menu li a {
            color:#FFFFFF;
            text-decoration:none;   
        }
        #menu li a:hover {
            text-decoration:underline;
        }
#newsflash {
    position:absolute;
    top:85px;
    right:-175px;
    width:170px;
}
    #newsflash h2 {
        font-size:25px;
        font-weight:normal;
        color:#FFFFFF;
    }
        #newsflash h2 sup {
            font-size:13px;         
        }
    #newsflash p {
        color:#FFFFFF;
    }

HTML:

<div id="container">
    <h1><span>ZISHI nomad design</span></h1>
    <ul id="menu">
        <li class="home"><a href="#">home ></a></li>
        <li><a href="#">Over ons</a></li>
        <li><a href="#">Zishi Logo</a></li>
        <li><a href="#">Contact</a></li>
    </ul>
    <h2 class="collectie">Zishi collectie</h2>
    <h2>Welkom</h2>
    <p>Lorem ipsum dolor sit amet etc...</p>
    <p>Morbi at neque bibendum arcu cursus etc...</p>
    <div id="newsflash">
        <h2>News<sup>flash</sup></h2>
        <p>Lorem ipsum dolor etc..</p>
    </div>
</div>

Een voorbeeld vind je op http://zoefff.area61server.nl/got/zishi/ . Zoals je ziet is dit veel flexibeler bij het resizen, en is de code imho duidelijker en beter beschrijvend.

Het menu en nieuwsflash zijn nu absoluut gepositioneert, dat zou je zelfs nog met een mooie 3-column layout op kunnen lossen. Daar heb ik nu alleen geen zin in

Overigens is dit natuurlijk wel een codevoorbeeld om van te leren, klakkeloos kopieren -mocht je het gebruiken- zou ik niet echt waarderen

[Bosmonster]

@Zoeff:

Zowieso is ie buggy op Firefox Maak je scherm maar eens wat minder hoog en scroll naar beneden

Zit verder wel netjes in elkaar overigens

[ Voor 23% gewijzigd door Bosmonster op 10-02-2006 11:39 ]

[Orion84]

Naast de dingen die al aangedragen zijn viel me ook nog op dat de tekst hier en daar nogal erg dicht tegen plaatjes aan staat, wat niet echt prettig leest.

Dit is vooral het geval in de about pagina's en is in Firefox erger dan in IE.

[ Voor 21% gewijzigd door Orion84 op 10-02-2006 11:51 ]

[Sappie]

@Zoeff.. dat ziet er een stuk beter uit idd.. net voorbeeld.

Heb ff de bugginess verholpen in Firefox: http://tienstra4.flatnet....rein-got/zishi/zishi.html

edit: verder zijn de verschillende plaatjes die de ts gebruikt wel erg groot (kb's). Beter kijk je eens naar een ander formaat (in het geval van het logo) of gebruik je hogere compressie.

edit:
url weer ff valid gemaakt

[ Voor 45% gewijzigd door Sappie op 06-03-2006 20:43 ]

[Zoefff]

Die buggyness was me inderdaad opgevallen, maar afaik is dat wél een Firfox bug, en geen foute code. Maargoed, had geen zin om daar verder naar te kijken ofzo