gå over fra gammel layout av tabeller til nyere metoder

[ThorB]

Hei.

Lurte på om noen hadde noen gode tips for hvordan denne siden her kan enkelt bygges:

http://home.no.net/thor918/layout/bruker_layout.jpg

(alt er så og si bygd opp av tabeller, HTML 4.01 Transitional)

 

Jeg vet layouten ikke er noe å skryte av.

men dette er en admin side.

så ting skal være så enkelt som mulig.

så layouten som er nå er helt ok..

men kunne ha tenkt meg å lære litt om bedre oppbygning(med tanke på html koden).

har sett på noen av dere webdesign-guruer her, og virker som det er div tags det går på nå.

 

Håper på konstruktive kommentarer.

Tanken er å bygge opp html koden helt på nytt ut i fra bildet som dere ser i linken.

 

Teknologier jeg bruker:

js, css, php, html

 

men det er altså ikke så viktig.. det er bare koden bak layouten jeg skal få ryddet opp.

 

setter utrolig pris på litt hjelp

Endret 13. desember 2007 av thor918

[eifoerde]

Nå er nok ikkje eg en av guruene innpå her, men selv ville eg brukt <div> og css til selve layouten på siden, og vanlige tables til listen over brukere

[ThorB]

Nå er nok ikkje eg en av guruene innpå her, men selv ville eg brukt <div> og css til selve layouten på siden, og vanlige tables til listen over brukere

Ja det er nettopp det jeg sitter å tenker på.

jeg benytter alt for mye tabeller her og der.

 

kanskje jeg poster html-kode her senere, for kritikk. er litt grønn på å bruke div til layout(begynte vel med nettkoding for tidlig ). så det kan ta litt tid

[eifoerde]

Er ikkje bare bare å venne seg av med bruken av tabeller istedet for div, er litt for lett å tenke:"pokker heller, det funker med table, vi bruker det bare litt til", kjenner meg litt for godt igjen akkurat der

[ThorB]

Er ikkje bare bare å venne seg av med bruken av tabeller istedet for div, er litt for lett å tenke:"pokker heller, det funker med table, vi bruker det bare litt til", kjenner meg litt for godt igjen akkurat der

ja det aller viktigste er jo at det fungerer.

men ser jo at litt bedre bruk av css kan gjøre innholdet og måten ting plasseres i siden litt bedre. blir litt ryddigere på en måte når det blir skikkelig gjenomført.

 

har prøvd å bygge opp den enkle layouten ved hjelp av css og divtags no..

http://home.no.net/thor918/layout/cleanhtml.zip

 

må innrømme at jeg falt for css oppbygningen til "T. Alexander Lystad" alias arex1337...

har ikke kopiert noe av koden din, men har brukt samme css oppbygningen. håper dette går greit

[hishadow]

Nå er nok ikkje eg en av guruene innpå her, men selv ville eg brukt <div> og css til selve layouten på siden, og vanlige tables til listen over brukere

Jeg har også forsøkt å holde meg til 100% div tagger men måtte krype tilbake til table. Problemet er hvis jeg vil samle en rekke div-tagger på en linje (hvor div-taggenes totale bredde kan overstige 100%), så dyttes div-taggene som blir overflødige ned på neste linje. Eneste måte jeg klarer å holde slik på en linje er ved bruk av tables.

[ThorB]

<table width="200px" border="0" cellspacing="1">
  <tr>
<td width="50px" align="left" valign="top">bilde</td>
<td width="150px" align="left" valign="top">massetekst</td>
  </tr>
</table>

 

hvordan får man konverter dette til divs?

 

jeg har et lite bilde der teksten bilde står, og så har jeg en rekke linjer på massetekst.

jeg vil da at tekstens nye linjer skal komme på rekke og rad.

 

okei fikk det til nå med

<div id="parent">

<div id="left">bilde</div>

<div id="right">massetekst</div>

</div>

 

satt left og right med flot..hadde en boarder på parent som sluttet å fungere helt til jeg fikk inn en

