Miután elkészítek egy weblap design-ját Photoshopban, és lementem apránként, hogyan programozzam meg?

Egy modern weboldal szerkezeti felépítéséhez, ahogyan #1 is említett div elemeket szokás használni.

A div-eket mint konténereket használd.

Célszerű egy teljes méretű konténerrel kezdeni az alapozást.

Ebbe beleépíted a weboldal központi tartalmi konténerét, majd ebbe a részek konténereit, mint a fejléc, menüsáv, központi tartalom, lábléc.

Ezekbe azután újabb konténereket helyezhetsz el, ami tovább osztja a tartalmi elrendezést, mint pl a fejlcben a logó és a menü konténerei, amik egymás mellé (ill az egyik bal, a másik jobb oldara) kerülnek.

Célszerű használni azt a grid rendszert (css), ami alapján a design-t készítetted.

A különböző konténerek háttereiül a szétvágott psd elemeit használhatod. Nálad többnyire horizontálisan ismétlődő háttérelemekről van szó, ezért azokból elég a megfelelő magasságú, de csak pár pixel szélességű képcsíkokat elkészíteni, majd repeat-x-szel ismételni a konténer háttereként.

Jó megoldás, ha hasonló elrendezésű modern hnlapokat felkeresel, és tanulmányozod a css-üket ötletekért.

Sok sikert!

A header, footer, article tagok html5-ben bevezetett újdonságok. Jól használhatóak a html szerkezet felépítéséhez, de sajnos az internet explorer 8-as verziója (és régebbi) nem ismeri őket.

Egy modern weboldal böngészőfüggetlen...