Do's en Dont's Website

[battler]

Het is alweer 8 jaar geleden dat ik voor het laatst een website heb gemaakt.
Ik was op dat moment 11/12 dus ongetwijfeld was het voor toen die tijd ook geen perfect code,
maar vandaag de dag zijn er toch aardig wat dingen veranderd.

De bedoeling is eigenlijk dat het een vrij simpele site wordt. Een banner, menu en main page, simpel
en volgens mij goed te doen.
Vroeger (toen ik nog jong was ) Deed ik alles met frames, nu moet dat blijkbaar anders.
Ik heb me een beetje ingelezen over div e.d, en toegepast op mijn website.
Via een external css bestand wordt alles gepositioneerd. Nu is mijn probleem dat ik graag
targets wil opgeven. Zodat een link die aangeklikt wordt in de div menu, een nieuwe pagina opent
in de div main.

Nu kan ik nergens op internet hier iets over vinden, waarschijnlijk kan wat ik wil helemaal niet.
Die wijsheid haal ik o.a uit de volgende link: http://www.dynamicdrive.c...ve/index.php/t-16754.html en http://www.phpfreakz.nl/forum.php?forum=3&iid=1092692

Ik zoek een oplossing zonder: Ajax of javascript.
Zoektermen google: css target links. css href link, css link, div linking

Uiteraard zijn andere tips over wat er vandaag de dag allemaal nog meer niet kan van harte welkom .

[ Voor 4% gewijzigd door battler op 18-02-2009 22:25 ]

[TERW_DAN]

Als je geen javascript wilt kun je er ook altijd nog voor kiezen om dingen als het menu e.d. gewoon te includen (bijv vanuit PHP), zodat je in principe iedere keer een page refresh hebt.

Wil je daadwerkelijk targetten zoals je dat met frames kon doen, dan is een JS oplossing wellicht het beste.

[MuisM4t]

In principe kun je alleen een volledig nieuwe pagina aanroepen, als je niet met frames en/of javascript werkt. Daarnaast is werken zonder frames en javacript in je navigatie ook voor de zoekmachines n het beste.

Het beste is dus om te doen wat terw_dan zegt: verwijs naar een volledig nieuwe pagina en include de onderdelen, zoals bijvoorbeeld een menu, die je hetzelfde wil houden gewoon.

[ Voor 40% gewijzigd door MuisM4t op 18-02-2009 22:32 ]

[Verwijderd]

MuisM4t schreef op woensdag 18 februari 2009 @ 22:29:
Daarnaast is werken zonder frames en javacript in je navigatie ook semantisch gezien het beste.

Wat betekent semantisch dan?

[battler]

bedankt voor de snelle reactie. Als ik het goed begrijp dan is het dus als volgt:

<a href="lampen.html"> lampen </a>
Gehele pagina wordt opnieuw geladen, en in de main komt de nieuwe tekst te staan.

[MuisM4t]

Verwijderd schreef op woensdag 18 februari 2009 @ 22:32:
[...]

Wat betekent semantisch dan?

Semantisch betekent: alles in de juiste context (tag) : Maak onderscheid tussen headers en gewone text, plaats links in anchor's enz. enz.

was net bezig met editten en toen zag ik jouw post

[djangoster]

Misschien moet je gebruik maken van een CMS? Dat is best makkelijk... www.joomla.org is een heel mooi CMS. Je installeert het cms, zet er een template op, richt het in met de menuitems en klaar is kees...

[curry684]

MuisM4t schreef op woensdag 18 februari 2009 @ 22:38:
[...]

Semantisch betekent: alles in de juiste context (tag) : Maak onderscheid tussen headers en gewone text, plaats links in anchor's enz. enz.

Ik kan je garanderen dat Cheatah dat heel goed weet en je alleen even wilde na laten denken over dat technische keuzes mbt het gebruik van iframes en javascript geen ruk van doen hebben met semantiek

[DeluxZ]

djangoster schreef op woensdag 18 februari 2009 @ 22:42:
Misschien moet je gebruik maken van een CMS? Dat is best makkelijk... www.joomla.org is een heel mooi CMS. Je installeert het cms, zet er een template op, richt het in met de menuitems en klaar is kees...

Joomla Zeg dan Wordpress, met een aantal plugins is het een mooi CMS. Er is veel over te vinden op internet en het is makkelijker aan te passen dan Joomla ( )

[TeeDee]

Voor de semantiek geldt: net als met 'programmeren'; the right tool for the right job.
Wat betreft de vraag:

Nu is mijn probleem dat ik graag
targets wil opgeven. Zodat een link die aangeklikt wordt in de div menu, een nieuwe pagina opent
in de div main.

Waarom? Omdat je denkt dat het je tijd gaat besparen dat je maar 1 x een menu (bijv.) aanmaakt?
Vziw weet zijn huidige browsers snel zat en is bijvoorbeeld een website zoals Tweakers.net onder de 2 secondes ingeladen. Maak je liever druk om optimalisaties, beschreven in de diverse (niet zaligmakende) documenten van o.a. Yahoo.

DeluxZ schreef op woensdag 18 februari 2009 @ 22:51:
[...]
Joomla Zeg dan Wordpress, met een aantal plugins is het een mooi CMS. Er is veel over te vinden op internet en het is makkelijker aan te passen dan Joomla ( )

Of drupal. Of custom built. Of... of.. of.. Als je niks hebt om te onderbouwen....

[ Voor 21% gewijzigd door TeeDee op 18-02-2009 22:56 ]

[curry684]

DeluxZ schreef op woensdag 18 februari 2009 @ 22:51:
[...]


Joomla Zeg dan Wordpress, met een aantal plugins is het een mooi CMS. Er is veel over te vinden op internet en het is makkelijker aan te passen dan Joomla ( )

Wordpress is een blogging engine. Het kan een aantal dingen inherent goed uit die specialisatie, en een aantal dingen expliciet minder goed dan een generiek CMS als Joomla. En hoewel ik het honderd procent met je eens ben dat Joomla, Mambo en aanverwante wanprodukten troep zijn is een 'my product is better than yours' flamewar niet bepaald relevant voor een topic van iemand die als hobby een siteje voor zichzelf wil fixen.

[battler]

Ik heb ook stiekem al een beetje gekeken naar producten als Joomla en Wordpress, maar dat is echt iets voor productie websites. Dit is gewoon "ik bak er geen zak van, maar wil het wel leren" hobby website.

[TeeDee]

Ik denk dat de baseline wel duidelijk is:
Je wilt iets zelf bouwen om of bezig te zijn of te leren, maar wel helemaal hip en zonder JS / XHR. Ga gewoon aan de slag met een taal die je bevalt (PHP, Asp.net, of plain-old HTML). Sitechecks doen we hier niet, maar problemen of andere invoelshoeken kan je altijd dumpen/vragen.

[MerijnB]

Als mede website bouw noob kan ik je dit aanraden (beviel mij wel iig): http://www.cmsmadesimple.org/
Doet z'n naam eer aan

[mcDavid]

battler schreef op woensdag 18 februari 2009 @ 23:04:
Ik heb ook stiekem al een beetje gekeken naar producten als Joomla en Wordpress, maar dat is echt iets voor productie websites. Dit is gewoon "ik bak er geen zak van, maar wil het wel leren" hobby website.

Als dat het doel is kun je je dat CMS beter besparen idd.

Eerst maar eens een basic understanding krijgen van hoe je tegenwoordig websites bouwt, als je eenmaal een mooi ontwerp heb is het een fluitje van een cent om daar later een template van te maken.

Een hoop moois is te lezen op www.w3schools.com, ook zeer geschikt als naslag.

Kijk verder eens naar bijv www.csszengarden.com om het kunstje af te kijken.

Een moderne, statische website bestaat tegenwoordig uit precies dat: statische pagina's. Menu's e.d. laat je gewoon op iedere pagina terugkomen.
Nu denk je waarschijnlijk: dat wordt tyfuswerk als je een pagina wilt toevoegen of iets wilt veranderen.
Een grote slag hierin is al gemaakt door op alle pagina's dezelfde externe CSS sheet te gebruiken.
Een volgende stap is dingen als een menu, header, footer, kortweg alles wat regelmatig terugkeert, uit je HTML-bestand te knippen, apart op te slaan, en op de server (d.m.v. een include) weer te laten samenvoegen.

nóg een stap verder is de zaak omdraaien, van je ontwerp een template maken, en de content vanuit een database in die template invoegen. Ofwel: een CMS.

Laatste tip: Veel mensen die stoppen met complete websites opmaken in frames willen overstappen naar "alleen divs en CSS". Dat is een foute gedachtegang. Gebruik niet overal klakkeloos de <div> tag, maar bedenk wat je weer wilt geven en gebruik het element wat daar bij past. Als dat een tabel is gebruik je gewoon <table>. Ook tabellen laten zich prima met CSS opmaken.

[PainkillA]

maak een template aan van alles wat statisch is. Zet daarin php tags als volgt op de plekken die dynamisch worden opgebouwd.

<div id="content">
<?=$Content ?>
</div>

zelfde voor je menu bijv.

In je index.php of iets anders kun je nu elke keer aan de hand van de GET of POST parameters de jusite content uit de database trekken en neerzetten in $content. Daarna include je deze template en klaar ben je.

[Da Weef]

Wat betreft de do's en don'ts, is dit wel een geinige site:

http://www.webrichtlijnen.nl/

Er worden wat open deuren ingetrapt en af en toe wel erg op het detail geneuqt, maar geeft desondanks wel een aardig overzicht en bevat een handige automatische toets.

[RM-rf]

battler schreef op woensdag 18 februari 2009 @ 22:24:

Nu is mijn probleem dat ik graag
targets wil opgeven. Zodat een link die aangeklikt wordt in de div menu, een nieuwe pagina opent
in de div main.

dat klinkt eerder alsof je niet daadwerkelijk 'div's' wilt gebruiken (of andere tags; div-soep brouwen wil ik je zeker ook niet aanraden en het is een verkeerd idee dat 'vooruitgang' op het bouwen van website's gebaseerd zou zijn op het gebruik van 'div-tags overal waar je vroeger frames gebruikte.... de vooruitgang ligt vooral in een andere conceptuele aanpak, semantiek en de opzet van je code) ...


