Re: [TYPO3-german] Responsive / Bootstrap
Hi Georg, nun je besser man TYPO3 kennt, desto bessere Seiten kann man bauen, auch logisch ;) Aber du bindest halt einfach nur mal die Sachen ein, die du wirklich brauchst, zB grid und sobald du dann neue Klassen verwendest, dann siehst du e sofort, dass es da keine styles gibt und bindest das nächste less file ein, zb buttons oder was auch immer super, klingt gut :) Danke! Grüße, Jan ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Responsive / Bootstrap
Hi Thomas, Eine serverseitige Integration von Less ist zwar ganz hübsch, erfordert aber einen viel tieferen Einstieg in's Thema, als die reine Nutzung mittels Mini-Tools wie z.B. 'Bootswatch'. Das Konzept ist einfach und transparent, und erlaubt eigene Styles direkt in Bootstrap einzukompilieren, ohne die Quellen zu mischen. Ich arbeite mit NetBeans, aber ohne LESS Plugin. Durch kleine Modifikation des Bootswatch Scripts kompiliere ich die Dateien direkt ins TYPO3 Stylesheet Verzeichnis meines Entwicklungssystemes - und gut is. D.h. du nimmt eines der Themes von Bootswatch, lädst nur die LESS-Files herunter, nimmst darin Anpassungen vor und kompilierst das dann von der Console direkt ins Ressource/Public/Css? Danke und viele Grüße, Jan ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Responsive / Bootstrap
Quote: Jan Kornblum (t3jkb) wrote on Fri, 13 December 2013 15:05 Hi Thomas, Eine serverseitige Integration von Less ist zwar ganz hübsch, erfordert aber einen viel tieferen Einstieg in's Thema, als die reine Nutzung mittels Mini-Tools wie z.B. 'Bootswatch'. Das Konzept ist einfach und transparent, und erlaubt eigene Styles direkt in Bootstrap einzukompilieren, ohne die Quellen zu mischen. Ich arbeite mit NetBeans, aber ohne LESS Plugin. Durch kleine Modifikation des Bootswatch Scripts kompiliere ich die Dateien direkt ins TYPO3 Stylesheet Verzeichnis meines Entwicklungssystemes - und gut is. D.h. du nimmt eines der Themes von Bootswatch, lädst nur die LESS-Files herunter, nimmst darin Anpassungen vor und kompilierst das dann von der Console direkt ins Ressource/Public/Css? So ähnlich. Ich nehme kein spezielles Theme von Bootswatch (das default Theme basiert auch auf Less). Die Skripte von Swatchmaker habe ich so angepasst, dass sie pro Domain wirken, also den Output in ein Verzeichnis meiner Wahl kopieren. Also z.B. make bootswatch PROJECT=myproject Im makefile dann die Pfade entsprechend gesetzt. Danke und viele Grüße, Jan ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Responsive / Bootstrap
-BEGIN PGP SIGNED MESSAGE- Hash: SHA1 Moin! On 12/13/2013 08:26 AM, Thomas Skierlo wrote: Quote: Jan Kornblum (t3jkb) wrote on Thu, 12 December 2013 22:01 Das ist mir erstmal (noch) etwas zu abgehoben. Mein Plan wäre zunächst, das Netbeans Plugin für LESS auszuprobieren (hat da jemand Erfahrungswerte, funktioniert das verlässlich?). Die IDE nutze ich, Projekte in der Regel als remote-Projekte (sftp). Und erstmal losgelöst von Frameworks etwas CSS auf Basis von LESS zu erzeugen (kompiliert). Node.js und clientseitige .less Kompilierung sind für mich eher uninteressant... Eine serverseitige Integration von Less ist zwar ganz hübsch, erfordert aber einen viel tieferen Einstieg in's Thema, als die reine Nutzung mittels Mini-Tools wie z.B. 'Bootswatch'. Das Konzept ist einfach und transparent, und erlaubt eigene Styles direkt in Bootstrap einzukompilieren, ohne die Quellen zu mischen. Ich arbeite mit NetBeans, aber ohne LESS Plugin. Durch kleine Modifikation des Bootswatch Scripts kompiliere ich die Dateien direkt ins TYPO3 Stylesheet Verzeichnis meines Entwicklungssystemes - und gut is. Ich persönlich finde die serverseitige Einbindung von LESS-Dateien sehr viel einfacher... man installiert sich einfach die Extension amazingless (gemacht mit phpless, das hängt dem echten LESS etwas hinterher), und kann LESS-Dateien dann genauso nutzen wie sonst CSS-Dateien. Nur die Dateiendung unterscheidet sich. Die Extension arbeitet auch mit dem scriptmerger zusammen. Gruß Jost -BEGIN PGP SIGNATURE- Version: GnuPG v1.4.14 (GNU/Linux) Comment: Using GnuPG with Thunderbird - http://www.enigmail.net/ iQIcBAEBAgAGBQJSqxtwAAoJEG6HPMAgWtVz4kQQAJaTQskzgnW8pdh32pNo2rF+ I/B7Ym4vDRKOJlGdE4DcL3GnDQxSw0YAJDpx1/3UKsb+RWaGc/i7leGV2MAstUJL 8xhGF/HYGaXC9YSGhYGFzTS1lESI3NVn2KmOzgX+ZoBtNdu1wRCRCuRXYPvnb+2N v2WzgmdXIZYA7GjurcEGzE8O8ze6CUEwlv53DNMBcWSG8kPFIs7XaPg6QxIc1Djg yQx8AfIkmIoF3ic3PzOhzvJRSX28FjOS4hnrzRT09GIzGQ9U3Ivzg9Gkam1RPV/j 34kfef1Y1VM9gg03Tkj89YDzGsFizMZVn28XR5yxF0/W8+BIwwNtLJE2MTElX75N 2AlH3JRKV705JZRT7C375KWD6/5WyY+I6ovWfJ3j/5Cf1+tBP/aLgEEH4Rehs6bQ 3sX7sKYQTLdll/12n0Pe5Ok009j/DDNZByqxMum+ZB7QUgffEr9jkDPBPLBqZQIy D6GKfQ7kfGtoNgCjIEgCtcgcanf5tUdeHhUiChj+5pB4o/g46Hl2iFg2HqvQASL/ 8n4PSg+YiZgsFQixe6atK73eqSMCRCayvtjdMElcg608eyTi/QfrHFbZ4YwOza7k h/u60zNDC+BzVFFcv1ndwHgM9yl6un5XhdOV/IfyntUqxZ3gU3SfSxDz2L/8c1yW /1w7h4vjAQY5GPxYMlon =NOlV -END PGP SIGNATURE- ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Responsive / Bootstrap
Hallo Sven, ich befürchte, der 'picture' Tag hat es bereits hinter sich. Die derzeitige Lösung scheint in Richtung 'src-N' zu gehen, wobei 'derzeitig' den Stand aus KW42 - 50 beschreibt. src-N bietet nicht nur unterschiedliche Bildgrößen für unterschiedliche Devices, es erlaubt auch 'Density' Angaben, um die Retina Displays der Apple Jünger nicht als Investitionsruine auf der Strecke zu lassen. HTML5 still sucks, weil es einfach nicht als Standard existiert, und permanent neu erfunden wird.Trotzdem ist es, wie die Bundesmutti sagen würde, alternativlos. In den 1990ern wurden Entwickler durch die Browser Wars gequält, und damit der Ungemach auch in Zukunft so bleibt, wurden Responsive Images erfunden :-) Grüße, Thomas ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Responsive / Bootstrap
Hallo, Am 11.12.2013 15:45, schrieb Jan Kornblum: Hi Georg, vielen Dank. bootstrap ist nur ein Framework das einem ein paar Klassen gibt und hier ein Default-Styling vornimmt. Das ist schön um mal schnell was rauszuschmeissen ohne dass man sich Gedanken machen muss ob es ganz hässlich aussieht. Also Masse als Klasse? Und für die richtig hübschen individuellen Sachen eher fehl am Platz...? nein gar nicht aber es ist halt ein Werkzeug und nicht ein Designkasten für das Design des Kunden. Aber das bootstrap.css in einer separaten Datei zu überschreiben bzw. anzupassen, darüber bin ich bei der Recherche schon öfters gestolpert. Auch eher ein no-go? ja weil man da dann wirklich unendlich viel arbeit hat. Daher arbeitet man mit LESS oder SASS, nimmt sich von bootstrap die Dinge die man eben braucht und nur die bindet man ins eigene CSS ein. O.K., das klingt nach richtig ordentlich aber auch recht aufwendig. less hilft einem bei jedem CSS, das hat mit bootstrap überhaupt nix zu tun Georg ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Responsive / Bootstrap
Hallo Jan, ich beschäftige mich seit nunmehr 6 Monaten fast ausschließlich mit der BS Integration in TYPO3. Als ich mit BS2 fertig war, kam BS3 und es ging fast 'zurück auf Start'. Ähnliche Folklore also, wie bei TYPO3. Jetzt bin ich erneut fast fertig, hänge aber noch auf TYPO3 6.1x. Der Knackpunkt sind und bleiben Responsive Images. Ein großes Manko von TYPO3 (aber auch den meisten Anderen): Durch hohe Konzentration auf Aspekte des Cores, die sich NICHT im FE auswirken, ist das FE-Rendering von TYPO3 etwas 'outdated'. CSC ist zwar strukturell geeignet, aber im Detail bleibt dann wohl doch eher ein kompletter Ersatz. Mein bisheriger Weg: 1) Minimale Erweiterung der Pages Tabelle (um eine Seitenklasse, banal) 2) Ein Hook für CSC Image Rendering, um Bilder nicht nur (per derzeit favorisiertem) Weg pro Device zu rendern, sondern sie auch noch in ein passendes Grid zu zwängen (ziemlich unbanal). 3) Ersatz von ca. 80% des CSC Setups (banal, sobald man Durchblick im Chaos hat) 4) Kräftige Überarbeitung des RTE Renderings für BS Klassen (vergleichsweise einfach) 5) Aktive (Javascript) Gimmicks, wie Collapse, Carousel, Slider, Fader per Gridelements/TS (bei Gridelements/Fluid bin ich bislang leider gescheitert) 6) Strukturelemente/Subgrids per Gridelements (banal) 7) Navigationsstrukturen a la BS per TS (sehr banal) 8) Rendering von Indexed Search und anderen Sys-Ext. auf BS anpassen (banal) 9) Add-Ons für BS-Javascript Elemente, um sie hinsichtlich visueller Gestaltung flexibler zu machen (einfach). 10) Beim Affix Plugin von BS daran scheitern, die Section Navigation von TYPO3 zu nutzen, weil diese Gridelements schnöde ignoriert. Ich bin zu 95% fertig, bis Weihnachten sollte es mein Entwicklungssystem verlassen können. Aber ich bin fast sicher, zwischenzeitig noch über irgend eine Blutgrätsche von 6.2 zu stolpern. Sonst wäre das Leben ja auch langweilig :-) Bleibt die Frage nach der individuellen Gestaltbarkeit. Auch ich erkenne fast jede Bootstrap (Foundation) Seite sofort. Dies liegt aber weniger an gestalterischen Möglichkeiten der Plattform, sondern eher daran, dass fast alle das Standardlayout ganz ok finden (zumindest im Vergleich zu allem, was sie bislang mühsam per Hand zusammengeklöppelt haben). Ich bin weit davon entfernt, ein guter grafischer Gestalter zu sein, aber gerade deshalb machen CSS Frameworks ja Sinn. Sich nicht mehr um das nitty-gritty kümmern müssen und alles klappt, oft sogar im IE.x Grüße, Thomas ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Responsive / Bootstrap
Am 12.12.13 09:39, schrieb Thomas Skierlo: Ich bin zu 95% fertig, bis Weihnachten sollte es mein Entwicklungssystem verlassen können. Aber ich bin fast sicher, zwischenzeitig noch über irgend eine Blutgrätsche von 6.2 zu stolpern. Sonst wäre das Leben ja auch langweilig :-) Das Ergebnis würd ich gern mal sehen! Bleibt die Frage nach der individuellen Gestaltbarkeit. Auch ich erkenne fast jede Bootstrap (Foundation) Seite sofort. Dies liegt aber weniger an gestalterischen Möglichkeiten der Plattform, sondern eher daran, dass fast alle das Standardlayout ganz ok finden (zumindest im Vergleich zu allem, was sie bislang mühsam per Hand zusammengeklöppelt haben). Richtig. Man kann natürlich weitgehend die Standarddefinitionen übernehmen. Was eben viele tun, weil kein Designer zur Hand oder ihnen zu teuer ist. Dann endet das so wie damals bei YAML, als viele behauptet haben, damit könnte man praktisch nur die Demolayouts umsetzen - was natürlich vollkommener Quatsch war. Ich bin weit davon entfernt, ein guter grafischer Gestalter zu sein, aber gerade deshalb machen CSS Frameworks ja Sinn. Sich nicht mehr um das nitty-gritty kümmern müssen und alles klappt, oft sogar im IE.x Man sollte schon einen guten grafischen Gestalter haben, dessen Entwurf man dann umsetzt. Bei eben dieser Umsetzung kann ein CSS Framework einem dann viel Routinearbeit abnehmen und durch Standardisierung Entwicklungs- und Wartungszeiten verkürzen. Gruß Christian ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Responsive / Bootstrap
Man sollte schon einen guten grafischen Gestalter haben, dessen Entwurf man dann umsetzt. Bei eben dieser Umsetzung kann ein CSS Framework einem dann viel Routinearbeit abnehmen und durch Standardisierung Entwicklungs- und Wartungszeiten verkürzen. Hmm... Angenommen, Gestalter und Entwickler einigen sich im Vorfeld auf den Einsatz von Bootstrap (o.a.) bei einer responsive Seite (Neuland für beide Beteiligten). Dann ist es sicher nicht verkehrt, wenn auch der Gestalter sich grundlegend mit Bootstrap auskennt und das bei der Gestaltung schon etwas berücksichtig, oder? Um ein gesundes Maß an Individualisierung bei verträglichem Entwicklungsaufwand zu erreichen... Klar, normalerweise läuft es wohl eher so: Der Gestalter gestaltet völlig frei etwas responsives und der Entwickler entscheidet danach, ob und auf welches Framework er bei der Umsetzung zurück greift. Stimmt's? Grüße, Jan ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Responsive / Bootstrap
Nun wenn natürlich das Design sich an kein Grid hält, wird das schwierig werden das mit einem Grid im CSS abzubilden. klar georg ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Responsive / Bootstrap
Danke für die ausführliche Erklärung! Der von Georg beschriebene Weg über SASS/LESS ist Stand der Technik und das Maß der Dinge. Es erlaubt dir, das Framework im Vornherein auf dein Projekt zu zu schneiden und nur die Benötigten Komponenten einzuziehen um uA Dateigrößen zu optimieren und den Workflow zu optimieren. Auf der Bootstrap Seite gibt es ja ein online Customizing, wo man die Komponeten zusammenstellen kann und sogar grundlegendes Styling vornehmen kann. Aber damit kratz man dann eher an der Oberfläche, stimmts? Also gut, dann muss LESS auf die Todo-Liste... Grüße, Jan ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Responsive / Bootstrap
Ich sage an dieser Stelle mal stellvertretend danke an alle Beteiligten, damit ich nicht die ganze Liste zumülle ;) Grüße, Jan ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Responsive / Bootstrap
Korrekt. Das sind im Prinzip LESS Variablen, die dort geschrieben werden. Zum Download hin wird es dann kompiliert. Das Grid ist, wie Georg ansprach, ziemlich Fundamental. Das sollte dein Gestalter in jedem Fall in seinen Vorlagen berücksichtigen / hinter seine Arbeiten legen. Dein Gestalter sollte also in jedem Fall das Grid und die Möglichkeiten/Einschränkungen kennen, die es bietet. Ähnlich auch bei Foundation. Zitat von Jan Kornblum jan.kornb...@gmx.de: Danke für die ausführliche Erklärung! Der von Georg beschriebene Weg über SASS/LESS ist Stand der Technik und das Maß der Dinge. Es erlaubt dir, das Framework im Vornherein auf dein Projekt zu zu schneiden und nur die Benötigten Komponenten einzuziehen um uA Dateigrößen zu optimieren und den Workflow zu optimieren. Auf der Bootstrap Seite gibt es ja ein online Customizing, wo man die Komponeten zusammenstellen kann und sogar grundlegendes Styling vornehmen kann. Aber damit kratz man dann eher an der Oberfläche, stimmts? Also gut, dann muss LESS auf die Todo-Liste... Grüße, Jan ___ TYPO3-german mailing list TYPO3-german@lists.typo3.orghttp://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Responsive / Bootstrap
Quote: Christian Hennecke wrote on Thu, 12 December 2013 10:56 Am 12.12.13 09:39, schrieb Thomas Skierlo: Ich bin zu 95% fertig, bis Weihnachten sollte es mein Entwicklungssystem verlassen können. Aber ich bin fast sicher, zwischenzeitig noch über irgend eine Blutgrätsche von 6.2 zu stolpern. Sonst wäre das Leben ja auch langweilig :-) Das Ergebnis würd ich gern mal sehen! Die Extension schiebe ich nach Fertigstellung auf Github. Vorher muss alles aber noch auf 6.2 funktionieren. ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Responsive / Bootstrap
Warum so spät? Erlaube doch Anderen, dir ein wenig zur Hand zu gehen :) Zitat von Thomas Skierlo t...@pix-pro.eu: Quote: Christian Hennecke wrote on Thu, 12 December 2013 10:56 Am 12.12.13 09:39, schrieb Thomas Skierlo: Ich bin zu 95% fertig, bis Weihnachten sollte es mein Entwicklungssystem verlassen können. Aber ich bin fast sicher, zwischenzeitig noch über irgend eine Blutgrätsche von 6.2 zu stolpern. Sonst wäre das Leben ja auch langweilig :-) Das Ergebnis würd ich gern mal sehen! Die Extension schiebe ich nach Fertigstellung auf Github. Vorher muss alles aber noch auf 6.2 funktionieren. ___ TYPO3-german mailing list TYPO3-german@lists.typo3.orghttp://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Responsive / Bootstrap
Quote: Cedric Ziel (virtualmachine) wrote on Thu, 12 December 2013 16:46 Warum so spät? Erlaube doch Anderen, dir ein wenig zur Hand zu gehen :) Um das zu ermöglichen müsste ich zuerst alles dokumentieren. Und vorher noch schnell den Doku Standard der Woche verstehen. Das hielte mich derzeit zu sehr vom Wesentlichen ab. Später, wenn es darum geht, Dinge rund zu machen, ist Hilfe gerne gesehen. ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Responsive / Bootstrap
Wenn du Contributions über GitHub abwickeln willst, warum nicht die Doku in Markdown schreiben? PlainText mit ein paar extras.. Auch zu Dokumentation kann von anderen erstellt werden ;) Just sayin' Zitat von Thomas Skierlo t...@pix-pro.eu: Quote: Cedric Ziel (virtualmachine) wrote on Thu, 12 December 2013 16:46 Warum so spät? Erlaube doch Anderen, dir ein wenig zur Hand zu gehen :) Um das zu ermöglichen müsste ich zuerst alles dokumentieren. Und vorher noch schnell den Doku Standard der Woche verstehen. Das hielte mich derzeit zu sehr vom Wesentlichen ab. Später, wenn es darum geht, Dinge rund zu machen, ist Hilfe gerne gesehen. ___ TYPO3-german mailing list TYPO3-german@lists.typo3.orghttp://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Responsive / Bootstrap
Jetzt muss ich das doch nochmal aufgreifen ;) Der von Georg beschriebene Weg über SASS/LESS ist Stand der Technik und das Maß der Dinge. Es erlaubt dir, das Framework im Vornherein auf dein Projekt zu zu schneiden und nur die Benötigten Komponenten einzuziehen um uA Dateigrößen zu optimieren und den Workflow zu optimieren. Habe mir gerade mal einen Grobüberblick über LESS verschafft, klingt genial! Ich sollte einfach mal öfter die sowieso abonnierten t3n's durchlesen... In Bezug auf Bootstrap o.ä. bedeutet das aber, dass man das Framework a mehr oder weniger auswendig kennen muss, um einen individuellen Zusammenbau mithilfe von LESS überhaupt bewerkstelligen zu können, oder? Für einen sanften Einstieg in fortgeschrittenes Tooling empfehle ich eine aktuelle Entwicklungsumgebung sowie Grunt. Grunt als TaskRunner kann dir einen haufen Arbeit abnehmen. Hier würde ich dir empfehlen einen Blick auf Yoeman zu werfen (http://yeoman.io/) der webapp-generator zeigt, wie viel mit wenig Aufwand erreichbar und optimierbar ist. Ich nutze Yeoman in 99% aller neuen Projekten, unabhängig ob TYPO3 oder nicht. Es gibt Alternativen, auf die ich keinen Blick geworfen habe. Mein Workflow sieht typischerweise so aus: * ProviderExtension erstellen * Innerhalb dieser ziehe ich in Dokumentation/Mock ein neues generator-webapp projekt hoch * Erstellung des html mockups mit grunt watch, um auf dem einen Bildschirm in der IDE und auf dem zweiten auf eine sich selbst aktualisierendee Mockup zu haben * nähert sich das Projekt der tatsächlichen Integration, ergänze ich den grunt task build um einen copy mechanismus, um die generierten files in Resources\Public zu kopieren, sowie den grunt server task um die gleiche Funktionalität Das ist mir erstmal (noch) etwas zu abgehoben. Mein Plan wäre zunächst, das Netbeans Plugin für LESS auszuprobieren (hat da jemand Erfahrungswerte, funktioniert das verlässlich?). Die IDE nutze ich, Projekte in der Regel als remote-Projekte (sftp). Und erstmal losgelöst von Frameworks etwas CSS auf Basis von LESS zu erzeugen (kompiliert). Node.js und clientseitige .less Kompilierung sind für mich eher uninteressant... Zweite Lernkurve wäre dann individualisiertes Bootstrap mithilfe von LESS zu erzeugen. Da muss wohl eine Testseite für herhalten... Grüße, Jan ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Responsive / Bootstrap
Am 12.12.2013 16:46, schrieb Cedric Ziel: Warum so spät? Erlaube doch Anderen, dir ein wenig zur Hand zu gehen :) und aus meiner Erfahrung aus ich-weiß-nicht-wievielen-extensions: - die leute wollen einfach nur einen snapshot und zu 99,9% nicht contributen, was auch grundsätzlich ok ist, aber - sie verstehen nicht dass es eine pre-alpha ist, die voller bugs sein kann - sind sauer wenn sie die extension doch produktiv nutzen und was nicht geht - sind sauer wenn irgendwas nicht geht - sind sauer weil nichts dokumentiert ist und dann greifen sie die extension nie mehr an, auch wenn sie dann einfach paar monate stable und sauber ist. just saying as well Georg ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Responsive / Bootstrap
Hallo, Am 12.12.2013 22:01, schrieb Jan Kornblum: In Bezug auf Bootstrap o.ä. bedeutet das aber, dass man das Framework a mehr oder weniger auswendig kennen muss, um einen individuellen Zusammenbau mithilfe von LESS überhaupt bewerkstelligen zu können, oder? nun je besser man TYPO3 kennt, desto bessere Seiten kann man bauen, auch logisch ;) Aber du bindest halt einfach nur mal die Sachen ein, die du wirklich brauchst, zB grid und sobald du dann neue Klassen verwendest, dann siehst du e sofort, dass es da keine styles gibt und bindest das nächste less file ein, zb buttons oder was auch immer Georg ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Responsive / Bootstrap
Quote: Jan Kornblum (t3jkb) wrote on Thu, 12 December 2013 22:01 Das ist mir erstmal (noch) etwas zu abgehoben. Mein Plan wäre zunächst, das Netbeans Plugin für LESS auszuprobieren (hat da jemand Erfahrungswerte, funktioniert das verlässlich?). Die IDE nutze ich, Projekte in der Regel als remote-Projekte (sftp). Und erstmal losgelöst von Frameworks etwas CSS auf Basis von LESS zu erzeugen (kompiliert). Node.js und clientseitige .less Kompilierung sind für mich eher uninteressant... Eine serverseitige Integration von Less ist zwar ganz hübsch, erfordert aber einen viel tieferen Einstieg in's Thema, als die reine Nutzung mittels Mini-Tools wie z.B. 'Bootswatch'. Das Konzept ist einfach und transparent, und erlaubt eigene Styles direkt in Bootstrap einzukompilieren, ohne die Quellen zu mischen. Ich arbeite mit NetBeans, aber ohne LESS Plugin. Durch kleine Modifikation des Bootswatch Scripts kompiliere ich die Dateien direkt ins TYPO3 Stylesheet Verzeichnis meines Entwicklungssystemes - und gut is. Auch die selektive Nutzung der Less-Bausteine stelle ich in Frage. Ich finde an Bootstrap nichts, was ich nicht benötige - sowohl auf der CSS als auch der JS-Seite. Zwei minifizierte Dateien für alles. Über Client-Side Caching nur 1x übermittelt. jQuery direkt vom CDN. Das ergibt allerbeste Performance Werte. Das schöne an Bootstrap: Man muss nicht viel verstehen. Es reicht, es anzuwenden. Für sichere Funktion sorgen qualifizierte Leute, die in CSS und JS träumen. ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
[TYPO3-german] Responsive / Bootstrap
Hallo Newsgroup, bislang musste ich mich noch nicht groß mit responsive beschäftigen, was sich demnächst ändern soll. Bootstrap scheint ja ganz toll zu sein und ich habe mich mal etwas damit befasst, zumindest in der Theorie... Habt ihr schon TYPO3 Seiten auf Basis von Bootstrap gemacht und wie sind eure Erfahrungen? Inwieweit lässt sich ein individuelles Design in Bootstrap integrieren? Es gibt ja diverse online-Tools, um das Aussehen (Primäre Farben, Abstände, etc.) anzupassen und Bottstrap selbst bietet ja auch eine online-Konfiguration. Ich habe den Eindruck, dass das nur in begrenztem Rahmen möglich ist. Mir scheint, dass der Anpassungsaufwand, wenn die finale Seite nachher nicht mehr nach Bootstrap aussehen soll, sehr hoch ist und es unter diesen Umständen ggf. mehr Sinn macht, ganz auf Bootstrap zu verzichten? Oder z.B. nur die erforderlichen Komponenten für das Grid zu verwenden und den Rest händisch zu erledigen? Wobei das sicherlich auch nicht weniger Aufwand wäre... Wie macht ihr das? Responsive ist ja auch irgendwo ein dehnbarer Begriff und Bootstrap macht ja auch nicht alles. Z.B. Bilder ohne Dimensionen auszuliefern funktioniert zwar, aber eigentlich sollten die Bilder ja serverseitig schon entsprechend gerendert werden. Oder in mehreren Dimensionen generiert werden und clientseitig dann nur die richtige Dimension geladen werden. Usw. Wann ist für euch responsive vollständig bzw. zufriedenstellend umgesetzt? Auch mit Focus auf TYPO3? Viele Grüße, Jan ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Responsive / Bootstrap
Hallo, bootstrap ist nur ein Framework das einem ein paar Klassen gibt und hier ein Default-Styling vornimmt. Das ist schön um mal schnell was rauszuschmeissen ohne dass man sich Gedanken machen muss ob es ganz hässlich aussieht. Mehr ist es nicht. Was man nicht tut: Einfach das bootrap.css zu nehmen und hier dann das anpassen was man anders haben will. Dann macht das ganze 0 Sinn. Daher arbeitet man mit LESS oder SASS, nimmt sich von bootstrap die Dinge die man eben braucht und nur die bindet man ins eigene CSS ein. lg Georg PS: Das ganze gilt natürlich auch für jedes andere Framework wie foundation Co ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Responsive / Bootstrap
Am 11.12.2013 11:35, schrieb Jan Kornblum: bislang musste ich mich noch nicht groß mit responsive beschäftigen, was sich demnächst ändern soll. Bootstrap scheint ja ganz toll zu sein und ich habe mich mal etwas damit befasst, zumindest in der Theorie... je nachdem wie dein demnächst definiert ist, ist vielleicht der TIPP unten auch etwas für dich... dort wird auf jeden Fall (unter anderem) genau an dieser Problematik gearbeitet um mit TYPO3 6.2 für verschiedene CSS Frameworks (natürlich auch Bootstrap) hier eine sauber funktionierende Basis zu schaffen (damit nicht jeder Gedanke von jedem wieder auf's neue gedacht werden muß)... -- image[FORMAT] - Ralf-René Schröder http://www.image-format.eu ... Wir geben Ihrem Image das richtige Format aktueller TIPP: www.startnext.de/typo3-theme-packages ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Responsive / Bootstrap
Hi Ralf, je nachdem wie dein demnächst definiert ist, ist vielleicht der TIPP unten auch etwas für dich... dort wird auf jeden Fall (unter anderem) genau an dieser Problematik gearbeitet um mit TYPO3 6.2 für verschiedene CSS Frameworks (natürlich auch Bootstrap) hier eine sauber funktionierende Basis zu schaffen (damit nicht jeder Gedanke von jedem wieder auf's neue gedacht werden muß)... Vielen Dank. Das hört sich interessant an! Wobei ich tendentiell eher dazu neige, möglichst plain auszukommen und wenig Fremdkomponenten einzubauen bzw. Abhängigkeiten einzugehen. Aber gut, bei bestimmten Anforderungen (repsonsive) muss man sich davon vielleicht lösen... Viele Grüße, Jan ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Responsive / Bootstrap
Das gute Maß an Einarbeitung wird immer mehr, je weniger man sich mit moderner Frontend Entwicklung auseinander setzt. Birgt aber unglaublich viel Einsparungspotential was Nerven und benötigte Manpower angeht. Bootstrap ist wie Foundation ein modulares Framework, das sich exakt deinen Bedürfnissen anpassen _kann_, aber nicht muss. Der von Georg beschriebene Weg über SASS/LESS ist Stand der Technik und das Maß der Dinge. Es erlaubt dir, das Framework im Vornherein auf dein Projekt zu zu schneiden und nur die Benötigten Komponenten einzuziehen um uA Dateigrößen zu optimieren und den Workflow zu optimieren. Für einen sanften Einstieg in fortgeschrittenes Tooling empfehle ich eine aktuelle Entwicklungsumgebung sowie Grunt. Grunt als TaskRunner kann dir einen haufen Arbeit abnehmen. Hier würde ich dir empfehlen einen Blick auf Yoeman zu werfen (http://yeoman.io/) der webapp-generator zeigt, wie viel mit wenig Aufwand erreichbar und optimierbar ist. Ich nutze Yeoman in 99% aller neuen Projekten, unabhängig ob TYPO3 oder nicht. Es gibt Alternativen, auf die ich keinen Blick geworfen habe. Mein Workflow sieht typischerweise so aus: * ProviderExtension erstellen * Innerhalb dieser ziehe ich in Dokumentation/Mock ein neues generator-webapp projekt hoch * Erstellung des html mockups mit grunt watch, um auf dem einen Bildschirm in der IDE und auf dem zweiten auf eine sich selbst aktualisierendee Mockup zu haben * nähert sich das Projekt der tatsächlichen Integration, ergänze ich den grunt task build um einen copy mechanismus, um die generierten files in Resources\Public zu kopieren, sowie den grunt server task um die gleiche Funktionalität ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Responsive / Bootstrap
Hallo Jan, nach meinen Erfahrungen nach, ist das ganze Thema noch ein wenig problematisch. Es kommt darauf an, in welcher Qualität du es umsetzen willst. Schön wäre natürlich die Unterstützung des picture-Tags um größenoptimierte Bilder ausliefern zu können, aber da machen die Browser ohne Weiteres noch nicht mit. TYPO3 beizubringen, mit Bootstrap 2 oder 3 umzugehen, ist möglich, aber auch aufwändig, je nach Qualität natürlich. Meine Erfahrungen: http://t3bootstraptv.de (TemplaVoila + Bootstrap 2) http://t3bootstrap.de (Fluid + Bootstrap 3 , TYPO3 6.1 und 6.2) Grüße, Sven Am 11.12.2013 11:35, schrieb Jan Kornblum: Hallo Newsgroup, bislang musste ich mich noch nicht groß mit responsive beschäftigen, was sich demnächst ändern soll. Bootstrap scheint ja ganz toll zu sein und ich habe mich mal etwas damit befasst, zumindest in der Theorie... Habt ihr schon TYPO3 Seiten auf Basis von Bootstrap gemacht und wie sind eure Erfahrungen? Inwieweit lässt sich ein individuelles Design in Bootstrap integrieren? Es gibt ja diverse online-Tools, um das Aussehen (Primäre Farben, Abstände, etc.) anzupassen und Bottstrap selbst bietet ja auch eine online-Konfiguration. Ich habe den Eindruck, dass das nur in begrenztem Rahmen möglich ist. Mir scheint, dass der Anpassungsaufwand, wenn die finale Seite nachher nicht mehr nach Bootstrap aussehen soll, sehr hoch ist und es unter diesen Umständen ggf. mehr Sinn macht, ganz auf Bootstrap zu verzichten? Oder z.B. nur die erforderlichen Komponenten für das Grid zu verwenden und den Rest händisch zu erledigen? Wobei das sicherlich auch nicht weniger Aufwand wäre... Wie macht ihr das? Responsive ist ja auch irgendwo ein dehnbarer Begriff und Bootstrap macht ja auch nicht alles. Z.B. Bilder ohne Dimensionen auszuliefern funktioniert zwar, aber eigentlich sollten die Bilder ja serverseitig schon entsprechend gerendert werden. Oder in mehreren Dimensionen generiert werden und clientseitig dann nur die richtige Dimension geladen werden. Usw. Wann ist für euch responsive vollständig bzw. zufriedenstellend umgesetzt? Auch mit Focus auf TYPO3? Viele Grüße, Jan ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german -- WapplerSystems: http://www.wapplersystems.de T3Yaml Template: http://t3yaml.de T3bootstraptv: http://t3bootstraptv.de Xing: https://www.xing.com/profile/Sven_Wappler Geeklist: http://geekli.st/svewap Twitter: https://twitter.com/WapplerSystems ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Responsive / Bootstrap
On 12/11/2013 11:13 PM, Sven Wappler wrote: Hallo Jan, nach meinen Erfahrungen nach, ist das ganze Thema noch ein wenig problematisch. Es kommt darauf an, in welcher Qualität du es umsetzen willst. Schön wäre natürlich die Unterstützung des picture-Tags um größenoptimierte Bilder ausliefern zu können, aber da machen die Browser ohne Weiteres noch nicht mit. TYPO3 beizubringen, mit Bootstrap 2 oder 3 umzugehen, ist möglich, aber auch aufwändig, je nach Qualität natürlich. Meine Erfahrungen: http://t3bootstraptv.de (TemplaVoila + Bootstrap 2) http://t3bootstrap.de (Fluid + Bootstrap 3 , TYPO3 6.1 und 6.2) Grüße, Sven Am 11.12.2013 11:35, schrieb Jan Kornblum: Hallo Newsgroup, bislang musste ich mich noch nicht groß mit responsive beschäftigen, was sich demnächst ändern soll. Bootstrap scheint ja ganz toll zu sein und ich habe mich mal etwas damit befasst, zumindest in der Theorie... Habt ihr schon TYPO3 Seiten auf Basis von Bootstrap gemacht und wie sind eure Erfahrungen? Inwieweit lässt sich ein individuelles Design in Bootstrap integrieren? Es gibt ja diverse online-Tools, um das Aussehen (Primäre Farben, Abstände, etc.) anzupassen und Bottstrap selbst bietet ja auch eine online-Konfiguration. Ich habe den Eindruck, dass das nur in begrenztem Rahmen möglich ist. Mir scheint, dass der Anpassungsaufwand, wenn die finale Seite nachher nicht mehr nach Bootstrap aussehen soll, sehr hoch ist und es unter diesen Umständen ggf. mehr Sinn macht, ganz auf Bootstrap zu verzichten? Oder z.B. nur die erforderlichen Komponenten für das Grid zu verwenden und den Rest händisch zu erledigen? Wobei das sicherlich auch nicht weniger Aufwand wäre... Wie macht ihr das? Responsive ist ja auch irgendwo ein dehnbarer Begriff und Bootstrap macht ja auch nicht alles. Z.B. Bilder ohne Dimensionen auszuliefern funktioniert zwar, aber eigentlich sollten die Bilder ja serverseitig schon entsprechend gerendert werden. Oder in mehreren Dimensionen generiert werden und clientseitig dann nur die richtige Dimension geladen werden. Usw. Wann ist für euch responsive vollständig bzw. zufriedenstellend umgesetzt? Auch mit Focus auf TYPO3? Viele Grüße, Jan ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german Hi Jan, falls du TYPO3 6.1 verwendest kannst du mal https://github.com/dohomi/t3_bootstrap_render ausprobieren. Dort wird die css_styled_content mit Bootstrap Klassen erweitert. Dadurch kannst du aus dem BE heraus Bootstrap Content Wrapper anlegen. Gruß Dominic ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german