Du bist nicht angemeldet. Der Zugriff auf einige Boards wurde daher deaktiviert.

#1 10. Januar 2013 20:04

brandy
Server-Pate
Registriert: 05. Juni 2011
Beiträge: 707
Webseite

[GELÖST] Neue Seite - responsive + Photoswipe

Hallo!

Hier mal das Ergebnis meiner ersten Seite, die auch für mobile Geräte optimiert ist. Ich hab fürs Gerüst Foundation und für die Galerie Photoswipe benutzt

Hier der Link:
http://www.floors.at

Beitrag geändert von brandy (10. Januar 2013 20:08)

Offline

#2 10. Januar 2013 22:22

czarnowski
arbeitet mit CMS/ms
Registriert: 18. Oktober 2012
Beiträge: 457

Re: [GELÖST] Neue Seite - responsive + Photoswipe

So weit so gut - bereits auf dem 1280 er Schirm rechts und links viel schwarzer Rand - auf größeren ist es ein Klacks.
Auf dem Smart TV grauenvoll von noch größeren Screens wollen wir nicht reden - jedenfalls auf dem Nexus 10 Tab ist das glatter Mist.
Leute gewöhnt euch mal daran das man nicht mehr solche Miniscreens vor der Nase hat.

Am lustigsten fand ich die Ausführungen zum Thema Jobs.

Ich glaube nicht das es in Österreich anders als in Deutschland ist - bei der perfekten Stellenausschreibung wird sich wohl niemand melden - scheint ein Werbegag zu sein.

Offline

#3 11. Januar 2013 00:09

rage_all
arbeitet mit CMS/ms
Ort: Augsburg
Registriert: 09. März 2011
Beiträge: 281

Re: [GELÖST] Neue Seite - responsive + Photoswipe

So kennen wir unseren czarnowski: Smackt immer watt...  wink

Ich finde die Umsetzung ganz gelungen.
Mich beißt persönlich eher ob schwarz (ja, ist edel, klar) so zu Böden passt, die ja doch ... hmm ... "warm" sein sollten / eine warme Ausstrahlung, gute Gefühle ausstrahlen sollten?

Und es ist halt seeeehr wenig Content (mein Screenreader (Browser-Plugin) für Sehbehinderte sagt sogar auf den ersten Blick dass es "scheinbar keine Inhalte zum Darstellen" gäbe); mich würde interessieren wie Google die Seite Mittelfristig im Vergleich zum Wettbewerb platziert.

Außerdem hätte ich noch eine Frage: Wie macht sich Foundation?
Bislang hab ich nur mit Skeleton gearbeitet (naja, fand ich so mittelmäßig) und überlege jetzt Foundation oder Bootstrap zu testen und kann mich nicht so richtig entscheiden... Hattest Du zuvor schon mal mit Foundation was gemacht — und falls nein, wie hast Du die Lernkurve und die Nützlichkeit des Framework empfunden?
Skeleton fand ich relativ easy, ausreichend anpassbar und recht übersichtlich in der Anwendung.

Offline

#4 11. Januar 2013 00:29

otter24
arbeitet mit CMS/ms
Ort: Hamburg
Registriert: 12. Januar 2011
Beiträge: 339

Re: [GELÖST] Neue Seite - responsive + Photoswipe

Moin brandy,

Du lädst entschieden zuviele Javascript-dateien die nicht benötigt werden.

<script src="foundation/javascripts/jquery.js">
<script src="foundation/javascripts/jquery.foundation.mediaQueryToggle.js">
<script src="foundation/javascripts/jquery.foundation.forms.js">
<script src="foundation/javascripts/jquery.foundation.reveal.js">
<script src="foundation/javascripts/jquery.foundation.orbit.js">
<script src="foundation/javascripts/jquery.foundation.navigation.js">
<script src="foundation/javascripts/jquery.foundation.buttons.js">
<script src="foundation/javascripts/jquery.foundation.tabs.js">
<script src="foundation/javascripts/jquery.foundation.tooltips.js">
<script src="foundation/javascripts/jquery.foundation.accordion.js">
<script src="foundation/javascripts/jquery.placeholder.js">
<script src="foundation/javascripts/jquery.foundation.alerts.js">
<script src="foundation/javascripts/jquery.foundation.topbar.js">
<script src="foundation/javascripts/jquery.foundation.joyride.js">
<script src="foundation/javascripts/jquery.foundation.clearing.js">
<script src="foundation/javascripts/jquery.foundation.magellan.js">
<script src="foundation/javascripts/foundation.min.js">
<script src="foundation/javascripts/app.js">

die fetten können auf jeden fall raus

jquery.foundation.orbit.js lädst du doppelt so wie ich das sehe, ausserdem sind sowieso alle Scripte in komprmierter Form, die einzelnen Scripte sind eigentlich damit Du sie noch bearbeiten kannst. 
Also alles raus was Du nicht brauchst, ansonsten führst Du das responsive Design ad absurdum, Design für Mobile, aber Traffic für DSL. 

Laut pagespeed schiebst Du 1.75MB durch den Äther... und der Pagespeed wert .. naja schweigen wir.
Also beim optimieren ist noch luft nach oben.

