fonts

Status
Niet open voor verdere reacties.

MegaByter

Terugkerende gebruiker
Lid geworden
11 okt 2009
Berichten
1.497
is dat me even wat :confused::confused:
al jaren maak ik websites (zelfs voor klanten) kom ik er eigenlijk pas sinds gister achter dat de fonts niet goed werken op sommige pc's...
ik heb sowieso me eigen site uit de lucht gehaald want ik schaam me kapot ook tegenover me klanten... ik mag dan wel goeie service leveren maar me producten hebben dus totaal geen waarden :(

nu moet ik zeker weer een hele cursus gaan volgen om de fonts goed te krijgen? want alle teksten op sites die ik gemaakt heb staat de standaard times new roman...

pffft, help? :(
 
Heb vroeger zelf het een en ander met HTML gedaan, kan me herinneren dat je meerdere fonts kon instellen. De browser zal de site openen in het eerste font dat bekend is op de pc.

Even zoeken levert deze site.
 
Heb vroeger zelf het een en ander met HTML gedaan, kan me herinneren dat je meerdere fonts kon instellen. De browser zal de site openen in het eerste font dat bekend is op de pc.
je precies dat is dus wat ik ook probeerde te vertellen
op veel sites gebruik ik zelf vaak verdana maar ja helaas staat verdana niet op elke pc voor geinstalleerd....
en dus schakelt de browser hem terug naar de standaard font en dat is times new roman
 
Wat als je dan in de html pagina ipv times new roman een ander lettertype invoert? Eentje dat standaard op bijna elke pc moet staan.
 
als ik zo bij browser shots kijkt dan ziet hij wel de lettertype verdana... hmm vreemd... altcare.nl is de site zou je mij kunnen vertellen wat je ziet misschien?
 
Wanneer ik je site open zie ik gewoon Verdana, dat staat namelijk ook op mijn laptop geïnstalleerd.
Wanneer jij de site opent zal je Verdana blijven zien, je kan het font tijdelijk uit de code halen. Dan zul je de site in het standaard lettertype zien. Wanneer je dan de code voor het lettertype Verdana weer toevoegt zal je de site opnieuw in Verdana zien. De browser gaat het lijstje binnen jou HTML code af en pakt dan het eerste font dat is geïnstalleerd op de pc waarop de browser wordt gebruikt. Stel je hebt 10 fonts ingevoerd in je HTML code zal de site bij jou waarschijnlijk in het lettertype dat vooraan staan worden geopend. (ga er vanuit dat je geen fonts gebruikt die je zelf niet hebt.) Bij iemand anders kan de site in bijv het 5e font worden geopend omdat de eerste 4 niet geïnstalleerd zijn op de pc van de gebruiker. Vermeid fonts die niet standaard zijn. Deze zullen namelijk bij veel gebruikers niet worden weer gegeven.

Ps. De tekst die momenteel op site staat bevat enkele grammaticale fouten. Ik vind dat persoonlijk zeer slordig staan tegenover klanten.
 
Ps. De tekst die momenteel op site staat bevat enkele grammaticale fouten. Ik vind dat persoonlijk zeer slordig staan tegenover klanten.

ow echt? :shocked:
ik vond het anders nog vrij netjes anno 2012 :confused:
 
Ben zelf een mierenneuker wat dat betreft. Ik weet niet uit wat voor bedrijven/personen je klantenbestand bestaat, de een zal er minder waarde aanhechten dan de ander. Maar je kan maar één keer een eerste indruk maken en ik vermoed dat veel potentiële klanten voor het eerst met je in contact komen door middel van je website. Wanneer deze grammaticale fouten bevat sta je bij sommige potentiële klanten al gelijk op achterstand. Zou zonden zijn als je omzet misloopt door iets wat makkelijk te voorkomen is.

Lukt het met de andere fonts toevoegen?
 
nou ik moet nog steeds die site lezen die je me gaf.
heb er nog geen zin in gehad om het allemaal even door te lezen, daar moet ik echt even op me gemak voor zitten.

en mwah bedrijf bedrijf... ik wil het niet persé een bedrijf noemen eerlijk gezegd... ik noem het meer een corporatie... dit omdat ik meer doet dan bijvoorbeeld alleen websites maken.
ik ben ook veel bezig met projecten voor mezelf, klanten en gratis diensten zoals o.a. applicaties, internet diensten en dergelijke...
 
Laatst bewerkt:
je precies dat is dus wat ik ook probeerde te vertellen
op veel sites gebruik ik zelf vaak verdana maar ja helaas staat verdana niet op elke pc voor geinstalleerd....
en dus schakelt de browser hem terug naar de standaard font en dat is times new roman
Wat je dan ook moet doen is meerdere fonts instellen. In plaats van
font-family:Verdana;
kun je bijvoorbeeld doen.

font-family:verdana, sans-serif;

Op het moment dat de bezoeker geen Verdana heeft (zal trouwens niet zo vaak voorkomen) schakelt de browser terug naar het standaard sans-serif font (dus niet naar Times, wat een serif font is). Je kunt natuurlijk een hele rij alternatieve fonts opgeven.

ik vond het anders nog vrij netjes anno 2012
Ook anno 2012 is het (bijvoorbeeld) nog steeds het logo, klanten opzadelen met grammaticaal slechte teksten is gewoon een slechte zaak, het komt onprofessioneel en slordig over en kan heb weer klanten kosten.
 
Er zijn een aantal websafe fonts, dit zijn lettertypes die op 99% van alle computers standaard geïnstalleerd staan.
Indien je alleen deze wilt gebruiken is het simpel, je geeft aan welk lettertype je wilt en daarna een lettertype type zodat de bezoeker altijd een vergelijkbaar lettertype krijgt.

Verdana is sans-serif en Times is bijvoorbeeld Sarif.
font-family: Verdana, Arial, sans-serif. Heeft de gebruiker geen verdana ziet ie arial, anders ziet ie hetgeen wat in de browser is ingesteld als sans-serif lettertype.

Wil je fonts gebruiken welke niet websafe zijn zul je hiervoor technieken moeten gebruiken als Google Webfonts, @font-face of oudere technieken als Cufon/Sifr.
 
ik heb inderdaad ook al gekeken naar google webfonts... maar aangezien ik in dit gebied amper ervaring heb maak ik dus weinig klaar...
bedankt voor jullie reacties, ik heb hier zeker wat aan om weer wat verder te komen!
 
ik heb inderdaad ook al gekeken naar google webfonts... maar aangezien ik in dit gebied amper ervaring heb maak ik dus weinig klaar...
bedankt voor jullie reacties, ik heb hier zeker wat aan om weer wat verder te komen!

Google webfonts is echt super makkelijk, alles wordt uitgelegd in de quick use.


Hier een lijst met websafe fonts, als je deze gebruikt in combinatie met de goede family is er niets aan de hand.
 
Laatst bewerkt:
Ehm, dames en heren, weet je wat het is?
(zie m'n handtekening hieronder)
Je kunt nog zoveel font-rijtjes in je code opnemen, als de html en/of css niet klopt, helpt het geen zier. :p


Vier foutjes maar, dat valt toch wel mee?
Kijk dan naar de broncode:


  • Begint met Doctype: akkoord.
  • In de head de charset-meta: akkoord.
  • Einde head (er hoorde nog een <title> in de head).
  • Regel 8: de <body> begint.
  • Regel 9 t/m 15,5: begin content-code.
  • Regel 15 (midden in een <td>!): nog een Doctype!
  • Regel 18: nog een <head>!
  • Regel 19: een <meta> in de <body>!
  • Regel 20: een <meta> in de <body>! (nog een keer de charset)
  • Regel 21 t/m 34: een styleblok <style type="text/css"> in de <body>! (met de Verdana)
  • Regel 35: nog een </head>!
  • Regel 37: nog een <body>!
  • Regel 38 t/m 61: vervolg content-code.
  • Regel 62: einde </body>.
  • Regel 64: einde </html>.
  • Regel 65: vervolg content-code!
  • Regel 74: nog een </body>!
  • Regel 76: nog een </html>!

Kijk, zo kom je nog eens ergens: op dwaalsporen voor browsers, denk ik. ;)
Oftewel: eerst checken, dan mopperen! :)

Met vriendelijke groet,
CSShunter
__________
PS: Voor overzichtjes van standaard geïnstalleerde fonts op verschillende OS'sen: ze bv deze en deze.
 
goed ik heb wat lijnen verwijdert maar moet je wel zeggen dat die validator voor geen meter klopt... bepaalde regels komen niet totaal niet overeen.
en daarbij verneukt de validator de pagina...
 
goed ik heb wat lijnen verwijdert maar moet je wel zeggen dat die validator voor geen meter klopt... bepaalde regels komen niet totaal niet overeen.
en daarbij verneukt de validator de pagina...

Die validator klopt wel zeker, alles wat er niet aan klopt komt door je website.
Die validator is van de W3C, de mensen die bepalen aan welke regels browsers zich moeten houden.

En de regels zijn gebasseerd op de gegenereerde HTML. Oftewel de broncode die de browser je toont niet de geschreven code in bijvoorbeeld dreamweaver.
 
Hoi MegaByter,
Ik snap er nu helemaal niets meer van.
goed ik heb wat lijnen verwijdert
(t=d)
In reactie #14 gaf ik precies aan waar het haperde.
Maar op dit moment is de html-code, als ik die netjes inspringend uitschrijf:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>

<body style="margin: 0">
    <table style="width: 100%" cellspacing="0" cellpadding="0">
        <tr>
            <td>&nbsp; &nbsp;</td>
        </tr>
        <tr>
            <td>
                [COLOR="#B22222"]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
                    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
                <html xmlns="http://www.w3.org/1999/xhtml">
                <head>
                <meta http-equiv="Content-Language" content="nl" />
                <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
                <style type="text/css">
                    .style1 {
                         text-align: center;
                    }
                    .style5 {
                         text-align: center;
                         font-family: Verdana;
                         font-size: 11pt;
                     }
                     .style6 {
                         text-align: center;
                         background-color: #333333;
                     }
                </style>
                </head>

                <body>
                    <p class="style1"><img alt="" src="img/logo.png" /></p>
                    <p class="style1">&nbsp;</p>
                    <p class="style1"><img alt="" src="img/Under-Construction.jpg" /></p>
                    <p class="style1">&nbsp;</p>
                    <p class="style5">Beste bezoeker,</p>
                    <p class="style5">Zoals u hoogst waarschijnlijk al vernomen heeft,<br />
                        zijn wij van plan voorlopig met onze services te stoppen.<br />
                        Geen nood! Dit houd natuurlijk niet in dat wij geen service meer bieden aan onze 
                        klanten!<br />
                        <br />
                        Wij zijn van plan andere wegen te betreden en we zijn hard aan de weg aan het 
                        timmeren om onze services nog meer te verbeteren!<br />
                        (De logo die u hierboven ziet verklapt al een beetje het één en andere...)<br />
                        Tot die tijd zal onze site eventjes offline zijn!<br />
                        <br />
                        Uiteraard zijn wij niet onbereikbaar!<br />
                        U kunt altijd met ons contact opnemen als u ons iets te vertellen heeft.<br />
                        Dit kunt u doen door de onderstaande formulier in te vullen en op te sturen (let 
                        op! Na versturen beland u tijdelijk op een bedankt pagina!)
                    </p>
                    <p class="style1">&nbsp;</p>
                    <p class="style1">&nbsp;</p>
                </body>
                </html>[/COLOR]
            </td>
        </tr>
        <tr>
            <td class="style6">
                <script type="text/javascript" src="http://dutch.jotform.com/jsform/22127802787356"></script>
                <br />
            </td>
        </tr>
    </table>

</body>
</html>
Er zit dus nog steeds een compleet document in een document geplakt. :shocked:
moet je wel zeggen dat die validator voor geen meter klopt

Geen wonder: de html-validator verslikt zich danig!


  • Vanwege de pagina-in-pagina probeert de html-validator een aantal elementen correct te plaatsen, dwz. de css en de tweede <meta> wordt bv. in de (eerste) <head> gezet, waardoor een aantal andere dingen niet meer kloppen.
  • Daardoor wordt ook de eerste <body> pas begonnen na het style-gebeuren, en waar eerder <body style="margin: 0"> stond, is daar <style="margin: 0"> van gemaakt omdat daar geen <body> hoorde te staan.
  • Enz.
  • En er zit een BOM (Byte Order Mark) in het bestand, wat ook niet mag.
  • De parser van de validator kon dit onrecht gewoon niet aan.

en daarbij verneukt de validator de pagina...
  • Dat is dus correct: de validator verneukt een in de broncode al verneukte pagina! :p

Maar minstens één ding heeft de html-validator goed: het is geen valid html...

Met vriendelijke groet,
CSShunter
 
Laatst bewerkt:
naja goed het is toch maar een under construction pagina
bij het bouwen van de nieuwe site zal ik voortaan telkens die validator ernaast houden.

Ik heb even een vraagje wanneer gebruik je HTML5?
 
wanneer gebruik je HTML5?
Als je de nieuwe spulletjes van html5 op je pagina wilt toepassen, en de browsers dat goed weten toe te passen. *) :)
Leesvoer bv.:

Met vriendelijke groet,
CSShunter
_______
*) Eventueel met bv. html5shiv (HTML5 IE enabling script, code.google.com/p/html5shiv/) of het eenvoudiger Simple HTML5 Fix for IE (www.hagenburger.net/BLOG/Simple-HTML5-Fix-for-IE.html) om Internet Explorers bij te trekken.
 
het heeft even allemaal wat moeite gekost maar het is me uiteindelijk gelukt om de validator niet meer te laten schrikken!
Daarbij doen de fonts het weer uitmuntend :D
ik heb eindelijk weer wat hoop!
die validator is nog best leerzaam :D

Maare dat html5 is me nog steeds niet helemaal duidelijk... zijn er ook nederlandse sites die stap voor stap uitleggen wanneer je html 5 kan gebruiken?
 
Laatst bewerkt:
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan