Useful links: heading markup, CSS Zen Garden, Adobe again, flexbox

How to mark up subheadings, subtitles, alternative titles and taglines now that hgroup is officially out of the spec.

CSS Zen Garden is 10 years old. Dave Shea has announced a revival. Designers take note.

Here’s what Zeldman says about the changes at Adobe: Adobe Love. It certainly isn’t what I was expecting to read on his site.

How to use the Flexbox layout method (part 1) at Web Designer Depot is worth viewing. Note that the order of the properties they use should put the actual property last after the vendor prefixes are listed. Like this:

display: -webkit-flex;
display: -moz-flex;
display: flex;

 

WordPress 10 Year Anniversary Meetup

Ferndale WordPress Meetup (March 09)

The Albuquerque WordPress community hosted a 10th anniversary of WordPress Meetup and party last night. In attendance were 30+ Automattic Happiness Engineers from around the world. It sounded like the UN, with all the accents you could hear in the room.

During the actual meetup, the people from Automattic talked about the various jobs they perform and explained how bloggers and developers can get involved in WordPress.

The Happiness Engineers have a variety of roles, from working with people needing help and support via email, to working on the WordPress core, developing plugins like Jetpack. There were specialists in both the .com and .org issues, WordPress store, and more. There was also a ‘happiness gardener’ who works on issues and bugs no one else is assigned to do as well as developing for the WordPress core.

Someone asked about developers contributing to the core. The response suggested it’s a good way to grow and improve as a developer in an environment where there are so many people who can help you. If you develop a theme, there are a list of guidelines for what will be tested.

