Logo niet scherp

Status
Niet open voor verdere reacties.
R

rob1970

Gebruiker
Lid geworden
14 jan 2012
Berichten
296
Op deze website vind ik het logo er niet echt goed uitzien, niet scherp: http://met-rob.com/lux/index.html

Ik dacht dat het eerst aan de dunne lijntjes lag.

Ik heb het logo hier even met een ander lettertype weggezet maar ook hier vind ik hem er niet scherp opstaan.
http://met-rob.com/lux/ontwerp.html
http://met-rob.com/lux/begeleiding.html

Vooral op een telefoon valt het op.

Zo staat het logo erop:
<div class="logo">
<a href="index.html"><img src="assets/img/logo/logo.png" alt=""></a>
</div>

Ik heb ook geprobeerd om dit (width="100%") eraan toe te voegen omdat het logo misschien door een of andere reden iets verkleind werd, maar dit hielp ook niet.
 
Laatst bewerkt:
Je zult het in het logo moeten zoeken.
 
Daar kan het niet aan liggen. Het is een origineel vector bestand. Opgeslagen vanuit illustrator als png bestand. Maar wat is jouw mening, vind jij het logo wel goed? (misschien ben ik wel te pietleuterig)
 
Png is geen vectorbestand
 
Dat weet ik. Dat zeg ik ook niet. Ik heb een origineel vector bestand opgeslagen als PNG bestand. Hiermee wil ik aangeven dat het logo niet een of ander wazig plaatje is wat van het internet is geplukt.

Dus aan het logo kan het niet liggen lijkt me. Ik denk als je een vector bestand opslaat als PNG dat dan de scherpte niet beter kan.

Ik ga er hierbij vanuit dat je geen "ai" of "eps" bestand kan gebruiken in je html
 
Nee, niet echt. Je kan wel een vectorbestand als svg kan gebruiken in HTML.
 
Ik zag het ook ja. Ik denk dat het minder scherp oogt op een telefoon omdat het dunne letters zijn.
 
Ik keek hem net voor het eerst overigens op een tablet en ik merkte nog iets wat niet goed is.

Als ik op het menu punt "hout skelet bouw" klik, verschijnt het dropdownmenu 1 seconde maar dan is hij weer foetsie.

Enig idee hoe ik kan zorgen dat deze blijft en niet weer verdwijnt?

Alleen als ik er mijn vinger lang ophoud blijft het drop down menu wel in beeld
Maar dan komt er eerst wel de keuze of ik die link wil openen in bijvoorbeeld een nieuw tabblad en dat is ook niet de bedoeling

Dit staat er in de css over het submenu:
Code: 
.header-area .menu-wrapper .main-menu ul ul.submenu {
  position: absolute;
  width: 170px;
  background: rgba(0, 12, 32, 0.8);
  left: 0;
  top: 90%;
  visibility: hidden;
  opacity: 0;
  box-shadow: 0 0 10px 3px rgba(0, 0, 0, 0.05);
  padding: 17px 0;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}

Heeft het iets te maken met dat "ease-out"?
 
Laatst bewerkt:
Dat is vreemd, want sinds ik het logo heb veranderd in een svg bestand is het bij mij haarscherp.

Zeker als ik hem vergroot.

Het probleem is net dat die dunne lijntjes juist wat onscherp lijken op een telefoon.

Schermafbeelding 2020-06-07 om 23.42.38.png

Schermafbeelding 2020-06-07 om 23.42.13.png

Schermafbeelding 2020-06-07 om 23.47.26.png
 
Laatst bewerkt:
Ik had 'm 12x vergroot, jouw screenshot is minder vergroot.
Dit heb ik bewust gedaan omdat een foto op een webpagina bij verkleinen of vergroten zelf gaat stoeien met subpixels. Bij een svg zou dit niet mogen zijn maar bij sterke vergroting zie ik bij de horizontale lijnen toch sublijntjes ernaast liggen. Dit zou dan ook in het origineel moeten zitten.
 
Dat zou niet moeten kunnen. Het is een vector bestand omgezet naar letter contouren.

Heb jij een oplossing want nu weet ik het helemaal niet meer.
 
Zoek het best vergelijkbare Google font op en zet de letters er als echte tekst in. Ook goed voor SEO.
Met @media kan je de font-size kleiner maken op kleinere schermen.

Je hebt een png logo nodig voor bijvoorbeeld
Code: 
meta property="og:image"
link rel="icon" type="image/png"
link rel="apple-touch-icon"
meta name="twitter:image"
 
Status
Niet open voor verdere reacties.
Steun Ons

Nieuwste berichten

Terug
Bovenaan Onderaan