Wat je beschrijft is waarschijnlijk het meest eenvoudig te gebruiken door het toepasen van IFRAME's ...
een aantal nadelen van frame-gebruik blijf je dan behouden (het zeer gefragmentariseerd zijn qua opzet van je HTML-code, slechtere indexering of toegankelijkheid en mogelijk problemen in de history/bookmarking en/of forward-backbuttons).
Het is wel de enige methode om een 'Frame-achtige navigatie toe te passen zonder Javascript en andere voordelen van CSS-based positionering toe te kunnen passen.


Wel zou ik je zeker aannraden toch wat verder te zoeken naar wat er nu precies anders is, als je eigelijk op dezelfde manier websites bouwt als 7,8 of 9 jaar terug, hooguit met wat andere 'tags' en misschien soms een beetje niewere techniek, haal je weinig voordeel uit de grotere mogelijkheden die je nu hebt.
Probeer dus ook uit te vinden wat er allemaal 'vernieuwd' is qua puur conceptuele en structurele aanpak vane en 'HTML-gebaseerde website' (en dat is vooral gericht op het versterken van de efficientie, overzichtelijkheid code en bv dingen als het scheiden van bepaalde verschillende elementen, structuur van enkel visuele vormgeving)

[Zakkenwasser]

Da Weef schreef op donderdag 19 februari 2009 @ 10:33:
Wat betreft de do's en don'ts, is dit wel een geinige site:

http://www.webrichtlijnen.nl/

Er worden wat open deuren ingetrapt en af en toe wel erg op het detail geneuqt, maar geeft desondanks wel een aardig overzicht en bevat een handige automatische toets.

ik scoor toch al wel 116 punten

[Da Weef]

MrJey schreef op donderdag 19 februari 2009 @ 16:05:
[...]

ik scoor toch al wel 116 punten

Ik kwam zelf niet veel verder dan 114, maar dat had vooral te maken met gebruik van javascript en CSS3

[battler]

Bedankt voor de vele tips. die website is inderdaad erg handig (webrichtlijnen.nl), ik scoor op dit moment
115 punten, maar ik moet nog beginnen met het includen van pagina's dan ben ik al een heel eind. Bedankt voor de vele tips, uiteraard hoe meer hoe beter.

[mcDavid]

die test zegt niet zo veel volgens mij, zelfs de meest vreselijke site scoort nog met gemak 110 punten ofzo.. wat ook geen slechte score is voor een perfecte website met een paar irrelevante schoonheidsfoutjes...

[crisp]

Er staat ook duidelijk bij dat slechts 47 punten echt machine-checkable zijn en dat de rest pas wat zegt als ook een handmatig onderzoek heeft plaatsgevonden. Ik vind de webrichtlijnen goed als richtlijn, maar ze zijn in mijn ogen behoorlijk conservatief...

[curry684]

Onze corp site faalt op 5 punten, waaronder 2 maal "je gebruikt geen strict doctype".

Dat er volstrekt valide redenen zijn om voor transitional doctypes te kiezen komt niet in ze op

[Da Weef]

curry684 schreef op donderdag 19 februari 2009 @ 23:53:
Onze corp site faalt op 5 punten, waaronder 2 maal "je gebruikt geen strict doctype".

Dat er volstrekt valide redenen zijn om voor transitional doctypes te kiezen komt niet in ze op

Ze zijn inderdaad erg conservatief en op het detail, maargoed het betreft dan ook richtlijnen en geen regels of standaarden...
Ik denk dat er in het algemeen weinig valt aan te merken op de richtlijnen, maar dat er wel degelijk uitzonderingen zijn. Reeds genoemde voorbeelden als gebruik van css3, javascript en transitional doctypes zullen in de praktijk nagenoeg nooit problemen opleveren en kunnen wel veel toegevoegde waarde hebben. Echter dat dergelijke keuzes wel in staat zijn om te leiden tot problemen is desalniettemin een relevante constatering als men daar zelf niet van op de hoogte is.

[crisp]

Da Weef schreef op vrijdag 20 februari 2009 @ 00:34:
[...]


Ze zijn inderdaad erg conservatief en op het detail, maargoed het betreft dan ook richtlijnen en geen regels of standaarden...
Ik denk dat er in het algemeen weinig valt aan te merken op de richtlijnen, maar dat er wel degelijk uitzonderingen zijn. Reeds genoemde voorbeelden als gebruik van css3, javascript en transitional doctypes zullen in de praktijk nagenoeg nooit problemen opleveren en kunnen wel veel toegevoegde waarde hebben. Echter dat dergelijke keuzes wel in staat zijn om te leiden tot problemen is desalniettemin een relevante constatering als men daar zelf niet van op de hoogte is.

True; ik zeg ook altijd dat als je je keuzes voor een bepaald 'failed' punt kan beargumenteren dat dat uiteindelijk weer als een 'passed' punt beoordeelt dient te worden