Logo leicht unscharf trotz exakten Maßen

Hallo liebe Leute,

ich habe bei der Webseite http://www.upnswutschimnorden.de/ das Logo eingefügt. Als Theme nutze ich Activello, WP 4.8. Das Bild ist als .png Datei hochgeladen mit 400x200px. Activello selbst gibt auch die Maße 400x200px vor (hab in der functions.php nachgesehen).

<img src="http://www.upnswutschimnorden.de/wp-content/upl…o-400-x-200.png" class="custom-logo" alt="Up'n Swutsch im Norden" itemprop="logo" width="400" height="200">

Dennoch erscheint das Logo leicht unscharf. Mein Ziel ist einfach, dieses Logo schärfer zu kriegen. Ich recherchiere seit 2 Tagen in Foren und Blogs nach Lösungen, aber meistens gehts ja darum, dass die falschen Maße fürs Bild verwendet werden, oder das Wordpress die Bilder nach dem Upload skaliert und es daran liegt. Aber da ja bei mir die Maße identisch sind, weiß ich nicht was ich noch machen kann. Woher dann die Unschärfe, oder übersehe ich hier was wesentliches?

Mir ist klar, das .png Dateien nicht so scharf darstellen wie z.B. .svg's. Ich habe versucht über das Plugin Safe SVG und auch SVG Support das Hochladen und Einfügen von .svg's möglich zu machen, allerdings wird mir die Logo.svg dann in der Mediathek nicht angezeigt, da ist nur ein "graues Bild" und beim Einfügen kommt die Fehlermeldung "Konnte nicht eingefügt werden". Auch mit dem Einfügen eines php Codes in die functions.php hat es nicht funktioniert (nach dieser Anleitung). Dachte vielleicht das wäre eine Alternative, aber wie gesagt, es funktioniert auch nicht.

Ich wäre für Hilfe sehr dankbar.

LG, Jasmin

Danke für eure Antworten.

Nein ich habe kein Retina-Display, daran kann es also nicht liegen. daniel: Bei dir erscheint es also scharf? Das ist ja eigentlich gut und das was ich möchte.

Ich habe mir die Seite auch auf verschiedenen Geräten angeschaut. Beim Smartphone (Sony Xperia Z) sieht es auch etwas schärfer aus, als auf dem Laptop. Das könnte ja mit der Browserskalierung zusammenhängen.

Also mir stellt sich jetzt die Frage: Ist die optimale Schärfe jetzt erreicht? Oder kann ich noch irgendwas machen, dass es schärfer erscheint? Es geht mir ja vor Allem darum, dass Besucher der Seite kein unscharfes Logo vorgesetzt bekommen, wenn es nur bei mir leicht unscharf angezeigt wird, kann ich damit leben. Was meint ihr?

Hm, ja das ist die Frage. Ich habe ein Screenshot gemacht und es hier hochgeladen:

http://www.upnswutschimnorden.de/wp-content/upl…_meinesicht.png

Ich würd deinen Vorschlag mit der svg ja gern probieren. Hab das Childtheme bereits angelegt (funktioniert auch) und die header.php aus dem elterntheme reinkopiert. Ich weiß allerdings nicht, welchen Code ich jetzt einfügen und wo ich die svg logo datei uploaden muss. -.-

---------------------

<?php
        $show_logo = true;
        $show_title = false;
        $show_tagline = true;
        $logo = get_theme_mod( 'header_logo', '' );
        $header_show = get_theme_mod( 'header_show', 'logo-text' );


        if ( 'logo-only' == $header_show ) {
            $show_tagline = false;
        } elseif ( 'title-only' == $header_show ) {
            $show_tagline = false;
            $show_logo = false;
        } elseif ( 'title-text' == $header_show ) {
            $show_logo = false;
            $show_title = true;
        }?>


        <div class="container">
            <div id="logo">
                <?php echo is_home() ?  '<h1 class="site-name">' : '<span class="site-name">'; ?>


                                    <?php


                                    if ( $show_logo && has_custom_logo() ) {
                                        the_custom_logo();
                                    } else { ?>
                                        <a class="navbar-brand" href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><?php  bloginfo( 'name' ); ?></a>
                                    <?php } ?>


                                    <?php echo is_home() ?  '</h1>' : '</span>'; ?><!-- end of .site-name -->


                <?php if ( $show_tagline && get_bloginfo( 'description' ) != '' ) : ?>
                    <div class="tagline"><?php bloginfo( 'description' ); ?></div>
                <?php endif; ?>
            </div><!-- end of #logo -->

--------------------------------------

Das habe ich gemacht, bevor ich das Screenshot aufgenommen habe. Und gerade nochmal überprüft. Also daran kann es denke ich jetzt eigentlich nicht mehr liegen. Mal ein ganz anderer Ansatz, kann es sein dass meine Bildschirmeinstellungen oder Grafikeinstellungen vom Laptop irgendwie nicht optimal sind?
[ATTACH=CONFIG]17397[/ATTACH]