Tekst op site soms onder elkaar i.p.v. in gewone regels

Nvu, Kompozer en Bluegriffon zijn open source (WYSIWYG) programma's waarmee je een website kunt maken en onderhouden (vergelijkbaar met FrontPage / Dreamweaver).
Gebruikersavatar
nirwana
Beheerder
Berichten: 11528
Lid geworden op: 19 september 2003, 5:09
    Windows 7 Firefox
Contacteer:

Re: Tekst op site soms onder elkaar i.p.v. in gewone regels

Bericht door nirwana »

Hans,

Als we daar dan toch mee bezig gaan, zullen we dan het menu ook wat eenvoudiger maken ?

Op www.mozbrowser.nl/web/pnf/index.html heb ik weer een kopie van de beginpagina van de website geplaatst. Daarbij heb ik de opmaak van het menu vooral eenvoudiger gemaakt. Het menu stond namelijk vol met dingen die rechts uitgelijnd moesten worden en lettertypes die kleiner gemaakt werden.

Dan geef ik liever 1 keer de breedte van het menu op (zodat ik die ook nog later kan veranderen) en ook geef ik 1 keer op dat die tekst rechts moet worden uitgelijnd. Verder geef ik 1 keer op dat het lettergrootte 11 pixels moet zijn.

Ik heb hier het menu wat meer naar links verplaatst, aangezien het mij opviel dat de ene tabel een cellpadding van 10 had en de andere van 0. Dus heb ik die ook naar 0 gezet, maar toen kwam het menu wel erg dicht op de tekst te staan. Daarom leek het me handig om het menu wat meer naar links te verplaatsen. Toch blijven de verwijzingen in het menu nog wel rechts uitgelijnd. Alleen komt de lijn aan de rechterkant waartegen ze worden uitgelijnd wat eerder.

Ik ben benieuwd wat je hiervan vindt. Als dit je bevalt, dan kunnen we dit als standaard gebruiken en dat ook in de andere pagina's van de website doorvoeren. Volgens mij moet het wel mogelijk zijn om de pagina's niet meer zo te laten verspringen.
Met vriendelijke groet,

