Css beoordelen

Ik heb een layout gebased. Nu zou ik graag willen weten of er op of aanmerkingen zijn en hoe ik dat dan zou kunnen verbeteren. Het design stelt niet veel voor, dat komt omdat ik daar niet echt mijn best heb op gedaan en geen photoshop heb gebruikt.

De link:
http://tunyque.woelmuis.nl/geen/index.html

Alvast bedankt!!

ps.
Als je comentaar hebt ondersteun die dan met argumenten zodat ik weet wat ik moet/kan verbeteren dankje!

Als eerste wat mij meteen opvalt bij je code is dat je met Divs based, dat is iniedergeval goed! MAAR, het is handiger om met classes te basen, aangezien je die vaker als 1 keer mag gebruiken!
Bij deze layout maakt dat niet heel erg uit, maar als je layouts als http://www.straat-power.nl/ zie je dat aan de zijkanten eigenlijk hetzelfde is, en dus gewoon dezelfde class heeft. Met ids kan dit niet.

Verder gebruik je op 1 plek tabellen: Dit raad ik af!
Nooit tabellen gebruiken, behalve als het echt nodig is!
Deze inputs zijn ook te positioneren via input{ } in je css!

Ook heb je geen goed doctype, probeer voor iniedergeval XHTML 1.0 Transitional te zorgen inplaats van HTML 4.0.
En je hebt geen en tags! Dit mag je gewoon niet vergeten.

Goed, nu even over je Style.css:

Je gebruikt achtergrond plaatjes voor dingen die je gewoon met background-color kan doen!
Gebruik indien nodig altijd background-color, aangezien dit laadtijd scheelt!

En, maar dit is iets wat ik persoonlijk fijner vind, en geen verplichting! Gebruik niet

background: #c7c7c7 url(balk1.PNG) no-repeat;

Maar gewoon:

background-color:#c7c7c7;
background-image:url(balk1.PNG);
background-repeat:no-repeat;

Dit houd de code overzichtelijker vind ik!

Zie dit alsjeblieft neit als aleen maar commentaar, maar als opbowuende kritiek, want het ziet er verder zeer goed uit!

Eleky schreef:

Als eerste wat mij meteen opvalt bij je code is dat je met Divs based, dat is iniedergeval goed! MAAR, het is handiger om met classes te basen, aangezien je die vaker als 1 keer mag gebruiken!

Bij deze layout maakt dat niet heel erg uit, maar als je layouts als http://www.straat-power.nl/ zie je dat aan de zijkanten eigenlijk hetzelfde is, en dus gewoon dezelfde class heeft. Met ids kan dit niet.

Verder gebruik je op 1 plek tabellen: Dit raad ik af!
Nooit tabellen gebruiken, behalve als het echt nodig is!
Deze inputs zijn ook te positioneren via input{ } in je css!

Ook heb je geen goed doctype, probeer voor iniedergeval XHTML 1.0 Transitional te zorgen inplaats van HTML 4.0.
En je hebt geen en tags! Dit mag je gewoon niet vergeten.

Goed, nu even over je Style.css:

Je gebruikt achtergrond plaatjes voor dingen die je gewoon met background-color kan doen!
Gebruik indien nodig altijd background-color, aangezien dit laadtijd scheelt!

En, maar dit is iets wat ik persoonlijk fijner vind, en geen verplichting! Gebruik niet

background: #c7c7c7 url(balk1.PNG) no-repeat;

Maar gewoon:

background-color:#c7c7c7;
background-image:url(balk1.PNG);
background-repeat:no-repeat;

Dit houd de code overzichtelijker vind ik!

Zie dit alsjeblieft neit als aleen maar commentaar, maar als opbowuende kritiek, want het ziet er verder zeer goed uit!

Heel erg bedankt!
Op een paar dingen wil ik graag reageren.

1. Op die met classes als eerste. is het niet juist dat je id meerdere keren kan gebruiken? tenminste dat dacht ik. En als je toch in de plaats van id classes doet moet je toch in de css een . zetten in de plaat van een #? want dat weet ik niet zeker.

2. Die tabbellen zijn waarschijnlijk van het inlogsysteem. Die heb ik via een tutorial gedaan want van input velden snap ik nog niet het allermeeste.

3. ik heb die background zo gedaan omdat dat minder laadtijd is. en dat is dus het beste vind ik dan
4. en die head en body tags doet de host automatisch weghalen! maar hij gebruikt ze wel zou ik maar zeggen.

5. harstikke bedankt dat je hebt gereageerd en als je meer weet over die input velden of een link naar een goedde tutorial dan zou dat heel fijn zijn!!!

Niks op aan te merken.

Persoonlijk vind ik

background: #c7c7c7 url(balk1.PNG) no-repeat;

Netter als:

background-color:#c7c7c7;
background-image:url(balk1.PNG);
background-repeat:no-repeat;

Hoor, maarja

Ik ook, maar hij mag het zelf weten.

Rik schreef:

Persoonlijk vind ik

background: #c7c7c7 url(balk1.PNG) no-repeat;

Netter als:

