Tryout 3D-Sculpturen Garageband 3D-Stereo-Fototechniek Audio-Techniek BBCBasic Web-design Line-Box-drawings PC-Applicaties Files2Index Mouseover MakeHtml |
Web design: Om snel en gemakkelijk een website te kunnen ontwerpen heb ik het conversie-programma TxtToHtml gemaakt. Bij TxtToHtml wordt een hele website in een makkelijk leesbare textfile mbv. Kladblok (Notepad) geschreven. Het conversie-programma heb ik in BBC Basic for Windows geschreven, zie BBCBasic. Het conversie-programma TxtToHtml.exe zet de textfile in een aantal Html-files om (Html = Hyper text markup language = opmaaktaal voor het maken van internet-pagina's). Deze Html-files kunnen vervolgens direct op het internet gezet worden. TxtToHtml maakt gebruik van een Initialisatie-programma, waarmee oa. kleuren gekozen kunnen worden. Het kiezen van de juiste kleur voor de letters van de tekst, de links, de achtergrond en omgeving is van het grootste belang. omdat met deze kleuren de sfeer van de website bepaald wordt; wordt het een zakelijke, vrolijke, opvallende of ingetogen website?
Onderstaande websites zijn met mijn TxtToHtml-programma gemaakt: Art-Site Frits de Groot (kpn) Art-Site Frits de Groot (hccnet) Spiegelogie (hccnet) Try-Outs = deze site (kpn) Art-Site Maria de Groot (kpn) Art-Site Alberto Valentini (kpn) Illustraties en strips In de broncode, die met Kladblok als een textfile wordt bewaard, worden puntcommando's gebruikt. Een puntcommando bestaat uit een punt in de meest links kolompositie met een letter: .P Index Een webpagina met de naam Index. Onder .P Index moet de inhoud (content) van de web-pagina Index ingetiept worden. Gebruik betekenisvolle namen. De allereerste pagina van een website heet meestal Index.htm. De extensie .htm zet het programma er automatisch bij. .I Image0101t Image0101.htm Maakt een klikbare meestal kleine afbeelding t van thumbnail (foto van postzegelformaat bvb. hxb = 120x90 pixels), die de pagina Image0101.htm toont. .P Image0101 Een webpagina met de naam Image0101, die een (grote) foto afbeeldt. bijvoorbeeld: .I Image0101.jpg Afbeelden van de foto Image Image0101.jpg .I Image0101t Image0101.htm Maakt een klikbare meestal kleine afbeelding, die de pagina Image0101.htm toont. .I Image0101t Image0101.jpg Maakt een klikbare meestal kleine afbeelding, die de foto Image0101.jpg toont. .F Lucida Sans Unicode De volgende tekst wordt in een nieuw font afgebeeld. .W http://www.google.nl Google Door klikken op het woord Google, wordt www.google.nl opgeroepen.
Eindig de tekstfile met .End en Enter (Return). Zoals hier boven verteld maakt het conversie-programma gebruik van een initialisatie-programma om het opmaken van een website makkelijker te maken. Hier onder het menu van het programma: Met de knop Show Ini-files kun je de namen van de reeds aanwezige ini-files zien. Vervolgens kun je in het lege venster links van de Show Ini-files knop de gewenste ini-file invoeren en dan op de Load Ini-file knop klikken. In een voorbeeldvenster verschijnen de gekozen instellingen en kan je nog wijzigingen aanbrengen en een nieuwe versie van de ini-file met de knop Save Ini-file bewaren. In het lege venster links van de Show Txt-files knop kun je de naam van de broncode file met de punt-commando's, zoals hier boven uitgelegd, invoeren als je op de Edit Txt knop klikt. In kladblok verschijnt de file en kun je wijzigingen aanbrengen, die je in kladblok onder Bestand moet Opslaan. Klik dan op de Make Html knop om de html files voor de website te genereren. Het is de bedoeling dat je ook direct de html site te zien krijgt, lukt dit niet klik dan nog een keer op de Make Html knop. Hieronder het voorbeeldvenster, zodat je de kleuren en het lettertype direct kunt beoordelen: Overzicht van de Files:
Tips en opmerkingen:
Knoppen: Accentkleur1 krijg je met cijfer 1 wat vooraf gegaan door het accent-teken linksboven Kleur2 met cijfer 2 Kleur3 met cijfer 3 Kleur4 met cijfer 4 Kleur5 met cijfer 5 Kleur6 met cijfer 6 Accentkleur7 met cijfer 7 Accentkleur8 met cijfer 8 Accentkleur9 met cijfer 9 Het kleuraccent stoppen met cijfer 0 vooraf gegaan door het accent-teken linksboven Achtergrondkleur = kleur midden veld Kleur zijvelden = kleur zijvelden links en rechts Omgevingskleur = kleur buiten middenveld en zijvelden Letterkleur = kleur van de tekst in het middenveld Link-kleur = kleur van tekst waarop geklikt kan worden Kleur aktieve link = kleur van tekst als je met de muis er op staat Kleur gebruikte link = kleur van tekst wat eerder als link is gebruikt Load Ini-file = Laadt de Ini-file, die in het invulvenster ingevoerd is. Save Ini-file = Bewaart de Ini-file, die in het invulvenster ingevoerd is. Show Ini-files = Toont alle Ini-files. Help = Verwijzing naar Internetsite met deze Help-Info. Edit Txt = Om in kladblok je broncode met de punt-commando's te editten. Make Html = Genereert Html files voor Internet. Show Txt-files = Toont alle broncode files. Exit = Om uit het programma te stappen. Lettertype = font van tekst in het middenveld Font grootte = formaat van het font Simpele Html-codes tussenvoegen: <B>Vet gedrukt</B> <U>Onderstreept</U> <UL type=disc><LI>
Duidelijke uitleg over html codes: www.htmlhulp.com/nl/ |
|