Beiträge von MrMurphy

    Hallo

    Das wird dir allgemein niemand beantworten können.

    Der Einsatz von Flexbox und CSS-Grid hängt vom konkreten HTML-Quelltext und der gewünschten Darstellung ab.

    Es gibt den Ansatz Flexbox mit eindimensional und CSS-Grid mit zweidimensional zu bestimmen. Das mag sich für Außenstehende logisch anhören, ist sachlich aber Quatsch. Somit auch die Bewertung zweidimensional ist besser als eindimensional, die immer wieder zu lesen ist.

    Gleich unsinnig ist die Unterscheidung Flexbox = älter = schlechter und CSS-Grid = neuer = besser. Genau so wenig ist Float jetzt plötzlich Teufelszeug oder veraltet. Es hat wiederum nur andere Aufgaben und kann und sollte dafür auch verwendet werden.

    Auch die immer wieder zu lesende Einordnung CSS-Grid sei besser für das Seiten- oder Gesamtlayout, Flexbox hingegen für einzelne Teile einer Webseite ist sachlich falsch.

    Die beiden CSS-Möglichkeiten lassen sich überhaupt nicht direkt vergleichen. Das sind schlicht unterschiedliche Möglichkeiten für unterschiedliche Aufgaben.

    Gruss

    MrMurphy

    Hallo

    In Gimp (Freeware) kannst du entsprechende Scripte erstellen.

    Allerdings wage ich zu beweifeln dass du mit dem Ergebnis, egal von welchem Programm, zufrieden sein wirst.

    Selbstverständlich bearbeiten Berufsfotografen jedes Bild einzeln, dass sie veröffentlichen wollen. Die kennen sich aber mit ihrer Software aus und haben die Erfahrung um dafür nicht "Stunden" zu brauchen.

    Zur Grundlage zur Erstellung guter Webseiten gehört es Bilder einzeln zu bearbeiten, auch wenn Anfänger diesen Aufwand gerne überspringen möchten.

    Bilder lassen sich nur auf eine einheitliche Größe bringen wenn ihr Seitenverhältnis gleich ist und nichts beschitten werden soll. Bei ungleichen Seitenverhältnissen mussen die Bilder entweder auf ein gleiches Seitenverhältnis beschnitten werden oder Ränder hinzugefügt werden. Da die Software den Inhalt der Bilder nicht kennt kann sie die nicht sinnvoll automatisch bescheiden. In der Regel ist es nicht sinnvoll alle Seiten gleichmäßig zu beschneiden.

    Dein Wunsch "Ich will keine Arbeit in die Bilder stecken, trotzdem sollen sie gut ausssehen" funktioniert nicht.

    Gruss

    MrMurphy

    Hallo

    Als Anfänger kopierst du am einfachsten die index.html und speicherst sie unter einem anderen geeigneten Namen ab. Dann änderst du so weit notwendig den Quelltext und passt gegebenenfalls die Links an.

    Gruss

    MrMurphy

    Hallo

    Zitat

    Viewport benutzt man nur für IOs bzw Android in den MEat-Daten oder?

    Nein, das hängt vom Inhalt ab, der in deinem Beispiel fehlt.

    height-Angaben sind in der Praxis meist überflüssig, die Höhe wird vom Inhalt bestimmt.

    px-Angaben für Breiten haben sich bereits seit über 10 Jahren als wenig hilfreich erwiesen.

    Beschäftige dich mal mit Flexbox.

    Gruss

    MrMurphy

    Hallo

    Nein. pt ist eine Einheit für Drucker. Im Internet hat die nichts verloren.

    Du solltest akzeptieren dass du deinen Besuchern nur einen Vorschlag machen kannst wie die Webseite aussehen kann.

    Im Gegensatz zu Papierausgaben von Textverarbeitungen, Tabellenkalkulationen, Grafikprogrammen, pdf-Dateien und ... hast du bei Internetseiten aber keinen Einfluß wie Webseiten beim Besucher aussehen. Besucher müssen sich Webseiten nicht mal anschauen, sie können sie sich auch vorlesen lassen oder in Blindenschrift ertasten. Oder, oder, oder ... Und das ist, wie schon geschrieben, auch gut so. Im Prinzip sieht eine Webseite bei jedem Besucher anders aus.

    Siehe zum Beispiel

    Little Boxes - Papierdenken

    Entscheidend ist nicht was du willst, sondern was möglich und zudem sinnvoll ist.

    Gruss

    MrMurphy

    Hallo

    Und wenn du die Strg-Taste drückst und am Mausrad drehst?

    Dein Vorgehen funktioniert meiner Kenntnis nach bei Webseiten, bei denen überhaupt keine Schriftgröße vorgegeben wird. Die sind heutzutage aber wohl die absolute Ausnahme.

    Gruss

    MrMurphy

    Hallo

    Zitat

    Lässt sich dies irgendwie umgehen, sprich, dass man für alle Benutzer automatisch eine Schriftgröße festlegt

    Nein. Und das ist auch gut so. In allen Browsern können die User die Schriftgröße selbst festlegen.

    In der Regel wird die vorgegebene Schriftgröße als zu klein empfunden.

    Mit einem Responsive Design, welches heutzutage eigentlich Standard sein sollte (Smartphone und so) ist das auch kein Problem.

    Vor 20 Jahren haben viele Webseitenersteller ihre Besucher regelmäßig mit Eingriffen oder Blockaden ihrer Browsereinstellungen gequält. Inzwischen sind bei den meisten Browsern solche Eingriffsmöglichkeiten gesperrt. Entsprechende Versuchen gelten heutzutage berechtigt als schlechter Stil.

    Gruss

    MrMurphy

    Hallo

    Wie ich vermutete läßt sich das Problem nur am praktischen Beispiel nachvollziehen.

    Die Ursache läßt sich nicht so einfach erkären.

    Jede Datei enthält unsichtbare Steuerzeichen, zum Beispiel für Zeilen- oder Absatzumbrüche.

    In der Datei mit den ungewollten Abständen befinden sich zwei dieser unsichtbaren Steuerzeichen. Ich weiß aber nicht was sie eigentlich bewirken sollen oder wie sie entstanden sind und kann deshalb nur raten. Entweder hast du ungewollt und unbewußt eine Tastenkombination gedrückt, die die Steuerzeichen einfügt oder dein Editor hat sie einfach so eingefügt oder sie sind beim Übertragen durch das FTP-Programm eingefügt worden. Es gibt aber noch mehr Möglichkeiten.

    Und zwar befinden sich die Steuerzeichen unmittelbar vor den öffnenden spitzen Klammern von

    Code
    <header>

    und vor

    Code
    <nav id="steuerungoben">

    Du kannst die Steuerzeichen direkt sehen und löschen wenn dein Editor die Datei mit den ungewollten Abständen im HEX-Modus anzeigen kann.

    Ansonsten stellst du den Cursor am besten ans Ende der jeweils vorigen Zeile und markierst den Inhalt bis einschließlich der öffnenden spitzen Klammer, löscht den markierten Teil und fügst die gelöschten Zeichen über die Tastatur wieder ein.

    Nachtrag:

    Vorweg: Das Problem hat nichts mit PHP oder dem include-Befehl zu tun.

    Offensichtlich handelt es sich bei den Steuerzeichen um die BOM (Byte Order Mark) Codierung.

    https://de.wikipedia.org/wiki/Byte_Order_Mark

    Aktuelle UTF-Dateien sollen ohne BOM gespeichert werden. Da die BOM-Codierung sich immer am Beginn einer Datei befindet stehen die Steuerzeichen wahrscheinlich in den beiden ausgelagerten Dateien "headerINC.php" und "nav_str_obenINC.php".

    Wenn dein Editor es unterstützt kannst du die beiden Dateien wahrscheinlich einfach als "UTF-8 ohne BOM" abspeichern. Wenn eine Datei als "UTF-8 mit BOM" geöffnet wird ändert der Editor ohne spezielle Anweisung nichts.

    Gruss

    MrMurphy

    Hallo

    Zitat

    Welche sollen das denn sein.

    Keine Ahnung. Du zeigst uns ja leider kein Online-Beispiel. Somit ist nur klar dass deine Angaben dein Problem nicht zeigen, wie an meiner Beispielseite sichtbar ist. Abstände entstehen schließlich nicht zufällig.

    Zitat

    Solltest du diesen aber zusätzlich benötigen, poste ich den auch noch gerne Code auch noch.

    Das wird nicht viel helfen. Zudem nervt es immer wieder nach fehlendem Quelltext zu fragen. olkostbe und basti1012 haben dein Beispiel offensichtlich auch nicht nachgebaut sondern einfach mal geraten. Wenn du Hilfe wünscht solltest du den Helfenden auch die notwendigen Angaben ohne Gezappel zur Verfügung stellen.

    Zitat

    Hast du da ein Tipp für mich (z.B. online Tutorial oder Literatur)?

    Dazu kenne ich mich zu wenig aus. Die Bücher und Videotrainings von Peter Müller (manchmal auch als Peter M. Müller) sind kompetent und gut nachvollziehbar geschrieben.

    Zitat

    hast du eine Empfehlung für einen Editor für mich

    Auch schwierig. Editoren müssen zum Nutzer passen. Ich selbst verwende Sublime Text 2 (aktuell Sublime Text 3) mit einigen AddOns. Der kostet etwas und das Menü und die Anleitung gibt es nur auf englisch. Du musst halt etwas suchen. Es ist halt hilfreich wenn der Editor Begriffe, die es in HTML / CSS / PHP nicht gibt farblich markiert. In deinem CSS zum Beispiel "background-colcor" oder "absolut".

    Gruss

    MrMurphy

    Hallo

    Wie schon geschrieben: Mit deinen Angaben ist das Problem für uns nicht nachvollziehbar.

    Am sinnvollsten wäre ein Online-Beispiel von dir. Im Moment muss jeder Einzelne, der dir helfen möchte, auf seinem Rechner dein Beispiel nachbauen. Um dann festzustellen, dass das Problem aus deinen Angaben nicht vorhanden ist.

    Eventuell hast du den Cache nicht geleert.

    Oder auf dem Server befinden sich Dateien oder veraltete Dateien, die lokal nicht mehr bestehen.

    Gruss

    MrMurphy

    Hallo

    Zitat

    Gibt es einen gänzlich anderen Ansatz, mit dem ich es am einfachsten erreiche, dass der feststehenden Bereiche nur einmal programmiert werden muss und dann der Content der Bereiche section und aside nur verändert werden muss, ohne immer den gesamten Code der feststehenden Bereiche zu wiederholen?

    Ja, aber die Lösung mit php-include ist aktuell die sinnvollste.

    Zitat

    Die PHP-Dateien werden mit include geladen, aber es werden Leerzeilen zwischen den Dateien eingefügt bzw. die Blöcke werden verschoben. Woran liegt das und wie kann ich es ändern?

    Das liegt an deinem CSS. Leider zeigst du uns die entscheidenen Passagen nicht. Mit deinen Angaben erhalte ich das folgende Ergebnis:

    Beispiel mit vorhandenen Informationen

    Die Fehlermeldungen interessieren nicht da die include-Dateien nicht vorhanden sind.

    Zwischen header und nav gibt es aber keine Abstände. Mit deinen Angaben können wir dein Problem also nicht nachvollziehen, der problematische Quelltext fehlt.

    Insgesamt fällt auf das deine CSS-Kenntnisse veraltet sind, du solltest dich auf den aktuellen Stand bringen.

    Zudem enthalten deine CSS-Angaben Rechtschreibfehler. Dabei kann ein Editor helfen, der solche Fehler farblich hervorhebt.

    Gruss

    MrMurphy

    Hallo

    Wie soll das ganze bei Touchscreengeräte funktionieren? Die kennen keine Hovereffekte.

    Zitat

    wenn ich ich über Element 1 fahre, sich Element 2 ändert

    Zunächst muss Element1 im Quelltext vor Element2 stehen. Nur als Hinweis, das ist bei dir gegeben.

    Dann musst du

    Code
    #element2:hover #element1

    durch

    Code
    #element1:hover + #element2

    ersetzen.

    Gruss

    MrMurphy

    Hallo

    Verweisssensitive Grafiken waren vor 15 Jahren mehr oder weniger Pflicht in jedem Webauftritt. Heutzutage werden sie aber kaum noch verwendet, da sie viele Nachteile haben.

    Viele Besucher erkennen die Verweise auf der Grafik überhaupt nicht und können deshalb die Links überhaupt nicht aufrufen. Es ist schließlich nicht üblich mit der Maus wild über jede Grafik zu fahren um versteckte Links zu finden.

    Viele Besucher klicken aus schlechter Erfahrung nur noch Links an, von denen sie aus der Beschreibung wissen, was sie erwartet. Zu Links auf Grafiken fehlt zu Erklärunge dazu häufig der Platz.

    Touchscreengeräte kennen keine hover-Effekte, die sind heutzutage aber bereits gegenüber Desktop-Geräten in der Mehrheit - mit noch steigender Tendenz. Die sowieso schon schlechte Möglichkeit über hover-Effekte Beschreibungen zu den Links einzufügen hilft somit nur noch einer Minderheit.

    Bei kleinen und / oder schmalen Bildschirmen wird der Platz für die Grafiken schnell zu klein. Die Links werden dann so klein, dass sie kaum noch anzuklicken sind. Mit Fingern auf Touchscreengeräten schon gar nicht.

    Oder es muss wild und nervig in alle Richtungen gescrollt werden. Wobei viele Besucher in Zeiten von Responsive Design häufig überhaupt nicht mit einem seitlichen Scrollen rechnen und so seitlich stehende Links überhaupt nicht erkennen.

    Eine Verweissensitive Grafik mag dein Traum sein - für deine Besucher ist sie eher ein Albtraum.

    Es hat schon seinen Sinn warum Verweissensitive Grafiken heutzutage trotz der deutlich verbesserten Möglichkeiten zur Einbindung (erweitertes CSS, SVG) kaum noch verwendet werden.

    Verweissensitive Grafiken haben auch heutzutage durchaus noch ihre Berechtigung, zum Beispiel in technischen Zeichnungen. Allerdings sollte aus dem zugehörigen Text deutlich werden, dass überhaupt eine Verweissensitive Grafik vorliegt und was die Besucher erwartet, wenn sie einen Link anklicken. Außerdem sollten sie auf möglichst vielen Endgeräten problemlos nutzbar sein.

    Gruss

    MrMurphy