kkokus: Website Gestaltungsfragen ...

Hi alle,

ich habe ein paar Fragen an die Profis unter euch zu meiner Website. Es geht um mehrere Sachen. 1. Das Menü oben: Ich habe mir ein tolles Konzept überlegt, wie ich mein Menü animieren kann. Es funktioniert auch ganz gut nur habe ich ein Problem. Wenn ich mit der Maus über einen Menüpunkt "drüberfahre" kommt im Hintergrund ein Bild. Jedoch sieht man bei dem letzten Menüpunkt "Contact", einen weißen Rand um das Hintergrundbild auf der rechten Bildseite. Dieser kommt daher, dass ich  das Bild mit weißem Hintergrund gemalt hatte. Wie bekomme ich den weg? Weiß jemand wie man ein Bild malt, dass transparent ist, allerdings nicht diesen häßlichen Rand hat. Ziel dabei ist, dass ich ich dieses Bild bei jeder Hintergrundfarbe anzeigen kann und kein Rand zu sehen ist. Welches Programm nutzt ihr dafür? Welche Tools?
2. Frage: Ich habe festgestellt, dass die Website auf verschiedlichen Betriebssystemen unterschiedlich dargestellt wird. Grund dafür ist die Schriftart, die ich verwende. Kann mir einer verraten welche Schriftarten man als Ersatz für Arial und Tahomma bei Linux, MacOS und anderen Betriebssystemen nehmen kann. Ich suche Schriftarten, die standartmäßig bei den meisten Distributionen vorhanden sind. Zur Zeit verwende ich da bei Linux "Courier" mit einem letter-spacing von -0.07; Bei MacOS habe ich noch keine Ahnung was ich da nehmen kann, da ich selbst keinen Mac besitze.
3. Frage: Wie findet ihr, dass Aufklappen der Website, wenn man bei "Pictures" sich ein Bild anschaut, welches hochkant ist? Kann ich bei kleinen Auflösungen ( 1024 * 768 und kleiner ) irgendwie verhindern, dass die ganze Seite zu weit nach oben rutscht, so dass das Menü nicht mehr sichtbar wird? Danke für nützliche Antworten.

MfG
Kokus

