Metatags in PHP-pagina's

Status
Niet open voor verdere reacties.
zo, daar ben ik weer. Iets meer dan een maand geleden mijn laatste bericht hier gepost, inmiddels verhuisd, het grootste gedeelte uitgepakt en dus weer eens tijd voor andere dingen.
Ben hier dus weer mee begonnen. Ik heb nu de header aangepast en een gecombineerde afbeelding van gemaakt (beide buttonstates in 1 afbeelding) Echter zit ik nog een beetje te stoeien met de pixels volgens mij... :(

Mag ik vragen hoe jij hier mee te werk gaat? Gewoon heel eenvoudig pixels tellen en dat in de css verwerken? Ik mis namelijk een heel klein stukje aan de onderkant van de header en de buttons verspringen als ik er met de muis overheen ga, terwijl de afmetingen toch lijken te kloppen (gemeten in fotoshop door te slicen en dan de afmeting van die afbeelding te bekijken)

zie test3
 
Laatst bewerkt:
Nu ben ik nog weer ff wat verder bezig, en vraag ik me af waarom je eigenlijk de <h1> helemaal buiten beeld zet? Die kan nu dus niet gebruikt worden?
 
Hoi Bas,
Ik ben ook weer terug van weggeweest (even cascades hunten in de Alpen).
In:
Code: 
#header {
	height: 239; /* alleen het bovenste deel van het background-img wordt hier gebruikt! */
	background: url(images/header.png) no-repeat;
	}
staat er geen maateenheid bij de hoogte van 239, en weten browsers niet wat ze ermee moeten doen (zijn het pixels, mm's, em's, Engelse zeemijlen, Oud-Hollandse roeden, enz.?). Volgens de css-voorschriften moeten de browsers dan de hele regel met het opgegeven getal overslaan. Met 239px i.p.v. 239 zit het onderrandje er weer bij.
  • Ook de css-validator signaleert dit foutje: altijd goed om die even over een ongehoorzame pagina heen te laten gaan! ;)
  • De html-validator weet trouwens ook iets te melden: de <!-- vlak voor de <body> hoort er niet.
=====
Het opspringen bij het hoveren over de menu-items zit 'm inderdaad in het uittellen van de pixels in de hoogte.
Met:
Code: 
#header ul {
   padding: 177px 0 0 0;
   ...
   }
i.p.v. de opgegeven 175px is dit verholpen: de standaard menu-items moeten 2px lager komen.

=====
De "onzichtbare" <h1> dient als plaatsvervanger van de header-afbeelding: voor pure text-browsers die geen images en ook geen opmaak (css) ondersteunen. Deze kunnen de met css buiten beeld geplaatste <h1> wel lezen (en ook de <span>'s van het menu, die de menu-item afbeeldingen vervangen):

duo-id-textbrowsers-a.png

Zo kunnen bv. mensen met voorlees-browsers ook precies weten wat er op de pagina staat. Want anders zouden ze dit voorgeschoteld krijgen:

duo-id-textbrowsers-b.png

Verder is ook de Google-bot een pure text-lezer: deze ziet dus ook op elke pagina de belangrijke <h1> met de naam staan, wat de Google-ranking erg ten goede komt.
Omdat er voor een goede pagina-structuur maar één <h1> mag zijn, kan deze inderdaad verderop niet meer gebruikt worden.
Vandaar is de "echte pagina-kop" een <h2> geworden:
HTML: 
<h2 class="center">Duo <em>Idem Dito</em>: voor uw gezellige muziek!</h2>
Als dan de <h2> telkens ook gebruikt wordt voor de <title> van de pagina:
HTML: 
<title>Duo Idem Dito, voor uw gezellige muziek | Home</title>
en de trefwoorden eruit ook nog eens terugkomen in de <meta name="description" ...>, vindt Google het helemaal mooi:
herhaling jaagt de zoekresultaten van de pagina omhoog! :)

Met vriendelijke groet,
CSShunter
 
Weer een heel verhaal! :D

Bedankt, tja, die 239px heb ik over het hoofd gezien, ik moet me inderdaad aan gaan wennen om met de validator te gaan werken.

Wederom hartelijk dank voor je tips, ik heb een hele hoop geleerd de laatste 4 pagina's!

Nog ff wachten op de laatste info om de site compleet te maken, daarna gaan stoeien met modrewrite (moet ik me ook nog in verdiepen, heb er nog niet eerder mee gewerkt) en daarna kan ie online.

(p.s. de ene helft van het duo vond de nieuwe kleuren ook erg mooi, van de andere helft heb ik nog geen antwoord terug gehad)
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan