Ankündigung

Einklappen
Keine Ankündigung bisher.

Flexbox: Navigation links

Einklappen

Google Anzeige oben

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • #16
    Hi,
    Zitat von Localfu Beitrag anzeigen
    Es ist aber nicht immer möglich gleichzeitig die Flexibilität einer Internetseite zu bieten und anderseits auf JavaScript zu verzichten. Zwar bietet HTML5 und CSS3 viele möglichkeiten Seiten auszugestalten und das mehr denje, aber um bestimmte Aufgaben auf der Seite zu erfüllen oder bestimmte Dienste anzubieten, ist dies nur mithilfe von JavaScript möglich. Dazu gehört unter anderem die Auswertung von Formularen, ohne die Seite neu laden zu müssen.
    Aber was spricht dagegen, Formulare so auszugestalten, dass sie auch ohne Javascript nutzbar sind?
    Ich sehe wirklich keinen Grund, auf Alternativen zu Javascript verzichten zu müssen und User auszusperren, anstatt ihnen die Seiten - wenn auch weniger komfortabel und flexibel - nutzbar zu machen.

    Der Mehraufwand dazu hält sich meist auch in Grenzen. Anstatt z.B. Elemente erst über Javascript einzublenden, kann man sie onload ausblenden und dann bei Bedarf wieder anzeigen.
    Oder Formulardaten ohne Javascript abschicken lassen und alternativ mit Javascript AJAX zu nutzen.

    Das zugrunde liegende Konzept ist recht einfach. Anstatt Alternativen zu Javascript (nachträglich) einzubinden kann man bis auf wenige Ausnahmen ohne Javascript funktionierende Seiten durch Javascript erweitern.

    Gruß
    Ingo
    Ingo Webdesign

    Kommentar


    • #17
      Es geht nicht darum, komplette Elemente auszublenden, wenn JavaScript nicht funktionieren sollte. Zudem sperrt sich der User damit aus und nicht umgekehrt, Ein Formular kann ohne zutun von JavaScript versendet werden. Eine vorherige Auswertung der Daten kann ich geschehen. So zum Beispiel, wenn man sich registriert, kann vorab mithilfe von JavaScript geprüft werden, ob der Benutzername schon registriert werden, ohne das ganze Formular abschicken und neuladen zu müssen. Das istnur mithilfe von JavaScript möglich und dafür ist JavaScript auch entwickelt worden. Auch eine interaktive Gestaltung von Internetseiten ist ausschließlich mit JavaScript möglich. Und ohne Spamschutz, wird auf meiner Seite keine einzige Eingabe vom Benutzer von mir erlaubt. Für mich und meine Arbeitskollegen ist es legitim auch Inhalte ein- und ausblenden zu lassen mithilfe von JS oder Inhalte per AJAX nachzuladen, wenn es erwünscht ist, dass die Seite z.B. für Liveticker, Ergebnisse etc. Inhalte ohne die Seite neuzuladen anzeigen zu können. Ich will damit nicht deuten, dass es nicht möglich Seiten ohne JavaScript zu realisieren, aber viele Möglichkeiten werden dem Entwickler vorenthalten, wenn man gezwungen wird auf JavaScript zu verzichten. Nicht um sonst ist die Einbindung von JavaScript in HTML-Code ein fester Bestandteil.

      Wenn also jemmand ein JavaScript-Blocker verwendet, kann er nicht verlangen, dass andere Besucher nicht die Möglichkeit geboten wird eine interaktive Seite zu nutzen. Ich kenne auch keinen Fachinformatiker oder Mediengestalter aus meinen Berufsleben, die auf JavaScript verzichten, damit nur wenige Nutzer die es teilweise oder komplett blockieren zu berücksichtigen.

      Wenn man einen gedanken weiter gehen würde, was wäre das Web ohne JavaScript und ohne interaktive Elemente. Zwar würde es statische Seiten geben, die aber immer wieder neu geladen werden müssten und die Seiten wären mehr oder weniger star. Ohne JavaScript wäre sowas wie Chatten in Facebook oder anderen Kanälen garnicht möglich. Zudem bietet mir JavaScript auch die Möglichkeit die Technik Screenreader aufzubohren und eine bessere Ausgabe für Sehbehinderte anzubieten und vieles mehr, was ich mithilfe von JS leisten kann. Es für mich einen Vorteil einen festen Bestandteil eines Browser zu nutzen.

      Zurüch zu Flexbox, was das eigentliche Thema ist

      Auch ein Befürworter von Frameworks wie Bootstrap bin ich, da es sehr gutes Hilfsmittel im Alltag ist. Bootstrap 4 nutzt sogar standardmäßig Flexbox und das Framework ist kompakter und Performance optimiert. Nicht umsonst ist die Nutzung von diesem Framework beliebt und in Fachzeitschriften hoch gehandelt(zumindest bei dem Verlag Heise). Es aber auch einige Alternativen zu diesem Framework. Mit MediaQueries lässt sich auch viel machen, aber Frameworks wie Bootstrap 4 machen die Arbeit leichter und intuitiver. Und solange das Grid Layout Module in CSS kein standard ist werde ich auf diese Framework nicht verzichten und kann dies nur empfehlen.

      Gruß

      Localfu
      Phantasie ist wichtiger als Wissen, denn Wissen ist begrenzt.
      Albert Einstein

      Kommentar


      • #18
        Zitat von Arne Drews Beitrag anzeigen
        Das sehe ich anders. Eine Seite muss aufgrund von etlichen Blockern zumindest uneingeschränkt auch ohne JS bedienbar sein, auch heute noch!
        Der Entwickler, der dafür nicht Sorge trägt, hat aus meiner Sicht das Ziel aus den Augen verloren.

        JavaScript ist fein und allgegenwärtig, aber ein Entwickler ist verantwortlich dafür, dass seine Seite von möglichst allen Clients bedienbar ist!
        Die Komfortablität kann mit JavaScript natürlich verbessert werden, ganz immens sogar in manchen Fällen. Aber bedienbar muss die Seite auch ohne JS sein, ansonsten hat der Entwickler aus meiner Sicht etwas grundlegendes nicht verstanden.
        Hallo Arne, das überrascht mich etwas, ich war der Meinung Javscript ist so "allgegenwärtig" wie HTML und CSS?
        Ist Javascript über den Browser auch so einfach abzustellen?
        Warum sollte aufgrund von Blockern eine website uneingeschränkt bedienbar sein?
        Mit dem Thema ohne JS habe ich mich noch nicht beschäftigt und ich frage mich,
        welchen Aufwand da betreiben müßte um das umzubiegen?
        Mit Javascript mache ich gerade die ersten "Gehversuche", lerne gerade dazu.
        Ein paar Infos dazu wären ganz gut.
        Viele Grüße
        Gerhard

        Kommentar


        • #19
          Hi,
          Zitat von Localfu Beitrag anzeigen
          Wenn also jemmand ein JavaScript-Blocker verwendet, kann er nicht verlangen, dass andere Besucher nicht die Möglichkeit geboten wird eine interaktive Seite zu nutzen. Ich kenne auch keinen Fachinformatiker oder Mediengestalter aus meinen Berufsleben, die auf JavaScript verzichten, damit nur wenige Nutzer die es teilweise oder komplett blockieren zu berücksichtigen.
          niemand verlangt doch, auf Javascript zu verzichten und den meisten Usern hierdurch zu benachteiligen. Es müssen auch nicht alle Funktionen ohne Javascript zur Verfügung gestellt werden, sondern nur die Seite - wenn auch eingeschränkt - nutzbar sein. Auch das lässt sich mit gekonntem Einsatz von Javascript und CSS realisieren. Aber mir scheint, dass diese Kenntnisse durch den Einsatz von Frameworks bei den meisten verlorengegangen ist.

          Gruß
          Ingo
          Ingo Webdesign

          Kommentar


          • #20
            Zitat von ST747 Beitrag anzeigen
            Hallo Arne, das überrascht mich etwas, ich war der Meinung Javscript ist so "allgegenwärtig" wie HTML und CSS?
            Ist es ja auch. Nur eben kann es deaktiviert oder bestimmte JS-Möglichkeiten durch Blocker gesperrt sein. Du kannst Dich im Gegensatz zu HTML/CSS nicht darauf verlassen, die volle Funktionalität im Browser des Benutzers zu haben.

            Zitat von ST747 Beitrag anzeigen
            Ist Javascript über den Browser auch so einfach abzustellen?
            Ja klar. In allen gängigen Browsern kann man JS per Klick deaktivieren. Aber darum geht es gar nicht, denn da würde ich sogar noch mit denjenigen gehen, die sagen: "Selbst schuld, dann stell JS an.". Es geht viel mehr darum, dass es Gang und gebe ist, einen AdBlocker oder auch NoScript im Browser installiert zu haben. Die können JS-Funktionalitäten einschränken, bzw. sind dafür gedacht.

            Zitat von ST747 Beitrag anzeigen
            Warum sollte aufgrund von Blockern eine website uneingeschränkt bedienbar sein?
            Stell Dir vor, Du realisierst eine Navi komplett auf JS basierend. Im Browser des Benutzers ist ein Script-Blocker, der die Funktion der Navi ( also die JS-Ausführung ) untersagt/blockiert. Das Resultat: Der Benutzer kann Deine Seite nicht bedienen und kommt evtl. nie wieder.

            Und genau dafür bist Du verantwortlich! Du musst Deine Website so aufbauen, dass die nahezu jeder bedienen kann. Wenn Du extra Features baust, die nicht jeder nutzen kann aufgrund seiner Browser-Einstellungen o.ä., ist das nun mal so. Das wirst Du auch fast nie 100% verhindern können.
            Aber Deine Seite muss für jeden bedienbar bleiben, auch ohne Scripte, ansonsten schießt Du Dich ins aus, auch wenn andere meinen, der Benutzer selber würde sich ausschließen. Nein, DU schließt den Benutzer aus und das absichtlich, wenn Du Basis-Funktionalität auf JS aufbaust.

            Das Beispiel mit der Navigation kann sogar im worst case rechtliche Folgen haben, denn bspw. muss lt. Datenschutzbestimmungen/Internetrecht/Impressumspflicht, Dein Impressum ohne Script und in wenigen Klicks offensichtlich einsehbar sein. Erreichst Du das Impressum nur über eine JS-Navi, die bei einem Benutzer nicht funktioniert, bist Du - worst case, wie gesagt - abmahnfähig!

            ---

            Zitat von Localfu
            Zudem sperrt sich der User damit aus und nicht umgekehrt
            Doch, genau umgekehrt. ie gesagt, rede ich nur von der grundsätzlichen Bedienung der Website, nicht von aufgesetzten Features, die das alles benutzerfreundlicher gestalten.

            Zitat von Localfu
            Ein Formular kann ohne zutun von JavaScript versendet werden. Eine vorherige Auswertung der Daten kann ich geschehen. So zum Beispiel, wenn man sich registriert, kann vorab mithilfe von JavaScript geprüft werden, ob der Benutzername schon registriert werden, ohne das ganze Formular abschicken und neuladen zu müssen. Das istnur mithilfe von JavaScript möglich und dafür ist JavaScript auch entwickelt worden.
            Korrekt! Nur gehört dieses Feature nicht zur Basis-Funktionalität eines Formular. Es spricht nichts dagegen, das Formular im eigentlichen Sinne "funktionieren" zu lassen und bei entsprechenden Browsern auf die Vorabprüfung zu verzichten. So bleibt das Formular grundsätzlich nutzbar für jeden, aber die bequeme Usability ist halt nur denjenigen vorenthalten, die JavaScript aktiv und ungeblockt laufen haben.

            Zitat von Localfu
            Auch eine interaktive Gestaltung von Internetseiten ist ausschließlich mit JavaScript möglich.
            Kommt auf die Definition von "interaktiv" an. Ich definiere interaktiv so, dass wenn ich etwas auf der Seite mache, eine Reaktion kommt. Das kann schon ein Mausklick sein, wenn man es ganz pingelig sehen will. Ob das, was dann passiert über einen kompletten HTTP-Request oder einen asynchronen im Background realisiert wird, hat für mich in Bezug auf Interaktivität keine Bedeutung.

            Zitat von Localfu
            Und ohne Spamschutz, wird auf meiner Seite keine einzige Eingabe vom Benutzer von mir erlaubt. Für mich und meine Arbeitskollegen ist es legitim auch Inhalte ein- und ausblenden zu lassen mithilfe von JS oder Inhalte per AJAX nachzuladen, wenn es erwünscht ist, dass die Seite z.B. für Liveticker, Ergebnisse etc. Inhalte ohne die Seite neuzuladen anzeigen zu können. Ich will damit nicht deuten, dass es nicht möglich Seiten ohne JavaScript zu realisieren, aber viele Möglichkeiten werden dem Entwickler vorenthalten, wenn man gezwungen wird auf JavaScript zu verzichten.
            Wie gesagt, niemand hat hier je gesagt, dass auf JS verzichtet werden soll! Ich nutze es selber doch auch in allen Projekten. Aber meine Projekte lassen sich auch ohne JS immer noch annehmbar bedienen.

            Zitat von Localfu
            Wenn also jemmand ein JavaScript-Blocker verwendet, kann er nicht verlangen, dass andere Besucher nicht die Möglichkeit geboten wird eine interaktive Seite zu nutzen.
            Verlangt auch keiner!

            Zitat von Localfu
            Ich kenne auch keinen Fachinformatiker oder Mediengestalter aus meinen Berufsleben, die auf JavaScript verzichten, damit nur wenige Nutzer die es teilweise oder komplett blockieren zu berücksichtigen.
            Es soll keiner verzichten, Du verstehst uns falsch...

            Zitat von Localfu
            Wenn man einen gedanken weiter gehen würde, was wäre das Web ohne JavaScript und ohne interaktive Elemente. Zwar würde es statische Seiten geben, die aber immer wieder neu geladen werden müssten und die Seiten wären mehr oder weniger star. Ohne JavaScript wäre sowas wie Chatten in Facebook oder anderen Kanälen garnicht möglich. Zudem bietet mir JavaScript auch die Möglichkeit die Technik Screenreader aufzubohren und eine bessere Ausgabe für Sehbehinderte anzubieten und vieles mehr, was ich mithilfe von JS leisten kann. Es für mich einen Vorteil einen festen Bestandteil eines Browser zu nutzen.
            Alles richtig und von niemandem hier bemängelt.
            Aber ohne JS wäre Facebook halt Facebook ohne Chat & Co. Der Chat ist ein Usability-Feature und kein grundsätzliches Bedienelement.


            Alles weitere hat Ingo ausreichend erwähnt, wie ich finde.
            Zuletzt geändert von Arne Drews; 06.02.2018, 15:22.
            PHProcks! » Tutorials

            Kommentar


            • #21
              ok arne., jetzt sehe ich das anders, das thema muss ich mir noch später zur gemüte führen.
              aber fast alle webseiten haben inzwischen für google-analytic js eingebaut.
              kann man sich da sicher sein, dass das google-script auch das berücksichtigt, vermutlich schon?
              viele grüße
              gerhard

              Kommentar


              • #22
                Wenn man JavaScript wirklich komplett deaktiviert, funktioniert auch GA nicht mehr.
                Ich kenne allerdings keinen Blocker o.ä., der GA blockt. Es sei denn der User hat die Möglichkeit dies einzustellen, wie bei Ghostery bspw.
                PHProcks! » Tutorials

                Kommentar


                • #23
                  Hallo

                  Hätte da noch eine andere Frage, die zwar nicht direkt mit Webdesign zu tun hat, aber vielleicht kennt jemand dieses Problem.

                  Ich habe jetzt einige Test's durchgeführt und bei der besagten Webseite einiges bearbeitet. Wenn ich jetzt die Seite mit Chrome, Firefox und Edge anschaue, funktioniert es tadellos. Die eigene und das Beispiel von MrMurphy.

                  Wenn ich die Seiten aber im Internet Explorer 11 anschaue, oh Graus, funktioniert gar nichts mehr (alles untereinander statt nebeneinander, Flex greift nicht). Wenn ich jetzt die Seiten auf einem anderen PC mit dem Internet Explorer 11 anschaue, funktioniert es auch dort im IE. Gleiches OS (Versionnummer identisch), gleiche Einstellungen im IE. Habe schon alle Einstellungen zurück gesetzt und alles auf Standard zurück gesetzt.
                  Ganz komisches Phänomen.

                  Wenn jemand dazu eine Idee hätte, wäre sehr dankbar.

                  Gruss Day-Walker

                  Kommentar


                  • #24
                    Hallo

                    Mein Beispiel funktioniert im IE11.

                    Falls das nicht der Fall sein sollte hat der IE11 ein Problem. Das kann viele Ursachen haben. Zum Beispiel wurde das CSS abgeschaltet oder durch ein AddOn eingeschränkt. Oder der IE11 wurde auf einen älteren IE umgeschaltet. Oder der IE11 ist defekt.

                    Zu deiner Seite können wir nichts sagen da wir sie nicht kennen. Ohne Link zu deiner Seite kannst du dazu kaum konkrete Hilfe erwarten. Wir haben dir beispielsweise auch zum besseren Verständnis Beispiele zur Verfügung gestellt.

                    Gruss

                    MrMurphy

                    Kommentar


                    • #25
                      Hallo MrMurphy

                      Wie geschrieben funktioniert Dein Beispiel einwandfrei unter dem IE11. Nur auf meinem einen PC nicht. Das liegt bestimmt am System und nicht an Deinem Beispiel.

                      Aber vielleicht stolpert einer der Leser über meine Frage und kennt zufälligerweise das Problem.

                      Und dank Deinem Hinweis "Oder der IE11 wurde auf einen älteren IE umgeschaltet" habe ich das Problem auch gelöst. Es war eine Einstellung im Fenster Kompatibilätsansicht.

                      Gruss Day-Walker
                      Zuletzt geändert von Day-Walker; 08.02.2018, 13:59.

                      Kommentar


                      • #26
                        Hallo MrMurphy

                        Ich bin die ganze Zeit am analysieren und auseinandernehmen von Deinem guten Beispiel. So wie ich das sehe, bist Du da nach dem Schema "Mobile First" vorgegangen. Ich weiss, dass ist besser, aber ich gehe bei meinem Vorgang mit "Desktop First" an die Sache. Auch hast Du in Deinem Beispiel sehr viel Drumherum (Schriftarten, Abstände,etc).

                        Ich bin mal so vorgegangen, dass ich Dein Beispiel genommen habe und meinen Text und meine Bilder hineinkopiert habe und dann alles rausgelöscht habe, was ich nicht benötige. Das hat natürlich funktioniert. Aber es gibt gewisse Sachen, was ich bei dem vielen Code nicht ganz verstehe.

                        Dann habe ich mal auf der grünen Wiese begonnen (nur mit dem aller nötigsten). Aber da funktioniert es nicht ganz so wie es sollte. Ich habe die zwei Versionen mal angehängt. Bei der ersten Version (_01) funktioniert es nur im IE11 nicht, bei den anderen aber schon (jedenfalls das meiste).

                        Im Header steht eine Grafik. Die sieht man jetzt natürlich bei den angehängten Files nicht. Diese sollte sich auch der Grösse anpassen, was bei mir nicht funktioniert. Mir ist es auch wichtig, dass der Inhalt der Seite nur eine bestimmte Grösse (1440px) hat uns sich der Inhalt nicht unendlich an die Breite anpasst.
                        Gibt es eine Möglichkeit, die Grafik im Header je nach MediaQuery auszutauschen?

                        Ich weiss, für einen Profi wahrscheinlich was vom einfachsten, aber ich bin am verzweifeln. Oder ich stelle mich einfach nur blöd an :-)

                        Gruss und Danke Day-Walker
                        Angehängte Dateien
                        Zuletzt geändert von Day-Walker; 08.02.2018, 19:23.

                        Kommentar


                        • #27
                          Hallo

                          Ich habe jetzt (glaube ich) den Dreh raus. Habe nochmals eine Version raufgeladen. Sie ist noch ohne MediaQuerys und ohne spezielle Formatierungen (Ränder, Abstände, Schriften etc.), aber das Verkleinern und Vergrössern funktioniert bei allen Browsern.

                          Danke für Eure Meinung.

                          Gruss und Danke Day-Walker
                          Angehängte Dateien

                          Kommentar


                          • #28
                            Hallo

                            Ich brauche nochmals dringend Eure Hilfe. Ich denke, ich bin kurz vor dem Ziel, aber leider beisse ich mir die Zähne am Internet Explorer aus.

                            Bei meiner letzten Version, habe ich es hingekriegt, dass die Navigation die feste Breite behält und auch die ganze Breite der Seite nicht grösser als 90em (1440px) wird. Beim Verkleinern wird der Content mit den 4 Artikeln schön verkleinert und umgebrochen.
                            Im Chrome, Firefox, Edge funktioniert es sehr gut, aber im Internet Explorer brechen die 4 Artikel nicht um. Ich denke, ich habe in meiner Verschachtelung irgendwo noch einen Fehler drin, aber ich finde ihn einfach nicht.

                            @MrMurphy: Dein Script habe ich mir schon stundenlang zu Gemüte geführt, aber ich bekomme den Überblick nicht richtig hin. Da ist mir einfach zu viel Code drum herum. Oder geht es nur so. Bei meiner aktuellen Version (ist angehängt) fehlen noch einige Formatierungen, ich weiss, und ich arbeite Desktop First, aber die Funktionalität der FlexBox Technik scheint (bis zum IE) zu funktionieren.

                            Ich wäre demjenigen sehr dankbar, wenn er mir den entscheidenden Hinweis geben könnte, wo der Hund begraben liegt.

                            PS: Da die Bilder natürlich im Download nicht enthalten sind, sieht es beim Ausführen (Google, Firefox und Edge) jetzt anders aus. Aber mit den Bildern funktioniert es einwandfrei.

                            Gruss und Danke Day-Walker
                            Angehängte Dateien
                            Zuletzt geändert von Day-Walker; 12.02.2018, 22:13.

                            Kommentar

                            Lädt...
                            X