overflow:hidden; på parent. da vistes alt.

Endret 15. desember 2007 av thor918

[Haraldson]

Det er ikke enten div eller table det går i. Det blir altfor enkelt.

 

Det som betyr noe, er å markere opp siden din med de riktige elementene. En meny er en uordnet liste med listepunkter, en liste med brukere er enten en liste, eller - hvis det er en del informasjon bortover som i ditt tilfelle - en tabell. En overskrift er hN, et avsnitt med tekst er p.

 

Et skjema, som søk og innlogging, er en form med fieldset som igjen inneholder labels og input-felter.

 

Selve siden din rammer du inn i en div, og du kan også separere toppen og selve innholdsfeltet med hver sin div. Divene setter du dimensjoner på og midtstiller osv.

[ThorB]

@Haraldson

ja, jeg er i den forståelsen også, at alle taggene kan brukes, men de passer i forskjellige bruksområder.

 

Har sett litt på koden igjen, og konkluderer med at det er enklere å bruke classe selectorer i forhold til ID selectorer.

Ble litt tullball med ID selectorer, for da må man ha unike ID'er for å validere.

Trur like greit jeg går over til bare klassebaserte selectorer på hele greia.

[Haraldson]

ID-er har sine fordeler mtp. CSS og vekting av selektorer.

Det lureste er å bruke ID-er på ting som du vet at er unikt uansett. En hovedmeny er unik. En logo er unik. En container-div er unik. Et sidesøk i toppen er unikt. Osv.

 

http://www.stuffandnonsense.co.uk/archives...icity_wars.html

[ThorB]

ID-er har sine fordeler mtp. CSS og vekting av selektorer.

Det lureste er å bruke ID-er på ting som du vet at er unikt uansett. En hovedmeny er unik. En logo er unik. En container-div er unik. Et sidesøk i toppen er unikt. Osv.

 

http://www.stuffandnonsense.co.uk/archives...icity_wars.html

akkurat. takker for info

har gått for det meste for classer nå. men beholdte noen ID-baserte

 

Adminsystemet mitt er bygd opp av omtrendt 100% min kode..

det jeg nå tenker på er et slags extension system.

en mappe for hver extension..

å da kan det være at jeg trenger noen css koder knyttet til en bestemt extension.

det vil si at hvis en extension legges til, så kommer det ekstra css linjer som skal være med.

Er ikke 100% sikker på hvordan jeg skal løse dette...

 

default css:

adminfolder\css\screen.css

 

extension css:

adminfolder\css\extensionname\screen.css

 

kanskje la php gå igjennom mapper å legge til linker dynamisk til disse filene hvis den finner noe.

Endret 17. desember 2007 av thor918

[LOOM]

Det som er så bra med DIV/CSS er jo at du kan forandre alt av utseende på alle sidene dine ved å bytte ut èn CSS-fil med en annen. Det er ikke bare bare når du kun bruker tables...

[Haraldson]

Du trenger ikke å ha CSS i forskjellige filer, det holder at du tar høyde for all markup i én global CSS-fil. Gjør den gjerne 'modulær' ved å kommentere godt i fila og lage blokker med CSS som hører til hver modul.

[ThorB]

Du trenger ikke å ha CSS i forskjellige filer, det holder at du tar høyde for all markup i én global CSS-fil. Gjør den gjerne 'modulær' ved å kommentere godt i fila og lage blokker med CSS som hører til hver modul.

jeg har tenkt på det. men er ikke så sikker på at det er en god i ide i det lange.

det vil si hvis jeg lager en ny extension som jeg sender til kunde. vil den globale css måtte lastes over...

 

jeg vil at extensions/plugins sine css skal være uavhenige av de andre.

det jeg synes virker som en bedre løsning er at de nye css filene som tilhører extensions utvider den globale.

 

adminsystemet skal mest sannsynlig brukes i forskjellige situasjoner, derfor bygd opp med forskjellige extensions.

hmm.. må smake litt på det egentlig.