Over deze site en meer ...


routekaart en opzet

De opzet van deze site was altijd al simpel. Een menu kolom links en de tekst rechts. Toen ik met deze site begon kon dat alleen door het scherm zoals dat heet op te delen in twee frames. Met de komst van HTML-5 en CSS-3 zijn mijn zelfgemaakte pagina's niet meer in een menu deel en een tekst deel opgesplitst. Hierdoor is het aantal files nodig voor de site afgenomen. Alleen de door Pro-Gen gegenereerde pagina's gebruiken nog de zogenoemde frames waarbij de pagina welke u ziet uit een aantal losse delen is opgebouwd. Het gebruik van deze frames geeft wel een flink aantal files. Voor elke ProGen-link zijn 5 files ter beschikking. Dat alleen geeft 15 files voor de Nederlandstalige site. De ProGen-files bestaan uit een frame-indeling, een key-index, een index, de gegevensfile en een file voor het Pro-Gen logo.
De wijziging naar HTML-5 is vooral ingegeven door het feit dat de zoekmachines, en vooral het veel gebruikte Google, een lagere plaats op de lijst van zoek resultaten geeft voor sites met veel oude HTML pagina's.


HTML-5, CSS-3 en Javascript

HyperText Markup Language (versie 5) is de code welke overwegend wordt gebruikt om deze pagina's vorm te geven. Cascading StyleSheets worden op deze site sinds enkele jaren gebruikt om een aantal zaken als letter soort, kleur en grootte vast te leggen. Ook zaken als marge en achtergrondkleur worden in het stylesheet vastgelegd. Aangezien verschillende pagina's dezelfde opmaak hebben kan deze door het gebruik van een stylesheet voor alle pagina's in een keer worden aangepast.
Met de komst van HTML-5 en CSS-3 is het gemakkelijker geworden om pagina's zich zelf aan te laten passen voor verschillende scherm groottes. U kunt dat waarnemen als u de breedte van uw browser venster een flink stuk veranderd.
Er zit nog maar weinig Javascript in deze pagina's, maar de foto-pagina maakt er nog gebruik van. De Javascript code is ideaal om foto's klein op de pagina te plaatsen, waarna deze door aan te klikken groot in een apart venster worden geplaatst.

Was in er het verleden soms een flink verschil tussen het uiterlijk van de pagina's op verschillende browsers, momenteel is dat nauwelijks waarneembaar. De 4 bekendste hedendaagse browsers – Firefox, Chrome, Edge en Opera – werken als men de nieuwste versie gebruikt zonder problemen. Er zijn echter alternatieve browsers welke niet de laatste HTML en CSS standaarden gebruiken.

Browser problemen?

Mocht u toch problemen hebben met de manier waarop deze pagina's op uw browser in beeld komen, controleer u dan als eerste of uw browser up-to-date is. Zoekt u eens in de roldown-menu's van de browser naar Help/About. Als u op about klikt krijgt u vaak te zien welke versie u heeft en soms ook de melding of er een nieuwere versie bestaat. Mocht u toch problemen hebben met de manier waarop deze pagina's op uw browser in beeld komen, controleer u dan als eerste of uw browser up-to-date is. Zoekt u eens in de roldown-menu's van de browser naar Help/About.

Als uw browser up-to-date is en u toch problemen heeft, dan hoor ik dat graag van u. Meldt u a.u.b. Met welke browser – en het versie nummer – u deze problemen heeft. Ik kan dan kijken of er een optie bestaat om het probleem te ondervangen.


Zelf webpagina's maken

Er is mij al wat keren gevraagd of het maken van deze pagina's moeilijk is. Het antwoord is nee. Met de hulp van wat boeken over HTML (5.0) en CSS (3) kan iedereen een eind komen. De moeilijkheid zit hem meer in de perfectie, in de details. Het toevoegen van de juiste opdracht opdat er een extra witregel wordt gebruikt, dezelfde opdracht niet vergeten omdat anders twee regels aan elkaar worden geplakt. Kortom de transpiratie zit meer in het testen en verbeteren van de pagina's dan in het bedenken er van.

Verder is de vraag of er dure zaken voor nodig zijn. Dat kan, maar het is niet nodig. Op het internet (http:www.filehippo.com) vindt je gratis editors. Ik gebruik zelf al jaren voor het uitwerken van de pagina's de freeware versie van AceHTML. Daarin ook zit een controle mogelijkheid waarmee ik kan nagaan of en welke fouten er in mijn pagina's zitten. Een verder voordeel van dat programma is ook dat er meerdere files open kunnen zijn. Bij het aanpassen van pagina's aan de nieuwe HTML versie is dat gemakkelijk om zo met kopiëren en plakken snel vaste onderdelen zoals het menu naar de volgende pagina's over te brengen.
Een wat meer hedendaags programma is BlueGriffon. Het is een WYSIWYG programma waarbij u in theorie geen HTML tags hoeft te leren. Een nadeel van de gratis versie is dat er geen handleiding bij zit. Die moet u kopen. Wel kunt u op Youtube filmpjes vinden over het gebruik van dit programma.

Ook is het mogelijk om van programma's als MS/Word gebruik te maken. U kiest dan bij opslaan als voor HTML. Ik heb Word eens getest, waar ik zelf een halve pagina aan HTML gebruikte, had Word het zesvoudige nodig. Dat programma gebruikt alle mogelijkheden welk het maar kan vinden om de zekerheid te hebben dat er niets wordt vergeten. Zonde van de beperkte ruimte welke je van je provider voor je pagina's krijgt.
Het is zelfs mogelijk om met wordpad of kladblok een webpagina te maken. Sommige boeken geven dit ook als voorbeeld. Je schrijft de HTML pagina in wordpad, slaat hem op en opent hem in je brouwser. Kijk wat je wilt veranderen, klik onder in het scherm wordpad weer aan, verander de tekst, sla op, klik de browser aan, klik op vernieuwen, enzovoort. Simpel.

Boeken kopen, dat kost geld. Vroeger kon je eerst in de bibliotheek gaan neuzen. En bij de winkels van 'Jan de Slechte' kon je soms voordelig aan goede boeken komen, zelfs bij tweede hands! Helaas, computerbeurzen met kramen vol met voordelige boeken, ze zijn er niet meer.
Belangrijk! Koop nooit een boek alleen op aanbeveling of op het uiterlijk. Als u denkt dat het iets voor u kan zijn neem dan rustig de tijd om uit een aantal hoofdstukken een bladzijde of twee door te lezen. Kijk hoe de schrijfstijl bevalt, legt de schrijver de zaken voor u duidelijk uit. Beslis daarna of u het boek wilt kopen.


Er zijn ook websites welke u kunnen leren om websites te schrijven. Maar ik heb sites gezien welke nog vertelden hoe HTML4 werkt. Er is een goede site, hij is weliswaar in het Engels, maar w3schools.com is op dit gebied een aanrader.

Verder hebt u een zgn. FTP programma nodig om je pagina's op internet te zetten (voorop gesteld dat uw provider een plaatsje voor u heeft gereserveerd). Ook dat vindt je op http://www.filehippo.com. Maar sommige internet providers hebben via mijn... (bijv. mijn-ziggo) op hun site een optie voor filetransfer. Mijn FTP programma is al jaren WS-FTP lite.

FileHippo
w3schools
Boeken site van Paul McFedries (engels)