background-color:#c7c7c7;
background-image:url(balk1.PNG);
background-repeat:no-repeat;

Hoor, maarja

Licht er maar net aan vind ik,
Een hoop mensen gebruiken SH-CSS (Short hand CSS), dit is makelijker en korter.
Maar sommige gebruiken ook normale CSS, En die is vrij uitgebreid.

voorbeeld van SH-CSS:

body{background: #c7c7c7 url(balk1.PNG) no-repeat;width:110px;border:1px solid black;}

voorbeeld normaal CSS:

body {
  background-color:#c7c7c7;
  background-image:url(balk1.PNG);
  background-repeat:no-repeat;
  width:110px;
  border:1px solid black;
}

Dit is niet mooi:

body {
  background-color:#c7c7c7;
  background-image:url(balk1.PNG);
  background-repeat:no-repeat;
  width:110px;
  border:1px solid black;
}

Dit wel:

body {
  background: url(balk1.png) no-repeat;
  background-color: #c7c7c7;
  width:110px;
  border:1px solid black;
}

Tom schreef:

Dit is niet mooi:

body {
  background-color:#c7c7c7;
  background-image:url(balk1.PNG);
  background-repeat:no-repeat;
  width:110px;
  border:1px solid black;
}

Dit wel:

body {
  background: url(balk1.png) no-repeat;
  background-color: #c7c7c7;
  width:110px;
  border:1px solid black;
}

Ik vind dit nog beter:

Codeblok (style.css):

1

body{background: url(balk1.png) no-repeat;background-color: #c7c7c7;width:110px;border:1px solid black;}

correctie:

Tom schreef:

Dit is vind ik niet mooi:

Ik vind het uitgebreid mooier dan het shorthand css, lijkt dan afgeraffeld alsof je er geen tijd voor heb genomen

Tunyque schreef:

Heel erg bedankt!

Op een paar dingen wil ik graag reageren.

1. Op die met classes als eerste. is het niet juist dat je id meerdere keren kan gebruiken? tenminste dat dacht ik. En als je toch in de plaats van id classes doet moet je toch in de css een . zetten in de plaat van een #? want dat weet ik niet zeker.

# = id = 1 maal
. = class = voor meerdere malen

Marjolein schreef:

# = id = 1 maal

. = class = voor meerdere malen

Okay, want op het begin deed ik het met classes alleen toen heeft iemand op een ander forum gezegd dat je veel beter ids kan gebruiken.
Geen idee waarom maar daarom doe ik het met ids.
En shorthand vind ik niet mooier maar wel beter voor de gene die de layout op zijn website zet.
Hij heeft dan minder laadtijd en minder laadtijd vinden bijvoorbeeld klanten heel fijn (ik ga altijd uit frustatie van het lange wachten ergens anders heen).

Dankje voor de uitleg van Ids en Classes voortaan ga ik classes gebruiken, schilt in de css.

uhhhh of je nu id of classes gebruik, dat maakt niet uit in laadtijd.
Je moet gewoon voor de plaatjes die je 1x gebruik een id gebruiken, zoals een header en footer, je gebruikt alleen classes als je cadres gebruik (van die vakjes die je meerdere malen kan gebruiken). De laadtijd heeft vooral met je afbeeldingen te maken, welke extensie je gebruik

of je nou:

body {
background-color:#c7c7c7;
background-image:url(balk1.PNG);
background-repeat:no-repeat;
width:110px;
border:1px solid black;
}

dit hebt, of:

body{background: url(balk1.png) no-repeat;background-color: #c7c7c7;width:110px;border:1px solid black;}

Maakt echt niet uit voor de laadtijd!
Wat wel uitmaakt voor de laadtijd zijn plaatjes!
Hou je plaatjes zo klein mogelijk, en gebruik geen onnodige, zoals je nu hebt gedaan met die balk, dat kan ook met background-color:;

Marjolein schreef:

uhhhh of je nu id of classes gebruik, dat maakt niet uit in laadtijd.

Je moet gewoon voor de plaatjes die je 1x gebruik een id gebruiken, zoals een header en footer, je gebruikt alleen classes als je cadres gebruik (van die vakjes die je meerdere malen kan gebruiken). De laadtijd heeft vooral met je afbeeldingen te maken, welke extensie je gebruik
Persoonlijk zou ik geen ids en classes door elkaar gaan gebruiken, het overzichtelijks vind ik 1 van de 2, en het lieft classes

Eleky schreef:

Eerdere citaten tonen

Marjolein schreef:

uhhhh of je nu id of classes gebruik, dat maakt niet uit in laadtijd.

Je moet gewoon voor de plaatjes die je 1x gebruik een id gebruiken, zoals een header en footer, je gebruikt alleen classes als je cadres gebruik (van die vakjes die je meerdere malen kan gebruiken). De laadtijd heeft vooral met je afbeeldingen te maken, welke extensie je gebruik
Persoonlijk zou ik geen ids en classes door elkaar gaan gebruiken, het overzichtelijks vind ik 1 van de 2, en het lieft classes

als je profesioneel gaat leren basen dan leer je ze allebei op de goede manier te gebruiken, ze zijn er niet voor niets