PS: Seite ist hauptächlich auf Englisch.

  1. Hi,

    um Grafiken zu bearbeiten benutze ich den GIMP. Ist ein sehr mächtiges Tool, allerdings ist die Bedienung etwas gewöhnungsbedürftig. Das Tool ist Freeware, aber ich weiß allerdings nicht, welche Version gerade aktuell ist.

    Mit den Schriftarten unter Linux kenne ich mich nicht so gut aus, aber Times, Arial, Courier und Verdana sollten doch "fast" überall vorhanden sein, oder? Lasse mich aber auch gerne belehren.

    Zu Punkt 3: Ich sehe da keinen Unterschied. Der onMouseOver-Effekt ist bei mir überall gleich (IE).

    Gruß,
    Thorsten F.

    1. Seid gegrüßt!
      ich denke für den Anwendungszweck ist PNG gedacht. Das hat doch ne Alpha-Transparenz.

      Jetz hab ich aber auch noch ne Frage dazu: bei PNGs gibts ne Transparenz von 0-255. Auf das ganze Bild? Also ne Art Wasserzeichen?
      oder kann man jedem Pixel einen anderen Transparenzwert geben?
      Wenn ja mit welchem Programm (da ich mit GIMP nicht klarkomme, evtl. andere).

      Danke

      --
      Bis Später
          
      ________________________________________________________________
      [Testversion meiner Seite] [Zwei unterwegs in Australien]
      1. Hallo,

        png speichert den Transparentwert jedes Pixels mit ab. Also Ideal für den angedachten Einsatz, vorausgesetzt die vermuteten Browser auf der anderen Seite der Leitung können damit umgehen.

        Ich selber nutzt painsthopPro, und das kann Grafiken in png abspeichern. - Äh - gehe ich mal stark von aus ;-)

        Chräcker

        --
        Erinnerungen?
        zu:]
        1. Hi,

          erstmal danke für die Beiträge ... hat mir sehr geholfen. Habe jetzt Png's statt Gif's eingefügt und es funktioniert. Es sieht super aus. Nun zur kompatibilität mit Png's. Wie ich herausbekommen habe scheinen Mozilla Browser und Opera keine Probleme mit der Darstellung von Transparenz bei Png's zu haben. Beim IE 7 gibts da auch keine Probleme, nur der IE 6 will nicht auf anhieb. Hier die Lösung damit es auch dort klappt:

          *html #objektid {
          background: none;
          filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='bild.png',sizingMethod='scale');
          }

          Was ist mit den anderen Fragen? Kann die jemand beantworten?

          Mit freundlichen Grüßen
          Konstantin Tabere

  2. Hallo,

    zu dem Buttonrandproblem: egal welches Grafikprogramm Du nimmst (auch bei dem Gimp meines Vorposters) - es geht nicht. Du wirst diesen Rand bekommen. Der hat einen "relativ" simplen "Grund".

    Bilder auf dem Computer sind aus "viereckigen" Blöcken gemalt, die Pixel. Eine schräge Linie ist also gar nicht "malbar", man malt da im Prinzip eine Treppe.

    X
     X
      X
       X

    Diese Treppenstufen würde und wird man sehen. Weil das aber blöd aussieht und allen nur beweisen würde, wie schlecht diese Technik doch noch ist, kann man tricksen. Malt man auf jeder Treppenstufe (sozusagen) noch ein paar Mischtöne (und zwar aus der Farbe der Linie und des Hintergrundes), dann "verwischen" vor dem Auge des Betrachters diese Treppeneffekte. Diese Technik nennt man antialiasieren

    Xo
    oXo
     oXo
      oXo

    Es wird aber, wie man am unzureichenden ASCII-Demo schon erahnen kann, die Linie etwas dicker und, hier freilich nicht zu sehen, verwaschener wirken.

    Jetzt zu Deinem Problem. Diese Zwischentöne zum verwischen, hier die o´s, mischt das Grafikprogramm in Abhängigkeit zur Hintergrundfarbe. bei Dir also weiß. Auf einem weißen Hintergrund sah es also gut aus. Auf einem dunklen eben wieder nicht. Deswegen gibt es nur zwei Möglichkeiten: entweder man verzichtet auf das anitaliasieren, oder man nimmt immer beim erstellen der Buttons (oder was auch immer) im Grafikprogramm den hintergrund der zukünftigen Seite. Damit müstest Du aber jeden Button Deiner Seite einzeln erstellen und abspeichern.

    (freilich kann man auch das Grafikformat png zum abspeichern nehmen, da bleiben die "Mischtöne" halb, viertel, was weiss ich transparent und passen sich so am Untergrund an. Ich bin aber überfragt, welche Browser das alles heutzutage richtig umsetzen...der bald ja den leuten aufgedrückte IE7 soll es "sogar" dann endlich können)

    Grüße,

    Chräcker

    --
    Erinnerungen?
    zu:]
  3. Hallo Kokus

    ich habe ein paar Fragen an die Profis unter euch zu meiner Website. Es geht um mehrere Sachen. 1. Das Menü oben: Ich habe mir ein tolles Konzept überlegt, wie ich mein Menü animieren kann. Es funktioniert auch ganz gut nur habe ich ein Problem.

    Nicht nur dieses. (siehe weiter unten)

    1. Frage: Ich habe festgestellt, dass die Website auf verschiedlichen Betriebssystemen unterschiedlich dargestellt wird. Grund dafür ist die Schriftart, die ich verwende. Kann mir einer verraten welche Schriftarten man als Ersatz für Arial und Tahomma bei Linux, MacOS und anderen Betriebssystemen nehmen kann.

    Auch, wenn du genau wüsstest, welche Schriftart üblicherweise auf welchem System vorhanden ist, und welche davon (nahezu) identisch in Form und Größe sind, kannst du dir nie sicher sein, ob diese bei jedem Seitenbesucher auch vorhanden sind. Gib also immer eine generische Schriftfamilie an.
    Noch viel wichtiger ist aber, dass du nie wissen kannst, welche Schriftgröße jeweils eingestellt ist. Mir ist die Schriftgröße deiner Texte zu klein, um sie entspannt lesen zu können, also vergrößere ich sie.
    Rufe deine Seite mal mit dem Firefox auf und vergrößere die Schrift, und schau dir an, was dann mit deiner Seite passiert.

    1. ... Kann ich bei kleinen Auflösungen ( 1024 * 768 und kleiner ) irgendwie verhindern, dass die ganze Seite zu weit nach oben rutscht, so dass das Menü nicht mehr sichtbar wird?

    Du hast den Seiteninhalt mittels der einfachen Variante zentriert, die nur für kleine Seitenelemente geeignet ist. Schau dir mal die bei meinem einfachen Beispiel verlinkten Varianten an.

    Deine Seite funktioniert leider nur mit Javascript. Wenn dir PHP zur Verfügung steht, sollte es kein Problem sein, eine Alternative anzubieten oder ganz normale Links zu verwenden und die Seite damit zusammenzusetzen.
    Wenn die Links ohne Javascript wirkungslos sind, dann bitte auch keine Links!

    Die gesamte Seite besteht fast ausschließlich aus Divs. Warum gibt es keine Überschriften, Textabsätze oder Listen?

    PS: Seite ist hauptächlich auf Englisch.

    Schön wäre es, wenn die Sprachen nicht vermischt wären, wie bei Family -> Nina.

    Auf Wiederlesen
    Detlef

    --
    - Wissen ist gut
    - Können ist besser
    - aber das Beste und Interessanteste ist der Weg dahin!
    1. Deine Seite funktioniert leider nur mit Javascript. Wenn dir PHP zur Verfügung steht, sollte es kein Problem sein, eine Alternative anzubieten oder ganz normale Links zu verwenden und die Seite damit zusammenzusetzen.

      Hi Detlef,

      ich finde es wirklich schade, dass so viele Leute eine so schlechte Meinung von JavaScript haben, dass sie gleich Panik bekommen wenn man dieses auf der Website benutzt. JavaScript gibt es seit 1995 und ich bin mir ziemlich sicher, dass das Konzept inzwischen sehr ausgereift ist.
      Natürlich hört man hier und da von einigen Sicherheitslücken, die unter anderen auch JavaScript betreffen, doch sind sie nicht so gravierend, als dass man auf diese Technik ganz verzichten müsste. Auch Jpegs können ein Sicherheitsloch darstellen und trotzdem geht niemand gleich so weit alle Grafiken aus seiner Website zu entfernen.
      Also für mich spricht nichts dagegen JavaScript bei jedem Websitebesucher als vorhanden anzunehmen. Es ermöglicht eine viel bessere und effizientere Websitegestaltung als jede andere Technik. Es macht Websiten übersichtlicher und vereinfacht die Bedienung. Es spart Bandbreite ( ich z.B. verwende AJAX um Websiteninhalte zu ändern, damit ich nicht mehr normale Links benutzen muss um die ganze Seite neu zu Laden ( ja - Frames würden auch gehen, allerdings sind diese längst nicht so flexibel ) und erlaubt die Kommunikation mit dem Benutzer. Ich würde es sehr begrüßen, wenn in ferner Zukunft wenigstens ein gewisser Teil von JavaScript definitiv in jedem Browser vorhanden ist und nicht mehr abgeschaltet werden kann.
      Mir ist im übrigen kein einziger "moderner" Browser bekannt, der kein JavaScript unterstützt oder dieses standartmäßig ausschaltet.

      MfG
      Konstantin

      1. Hallo Konstantin,

        ist ja interessant, dass du (nur) auf diese Bemerkung meines Postings antwortest. ;)

        ich finde es wirklich schade, dass so viele Leute eine so schlechte Meinung von JavaScript haben, dass sie gleich Panik bekommen wenn man dieses auf der Website benutzt.

        Ich bekomme keine Panik, ich weise lediglich darauf hin, dass eine Seite nicht ohne zwingenden Grund von Javascript absolut abhängig sein sollte. Außerdem sollte eine Seite, die nur bei eingeschaltetem Javascript benutzbar ist, dies zumindest mitteilen, statt den User sinnlos auf Links klicken zu lassen, die aufgrund des Pseudoprotokolls (javascript:) gar keine wirklichen Links mehr sind.

        JavaScript gibt es seit 1995 und ich bin mir ziemlich sicher, dass das Konzept inzwischen sehr ausgereift ist.

        Nur leider wurde und wird es immer noch mehr für eher nervige Effekte eingesetzt, statt für sinnvolle und hilfreiche Funktionen (genauso wie auch Flash). Deshalb ist Javascript bei mir üblicherweise deaktiviert und wird nur bei bedarf eingeschaltet. Dazu muss mir die betreffende Seite allerdings wichtig sein.

        Natürlich hört man hier und da von einigen Sicherheitslücken, die unter anderen auch JavaScript betreffen, doch sind sie nicht so gravierend, als dass man auf diese Technik ganz verzichten müsste.

        Und das kann ein normaler Nutzer einschätzen, wenn wieder einmal empfohlen wird, es bis zur Beseitigung einer Lücke im IE auszuschalten.

        Auch Jpegs können ein Sicherheitsloch darstellen und trotzdem geht niemand gleich so weit alle Grafiken aus seiner Website zu entfernen.

        Auch, wenn die Grafikanzeige deaktiviert ist, funktioniert die Seite und die Texte sind lesbar und aufgrund des Alternativtextes kann der Nutzer eventuell sogar einschätzen, was er sehen würde.

        Also für mich spricht nichts dagegen JavaScript bei jedem Websitebesucher als vorhanden anzunehmen.

        Genausogut könntest du auch Windows mit IE annehmen. ;)

        Es ermöglicht eine viel bessere und effizientere Websitegestaltung als jede andere Technik.

        Wirklich?

        Es macht Websiten übersichtlicher und vereinfacht die Bedienung.

        Oder unbenutzbar.

        Es spart Bandbreite ( ich z.B. verwende AJAX um Websiteninhalte zu ändern, damit ich nicht mehr normale Links benutzen muss um die ganze Seite neu zu Laden ...

        Wie groß wäre das, was wirklich mehr geladen werden müsste?

        Ich habe auch Seiten erstelt, auf denen Bilder per Javascript ausgewechselt wurden, aber - der Link war ein Link zur selben Seite mit dem anderen Bild, dieser Link wurde dann onclick abgefangen und nur das Bild gewechselt. Das dürfte auch beim Wechsel von anderen Seiteninhalten mittels AJAX problemlos möglich sein.

        Ich würde es sehr begrüßen, wenn in ferner Zukunft wenigstens ein gewisser Teil von JavaScript definitiv in jedem Browser vorhanden ist und nicht mehr abgeschaltet werden kann.

        Diesen Browser würde ich definitiv ausschließlich für unvermeidbare Seitentests nutzen, aber bestimmt nicht zum surfen.

        Mir ist im übrigen kein einziger "moderner" Browser bekannt, der kein JavaScript unterstützt oder dieses standartmäßig ausschaltet.

        Warum interessiert dich dann die Anzeige unter Linux oder in anderen Browsern als dem IE?
        Mir ist auch kein PC bekannt, der "standardmäßig" Linux installiert hat und kein Windowsrechner, der "standardmäßig" einen anderen Browser als IE mitbringt.

        Auf Wiederlesen
        Detlef

        --
        - Wissen ist gut
        - Können ist besser
        - aber das Beste und Interessanteste ist der Weg dahin!