|
| SEO og sidedesign med footer Fra : Morten |
Dato : 11-06-07 00:36 |
|
Hej jeg har egentlig spurgt en gang før men tråden tog en anden
drejning, så nu prøver jeg igen.
Jeg har opbygget en siden med absolut positionering og nu vil jeg
så gerne have en footer med i designet.
Derfor tænkte jeg at jeg ville sætte hele den nuværende kode ind
i et div-tag. Nedenunder dette ville jeg så lave endnu et div-tag
til footeren
Altså en struktur som den her:
<div>Alt det nuværende indhold</div>
<div>ny footer</div>
Problemet er at når jeg wrapper en div om alt det nuværende
indhold, så bliver den ikke fyldt ud af indholdet. Den ligger
bare øverst og tager ikke højde efter det indhold den er fyldt
af. Så den fremgangsmåde duer ikke.
Årsagen til at jeg har valgt absolut positionering er at det
giver
fuldstændig kontrol over designet. Samtidig kan man bytte rundt
på
rækkefølgen af indholdet i html koden uden at designet bliver
påvirket.
Det er rigtig smart, når det er vigtigt at siden er optimeret til
søgemaskinerne.
Hvis man eksempelvis laver sit design med float, så vil
rækkefølgen
i html koden typisk se sådan her ud
1. header med logo og måske en reklame
2. højre kolonne floatet til højre
3. Menuen floatet til venstre
4. Indholdet
5. Footeren
Det indhold og de søgeord som søgemaskinerne skal indeksere,
dukker
altså først op som det næstsidste i koden. Det betyder at
indholdet
ikke bliver vægtet lige så højt, som hvis det stod først i koden.
Med absolut positionering kan man flytte det væsentlige, nemlig
indholdet helt frem i koden, så det allerførste søgemaskinerne
møder
er den overskrift, som er sigende for hele siden. Det giver en
markant bedre indeksering og placering i søgemaskinerne.
Udfordringen er altså at lave et design hvor indholdet står først
og
de mindre relevante elementer, som menu header og reklamer står
længere nede i koden.
Vi taler selvfølgelig CSS og html.
Nogen bud?
--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials
| |
Allan Vebel (11-06-2007)
| Kommentar Fra : Allan Vebel |
Dato : 11-06-07 00:51 |
|
Morten skrev:
> Jeg har opbygget en siden med absolut positionering
Det er ikke altid den bedste løsning.
> og nu vil jeg så gerne have en footer med i designet.
Derfor er det ikke altid den bedste løsning
> <div>Alt det nuværende indhold</div>
> <div>ny footer</div>
>
> Problemet er at når jeg wrapper en div om alt det
> nuværende indhold, så bliver den ikke fyldt ud af
> indholdet.
Netop, det bliver bare lag på lag.
Du skal jo kende højden på dit indhold, og den kender
du ikke, da det ligger i et lag for sig.
> Nogen bud?
Du kunne lægge din footer ind umiddelbart efter dit
indholds-lag, det må kunne gøres med en include-fil på
alle sider.
Kom med et link til det du allerede har, ellers er det
helt umuligt at hjælpe dig.
--
Allan Vebel
http://html-faq.dk
| |
Morten (11-06-2007)
| Kommentar Fra : Morten |
Dato : 11-06-07 09:19 |
|
Tak for svar.
Det gælder følgende side: http://stillepc.dcmedia.dk (siden går i
luften 1.juli)
Der er to grund templates: Forsiden og en til artikler der kan
ses her:
http://stillepc.dcmedia.dk/stillepc-start/introduktion.html
Det er rigtigt at jeg kan sætte en footer ind efter indholdet,
men det er ikke en optimal løsning i forhold til søgemaskinerne.
Google sætter stor pris på at de relevante søgeord også bliver
nævnt til sidst i koden. Så en footer der indeholder artiklens
titel og copyright ville være meget fint. Men den skal jo stadig
stå til aller sidst i koden.
Det undre mig egentlig at man ikke kan bruge absolut
positionering og samtidig lade dem indgå i flowet. Det ville jo
give total frihed i opbygningen af koden.
Allan Vebel wrote in dk.edb.internet.webdesign.html:
> Morten skrev:
>
> > Jeg har opbygget en siden med absolut positionering
>
> Det er ikke altid den bedste løsning.
>
> > og nu vil jeg så gerne have en footer med i designet.
>
> Derfor er det ikke altid den bedste løsning
>
> > <div>Alt det nuværende indhold</div>
> > <div>ny footer</div>
> >
> > Problemet er at når jeg wrapper en div om alt det
> > nuværende indhold, så bliver den ikke fyldt ud af
> > indholdet.
>
> Netop, det bliver bare lag på lag.
>
> Du skal jo kende højden på dit indhold, og den kender
> du ikke, da det ligger i et lag for sig.
>
> > Nogen bud?
>
> Du kunne lægge din footer ind umiddelbart efter dit
> indholds-lag, det må kunne gøres med en include-fil på
> alle sider.
>
> Kom med et link til det du allerede har, ellers er det
> helt umuligt at hjælpe dig.
>
> --
> Allan Vebel
> http://html-faq.dk
>
>
--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials
| |
Bertel Lund Hansen (11-06-2007)
| Kommentar Fra : Bertel Lund Hansen |
Dato : 11-06-07 09:42 |
|
Morten skrev:
> Det undre mig egentlig at man ikke kan bruge absolut
> positionering og samtidig lade dem indgå i flowet.
Hvis du forankrer et skib, kan det ikke flyde frit.
--
Bertel
http://bertel.lundhansen.dk/ http://fiduso.dk/
| |
Ukendt (11-06-2007)
| Kommentar Fra : Ukendt |
Dato : 11-06-07 09:45 |
|
"Morten" <ning@tiscali.dk> skrev i en meddelelse
news:466d0569$0$90274$14726298@news.sunsite.dk...
> Det undre mig egentlig at man ikke kan bruge absolut
> positionering og samtidig lade dem indgå i flowet. Det ville jo
> give total frihed i opbygningen af koden.
Hvordan skulle det lige kunne lade sig gøre? Du ønsker både at indholdet
skal være der hvor det rent fysisk står i koden, og samtidig der hvor du vil
forankre det. Det bliver_svært_
PS. Vær venlig at svare under det du svarer på, og klip det overdlødige væk
--
Med venlig hilsen
Carsten Sørensen
Gode råd til webdesigneren - http://csnet.dk/html/
| |
Allan Vebel (11-06-2007)
| Kommentar Fra : Allan Vebel |
Dato : 11-06-07 21:21 |
|
Morten skrev:
> Det er rigtigt at jeg kan sætte en footer ind efter
> indholdet, men det er ikke en optimal løsning i
> forhold til søgemaskinerne.
Det er jo den eneste løsning du levner for dig selv,
når du har opbygget siden på den måde.
At placere indholdsteksten med absolute er en lidt
kluntet løsning, nu ser du jo selv hvorfor
Prøv også i IE6 at markere noget af teksten med
musen.
> http://stillepc.dcmedia.dk (siden går i luften 1.juli)
Så har du godt nok travlt, når du skal i gang med en
helt ny struktur, og samtidig rette valideringsfejl.
Den øverste Google-menu går i øvrigt helt galt i
Firefox - det skal du også nå at kigge på.
--
Allan Vebel
http://html-faq.dk
| |
Morten (12-06-2007)
| Kommentar Fra : Morten |
Dato : 12-06-07 13:54 |
|
Hej Allan.
Jeg kan godt se dine pointer. Og jeg kan godt høre at du ikke er
vild med tanken om absolut positionering og jeg ender nok med at
lave det om, men det ville være rart med konkrete
løsningsforslag.
At efterspørge et sidedesign hvor indholdet står først i koden er
vel fair og meget relevant.
Kan du ikke lige uddybe hvad du mener når du skriver:
> Den øverste Google-menu går i øvrigt helt galt i
> Firefox - det skal du også nå at kigge på.
Hos mig er der ingen problemer.
Og ja. Jeg kan godt se, at der er problemer med IE6 når teksten
markeres. Det må jeg ændre.
Allan Vebel wrote in dk.edb.internet.webdesign.html:
> Morten skrev:
>
> > Det er rigtigt at jeg kan sætte en footer ind efter
> > indholdet, men det er ikke en optimal løsning i
> > forhold til søgemaskinerne.
>
> Det er jo den eneste løsning du levner for dig selv,
> når du har opbygget siden på den måde.
>
> At placere indholdsteksten med absolute er en lidt
> kluntet løsning, nu ser du jo selv hvorfor
>
> Prøv også i IE6 at markere noget af teksten med
> musen.
>
> > http://stillepc.dcmedia.dk (siden går i luften 1.juli)
>
> Så har du godt nok travlt, når du skal i gang med en
> helt ny struktur, og samtidig rette valideringsfejl.
>
> Den øverste Google-menu går i øvrigt helt galt i
> Firefox - det skal du også nå at kigge på.
>
> --
> Allan Vebel
> http://html-faq.dk
>
>
--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials
| |
Allan Vebel (12-06-2007)
| Kommentar Fra : Allan Vebel |
Dato : 12-06-07 22:36 |
| | |
Ukendt (11-06-2007)
| Kommentar Fra : Ukendt |
Dato : 11-06-07 09:41 |
|
"Morten" <ning@tiscali.dk> skrev i en meddelelse
news:466c8ae9$0$90275$14726298@news.sunsite.dk...
> Problemet er at når jeg wrapper en div om alt det nuværende
> indhold, så bliver den ikke fyldt ud af indholdet. Den ligger
> bare øverst og tager ikke højde efter det indhold den er fyldt
> af. Så den fremgangsmåde duer ikke.
Nemlig, hvilket understreger at absolut position ikke nødvendigvis er den
bedste løsning. Det sker fordi absolut placeret indhold ikke indgår i sidens
normale flow. Men bare bliver til lag på lag
> Årsagen til at jeg har valgt absolut positionering er at det
> giver
> fuldstændig kontrol over designet.
Måske giver det kontrol, men kan også nemt give kedelige overraskelser.
Eksempelvis hvis brugeren skalerer teksten.
> Det er rigtig smart, når det er vigtigt at siden er optimeret til
> søgemaskinerne.
Man behøver nu ikke placere alt absolut, bare fordi med ønsker SEO
> Hvis man eksempelvis laver sit design med float, så vil
> rækkefølgen
> i html koden typisk se sådan her ud
>
> 1. header med logo og måske en reklame
> 2. højre kolonne floatet til højre
> 3. Menuen floatet til venstre
> 4. Indholdet
> 5. Footeren
Nu ved jeg ikke hvor du præcis ønsker hvad i html koden, men du kan
eksempelvis gøre sådan her
1. indhold
2. menu (placer absolut)
3. header (placer absolut)
4. højre kolonne (placer absolut)
5. footer.
Indhold og footer indgår stadig i sidens normale flow, og footeren vil
derfor placere sig under indholdet. Juster dem på plads med lidt margin og
padding.
--
Med venlig hilsen
Carsten Sørensen
Gode råd til webdesigneren - http://csnet.dk/html/
| |
Leonard (11-06-2007)
| Kommentar Fra : Leonard |
Dato : 11-06-07 10:14 |
|
On Mon, 11 Jun 2007 10:41:28 +0200, Carsten Sørensen wrote:
> Nu ved jeg ikke hvor du præcis ønsker hvad i html koden, men du kan
> eksempelvis gøre sådan her
>
> 1. indhold
> 2. menu (placer absolut)
> 3. header (placer absolut)
> 4. højre kolonne (placer absolut)
> 5. footer.
>
> Indhold og footer indgår stadig i sidens normale flow, og footeren vil
> derfor placere sig under indholdet. Juster dem på plads med lidt margin og
> padding.
Den løsning kræver at indholdet fylder mere en de andre kolonner.
Tag et kig på http://www.webdesign101.dk/ der findes eksempler på
flydende design, med SEO og footer.
Det gør der også andre steder, Jørgens sider er bare de nemmeste at
forstå for mig
--
Leonard
RC Tamiya King Hauler 1:14 sælges
http://leonard.dk/tilsalg/kh.php
| |
Bertel Lund Hansen (11-06-2007)
| Kommentar Fra : Bertel Lund Hansen |
Dato : 11-06-07 11:40 |
|
Leonard skrev:
> Den løsning kræver at indholdet fylder mere en de andre kolonner.
.... eller at man giver indhold en min-height og lige laver en
ekstra fidus for at IE 6 kan være med på den. Den ser sådan ud:
<!--[if lt IE 7]>
<style type='text/css'>
.indhold { height: 60em; }
</style>
<![endif]-->
og skal ligge i head-sektionen (ret navnet "indhold" hvis din
klasse hedder noget andet).
--
Bertel
http://bertel.lundhansen.dk/ http://fiduso.dk/
| |
Morten (12-06-2007)
| Kommentar Fra : Morten |
Dato : 12-06-07 14:42 |
|
Carsten Sørensen wrote in dk.edb.internet.webdesign.html:
> "Morten" <ning@tiscali.dk> skrev i en meddelelse
> news:466c8ae9$0$90275$14726298@news.sunsite.dk...
>
> > Problemet er at når jeg wrapper en div om alt det nuværende
> > indhold, så bliver den ikke fyldt ud af indholdet. Den ligger
> > bare øverst og tager ikke højde efter det indhold den er fyldt
> > af. Så den fremgangsmåde duer ikke.
>
> Nemlig, hvilket understreger at absolut position ikke nødvendigvis er den
> bedste løsning. Det sker fordi absolut placeret indhold ikke indgår i sidens
> normale flow. Men bare bliver til lag på lag
>
> > Årsagen til at jeg har valgt absolut positionering er at det
> > giver
> > fuldstændig kontrol over designet.
>
> Måske giver det kontrol, men kan også nemt give kedelige overraskelser.
> Eksempelvis hvis brugeren skalerer teksten.
>
> > Det er rigtig smart, når det er vigtigt at siden er optimeret til
> > søgemaskinerne.
>
> Man behøver nu ikke placere alt absolut, bare fordi med ønsker SEO
>
> > Hvis man eksempelvis laver sit design med float, så vil
> > rækkefølgen
> > i html koden typisk se sådan her ud
> >
> > 1. header med logo og måske en reklame
> > 2. højre kolonne floatet til højre
> > 3. Menuen floatet til venstre
> > 4. Indholdet
> > 5. Footeren
>
> Nu ved jeg ikke hvor du præcis ønsker hvad i html koden, men du kan
> eksempelvis gøre sådan her
>
> 1. indhold
> 2. menu (placer absolut)
> 3. header (placer absolut)
> 4. højre kolonne (placer absolut)
> 5. footer.
>
> Indhold og footer indgår stadig i sidens normale flow, og footeren vil
> derfor placere sig under indholdet. Juster dem på plads med lidt margin og
> padding.
>
>
> --
> Med venlig hilsen
> Carsten Sørensen
>
> Gode råd til webdesigneren - http://csnet.dk/html/
>
>
--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials
| |
Morten (12-06-2007)
| Kommentar Fra : Morten |
Dato : 12-06-07 14:47 |
|
Denne her ide kan jeg godt lide, da koden bliver som jeg gerne vil have den. Og
kombineret med en minimum height på indholdet bliver der ikke noget rod.
Men når jeg umiddelbart forsøger at få indholdet på plads ved hjælp af maginer,
placerer det sig forskelligt i Firefox og IE. Er der en løsning på det?
/Morten
Carsten Sørensen wrote in dk.edb.internet.webdesign.html:
> "Morten" <ning@tiscali.dk> skrev i en meddelelse
> news:466c8ae9$0$90275$14726298@news.sunsite.dk...
>
> > Problemet er at når jeg wrapper en div om alt det nuværende
> > indhold, så bliver den ikke fyldt ud af indholdet. Den ligger
> > bare øverst og tager ikke højde efter det indhold den er fyldt
> > af. Så den fremgangsmåde duer ikke.
>
> Nemlig, hvilket understreger at absolut position ikke nødvendigvis er den
> bedste løsning. Det sker fordi absolut placeret indhold ikke indgår i sidens
> normale flow. Men bare bliver til lag på lag
>
> > Årsagen til at jeg har valgt absolut positionering er at det
> > giver
> > fuldstændig kontrol over designet.
>
> Måske giver det kontrol, men kan også nemt give kedelige overraskelser.
> Eksempelvis hvis brugeren skalerer teksten.
>
> > Det er rigtig smart, når det er vigtigt at siden er optimeret til
> > søgemaskinerne.
>
> Man behøver nu ikke placere alt absolut, bare fordi med ønsker SEO
>
> > Hvis man eksempelvis laver sit design med float, så vil
> > rækkefølgen
> > i html koden typisk se sådan her ud
> >
> > 1. header med logo og måske en reklame
> > 2. højre kolonne floatet til højre
> > 3. Menuen floatet til venstre
> > 4. Indholdet
> > 5. Footeren
>
> Nu ved jeg ikke hvor du præcis ønsker hvad i html koden, men du kan
> eksempelvis gøre sådan her
>
> 1. indhold
> 2. menu (placer absolut)
> 3. header (placer absolut)
> 4. højre kolonne (placer absolut)
> 5. footer.
>
> Indhold og footer indgår stadig i sidens normale flow, og footeren vil
> derfor placere sig under indholdet. Juster dem på plads med lidt margin og
> padding.
>
>
> --
> Med venlig hilsen
> Carsten Sørensen
>
> Gode råd til webdesigneren - http://csnet.dk/html/
>
>
--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials
| |
Kerim Ellentoft (12-06-2007)
| Kommentar Fra : Kerim Ellentoft |
Dato : 12-06-07 22:26 |
|
Morten <ning@tiscali.dk> skrev :
>Men når jeg umiddelbart forsøger at få indholdet på plads ved hjælp af maginer,
>placerer det sig forskelligt i Firefox og IE. Er der en løsning på det?
At du starter med at læse
http://www.html.dk/nyhedsgrupper/usenet.asp, især Gælder der
nogle regler for nyhedsgrupperne?
Tilsvarende står der også tydeligt, når du besvarer et indlæg på
html.dk.
Såfremt man ikke følger de enkle retningslinjer, så ender det med
at folk bliver trætte af en skribent og man ignorer/bortfiltrerer
vedkommende.
--
Kerim
»Søger nogen en anden religion end Islam, skal den ikke modtages
af Ham, og han skal i det kommende liv være blandt taberne.«
(Sura 3, vers 87)
| |
Rune Jensen (13-06-2007)
| Kommentar Fra : Rune Jensen |
Dato : 13-06-07 00:05 |
|
"Morten" skrev i en meddelelse...
> Denne her ide kan jeg godt lide, da koden bliver som jeg gerne vil have
> den.
Jamen det er da godt, du kan lide den idé. Så er det jo synd, man ikke kan
se, hvilken idé, du mener, eftersom det lader til at være essentielt for den
videre besvarelse af spørgsmålet og løsningen på dit problem.
http://www.usenet.dk/netikette/citatteknik.html
Et lille hint om, at din citatteknik kan forbedres. Det er tilladt at læse
hele siden
MVH
Rune Jensen
| |
Morten (13-06-2007)
| Kommentar Fra : Morten |
Dato : 13-06-07 11:16 |
|
Jeg har vist afsløret at jeg ikke er super erfaren i brugen af nyhedsgrupper...
> Jamen det er da godt, du kan lide den idé. Så er det jo synd, man ikke kan
> se, hvilken idé, du mener, eftersom det lader til at være essentielt for den
> videre besvarelse af spørgsmålet og løsningen på dit problem.
Det var Carstens Sørensens ide med at placere indholdet først og footeren sidst.
Se citatet her under:
>1. indhold
>2. menu (placer absolut)
>3. header (placer absolut)
>4. højre kolonne (placer absolut)
>5. footer.
>
>Indhold og footer indgår stadig i sidens normale flow, og footeren vil
>derfor placere sig under indholdet. Juster dem på plads med lidt margin og
>padding.
Det er lykkedes mig at få det nogenlunde på plads i IE7 og firefox ved at
positionere indholdet med padding. I dag skal jeg så se om jeg kan få det passet
til så IE6 også viser sider hvor boksen til indholdet ikke er den højeste
rigtigt.
Se fremskridtet her:
http://stillepc.dcmedia.dk/stillepc-start/introduktion.html
Og en side hvor indholdet ikke er højest:
http://stillepc.dcmedia.dk/stillepc-start/om-stillepc.html
Er der i øvrigt noget med at man kan annullere browserens standard styling?
--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials
| |
Erik Ginnerskov (13-06-2007)
| Kommentar Fra : Erik Ginnerskov |
Dato : 13-06-07 17:35 |
|
Morten wrote:
> Er der i øvrigt noget med at man kan annullere browserens standard
> styling?
Det gør al css da.
Med mindre der på brugerens maskine ligger en css med prædikatet !important
for nogle specielle definitioner.
Det har jeg f.eks. med hensyn til scrollbarfarvning i IE, hvor jeg fastlåser
standardfarven, uanset hvad en webside måtte indeholde af syge ideer om at
gøre scrollbaren næsten usynlig på grund af farvesætning:
http://hjemmesideskolen.dk/net/nocolor.asp
--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk/ - http://ginnerskov.dk/
http://html-faq.dk
| |
Jørn Andersen (13-06-2007)
| Kommentar Fra : Jørn Andersen |
Dato : 13-06-07 22:57 |
|
On 13 Jun 2007 10:15:53 GMT, Morten <ning@tiscali.dk> wrote:
>Er der i øvrigt noget med at man kan annullere browserens standard styling?
Ja, ved at definere noget andet.
Det er oftest meget nyttigt at nulstille margin og padding, da
forskellene mellem browsernes default settings her ofte driller - fx
med:
html, body {
padding:0;
margin:0;
}
eller:
* {
padding:0;
margin:0;
}
Good luck!
--
Jørn Andersen,
Brønshøj
| |
Philip Nunnegaard (11-06-2007)
| Kommentar Fra : Philip Nunnegaard |
Dato : 11-06-07 14:38 |
|
> <div>Alt det nuværende indhold</div>
> <div>ny footer</div>
Hvad med dette?
<div>
Alt det nuværende indhold
<div>
ny footer
</div>
</div>
| |
Morten (14-06-2007)
| Kommentar Fra : Morten |
Dato : 14-06-07 18:01 |
|
For lige at runde tråden af vil jeg fortælle hvilken løsning jeg
endte med at benytte.
Jeg fandt at Carsten Sørensens forslag (herunder) bedst levede op
til mine krav:
-------------------------
1. indhold
3. header (placer absolut)
4. højre kolonne (placer absolut)
5. footer.
Indhold og footer indgår stadig i sidens normale flow, og footeren
vil derfor placere sig under indholdet. Juster dem på plads med lidt
margin og padding.
-------------------------
Og kombineret med Bertels forslag til at sætte en min-height på
indholdet og lave en udtagelse for IE6 virker alt nu som det skal.
Bertels undtagelse:
<!--[if lt IE 7]>
<style type='text/css'>
..indhold { height: 60em; }
</style>
<![endif]-->
Tjek gerne siden og kom med kommentarer, hvis der er noget der ikke
ser rigtigt ud.
Mvh
Morten
--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials
| |
|
|