Some of the people from Automattic mentioned that they got their starts working in the open source part of the community and were eventually hired by Automattic. There are many ways you can contribute to the open source project that is WordPress. Here are a few suggestions I heard.

  • Use the forums to give back to the community
  • Write plugins
  • Work on documentation (the documentation in the codex is user created.)
  • Get involved in writing patches or fixing bugs
  • Work on adding feature requests
  • Translations are always needed for all the documents and other information because WordPress is in so many languages
  • There are a number of public mailing lists. [http://codex.wordpress.org/Mailing_Lists] in which you can participate
  • Contribute to the development of mobile apps
  • Join in meetups and Word Camps
  • Someone from the audience suggested that submitting ratings for plugins is helpful so that other people can see ratings and comments

At Automattic, all developers spend their first 3 weeks as happiness engineers and one week a year for every year thereafter.

2 Timely Tips from the WordPress community

You know that you should be downloading and saving a backup of your blog each time you upgrade WordPress. But did you know there’s a company that does it for you – every day – for a minimal charge? That company is VaultPress. Check it out. It could save you from a disaster.

Everyone from newbies to old WordPress hands can find something valuable at learn.wordpress.com.

Images of Women in Tech

I haven’t thrown this up in a while and there are lots of new faces. Hope you enjoy seeing these faces as much as I do.

This is a Flash-based slide show, so it won’t work on iOS. If you know of a way to create a slideshow using a Flickr group pool that will work on iOS, please let me know. I found some that don’t work, and some that work only on your own photos (like Blaze Digital) but not a group pool.

As always, if you have photos on Flickr that would fit in the women in tech group pool, please contribute.

Adobe’s Creative Cloud: Drawbacks, Incentives, and Education Implications

Users of Adobe CS6 have already had access to cloud based versions of the popular Adobe product line, but now these products will be cloud only. No more software downloads, no more boxes with CDs inside. The Adobe business model for the new Creative Cloud line means a monthly subscription fee to use the products.

The products involved include Photoshop, Illustrator, After Effects, Dreamweaver, Flash, Muse, InDesign, Lightroom, Bridge, and more Adobe tools and services. These products are now identified as CC for Creative Cloud. The CS (Creative Suite) name is going away. There won’t be a Photoshop CS7 or any other numerical ID, there will only be Photoshop CC. The release date for Adobe CC is June 17.

Those of you who use Photoshop Elements don’t need to worry. This change does not apply to your product. You’ll still be able to buy software in a box like before.

What Does This Mean?

In terms of products, Creative Cloud means you’ll always have the most up-to-date tools, and you’ll be able to share your designs with a team if you work that way. Here’s how Adobe describes it:

All-new desktop versions of your favorite creative tools and services, check. Immediate access to new features and updates, check. And that’s just the beginning. With Creative Cloud™, everything you need to create intuitively and collaboratively is included. All-new tools and services will be available in June.

It also means you aren’t paying for products, you’re paying for access to products in the form of monthly subscription fees. New users get access to the whole list of Adobe CC products for $50 a month. You can save if you sign up before the end of July. There are student and teacher pricing plans, and a pricing plan if you want to use only one product. (For example, you can use only Dreamweaver for a price of $20 per month.) The pricing plan for existing Adobe customers who own from CS3 up is also less than the $50 a month. If you own any version of from CS3 up, act quickly to get in on the price savings. You have to commit to a year’s subscription when you join. Here is the complete pricing plan list.

That monthly payment may feel like a big drawback to some. And, there is the reliability of your internet service. As Laura Scott tweeted,

 

Adobe Fireworks is going away. That may make a lot of people unhappy. According to Julie Bort, writing in Business Insider, “Adobe’s screen-grabbing, no-coding graphics tool Adobe Fireworks was originally included with the Creative Cloud, but Adobe just announced that it was killing that product.”

In spite of the drawbacks, I see some incentives for users.

If you normally buy each new version of everything each time it comes out, this monthly fee is a substantial savings. Even if you are paying the whole $50 a month, something most people won’t have to do, you’ll still be able to get two years worth of subscription services for the previous cost of a full creative suite.

If you’re like me – I’m still using Photoshop CS3, but have upgraded to Dreamweaver CS 5.5 (not the latest version either), it may not be such an attractive deal money-wise. But – you get the latest version of everything – all the time. That is a huge incentive.

Adobe has already been talking about some of the changes to Photoshop CC that users will like, always an incentive if you need to stay on the cutting edge.

Another incentive is the cloud-based collaboration and sharing that creative teams can take advantage of with Adobe CC.

Implications for Education

What does this mean for educators and classrooms full of students who want to learn Dreamweaver or Photoshop or Illustrator? Although the pricing page shows a listing for teams, it doesn’t specifically mention educational licenses for computer lab settings. I’m sure that Adobe has this figured out, but as far as I know, there’s no word out to educational institutions about it yet.

Implications for extension makers

Another question I have is what happens to those businesses like Project Seven or Community MX that have done very nicely supplying extensions for Adobe products? Will their extensions be available in Creative Cloud? Can a subscriber individualize a version of a product like Dreamweaver with custom extensions and widgets if everything is cloud based?

Thoughts?

Are you happy about this announcement and are you signing up early to get in on the savings?

Note: A shortened version of this post was also published on BlogHer.

UPDATE: See Adobe Creative Cloud for a more informed explanation of how CC works.

Review: The Modern Web: Multi-Device Web Development with HTML5, CSS3, and JavaScript

[Disclosure: I received a free copy of this book from the publisher for this review. Opinions are my own. Links to Amazon are affiliate links. Here is my review policy.]

The Modern Web cover

The Modern Web: Multi-Device Web Development with HTML5, CSS3, and JavaScript by Peter Gasston is from no starch press (2013).

Recently I’ve been reevaluating that pyramid (or three-legged stool) image we have of what skills are used to create a web site. The traditional pyramid metaphor has been a broad foundational layer of semantic HTML, followed by a second presentational layer of CSS, with the complete pyramid being topped by a small peak of interaction created with JavaScript.

Now we have a modern web. We deal more and more often with responsive (or adaptive) thinking, with apps, with APIs, with new CSS layout techniques using programming concepts, and with images built from SVG or canvas. All these changes lead me to think that the foundational layer in the pyramid of web design skills should be recognized as JavaScript. Books like this one reinforce that idea. (I first began thinking about this when I reviewed Introducing HTML5, but I didn’t mention it at the time.)

There is concern over the idea of HTML5 as “pure” HTML vs. the idea of HTML5 and related technologies that often get labeled as HTML5. It’s a dilemma facing many authors today who tackle the topic of modern web technologies, because you can no longer talk “just” about HTML.

The web is moving toward scripting as a way of dealing with every part of a website. In this book by Peter Gasston, it’s very clear that what he calls “the demands and requirements of working on the multi-device Web” are interlaced inextricably with JavaScript. He’s writing about that broader range of technologies I mentioned.

This is a well-written book. In a clear and accessible manner, Gasston leads you through several chapters detailing the latest technologies and thinking in modern web design. The book isn’t for newbies, it’s for people who already have skills and want to keep informed on the latest thinking, trends, techniques, and possible future directions. Here’s a summary of the chapters. Every chapter has an extensive section called Further Reading with excellent resources for the reader.

  1. The Web Platform talks about HTML5 and new best practices, CSS3 and beyond, and CSS preprocessors.
  2. Structure and Semantics deals with new elements in HTML5, WAI-ARIA, semantic markup, microformats, RDFa, microdata, data attributes and web components.
  3. Device-Responsive CSS provides information about media queries, adaptive and responsive design, viewport relative length units, and responsive images.
  4. New Approaches to CSS Layouts talks about multi-columns, flexbox, and grid layout.
  5. Modern JavaScript looks at new features in JavaScript, JavaScript libraries, and polyfills and shims.
  6. Device APIs covers a whole bunch of APIs from geolocation to drag and drop as well as information about PhoneGap and Native Wrappers.
  7. Images and Graphics includes SVG and canvas.
  8. New Forms takes you through new input types, new attributes, datalists, on-screen controls, form validation, constraint validation and css for forms.
  9. Multimedia deals with media elements, media API, and media events.
  10. Web Apps talks about various kinds of apps and tools for creating them as well as application cache.
  11. The Future goes through some really interesting ideas that may become reality in the future such as decorators, the shadow DOM, regions and exclusions in CSS and more.

There’s an appendix for browser support and one with further reading suggestions.

The style of presenting each concept is consistent throughout the book. He introduces a single idea, provides a spare code example, and shows the results. (He talks as if there are code samples available for download somewhere, but although I searched for a mention of the location of those code samples, I couldn’t find it.) Then he builds on the previous example with an new idea, a new code example, and a new result. It’s a very effective way of walking the reader through the new information and building an understanding of it step by step.

Summary: Trying to keep up? This book is an informative and up-to-the-minute look at modern web technologies.

A review by Virginia DeBolt of The Modern Web: Multi-Device Web Development with HTML5, CSS3, and JavaScript (rating: 5 stars)