Blocs 2 review: Web design app balances simplicity and sophistication

One of the mac's best, easy to use web design apps for the Mac gets even better.

Blocs 2 ($80) makes one of the Mac’s best, simplest Web design programs even better. Though it retains a few quirks, it builds on its solid predecessor with impressive and well-implemented new features.

Blocs 2 keeps its sleek, Adobe-like interface, but adds more Mac-friendly touches like contextual menus.

Simplicity on the surface

Blocs 2 sticks squarely with its basic web design-as-Lego-kit approach. Choose from an abundant menu of pre-built chunks of code (“blocs”) that snap together to quickly build your site’s basic structure. Then customize the paragraphs, images, buttons, and other premade elements of those chunks (“brics”) by typing directly into your design, or adjusting their parameters in the program’s sidebar. To add images or picture or video backgrounds, just drag the files straight from your desktop, or from Blocs’ clean and well-organized Project Assets window.

If you want to tinker with your blocs’ basic templates, it’s easier than ever to drop in other brics, thanks to a newly searchable menu. The icons denoting each bric take a bit of figuring out—accompanying tooltips help—but if you just start typing the name of the element you seek, Blocs 2 automatically winnows it out for you.

The easy but powerful new Class Manager gives you pinpoint precision over any element’s CSS styling.

Blocs 2 hews closer than its predecessor to Mac interface conventions. In version 1, right-clicking counterintuitively switched you to “drop in new brics” mode. In version 2, it summons useful contextual menus, just as you’d expect.

Plenty of power underneath

Blocs 1 offered a limited roster of webfonts from Google. But by pasting in the right URL from the Google Fonts site, Blocs 2 lets you add anything from that service’s entire library, which has dramatically expanded in the last year to include a gaggle of great-looking typefaces.

Blocs 2’s biggest, most welcome addition is custom class editing. With the new Class Manager, it’s now simple to create a new class, specify a plethora of CSS attributes from color to margin and padding to text styling to drop shadows, and apply those qualities to any item throughout your site. I found the menu well-organized and easy to figure out.

You can now quickly search for any items you want to add to your pages.

And while Blocs 1 gave you a basic preview of how its prebuilt sections would look on desktops, tablets, and phones, Blocs 2 adds the ability to quickly show or hide an element at different “breakpoints,” screen widths associated with different devices. If one aspect of your site looks great on desktops and tablets, but weird and clunky on a phone, just click the appropriate visibility icons to hide it on smaller screens.

Better yet, these two big additions work together. You can alter the properties of any class in your site at different breakpoints—making text smaller on smaller screens, for example or changing buttons’ alignment so that they don’t jut out awkwardly when squeezed into less space.

Still a few growing pains

Blocs 2 lets you search its online help library from within the program. But while the existing entries cover Blocs’s basics in clear, friendly fashion, the documentation remains a work in progress. New entries for important features like video backgrounds were added while I was reviewing the program, weeks after its release; without them, I got stumped at several spots. I wouldn’t have even known about custom classes for different breakpoints if Blocs’ author, Norm Sheeran, hadn’t pointed me to the right spot in the help files.

Blocs 2 has conquered its predecessor’s occasional jitters when placing and editing brics, but I found a few other minor bugs and glitches. Custom classes had a habit of vanishing from the Class Manager if I closed, then reopened the same project without restarting the program. (Sheeran says that issue will be fixed by the time you read this.) And my sample site rendered weirdly when previewed at the phone breakpoint, but looked a lot better on my actual phone. None of these rough edges kept me from using or enjoying Blocs, though.

A few nice, though nonessential, features remain absent as well. There’s no built-in FTP client, no way to easily incorporate PDFs or other non-image files to your site. You have to upload them yourselves, then type in the appropriate links, and Blocs 2 suffers from two different ways to choose colors. Global swatches let you pick a set of colors, then easily apply them to any element sitewide, but they can’t specify opacity or other fancier aspects. The Class Manager can, but only by using Apple’s own color picker, which doesn’t know or remember the colors in the global swatches. Keep your hex codes handy.

Blocs 2 improves its support for responsive design with visibility controls and custom classes for desktop, tablet, and phone breakpoints.

Bottom line

Minor limitations aside, Blocs 2’s new features add a lot more power, but only a little more complexity. They’re well worth the $10 price hike for the new version. Blocs 2 remains a great option for anyone who wants to build a sharp-looking site with minimal hassle.

Join the Good Gear Guide newsletter!

Error: Please check your email address.

Tags web design

Our Back to Business guide highlights the best products for you to boost your productivity at home, on the road, at the office, or in the classroom.

Keep up with the latest tech news, reviews and previews by subscribing to the Good Gear Guide newsletter.

Nathan Alderman

Macworld.com
Show Comments

Most Popular Reviews

Latest News Articles

Resources

PCW Evaluation Team

Azadeh Williams

HP OfficeJet Pro 8730

A smarter way to print for busy small business owners, combining speedy printing with scanning and copying, making it easier to produce high quality documents and images at a touch of a button.

Andrew Grant

HP OfficeJet Pro 8730

I've had a multifunction printer in the office going on 10 years now. It was a neat bit of kit back in the day -- print, copy, scan, fax -- when printing over WiFi felt a bit like magic. It’s seen better days though and an upgrade’s well overdue. This HP OfficeJet Pro 8730 looks like it ticks all the same boxes: print, copy, scan, and fax. (Really? Does anyone fax anything any more? I guess it's good to know the facility’s there, just in case.) Printing over WiFi is more-or- less standard these days.

Ed Dawson

HP OfficeJet Pro 8730

As a freelance writer who is always on the go, I like my technology to be both efficient and effective so I can do my job well. The HP OfficeJet Pro 8730 Inkjet Printer ticks all the boxes in terms of form factor, performance and user interface.

Michael Hargreaves

Windows 10 for Business / Dell XPS 13

I’d happily recommend this touchscreen laptop and Windows 10 as a great way to get serious work done at a desk or on the road.

Aysha Strobbe

Windows 10 / HP Spectre x360

Ultimately, I think the Windows 10 environment is excellent for me as it caters for so many different uses. The inclusion of the Xbox app is also great for when you need some downtime too!

Mark Escubio

Windows 10 / Lenovo Yoga 910

For me, the Xbox Play Anywhere is a great new feature as it allows you to play your current Xbox games with higher resolutions and better graphics without forking out extra cash for another copy. Although available titles are still scarce, but I’m sure it will grow in time.

Featured Content

Latest Jobs

Don’t have an account? Sign up here

Don't have an account? Sign up now

Forgot password?