Layouts for different devices

@producerguyaz, I understand each to their own, but having been in the web design game for now a very long time and fully being aware of the difference between fixed width (Sparkle) and fluid width design (mostly using bootstrap) I can say that Sparkle has a fairly good footing!

I also was annal about code in my earlier days until I got that even Google went against their own guidelines in that if you had a table generated site you will be handicapped - well I have come across many in the last three years and that is not the case! So what is perfect code? And then compare Sparkle’s code against Squarespace and even WordPress with the convoluted plugins and in my eyes that is an absolute mess! And then we have the issue of the software guesstimating how tablet and mobile should look and that also comes across as a mess with text hardly legible in most of the cases! :frowning:

I know Sparkle hasn’t work for you but your take on it is harsh, knowing that the big corporate players are also using fixed width design to create their websites allowing them greater control over the layout per breakpoint instead of the software guesstimating it!

We have been taught the faster the better - just pump them out! The web is looking full of boxed-styled websites because the software is doing most of the work for us designers - just a lazy take on crafting a website nowadays… so bagging out a platform that allows for website craftsmanship is NOT COOL!

Us designers are here to bring life to a clients’ visions and I for one will use a platform that will allow that instead of a “fast spit me it out platform” that confines and restricts me into box styles parameters being far from creative, and instead pumping out a commodity!!! :frowning:

1 Like

I have been reading these ongoing discussions here on the Sparkle community … about whether Sparkle being a “responsive” or “not responsive” website builder.

I didn’t feel like joining, because honestly, I thought it was becoming increasingly tiring …

Often because people use the term “responsive” in the wrong way. It has been explained here many times before – by various community members – what “responsive” actually means. Thank you for that.

But these discussions seem to be endless.

I am not a “code expert” at all, I just know a little bit about HTML code from my early days with Adobe GoLive. Sparkle’s code is very well structured, in my humble opinion, compared to the mess that other software creates.

Yes, with Sparkle you have to rearrange your website for a different device size.

But … that is actually the strength of Sparkle and the beauty of Sparkle … because it gives us freedom!!!

You can use other tools, yes, they do it all “automatically” and “fluid”. But then, that’s exactly how your website looks … “automatically generated” like millions of indistinguishable websites out there. Nothing wrong with that. But that’s not what I am looking for …

So yes, Sparkle isn’t for everybody … and it doesn’t have to be. But for some of us, it is a marvellous and helpful tool to build creative websites.

1 Like

Gotta apologize to all, my frustration with trying to get things working right has overflowed. The closer I get to my deadline the more frantic my mind gets.

Sparkle works the way my swiss-cheese brains works; I can literally build a page precisely the way I see it in my mind with almost no limitation. The biggest issue I’m having is not clearly understanding HOW to make the WIDE and MOBILE pages behave and look properly.

The whole concept that you design for one, adjust the other and not affect the original never seems to work as described.

My primary site - which is not published yet - looks fantastic, exactly the way I want it. But it’s the translation to MOBILE that always trips me up.

For now if I have to build two completely different sites as described in this earlier thread, so be it. I’m wasting more time trying to rebuild it elsewhere. (ugh)

I’m sure when I get this figured out I’ll be sharing what I’ve learned, just gotta get there.

If you’ve got it right for wide can you then go to mobile and build it just the way you want? What you do with the mobile version shouldn’t affect the wide??

I’ve found you only strike trouble if you start copy and pasting and such, but it all seems to come good if you just work with what Sparkle gives you as the mobile version and just tweak what’s there to the way you want it. More major changes in the mobile version can do some weird stuff but if you take it bit by bit it is as Duncan would say MANAGEABLE???

1 Like

It’s not quite as simple as that, otherwise I wouldn’t be so frustrated. You can size/move elements without issue, mostly, but “effects” such as drop-shadows and outer lines are where things get dicey, and that’s the major issue.

If I want text and other elements to have totally separate settings between breakpoints then I have to build a sub-site. Otherwise drop-shadow settings for WIDE are totally inappropriate for MOBILE. It’s all covered in previous posts. Right now I have to figure out the best workaround for all this and fast.

Yeah I don’t use special effects but with text if necessary I change size etc to what looks okay on mobile and do the button on the text style that makes it the mobile version, and I think one time I was wrangling a drop shadow and I just adjusted it for mobile, but hey maybe that affected the desktop drop shadow like you say, anyway I dropped it, but can’t you hide Sparkle’s mobile drop shadow and make a new thing in mobile and hide the mobile thing in the wide page?? I haven’t bothered with all that but from what everyone says that’s what you do, and I suppose you could hide everything and make a new mobile page as long as you hide all the new mobile stuff in the wide page?? You would probably want to jump to and fro all the time to keep track of what you are hiding and not hiding.

Found my solution - and no, it’s not for everyone nor is it the supposed “right” way to handle this. But based on Sparkles’ current limitations it’s the best for now. And surprisingly it’s elegantly simple.

(FYI: The current version of Firefox for Android is horrible and never displays properly, even “big brand” sites. I’ve been testing on Chrome and on another phone Safari.)

Keep in mind I have very specific needs for my site/s:

  • I’m using text drop-shadows heavily for the dramatic effect it creates.
  • I have a handful of videos (my primary business) that I need to showcase, and being able to send the video to “full-screen” easily is paramount.

The issues that had to be overcome:

  1. Drop-shadow and other element effects need to be independent from breakpoint settings, not currently possible in Sparkle.
  2. Mobile-version publishing leaves blank, unused space on left/right borders further shrinking the over page width and thus text/photos etc.
  3. Videos need to be easily scaled to full-screen during playback.

The elegant solution: Build ONLY for WIDE-PC and nothing else, publish that way. Right, that goes against all the advice and even the instructions for Sparkle. But the results are absolutely perfect.

What happens is the browsers (current versions of all) automatically scale to fit the screen. No wasted edge-space on left-right.

I have two types of videos I use in my design:

  1. “Banner” videos with no audio, used to separate sections and be more interesting than a static banner. Those are set to “Still + Embed” so they don’t scale-up. (no need)
  2. “Traditional” videos that need to scaled-up to full-screen on playback. Those are set to “Still + Embed in Lightbox”.

Using this eliminates the problem of effects not staying separated between breakpoints and keeps every page at it’s fullest width regardless of device type.

For me this is the perfect solution, and works elegantly with Sparkles “flexible-size” coding rather than having elements pushed all around like in BLOCS.

Now I’ll just have to hope browser tech doesn’t change drastically in the next few months before I can hire a real code-monkey to take over web duties. (whew… sighs of relief)