Martijn
[ Mede-oprichter + webmaster MozBrowser | beheerder Startpagina's over freeware, GIMP, Mozilla en OpenOffice.org / LibreOffice, Ubuntu
Hannes1
Berichten: 37
Lid geworden op: 17 augustus 2010, 18:09
    Windows XP Internet Explorer 8

Re: Tekst op site soms onder elkaar i.p.v. in gewone regels

Bericht door Hannes1 »

Hij ziet er keurig uit, alleen raakt op 1 plaats de tekst in het hoofdvak aan de rechterzijde de rand van het gele vlak, daar zou ik liever een kleine afstand hebben. Kan ik nu dit kopieren en dan alle pages in dit frame plaatsen of moet dit veranderd worden via de broncode. Ik vind het toch een nadeel dat ik geleerd heb in Kompozer alles simpel op te zetten via het blad "Normaal" maar dan toch veel via het blad "Bron" moet corrigeren. Ik neem tenminste aan dat jij met menu de broncode bedoelt. Kun je mij zodanig instrueren dat ik dit menu zelf kan aanpassen? Ik heb bij jouw voorstel, door het naar mijn PC te kopieren, gecheckt wat er nu met de cel afmetingen gebeurd is, maar die zijn gelijk gebleven.
Alweer met vriendelijke groet Hans van Buuren
Gebruikersavatar
nirwana
Beheerder
Berichten: 11528
Lid geworden op: 19 september 2003, 5:09
    Windows 7 Firefox
Contacteer:

Re: Tekst op site soms onder elkaar i.p.v. in gewone regels

Bericht door nirwana »

Hans,

Is het zo beter: www.mozbrowser.nl/web/pnf/index.html ?

Wat het aanpassen via de broncode betreft: zelf werk ik vooral via de codes van HTML en CSS, omdat ik aardig weet wat daarmee mogelijk is. Echter kan ik dat niet van anderen verwachten. De makkelijkste manier om wijzigingen over te nemen is doorgaans via de broncode-weergave.

Veel van deze zaken zijn in Kompozer ook wel op een functionele manier aan te passen, alleen is het doorgaans even zoeken hoe je dat het beste kunt doorvoeren. Al denk ik dat ik morgen eens zal kijken of ik daarvoor ook wat instructies kan geven.
Met vriendelijke groet,

Martijn
[ Mede-oprichter + webmaster MozBrowser | beheerder Startpagina's over freeware, GIMP, Mozilla en OpenOffice.org / LibreOffice, Ubuntu
Hannes1
Berichten: 37
Lid geworden op: 17 augustus 2010, 18:09
    Windows XP Internet Explorer 8

Re: Tekst op site soms onder elkaar i.p.v. in gewone regels

Bericht door Hannes1 »

Beste Martijn, jouw versie van het blad ziet er nu perfect uit en ik ben in blijde afwachting van jouw verdere instructies.
Met hartelijke groet, Hans van Buuren
Gebruikersavatar
nirwana
Beheerder
Berichten: 11528
Lid geworden op: 19 september 2003, 5:09
    Windows 7 Firefox
Contacteer:

Re: Tekst op site soms onder elkaar i.p.v. in gewone regels

Bericht door nirwana »

Hans,

Ik ben nu aan het bekijken hoe de wijzigingen ook in Kompozer zelf zijn door te voeren.

Nieuw style.css bestand
Het bestand style.css heb ik met enkele regels uitgebreid. Daarom kun je het beste eerst dit aangepaste style.css bestand downloaden: http://www.mozbrowser.nl/web/pnf/style.css
Je kunt dit bestand opslaan in de map waarin je nu lokaal je website bijhoudt. Daarmee overschrijf je dan het bestaande style.css bestand. Dit bestand is een uitbreiding van het bestaande style.css bestand, dus die kun je zonder problemen overschrijven.

Ruimte in tabel
Daartoe heb ik eerst de tabel geselecteerd (door erin te klikken en vervolgens voor de zekerheid het menu Tabel > Selecteren te gebruiken. Daarna kies ik voor Tabel > Tabeleigenschappen en daar heb ik de Opvulling ook op 0 gezet.

Met die instelling probeer ik de volgende code te beïnvloeden:

Code: Selecteer alles

border="0" cellpadding="10" cellspacing="0"
Opvulling komt dus overeen met cellpadding.

Nieuw menu
Dan heb ik het menu geselecteerd en verwijderd. Vervolgens heb ik via het menu Invoegen > HTML de volgende code ingevoegd:

Code: Selecteer alles

<div class="menu">
	<a href="index.html">HOME</a><br>
	<br>
	<br><a href="bestuur.html">BESTUUR</a><br>
	<br>
	<br><a href="doelstelling.html">DOELSTELLING</a><br>
	<br>
	<br><a href="activiteiten.html">ACTIVITEITEN</a><br>
	<br>
	<br><a href="nieuwsbrief.html">NIEUWSBRIEF</a><br>
	<br>
	<br><a href="ontstaan.html">ONTSTAAN</a><br>
	<br>
	<br><a href="ondersteuning.html">ONDERSTEUNING</a><br>
	<br>
	<br><a href="links.html">LINKS</a><br>
	<br>
	<br><a href="contact.html">CONTACT</a><br>
	<br>
</div>
Dat is een opgeschoonde versie van het menu dat je in de website gebruikt. De <div class="menu"> wordt via het styles.css bestand verder opgemaakt. Het voordeel hiervan is dat je voor alle pagina's 1 gedeeld styles.css bestand gebruikt. Als er dan iets aan de opmaak gewijzigd moet worden dan hoef je dat doorgaans alleen in dit centrale bestand te doen.

Het styles.css-bestand kun je ook wel via Kompozer bewerken (via het menu Extra > CSS bewerken), maar dat vind ik nog wat omslachtig. Daarom bewerk ik die het liefst via een gewone tekst-editor. Nadeel daarvan is dan wel dat je de benodigde codes moet kennen, terwijl Kompozer je daar nog enigszins mee kan helpen.

Uitlijning aan rechterkant
Hiervoor klik je ergens in de tekst van de rechterkolom.
Vervolgens ga je naar het menu Tabel > Tabeleigenschappen en in het venster dat dan verschijnt klik je op Cellen. Je wilt namelijk alleen iets van die cel aanpassen en niet voor de hele tabel.

Vervolgens klik je in dat venster op de knop Geavanceerd bewerken en dan verschijnt er een nieuw scherm. Daar klik je op Inline stijlen. Nu zie je de volgende stijlen vermeld staan:
- height (= de hoogte van de cel)
- text-align (= de horizontale uitlijning binnen de cel)
- vertical-align (= de verticale uitlijning binnen de cel)
- background-color (= de achtergrondkleur)
Hieraan gaan we nu een waarde toevoegen. Daartoe voer je onderin het scherm (bij Eigenschap) padding-right in en daarnaast vul je (als Waarde) 10px in. Vervolgens klik je op OK. Dan kom je terug in het vorige scherm. Als je daar op Toepassen klikt dan zou je in het Kompozer-scherm al moeten zien dat aan de rechterkant van de tabel-cel een marge van 10 pixels in acht wordt genomen. Vervolgens kun je op OK klikken om ook dit venster te sluiten en de wijziging door te voeren.

Volgens mij hebben we dan alle wijzigingen wel gehad. Wel begrijp je dan misschien waarom ik bepaalde wijzigingen net zo lief in de code doorvoer. Want als je die padding-right aanpassing wilt doorvoeren dan moet je al haast in code denken. Je kunt in Kompozer best veel dingen instellen, maar het is voor de makers ondoenlijk om voor alles instellingen in vensters op te nemen. Daarom biedt Kompozer hiervoor gelukkig een ontsnappingsmogelijkheid via de knop "Geavanceerd bewerken".

Zoekmachines: NoIndex, NoFollow
Nog 1 opmerking: bovenin de code van jouw index-pagina staat de volgende regel:

Code: Selecteer alles

<meta name="ROBOTS" content="NOINDEX,NOFOLLOW">
Dat is waarschijnlijk omdat die vanuit mijn bestand is gekopieerd. Echter kun je beter die regel verwijderen of vervangen door

Code: Selecteer alles

<meta name="ROBOTS" content="INDEX,FOLLOW">
Anders zullen zoekmachines de website niet indexeren en dat zou wat jammer zijn.
Met vriendelijke groet,

Martijn
[ Mede-oprichter + webmaster MozBrowser | beheerder Startpagina's over freeware, GIMP, Mozilla en OpenOffice.org / LibreOffice, Ubuntu
Hannes1
Berichten: 37
Lid geworden op: 17 augustus 2010, 18:09
    Windows XP Internet Explorer 8

Re: Tekst op site soms onder elkaar i.p.v. in gewone regels

Bericht door Hannes1 »

Hallo Martijn,

de No's van NoIndex en NoFollow heb ik maar direct verwijderd, die stonden trouwens niet alleen bij de homepage, maar ook bij de pagina's links en ondersteuning. Verder heb ik de "tabeloefeningetjes" die je aangaf gedaan, daar zie ik resultaat van en die snap ik en kan ze dus ook toepassen.

Het simpele menu verwijderen is voor mij niet te doen, want hoe kan ik in mijn oude broncode of via de keuzemenuutjes aan de bovenzijde vinden wat het menu is. Door zorgvuldig de broncodes van jouw pagina naast die van de mijne te leggen lukt het uiteraard wel, maar uit mezelf is dat teveel gevraagd lijkt me.

Ik stel nu voor dat ik jouw pagina kopieer (uiteraard nu zonder de No's) en die vervolgens als een soort sjabloon te gebruiken voor de andere pagina's. Lijkt dit jou ook niet de beste methode?

Hans van Buuren
Gebruikersavatar
nirwana
Beheerder
Berichten: 11528
Lid geworden op: 19 september 2003, 5:09
    Windows 7 Firefox
Contacteer:

Re: Tekst op site soms onder elkaar i.p.v. in gewone regels

Bericht door nirwana »

Hans,

Een andere belangrijke oorzaak van het verspringen is dat de vlag de ene keer hoger is dan de andere. Volgens mij had je dit zelf ook al eens opgemerkt. Door de opbouw in een tabel wordt de vlag even hoog als de foto aan de linkerkant.

Ik zou dan ook willen voorstellen om de vlag een vaste hoogte te geven en niet meer afhankelijk te laten zijn van de hoogte van de foto. Of je moet alle foto's aan de linkerkant even hoog maken.

Inmiddels heb ik de vlag in een aparte tabel weer opgebouwd:

Code: Selecteer alles

		<table style="width: 417px; border-collapse: collapse; border: 0; font-weight: bold; font-style: italic; font-size: 32px; color: white; text-align: center;">
			<tr>
				<td style="background-color: red; line-height: 50px;">PLATFORM</td>
			</tr>
			<tr>
				<td style="background-color: white; line-height: 50px;"><span style="color: black;">NEDERLANDSE</span></td>
			</tr>
			<tr>
				<td style="background-color: rgb(0, 0, 153); line-height: 50px;">FOLKLORE</td>
			</tr>
		</table>
Uitleg bij deze tabel: de tabel bestaat nog steeds uit 3 rijen.
Voor de hele tabel definieer ik de breedte, de opmaak van de letters (grootte, vetgedrukt, schuin en witte kleur) en dat deze gecentreerd moeten worden. Dan hoef ik voor de rijen alleen nog de achtergrondkleur op te geven en voor de witte achtergrond aangeven dat daar zwarte letters gebruikt moeten worden.

Deze tabel kun je op de volgende manier via Kompozer in plaats van de huidige vlag opnemen:
- klik in de rode rij van de vlag en ga naar het menu Tabel > Verwijderen > Cel
- doe dit ook voor de beide andere rijen van de tabel
- vervolgens zul je hiervoor weer een tabel-cel moeten invoegen
- klik daarvoor in de meest rechter cel en via het menu Tabel > Invoegen > Cel ervoor kun je daar weer een cel invoegen
- vervolgens kun je de tabel die hierboven staat op die plaats invoegen via het menu Invoegen > HTML.

Als je na deze operatie een oranje kleur door de website heen ziet, dan moet je de gehele omringende tabel nog die gele achtergrondkleur geven. Klik daarvoor ergens in de omringende tabel en via het menu Tabel > Tabeleigenschappen kun je de achtergrondkleur aangeven.
Met vriendelijke groet,

Martijn
[ Mede-oprichter + webmaster MozBrowser | beheerder Startpagina's over freeware, GIMP, Mozilla en OpenOffice.org / LibreOffice, Ubuntu
Gebruikersavatar
nirwana
Beheerder
Berichten: 11528
Lid geworden op: 19 september 2003, 5:09
    Windows 7 Firefox
Contacteer:

Re: Tekst op site soms onder elkaar i.p.v. in gewone regels

Bericht door nirwana »

Hannes1 schreef:de No's van NoIndex en NoFollow heb ik maar direct verwijderd, die stonden trouwens niet alleen bij de homepage, maar ook bij de pagina's links en ondersteuning.
Dat zijn blijkbaar de pagina's die je van mij hebt overgenomen. Dat maakt op zich niets uit, want daarvoor plaats ik ze immers op de server: ter leering ende vermaeck. Die "noindex, nofollow" plaats ik er tegenwoordig in voor als zoekmachines de pagina's vinden en willen indexeren. Anders kan het zo zijn dat die kopieen hoger in de zoekmachine komen te staan dan de eigenlijke website. MozBrowser heeft namelijk een behoorlijk goede positie in Google, maar het is natuurlijk niet de bedoeling dat we de functie overnemen van de website waarvan ik tijdelijk een kopie maak.
Hannes1 schreef:Verder heb ik de "tabeloefeningetjes" die je aangaf gedaan, daar zie ik resultaat van en die snap ik en kan ze dus ook toepassen.
Dat was ook mijn bedoeling.
Hannes1 schreef:Het simpele menu verwijderen is voor mij niet te doen, want hoe kan ik in mijn oude broncode of via de keuzemenuutjes aan de bovenzijde vinden wat het menu is. Door zorgvuldig de broncodes van jouw pagina naast die van de mijne te leggen lukt het uiteraard wel, maar uit mezelf is dat teveel gevraagd lijkt me.
Het was ook mijn bedoeling dat je dit verwijderen niet via de broncode zou doen, maar gewoon via het Ontwerp-tabblad. Zo heb ik het net namelijk ook gedaan. Daarvoor selecteer je alles wat er nu in het menu staat (van HOME tot en met CONTACT) en verwijder je die. Vervolgens kun je daarin de HTML-code van het menu weer invoegen. Alleen moet je niet vergeten om per pagina aan te geven welke pagina het is (door 1 link te verwijderen en die een andere kleur te geven).
Hannes1 schreef:Ik stel nu voor dat ik jouw pagina kopieer (uiteraard nu zonder de No's) en die vervolgens als een soort sjabloon te gebruiken voor de andere pagina's. Lijkt dit jou ook niet de beste methode?
Het lijkt me handiger als je met mijn aanwijzingen de wijzigingen zelf in jouw pagina's kunt doorvoeren. Ik hoop dat je op die manier steeds meer van Kompozer leert en er zo steeds handiger mee wordt.
Met vriendelijke groet,

Martijn
[ Mede-oprichter + webmaster MozBrowser | beheerder Startpagina's over freeware, GIMP, Mozilla en OpenOffice.org / LibreOffice, Ubuntu
Hannes1
Berichten: 37
Lid geworden op: 17 augustus 2010, 18:09
    Windows XP Internet Explorer 8

Re: Tekst op site soms onder elkaar i.p.v. in gewone regels

Bericht door Hannes1 »

Beste Martijn, ik ben braaf bezig geweest eerst om de vlag te vervangen. Het lukte prima maar toch merkwaardig dat in Kompozer in de mode "normaal" in de bladen doelstelling, nieuwsbrief en ontstaan het plaatje van de vlag iets smaller is dan de cel er boven, terwijl ze vlgs de tabeleigenschappen alle 417 pixels breed moeten zijn. Bij alle andere bladen zijn ze wel even breed. Toen ik deze actie controleerde via de server bleek het springen alleen maar toegenomen te zijn!!
Daarna heb ik het menu gewijzigd, fluitje van een cent alleen werkt het op de homepage anders dan op alle andere bladen, de woorden staan letterlijk tegen de tekst rechts ervan aan, toen ik jouw trucje voor deze cel een "padding-right" van 10px toevoegde schoof de tekst van de rechtercel naar rechts op ipv de tekst in de linker cel naar links, dat heb ik toen maar weer teruggedraaid.
Ik ga nu eens kijken wat de foto's in de linker bovenhoek voor invloed kunnen hebben.
Met vriendelijke groet, Hans
Hannes1
Berichten: 37
Lid geworden op: 17 augustus 2010, 18:09
    Windows XP Internet Explorer 8

Re: Tekst op site soms onder elkaar i.p.v. in gewone regels

Bericht door Hannes1 »

Nu heb ik alle plaatjes links boven er uitgegooid, het springen is daarmee een stuk minder geworden, maar het blijft springerig. Ik had echter goede hoop want -nu kritischer dan in het begin- zag ik dat in die cel van b/h 60px/221px plaatjes stonden van zelfs 200px/145 px, ik denk dan te groot maar als ik die plaatjes dan verklein tot een afmeting die vlgs mijn simple mind net moeten passen, dan worden ze wel erg klein. Kennelijk gaat daar mijn logica dus niet op. Ik wil die plaatjes daar wel terug want ze vrolijken de pages leuk op. Is er een andere manier om ze redelijk vullend erin te krijgen of moet ik ze gewoon herplaatsen met de oude afmetingen?
In afwachting........ Hans
Hannes1
Berichten: 37
Lid geworden op: 17 augustus 2010, 18:09
    Windows XP Internet Explorer 8

Re: Tekst op site soms onder elkaar i.p.v. in gewone regels

Bericht door Hannes1 »

Nog wat zitten experimenteren: wordt het niet nog wat simpeler als ik de cellendirect links en rechts van de "vlag" en die daarboven laat vervallen en dan de tabel van de vlag zoals jij die gemaakt hebt op 417px breedte laat maar horizontaal centreer in die ruimte? Dan ben ik toch weer 4 cellen kwijt. In Kompozetr ziet het er goed uit en ik ga hem NU ook zo tijdelijk op de server zetten zodat jij het ook kunt zien. het is pagina activiteiten
Met vriendelijke groet, Hans
Hannes1
Berichten: 37
Lid geworden op: 17 augustus 2010, 18:09
    Windows XP Internet Explorer 8

Re: Tekst op site soms onder elkaar i.p.v. in gewone regels

Bericht door Hannes1 »

Tot slot heb ik ook nog geprobeerd de bovenste rij cellen te verwijderen, de vlag 60px hoog te maken en de rij cellen 70 en daarbij de vlag gecentreerd onder te plaatsen en het woord STICHTING links boven, maar helaas dat trucje werkte bij mij niet. Voordeel zou dan misschien zijn dat mijn totale gele tabel nog maar uit 4 cellen zou bestaan (als dat tenminste een voordeel is). Je ziet ik wordt wat brutaler, maar het resultaat is er nog niet naar.
Met vriendelijke groet, Hans
.
Gebruikersavatar
nirwana
Beheerder
Berichten: 11528
Lid geworden op: 19 september 2003, 5:09
    Windows 7 Firefox
Contacteer:

Re: Tekst op site soms onder elkaar i.p.v. in gewone regels

Bericht door nirwana »

Hans,

Het lijkt me handig als je ook eerst de nieuwe style.css op de webserver plaatst:
www.mozbrowser.nl/web/pnf/style.css
Daardoor moet het menu aan de linkerkant er ook beter uit gaan zien.

Verder ben ik op de beginpagina opeens de afbeelding linksboven kwijt.
Bij Activiteiten ben ik die foto ook kwijt. Die foto's vond ik inderdaad wel leuk, dus die zou ik wel terug willen krijgen.
Hmm, ik zie dat die foto nu zelfs op alle pagina's verwijderd is.

Des te minder cellen is wel een voordeel, maar soms zijn die cellen er ook met een reden. Zo heb ik gisteren wel eens wat van die cellen weggegooid om ze later toch maar weer terug te zetten. Dan bleken bepaalde cellen achteraf toch een functie te hebben.

Om eerlijk te zijn zou ik het liefst een layout geheel zonder tabellen willen zien, maar dat is doorgaans wat lastiger. Verder is dat niet iets wat ik zo even voorstel als iemand al een hele layout met tabellen heeft. Op het web zijn tabellen eigenlijk bedoeld voor het weergeven van gegevens, maar ze worden nogal eens misbruikt om de layout van een website mee te maken. Echter, zolang de MozBrowser-website ook uit een tabel bestaat heb ik eigenlijk weinig recht van spreken.
Met vriendelijke groet,

Martijn
[ Mede-oprichter + webmaster MozBrowser | beheerder Startpagina's over freeware, GIMP, Mozilla en OpenOffice.org / LibreOffice, Ubuntu
Hannes1
Berichten: 37
Lid geworden op: 17 augustus 2010, 18:09
    Windows XP Internet Explorer 8

Re: Tekst op site soms onder elkaar i.p.v. in gewone regels

Bericht door Hannes1 »

Best Martijn, je ging nu even te snel, ik had 3 berichtjes achterelkaar gezet. De nieuwe CSS had ik direct al in gebruik genoemen, dus daar ligt niets aan, verder heb ik jouw vlag overgenomen, toen sprongen de pages zelfs nog heviger en daarna heb ik de foto's eruit gehaald als proefje, het springen werd ietsje beter. Ik heb alles daarna zo gelaten om jou de gelegenheid te geven het in die staat te bekijken. Als je dat gedaan hebt zet ik die foto's er snel weer in, want ja het staat veel vrolijker.
Met vriendelijke groet, Hans
Gebruikersavatar
nirwana
Beheerder
Berichten: 11528
Lid geworden op: 19 september 2003, 5:09
    Windows 7 Firefox
Contacteer:

Re: Tekst op site soms onder elkaar i.p.v. in gewone regels

Bericht door nirwana »

Hannes1 schreef:Best Martijn, je ging nu even te snel, ik had 3 berichtjes achterelkaar gezet. De nieuwe CSS had ik direct al in gebruik genoemen, dus daar ligt niets aan,
Hans,

Ik heb jouw berichtjes wel gelezen, maar het viel me op dat op http://www.platformnederlandsefolklore.nl/style.css nog de oude style.css staat.
Met vriendelijke groet,

Martijn
[ Mede-oprichter + webmaster MozBrowser | beheerder Startpagina's over freeware, GIMP, Mozilla en OpenOffice.org / LibreOffice, Ubuntu
Plaats reactie