Web Design 3.0: When Your Web Design Matters
nicepage.com
nicepage.com
Boring maybe, but Bootstrap is extremely practical for non-designers like me.
I feel like Bootstrap captured more than 80% of the features I want for less than 20% of the time (or cost) it would take to make something from scratch.
Second, navigation on websites became much more predictable. The examples they show of Web Design 3.0 look difficult to navigate. Aside from increasing dwell time from confused users, there probably isn't a big benefit.
In the future, I see custom website design being accessible for large companies that need their site to evoke a certain brand image. For the rest of us, Bootstrap will continue to evolve (Web Design 2.5) to provide +80% of what we want.
Jakobs law comes to mind on this point - https://lawsofux.com/jakobs-law
I think Bootstrap is trying to offer both an out of the box template like framework & utility framework in their latest & upcoming releases. Foundation also does this. Whereas something like Tailwind does a nice job of being just a utility framework.
I think there is a lot of value in using any of the above depending on your skill level. They all solve common problems so you don't have to.
A good HTML/CSS designer/developer should have no problem extending & customizing them either so that they don't look like every other site using them. No reason to rebuild everything from scratch.
On an additional note, it depends what the website is trying to mirror as to how you want to layout the content. A news site is often best done similar to a newspaper with nice table like structure.
Bootstrap has flaws but they keep improving it. A non-professional designer using Bootstrap is a better outcome most of the time compared to no CSS framework or using many of the others.
Seriously, most of the examples of "Web Design 3.0" look like a piece of modern art. That's great for showcasing your portfolio as a web designer, but if you try to be artsy with the menu of your restaurant I'm going to the competitor.
Compare the "Web 2.0 vs Web 3.0 in MS Word" comparison. On the left: "Web 2.0" (looks like "Web 1.0" to me) with quickly skimmable paragraphs, concise information and a clear overview of where to look for what information. On the right, a flat-out clusterfuck of random boxes and pictures that doesn't tell you anything at all.
By the way, we already had free positioning in the "old" web; stacked floats and absolute positioning are nothing new. It became easier with flexbox and css grids, but only for people writing actual HTML/CSS.
Whenever I see a website made by a tool like this, I generally don't even bother reading what it has to say. The themes are always form-over-function with huge swathes of whitespace and PNGs that suck up my mobile data. If you're a designer and looking to make a website, please get someone competent to write proper code for you instead of wasting your design on an awful tool like this.
Edit: This is for brochureware that has very little content and lots of branding.
All of the "web 3.0" examples feature maybe 3-4 of the same design tricks or techniques. Which makes this not web 3.0 but more like Web 2018/19.
Examples: Offset elements like drop shadows, angled/shaped section dividers, uneven "artistic" layout models (aka free positioning), art deco - it's basically one design concept, executed many different ways. I wouldn't go so far as to call it a new generation of web design, just updated styles/preferences.
A lot of this is driven by new layout models for CSS, which makes these approaches feasible/much easier for your average designer.
https://nicepage.com/Content/BundledScripts/main-libs.js https://nicepage.com/Content/BundledScripts/main-libs.css
Additionally, I have yet to find a page builder that's in any way 1) performant and 2) not compromising fundamental best practices (because WYSIWYG site builders require exorbitant amounts of flexibility).
https://www.webpagetest.org/result/190305_4Y_ff1823195f2bedd...
I liked the article and agree with the central thesis of CSS Grid enabling some wild UI designs, but the whole thing came off in a completely different light after looking under the hood.
Yeah, it's kind of ironic that my first thought was "this looks a canned Bootstrap site". And, not a very good one at that.
https://www.digitaltrends.com/mobile/att-5ge-is-not-5g-and-t...
No offense to the author but this is not new. Of course neither is Web XXX 3.0 which has been used for over a decade.
I'm somewhat sad to see the Flash era wasn't mentioned. A lot of this non positioning was done back then in the late 90's & early 00's. And one can not forget the days of giant images in Photoshop spliced apart to make a web page.
Content should determine design strategy 99.9% of the time.
"Forget"? Are they gone?
When I read this, I was sure I was in for a fun takedown of web design gimmicks. Sorely disappointed.
I'm still not certain that it _wasn't_ that...
It was nice when every site settled on the header-sidebar-footer two- to three-column layout. You knew where stuff would be. "Bootstrap" design is nice (though often less-nice than old-school column layouts, at least on desktop, because more spread out and less predictable) for similar reasons.
This stuff for "experience" sites is one thing. For anything else it's, as mentioned above, peacock-signaling over usability. Often the flourish-filled stuff is outright broken on some not-uncommon browser and platform combos—I saw a Tesla marketing site the other day that's broken on Safari on MacOS—though that's more common when they screw with interactions than layouts, but often the two go hand-in-hand.
I have no doubt this will be A Thing. In the overwhelming majority of cases it's used, it will harm UX. It looks expensive to do right across platforms and screen sizes, and will probably be done wrong (i.e. be broken) more often than not. So the cycle continues.
2. While I do like many of the "new" graphic design trends they mention, good graphic design is not always (and in fact not usually) good web design. Paper is usually a reasonable size and shape and, most importantly, is not able to suddenly change in either of those parameters at any moment. Almost every attempt at this that I've seen has been either broken, stupid or different when using viewed on smartphones and the like. If you just show me the desktop version, I will get annoyed from scrolling and zooming. If you try to slightly adjust it, you will probably end up wasting an absurd amount of screen real-estate. If you adjust it to the point where the experience is good, I'll be frustrated when I try to find the same thing on my desktop an hour later and get a completely different layout for the same URL.
The fact is that you need many different designs for different mediums and while a "poster" style website could do that, anything you expect people to "browse" needs to be mostly standard and have to adapt as little as possible.
There are two forces at play here: On the one hand you have those print inspired designer types, boosted by the possibilities of modern browsers. On the other hand you have the usability requirements and the dictate of the form factor: If you do a mobile website you need a very simple grid, responsive for bigger screens yes, but the focus is on structure and content. Free placement of stuff according to print design ideals of magazine cover pages is completely useless there, the phone screen is too small for that anyway.
What we end up with is the current design: Very formalized pages for the most part, with lots of possibilities to experiment thanks to evolving browser capabilities while keeping the standardized structure. This will lead to further evolution of what is a modern design, but I doubt we will see a complete new paradigm anytime soon - as long as technology remains as constant as it was the last 10 to 20 years. Foldable phone screens might move the needle a little, if they ever come down from the uber-premium price segment vendors target right now and don't turn out to be a useless gimmick
One thing to keep in mind: Yes, web design is new, but because we already had print design before it adopted very much very fast. This is not a completely new field that still has to match what humans actually need, it already took that from existing research and practices. That's why it could evolve and settle down that fast, and that's why the article is wrong in predicting the next grand revolution, that happens to need their website builder.
Looking at the mentioned "Web 3.0", I see patterns that Bootstrap can pickup and evolve into having over time. For example overlay elements and grid cells.
Designers will continue evolving the look of the Web. Bootstrap (and others) will continue picking up patterns and incorporating them for developers to implement without a designer. And that's a good thing.
This is held up if the site requires cookies, or blocked outright if it requires scripts eg. to present text (q.v. the washington post). That is about all.
This sums it up:
> We are strongly against the fact that designers are limited in the freedom of creativity
I'm all for limiting their creativity in areas outside the purely artistic. I want usable websites (= useful info concisely and safely presented, with respect for others' disabilities), but creative types often don't seem to care (edit: or know; they're often clueless about usability).
(to be fair, this website is certainly not bad)
They show some pictures of intricately laid out shelves and all I can think about is how they are going to look when you squish them. The "free positioning" in their 3.0 illustration reminds me of using tables to lay things out precisely and having everything break when you need to change the text. Forget about providing content with a CMS.
At the end of the day it's not about "better tools" it's making tradeoffs between a tight elegant design and a need to show dynamic content on a wide variety of devices.
Be warned, I could be tearing out and throwing away your website too.
The bigger challenge now is that "web design" isn't really respected as a discipline, since half of the customers associate it with cheap templated Wordpress/Drupal sites, and the other half care only about utility (if it's a web app), and little to nothing about how the design speaks to its brand. It's their call of course, and if they want a barebones site, it's on the designer to show them that a custom design can bring in more business.
PS - the Pinterest-sourced design examples are nice. I wouldn't have discovered them myself since Pinterest's UX and takeover of Google Image search results has soured me on them.
Someone likely advised them to write a blog article all about how everyone needs "web design 3.0", and position the product as the solution to everyone's problem.
The thing is, they forgot about responsive design. If everything is overlapping everything else, you will end up with a very nasty problem of what to do on different size screens, and scrolling, and font size, and zoom levels etc.
You can safely skip the article, as it's nothing but a messy concept around "web design 3.0" (which isn't a thing) and a lead into the inevitable pricing page...
"no coding needed". (for your messy looking web design 3.0 page)
Let's learn all about accessibility and then spit in its face.
I don't have a problem with small companies (Indie Hacker myself), I just wanted to learn more about the founding team to see if this is some fly by night company or if they have some solid experience in this space or some investors.
Scroll down home page to their "testimonial" from web designer "Allan Hollander". There's a picture of him. He's a good looking chap, and the photo looks like stock art, because it is....
Funny that all examples of web design 1.0 present ye olde web as "boring" pure text websites rather than the rivetingly fun designs going around (see http://mentalfloss.com/article/53792/17-ancient-abandoned-we... :) ).
Also, any mention of "design progress" sounds odd.
Which is exactly why it'll never take off. Design is only one part of a larger whole, and I can't think of a single business or website that shows the "designer's freedom" and is still in business.
Websites with byzantine navigation or difficult-to-decipher layouts are designer masturbation that create frustration rather than solve problems.
No thanks.
While there were a few annoyances, it is one of the best visual web editors I've experienced, and it only took a few hours to redo my home page, without watching any of their training. I am impressed.
The site I'm redoing was built on bootstrap. The results on nicepage looks close to identical, but it was much easier to make versions for different sizes, as I could rearrange elements however I wanted, allowing me to customize my site more than I can with bootstrap for different devices.
The code even looks reasonably clean compared to what I've seen from other visual editors.
So, while the article was all about these more artistic layouts, it's a pretty good tool for putting together a "web 2.0" site if you don't feel like coding it yourself. No way I could have done it that fast by hand, and the results are good enough for me.
I would recommend scanning for malware if you installed anything from nicepage.com
I would argue it isn't just "artistic", but it conveys they ideas better in this case.
There are already skilled and talented designers/developers out there producing "Web-Design 3.0" sites, but they are doing so at a much higher budget than the average SMB is going to shell out. The tool being advertised brings these layouts and design ideas to a broader range of designers, and allows for projects with this look and feel to be completed at a lower cost.
I actually really like this as a business opportunity. Anyone with a reasonable pipeline of clients could start using this to crank out sites for SMBs and turn a decent profit.
Frankly, as a user I don't complain. GUI consistency has a great value for me. Crawling through the fancy artistic designs is fun until I just want to find contact address of some company on their website.
The advantage that MS Windows has (or had, before they decide to go with the "modern designs" here and there) is a GUI predictable across all applications. File menu, Edit menu, Tools menu, Help menu, consistent shortcuts, toolbar, everything always the same, boring - all of this makes users productive.
"Free positioning" isn't new. I was dragging absolutely positioned divs and image maps around in Dreamweaver 3, 20 years ago.
These chumps think they've reinvented design. Instead they've just unearthed exactly the same problems that Bootstrap helped control.
Seriously. Some of us have been through the hell of uninformed design choices. Mystery meat navigation, never knowing what you can or should click, criminally insane typography, and fixed resolution design. Leave in in the 90s.
The conclusion is fairly misleading because it's missing the glaringly obvious answer: designers could learn HTML and CSS. I fought it forever thinking that there will always be a WYSIWYG and they'll eventually get so good they'll spit out the code for me.
The reality is much more frustrating. Adobe Muse was promising as it helped with responsive design and the free form creativity this article talks about, BUT it had a ton of issues. Relying on it for projects with clients was risky as one update would kill your production, as it often did. Reverting back a version was a solution so you could finish the project, but the features added to the update were crucial, and as a designer I wanted those too.
Then it became a game of learn the software de jure, and hope it's A) good enough B) will have support for a long time C) isn't cheap, and D) doesn't take forever to learn.
Eventually, I discovered grid and flex box and have been teaching myself HTML, CSS, and JS. Code isn't going away. Software does.
Also, I don't trust any WYSIWYG editor to produce clean and concise code. I'm afraid it'll spit out a bunch of divs and be extremely inefficient. Not to mention accessibility and semantics. Even if designing to a grid and carefully watching my proportions and where items sit on or next to each other, I still fear the program will spit out some ugly code.
Mainly, when using a WYSIWYG, it ends up taking just as long as it would to code, especially if you want it to look really good.
So now, my goal is design like the Web 3.0 described in this article, but with the good old tools with which I have full control. It's like a carpenter in his wood shop, as opposed to using a combination of legos and Ikea. No matter what, to have ultimate control is the best, and it remains to be seen if Nicepage or any design tool will ever be as good as the most fundamental of tools (code).
I suppose the reality is there's a huge spectrum of designers. There's the developer oriented ones, which resources are aplenty. Then on the other end of the spectrum are artists, who need a blank canvas to fill out their ideas. One is quick and good enough, the other long and the end result likely janky behind the curtain. Nicepage seems to want to appeal to the the artist.
With enough time, a true designer can understand the full spectrum and see that fully custom coded websites, even if they take a long time, are still likely to be the most unique and longest lasting.
For the most part people who are like this should be doing a different specialty related to design (graphic design, branding, tv, print...). Web design for the most part is taking a lot of data and fitting it into a limited space that changes based on the user's preferences and device.
And you are right the simplest solution is to just learn to write code. Once you get a good setup going it's less painful than using the pallets in photoshop and you'll have a hell of a lot more control and flexibility. I think people get intimidated because when they think of code they think you'll need a lot of math and arcane knowledge. CSS is a much different thing that often makes more sense to designers than it does to developers.
Seems pretty damn inane if you ask me.
> Agree that these examples look like modern Print Design and Web Design 3.0? Why is this happening? Nobody wants to see boring Grids from the past on their walls.
Pretty sure this is content farm swill.
Server Error
502 - Web server received an invalid response while acting as a gateway or proxy server
I suggest you learn it as it is free and useful in many others aspects of life (Cropping pdfs for including in lab reports, making simple icons, making vector figures, etc.).
I'm a fan of the bootstrap hegemony. Bootstrap apps are predictable and usable.
Assembly language provided creative ways to solve a problem. C won because it had patterns to solve them across projects.
Word processors provide creative ways to layout your document. Yet markdown is winning because it solves the layout problem with reusable syntax.
People like patterns and reusability. Be it developers who want to reuse code or the users who want to reuse their previous knowledge. Practicality will eventually win. The arguments for Web 3.0 goes against this very funda. I doubt it will ever catch up.
In 1997, I was tasked with making 'layout designs' like these in to 'webpages'. "Designers" have always had freedom of position/layout, even (especially?) when it was a PITA to achieve.
Hmm... pass
Then computers came along. Some of the early techno pioneers didn't have a clue how to use a computer. They were stuck using the early electronic gadgets and the workflow that went with it.
Then a new generation came along that could use the computers and could do everything on an Apple laptop without having to have a bedroom full of turntables, forests of wires, keyboards, samplers and drum machines.
The older guys stuck with the original tools for 'electronic music' still linger around but the tools for the job have changed. Had they been born a generation later with the same passion for music they would have gone straight to the computer stage.
Getting back to web development, I think we have something similar going on. A generation of web designers got used to developing with the desktop publishing tools and static mockups in PDF form. Responsive design for mobile for them was just a doubling of their workload using these same methods. They are very much stuck on things like 'pixel sizes' and much else that doesn't really relate to how it is done.
I think that future designers will work very differently, essentially thinking in terms of what can be done to content instead of placeholder copy with CSS, SVG and javascript animation.
The reason we are not there yet is pretty much the same as it was with music, you need a new generation to come along to think in terms of the new ways of working.
Right now it seems that the website builder services such as Squarespace are of great appeal to people. A few years ago a freelance designer could build a website for a local business with Wordpress but now they use Squarespace. The bloat does not matter to them. It looks good and who cares if it is not using CSS grid?
At the other end of the spectrum, sizeable businesses with web development teams are stuck like the early electronic music artists are. They have a visual design process, the 'agile' religion and plenty of excuses for not using CSS grid or even the full vocabulary of HTML5 elements one would use if taking a content driven design path.
I am looking forward to the changes that are likely to happen as the new generation gain more confidence and demonstrate better, quicker results by using better HTML5 and the full range of CSS grid. I can't see website builder services such as Squarespace being able to keep people happy with bloated web pages forever and, when it becomes possible to get results with native HTML5/CSS without having a behemoth of a dev team, there should be design progress.
With every step into makeing things easier, you lose something. With neural networks, we cant see how or why. With electronic music. the button that lets an orchestra play with one push, makes it more difficult to change one instrument. For webdesign / development: with tools that help you, it is harder to get things really how you want.
I notice this personally as well as coding as with music and find myself, not going back to the basics, but wanting to know more about it so it gives speed with using tools, while still being able to adjust the details.
I believe that there is value in mastering your skills and tools, and that that will you make you a better ... I dont think it has anything to do with a new generation or condifence?
To give that up and to take a content first approach with no visual mockups and semantic HTML is a bit too much to give up when you have teams built around the process. A younger generation starting from scratch can avoid all of this. Or they can just use Squarespace with the status quo continuing a lot longer.
The thing is that there are universities and colleges that do teach basic HTML. This will be taught with the modern HTML5 elements not too soon. When people who learn this stuff then get to do real projects they might baulk at using frameworks and libraries that are another thing to learn that is a bit unnecessary as they can achieve their design goals with what they already know.
This is 'intrinsic web design', using the inherent built in properties of the browser, keeping it simple and binning the frameworks, polyfills, libraries and visual mockup tools.
I don't like how clickbait-y the article started