zu Design nur soviel, czarnowski hat recht,  viel schwarz und wenig Seite auf größeren Bildschirmen. Ausserdem mag ich keine schwarzen Seiten, die sind mir zu schwer und wirken immer so "tragisch" und dunkle Farben verstärken den effekt "Viel Schwarz wenig Seite" bei Weiß ist das nicht ganz so schlimm.

Ach und schalt mal Graceful Orbit Loading State ein, (ganz unten auf der verlinkten Seite.) Das mit den Bilder nervt nämlich, wenn die untereinader erscheinen.


Ich bin war  kein Klugscheißer, ich weiß wusste es wirklich nicht besser.

Offline

#5 11. Januar 2013 00:42

otter24
arbeitet mit CMS/ms
Ort: Hamburg
Registriert: 12. Januar 2011
Beiträge: 339

Re: [GELÖST] Neue Seite - responsive + Photoswipe

@rage_all

ich komme mit foundation besser zurecht als mit jedem anderen Framework, vor allem, es bringt erstmal ne menge mit so das man gleich loslegen kann Stichwort "rapid prototyping) du hast gleich ne Menge Templates auf der Seite mit denen man sofort loslegen kann. Ausserdem kannst Du neben "herkömmlichen" CSS dateien auch Sass einsetzen.

Allerdings wenn man fertig ist heißt es aufräumen und rausschmeissen. Alle Javascripte die man nicht benötigt, die CSS datei ist, weil Sie soviel addons mitbringt ziemlich fett, vieles braucht man nicht. Die Doku ist recht ordentlich (nicht so umfangreich wie bei Yaml), aber finde ich ausreichend. Vor allem wenns schnell und einfach sein soll ist das gut einzusetzen.


Ich bin war  kein Klugscheißer, ich weiß wusste es wirklich nicht besser.

Offline

#6 11. Januar 2013 09:34

brandy
Server-Pate
Registriert: 05. Juni 2011
Beiträge: 707
Webseite

Re: [GELÖST] Neue Seite - responsive + Photoswipe

Vielen Dank für eure Rückmeldungen.

@czarnowski: Ich arbeite selbst beruflich mit einem 27" Mac - natürlich hab ich da auf jeder Seite sehr viel schwarz rundherum - aber das hab ich bei jeder Seite, bei der ich das Fenster auf die komplette Größe des Monitors aufziehe.

@rage_all: Ja ich weiß, dass wenig Content auf der Seite ist - muss man damit leben - der Auftraggeber freut sich, dass er seine Seite auf dem Handy optimal dargestellt ansehen kann. Wenn er mir keine anderen Inhalte liefert, muss man damit auskommen.
Foundation find ich sehr gut - ich hab Skeleton und Gumby ausprobiert, bin dann aber bei Foundation stecken geblieben. Natürlich kann man noch etliche Sachen besser machen, aber für mein erstes Projekt damit, bin ich sehr zufrieden.

@otter24: Das mit dem Graceful Orbit Loading State hab ich schon befolgt - hat mich auch gestört... Und natürlich gehört alles noch optimiert, jedoch ist das mein erstes Projekt in diese Richtung - deshalb bin ich mal froh, dass ich innerhalb von gut 3 Wochen sowas auf die Beine gestellt habe...

Offline

#7 11. Januar 2013 11:47

czarnowski
arbeitet mit CMS/ms
Registriert: 18. Oktober 2012
Beiträge: 457

Re: [GELÖST] Neue Seite - responsive + Photoswipe

Zur Klarstellung Zoll ist für mich kein Maßstab sondern die Pixelauflösung.
Wer 27 " beruflich einsetzt der wird sicher seine Bereiche teilen - das macht aber von den normalen Surfern niemand.
Beruflich arbeitet man normal heute mit mindestens 2 Bildschirmen ( ich persönlich mit vieren) eben weil ich volle Fläche für die Anwendungen benötige - das ist aber nicht das Kriterium für Prviatanwender , die haben ihren Focus normal auf eine Sache ausgerichtet.

Wer als Entwickler keine 2500 er Pixel hat der kann im Mehrschirmbetrieb seinen Browser auch über 2 Monitore ziehen und damit ebenfalls sehen wie eine Seite kommt.

Für manche Kunden verwende ich 4 Auflösungen (also je Schirm eine fixe) da die diese eben genau mit diesen arbeiten  aber alles dort zu laufen hat und das muss ich ebenfalls sehen können.

Ein Klecks HTML wird da genauso wenig akzeptiert wie Scrollbalken.

Hier bei dem Web sorgt das links herausgeführte Logo für noch mehr Schwärze.

Pagespeed ist mehr als mies (44 auf der Startseite).

Wenn eine Site wenig Texte hat aber wie hier eigentlich Klasse Bilder dann sollte man die Bilder mehr ausnutzen.
Klasse Aufnahmen auf ein unnötig kleines Format gewürgt kann auch nicht die Lösung sein.
Da muss man sich eben einen ganzen Satz  pro Bild machen.

