simpele site maken

[ByteWarrior]

PS. ik heb nog even gekeken naar sites over Comic Sans en de critiek op het lettertype ontgaat me. Ik ben het met de schrijvers eens dat het lettertype haar oorspronkelijkheid wat gaat verliezen door het vele gebruik er van. Maar om die reden zou je Time new roman en Arial dan ook moeten gaan bannen. Voor mij hangt het gebruik ervan gewoon af vande doelgroep. Comic Sans heeft een wat minder zakelijke uitstraling maar blijft wel goed leesbaar... Uiteindelijk een kwestie van smaak dus.

Even terzijde...

Er zijn verschillende nadelen verbonden aan Comic Sans. Niet enkel is het helemaal niet geschikt voor zakelijk gebruik, maar het is ook niet geoptimaliseerd op getoond te worden op schermen (van pc's bijvoorbeeld).

Wat betreft webpagina's kan je beter gebruik maken van een standaardlettertype als Arial of Verdana. Dit zijn lettertypes die bijna iedereen op zijn pc geïnstalleerd heeft.

Vergeet ook niet dat het lettertype op de pc van de "lezer" geïnstalleerd moet zijn. Zelf ben ik ook geen fan van Comic Sans, dus ik heb het lettertype ook niet geïnstalleerd. Bij mij zal jouw website er dus al zeer anders uitzien.

[Robby]

O...,

Dat is nog wel een belangrijk punt Ben. Ik heb in de kop nl. het OCB- lettertype gebruikt. Ik denk dat ik daar dan een grafische banner van moet maken, anders gaat dat ook mis.

Als ik jouw suggestie wil opvollgen om in het menu geen tabel te gebruiken dan moet ik daar ook grafische knopjes van maken en dat vind ik eigenlijk niet zo handig (m.n. als de menutjes weer aangepast moeten worden. Jammer dat Nvu geen standaard knopjes aanbied waar je dan een tekstje in kunt zetten.

Alweer bedankt Ben!

[nirwana]

Er zijn verschillende nadelen verbonden aan Comic Sans. Niet enkel is het helemaal niet geschikt voor zakelijk gebruik, maar het is ook niet geoptimaliseerd op getoond te worden op schermen (van pc's bijvoorbeeld).

Dan heeft Robby wel gelijk dat hetzelfde geldt voor Times New Roman. Dat wordt ook gebruikt als er geen lettertype is opgegeven en dat vind ik nu ook niet bepaald een voorbeeld van wat je op Internet zou moeten gebruiken. Times New Roman vind ik eigenlijk alleen geschikt voor in documenten en ik vind het er voornamelijk goed uit zien als je het afdrukt. Maar ja, dat doen we natuurlijk steeds minder in dit digitale tijdperk (ahum).

[ByteWarrior]

Als ik jouw suggestie wil opvollgen om in het menu geen tabel te gebruiken dan moet ik daar ook grafische knopjes van maken en dat vind ik eigenlijk niet zo handig.

Als je SSI (server side includes) of PHP gebruikt, kun je eigenlijk hetzelfde menu op iedere pagina laten weergeven. Je verwijst dan gewoon naar hetzelfde bestand.

Het voordeel is dat je bij een menu-wijziging niet alle pagina's hoeft aan te passen.

Over de knoppen:
Je kan de knoppen opmaken met CSS (als je dat wilt natuurlijk). Dan wordt het bijvoorbeeld zoiets:

Code: Selecteer alles

<ul id="menu">
  <li>Menu 1</li>
  <li>Menu 2</li>
  <li>Menu 3</li>
</ul>

In de CSS komt dan iets te staan als:

Code: Selecteer alles

#menu li { 
  color: blue;
  background-color: #efefef;
  border: 1px solid green; 
  padding: 0.5em; 
}

Zo'n code is, volgens mij toch, veel makkelijker in het onderhoud dan knoppen met een vaste tekst. Het voordeel is ook dat tekst sneller laadt dan afbeeldingen. De surfer merkt dus een kleine snelheidsverbetering.

Dan heeft Robby wel gelijk dat hetzelfde geldt voor Times New Roman. Dat wordt ook gebruikt als er geen lettertype is opgegeven en dat vind ik nu ook niet bepaald een voorbeeld van wat je op Internet zou moeten gebruiken. Times New Roman vind ik eigenlijk alleen geschikt voor in documenten en ik vind het er voornamelijk goed uit zien als je het afdrukt. Maar ja, dat doen we natuurlijk steeds minder in dit digitale tijdperk (ahum).

Dat is ook juist. Times New Roman is niet echt geschikt voor een beeldscherm. Dan zou Arial eigenlijk beter als "standaardlettertype" gebruikt worden.

Ik denk dat het gebruik van Times New Roman eigenlijk historisch gegroeid is. Ik denk dat het één van de eerste "leesbare" lettertypes was. Tegenwoordig heb je natuurlijk Arial en Verdana, maar als ik me niet vergis, zijn dat Microsoft-lettertypes... En die zijn natuurlijk niet altijd beschikbaar (Ik geloof dat ik een omweg heb moeten gebruiken om ze op mijn Linuxsysteem toch te installeren). Times (New Roman) daarentegen wel.

[nirwana]

Ik denk dat het gebruik van Times New Roman eigenlijk historisch gegroeid is. Ik denk dat het één van de eerste "leesbare" lettertypes was. Tegenwoordig heb je natuurlijk Arial en Verdana, maar als ik me niet vergis, zijn dat Microsoft-lettertypes... En die zijn natuurlijk niet altijd beschikbaar (Ik geloof dat ik een omweg heb moeten gebruiken om ze op mijn Linuxsysteem toch te installeren). Times (New Roman) daarentegen wel.

Ik denk dat dat komt doordat vanuit tekstverwerkers documenten als HTML werden opgeslagen. Digitale documenten moesten op Internet gepubliceerd worden. Dan wordt het standaard-lettertype in een tekstverwerker al snel ook het standaard-lettertype op het Internet (ook al is dat daar misschien nooit voor bedoeld). In het begin lag ook vnl de nadruk op het publiceren van informatie en niet zozeer op hoe het er grafisch uit zag.

[Robby]

Ik vrees dat ik toch nog enige bijstand nodig heb...

Martijn,
bij mij kan ik de tabbladen achter "algemeen" niet activeren. Ik wil bijvoorbeeld het standaard lettertype op Arial 12 pt zetten, maar het tabblad "tekst" krijg ik niet geactiveerd. De achtergrondkleur wil ik ook veranderen, maar tabblad "achtergrond" krijg ik ook niet aan de gang.

Wat moet ik invullen achter "media lijst"? er staat standaard "all" achter bij mij.

Ben,
Ik ben nog niet toegekomen aan jouw suggesties voor het maken van knoppen. Ik kom er nog op terug.

Groeten Robby

[nirwana]

Als er "all" aan de rechterkant staat, dan heb je aan de linkerkant de "internal stylesheet" geselecteerd. Je moet eerst een nieuwe regel aanmaken (klik op de knop Rule onderaan de lijst aan de linkerkant en kies vervolgens aan de rechterkant voor Create a new style applied to all elements of type (enter type below)). Vervolgens vul je daaronder het element in waarvoor je een nieuwe regel wilt aanmaken (bijvoorbeeld h1 in jouw geval). Klik je dan op de knop daaronder (Create Style Rule) dan verschijnt in de lijst aan de linkerkant een h1 en die wordt direct geselecteerd. Vervolgens is het tabblad Text wel te selecteren (aangezien je aan de linkerkant een regel hebt geselecteerd).

Onthoud dat als je geen tabbladen kunt selecteren je aan de linkerkant niet een juist element hebt geselecteerd. Dat komt volgens mij enkel voor als je aan de linkerkant de "internal stylesheet" hebt geselecteerd, dus maak eerst enkele regels aan en ken daar vervolgens de opmaakkenmerken aan toe.

[Robby]

Bedankt Martijn,

De stijlen werken nu wel!

Maar nu heb ik er echt een zooite van gemaakt... Als ik nu met FF, of NVU de hele site opsla (opslaan als) dan wordt maar een deel van de site gekopieert. Sommige mappen worden niet mee gekopieerd en de mappen die wel worden gekopieerd krijgen een foute naam mee (een oude naam die ik vroeger gebruikte). Ik heb alle HTM-files bekeken, maar ik zie nergens die oude map-namen nog voorkomen

Wat nu weer? Iemand suggesties?

[Robby]

Ik heb een beetje kunnen uitpuzzelen wat er mis gaat, maar ik heb nog geen oplossing. Ik zou nog wel een beetje hulp kunnen gebruiken!

1.
Als ik de site opsla dan worden de submappen automatisch omgezet in: <bestandsnaam>_data en de map bij het hoofd html bestand wordt automatisch <bestandsnaam>_files. Klaarblijkelijk is dat een defaultsetting van FF en NVU

2.
In het menu heb ik koppelingen staan en die zouden relatief t.ov. de beginpagina moeten zijn. Ik heb dat aangevinkt. Maar op een of andere manier werkt dat niet goed. Als ik de site opsla op een andere lokatie (op mijn harde schijf), en vervolgens de link uit het menu van de zojuist opgeslagen site onderzoek dan verwijst hij naar het adres waar ik het vandaan gekopieerd heb.
Ik vermoed dat daarom maar een deel van de sub-mappen wordt gekopieerd bij het opslaan vanuit de site met FF

Zou het bovenstaande kunnen kloppen?

Groeten Robby

[nirwana]

Robby,

Kun je aangeven hoe je een site/pagina/map probeert te kopieren vanuit Nvu ?

Alvast bedankt,

Martijn

[Robby]

Hoi Martij,

> Bestand
> Opslaan als


De mappenstructuur is alsvolgd:
<> = map
() = bestand

<Mijn Documenten>
_<Index_files>
_(Index.html)
___<Zijkant_data>
___<Bovenkant_data>
___<Onderkant_data>
___<Middendeel_data>
___(Zijkant.html)
___(Bovenkant.html)
___(Onderkant.htm.)
___(Middendeel.html)

Alleen de mappen <Bovenkant_data> en <Zijkant_data> worden mee gekopieerd naar de nieuwe lokatie.

[Robby]

Ik probeer de site nu opnieuw op te zetten, met alleen CSS en simulatie van frames. Wel een stuk moeilijker! Wat me maar niet lukt is om van de links die in het linker menu staan de inhoud in het rechter veld te krijgen. Weet iemand hoe dat moet?

Dit is overigens de code (enkel in de body:

Code: Selecteer alles

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"
 lang="nl">
<head>
  <meta http-equiv="Content-Type"
 content="application/xhtml+xml; charset=UTF-8">
  <title>Layout</title>
  <style type="text/css">
html {
height:100%; max-height:100%; padding:0; margin:0; border:0; background:#fff; font-size:76%; font-family: verdana, arial; background:rgb(255,255,204); background-position:-18px 0;
/* hide overflow:hidden from IE5/Mac */ /* \*/ overflow: hidden; /* */ }
body {height:100%; max-height:100%; overflow:hidden; padding:0; margin:0; border:0;}
#content {display:block; height:100%; max-height:100%; overflow:auto; padding-left:200px; position:relative; z-index:3;}
#head {position:absolute; left:0; margin:0; top:0; right:18px; display:block; width:100%; height:50px; background:rgb(214,100,50); font-size:32px; z-index:5; color:#FFFFCC;}
#left {position:absolute; left:0; top:0; height:100%; width:200px; background:url(Index_files/figuur.png); background-repeat:no-repeat; background-position:-170px 170px; font-size:12px; color:#FFFFCC;z-index:4;}
#foot {position:absolute; margin:0; bottom:-1px; right:18px; display:block; width:100%; height:50px; background:rgb(214,100,50); color:#FFFFCC; font-size:10px; z-index:4;}
#content p {padding:5px;}
.bold {font-size:1.2em; font-weight:bold;}
#wordsleft {float:left; top:100px; left:150px; height:200px; width:150px; background:#efd; border:1px solid #000; margin:5px; padding:5px;}
#wordsright {float:right; top:100px; right:150px; height:200px; width:150px; background:#def; border:1px solid #000; margin:5px; padding:5px;}
#wordsabsolute {position:absolute; top:280px; left:400px; background:#eee; border:1px solid #000; margin:5px; padding:5px; font-size:2em; color:#c00;}
#wordsrelative {position:relative; top:10px; left:30px; background:#ddd; border:1px solid #000; margin:5px; padding:5px; font-size:2em; color:#c00; width:200px;}
a.nav, a.nav:visited {display:block; width:100px; height:25px; text-decoration:none; color:#FFFFCC; font-weight:bold; line-height:25px;}
a.nav:hover {color:#D6640F;} #fc0 </style>
</head>
<body>

[steve]

Ik weet niet of ik je hiermee kan helpen, ik heb op mijn site ook zo'n situatie
Maak een pagina met daarop de gewenste linken als volgt, als vb noem ik deze pagina1.html

!A HREF="pagina##.html" target="hoofdframe">.............!/A><br>
!A HREF="pagina##.html" target="hoofdframe">.............!/A><br>
(de ## zijn je paginanummers, de .........de titels van de pagina's, ik heb hierboven wel de < vervangen door een !, anders is de code niet zichtbaar)
maak al je linken op deze manier, vergeet target="hoofdframe" niet
Dan maak je je indexpagina als volgt:
<html>
<head>
<title>................... </title>
</head>


<frameset cols="160,*">
<frame src="pagina1..html" noresize name="navigatie">
<frame src="start.html" name="hoofdframe">
</frameset>
</html>
Ik heb hier nog start.html in het hoofdframe, dit is een afbeelding.

De code cols kan je aanpassen, naargelang de breedte je wil
T is een beetje moeilijk uitleggen zo maar als je een beeld wil ervan moet je maar even kijken op mijn site http://users.telenet.be/stevenskoipagina/

[Robby]

Dag Steve,

Bedankt voor je reaktie, maar de 'target'-optie lijkt alleen te werken bij frames en die heb ik niet. De 'id'-optie werkt in zekere zin wel, maar dan verplaatst de link zelf naar het gebied rechts, niet de inhoud van de link....


Groeten Robby

[nirwana]

In tegenstelling tot bij frames, laadt je nu het hele venster opnieuw in. Dus als je 1 zo'n pagina goed hebt, dan kopieer je die en maak je op basis daarvan een tweede. Vervolgens link je van de ene pagina naar de andere.

Je bent nu bijvoorbeeld bezig met de pagina index.html. Als je vindt dat die qua structuur goed is, dan kun je die bijvoorbeeld als een sjabloon opslaan. Vervolgens kun je op basis van dat sjabloon nieuwe pagina's maken.
Overigens kan dit ook zonder sjablonen, maar aangezien Nvu ook sjabloon-mogelijkheden biedt kunnen we die hier best gaan gebruiken.
Op basis van die beginpagina kun je zoveel pagina's maken als je wilt. Via het menu aan de linkerkant link je dan naar de afzonderlijke pagina's.`