Das geht mit Kommandozeilentools in wenigen Sekunden zu machen.

Offline

#8 11. Januar 2013 13:58

otter24
arbeitet mit CMS/ms
Ort: Hamburg
Registriert: 12. Januar 2011
Beiträge: 339

Re: [GELÖST] Neue Seite - responsive + Photoswipe

czarnowski schrieb:

Hier bei dem Web sorgt das links herausgeführte Logo für noch mehr Schwärze.

schwarz, Schwärzer am schwärzesten ...
Ok aber wie kommst du auf sagenhafte 44 punkte, ich hatte mit dem FF Pagespeed addon nur 21 Punkte, aber egal...
Was Brandy in kurzform mit dem 27 " mac sagen wollte, ist das er vor einer nativen Auflösung von 2560 x 1440 sitzt,
also vor einer der größten marktüblichen Auflösungen. Abgesehen mal von solchen Exoten wie dem Radiforce von Eizo, aber den hat man meist nicht vor der Nase.

@brandy. Foundation ist was die Abmessungen nach oben hin angeht, ziemlich restriktiv eingestellt. Wenn Du nach der .row suchst wirst dort eine breite von 940px finden. Ich passe die immer als erstes nach oben hin an und vor allem nehme ich auch % anstatt px und dannach passe die max-width an bis das passt.

Wichtig bei der ganzen Geschichte ist aber auch, dass Du irgendwo eine Grenze setzt. Ist zwar vielleicht toll wenn Du die ganze Breite eines 36 ' Smart TV nutzt, wenn sich aber deine Texte über die ganze Breite des Bildschirms erstrecken ist das wieder schwieriger zu lesen und sorgt meist für noch mehr Frust und ärger beim User, als wenn Du massig schwarz hast.

Bilder kannst Du natürlich mit der Komandozeile mache, kannst aber auch die Stapelverarbeitung in Photoshop nehmen, wirst wahrscheinlich eh offen haben.

gruß aus HH


Ich bin war  kein Klugscheißer, ich weiß wusste es wirklich nicht besser.

Offline

#9 11. Januar 2013 14:23

czarnowski
arbeitet mit CMS/ms
Registriert: 18. Oktober 2012
Beiträge: 457

Re: [GELÖST] Neue Seite - responsive + Photoswipe

Otter24 schrieb:

Pagespeed

Pagespeed Insight über aktuelle Chrome Version

Da wird aber offenbar gerade gefummelt denn nun liegt man bei sagenhaften 3  - einen solchen Wert habe ich schon lange nicht mehr gesehen.

Die eigentliche Nutzbreite der Site ohne Logo ist nur 700 px - klar das es eine schwarze Sache wird.

Offline

#10 11. Januar 2013 14:54

czarnowski
arbeitet mit CMS/ms
Registriert: 18. Oktober 2012
Beiträge: 457

Re: [GELÖST] Neue Seite - responsive + Photoswipe

Also bei 2560 er Pixel Monitor ist die Auswahl schon recht groß - es ist keine Exotenproduktion.

Nexus 10 Tab hat 2560 x 1600  bei nur 10 " Schirm.

Andere Tab Anbieter wie Vizio bieten gleiche Auflösung bei 11,6 Zoll an.

Und es sind schon Geräte in der Mache die gleiche Auflösung bei 7" anbieten.

Und Toshiba produziert und liefert bereits Displays mit diese Auflösung bei nur 6,1 Zoll an Erstausrüster.

Mehr über kurz als über lang wird man solche Auflösungen an jeder Straßenecke finden.

Man darf davon ausgehen das sich das auch auf dem Desktop Monitor Markt bemerkbar machen wird und zwar binnen der nächsten 18 Monate.

Offline

#11 11. Januar 2013 15:22

otter24
arbeitet mit CMS/ms
Ort: Hamburg
Registriert: 12. Januar 2011
Beiträge: 339

Re: [GELÖST] Neue Seite - responsive + Photoswipe

czarnowski schrieb:

Man darf davon ausgehen das sich das auch auf dem Desktop Monitor Markt bemerkbar machen wird und zwar binnen der nächsten 18 Monate.

Dein wort in Gottes gehörgang...

Exoten bezog sich auf Auflösungen über 2560 in der Breite. Also 4k und eben "spezialmonitore" wie sie in der Medizin verwendet werden mit z.B. 4096 x 2160 px.

Kann man Smart Tv eigentlich erkennen? Also ich meine per javascript oder ähnliches. Über die Auflösung ist klar, aber da gibt es ja auch Monitor in der Auflösung.


Ich bin war  kein Klugscheißer, ich weiß wusste es wirklich nicht besser.

Offline

#12 11. Januar 2013 15:51

czarnowski
arbeitet mit CMS/ms
Registriert: 18. Oktober 2012
Beiträge: 457

Re: [GELÖST] Neue Seite - responsive + Photoswipe

Otter24 schrieb:

Kann man Smart Tv eigentlich erkennen

Bei mir nicht wirklich ,die Browserkennung zeigt bei mir nichts was eindeutig wäre.
Zudem werden Webseiten immer Fullscreen angezeigt.

Offline