Create skills underpinning 'Designing for the Web' competency

[dajbelshaw]

We decided on the 29th January community call to separate out 'Design & Accessibility' into two discrete competencies.This has been reflected in the repo (#13). Now we need to come up with the skills for Designing for the Web.

For reference, v1.1:

• Design & Accessibility

[jgmac1106]

Let's make the focus on design. I would love to get input from the Design Team on what they consider to be the most fundamental principles.

Move to Composing

• Demonstrating the difference between inline, embedded and external CSS
• Using CSS tags to change the style and layout of a Web page

Move to Web Mechanics

• Identifying the different parts of a web page using industry-recognized terms

Move to Accessibility

• Improving the accessibility of a web page by modifying its color scheme and markup
• Reorganizing the structure of a web page to improve its hierarchy/conceptual flow

Add

• Using a variety of design elements to convey meaning.
• Enhancing your content through use of balance, space, and alignments.
• Reinforcing elements through proximity, repetition, and contrast

[dajbelshaw]

Thanks! Paging @cassiemc, @iamjessklein et al for their input. :)

[jgmac1106]

Spent time reading everything on webmaker.org about design and accessibility. Maybe I deprecated CSS too soon.

I do see the difference in knowing CSS for basic composing and then the cool stuff @cassiemc, @iamjessklein can do. Maybe differentiate with:

• Using advanced CSS techniques to enhance design.

Is using advanced too much? Did I just introduce skill levels?

[dajbelshaw]

So at the moment we (perhaps arbitrarily) separate out HTML for 'Composing for the Web' and CSS for 'Design & Accessibility'. As @jgmac1106 has suggested, we might want to rethink that as part of the changes for v1.5

Should both HTML and CSS be part of 'Composing for the Web'? What would we include in a re-scoped 'Designing for the Web' if CSS isn't part of it?

Oh, and as for 'advanced CSS' I think we should avoid any language in skill descriptors that introduce subjectivity.

[dajbelshaw]

Here's what we ended up with after this week's community call. What do you think?

• Demonstrating the difference between inline, embedded and external CSS
• Using CSS tags to change the style and layout of a Web page
• Reorganizing the structure of a web page to improve its hierarchy/conceptual flow
• Understanding how and why to involve users in the design process
• Understanding the impact of diversity of screen size and mobile vs desktop device inputs on design

[jgmac1106]

For the last bullet point why not just say responsive design?

[dajbelshaw]

Yeah, that came out in the comments after, but 'responsive design' feels a bit fad-ish?

[jamiea]

Great work on the skills, agree the last bullet phrasing needs a little work.

( I'd personally prefer this skill as part of 'designing for device diversity' in an 'Inclusivity' competency which also include the 'accessibility' skills).

I haven't listened to Thursday's call but liked some of @jgmac1106's earlier suggestions to put some of the design skills into the 'Composing..', competency, comments I thought flagged up the fundamental links between content & design. Those suggestions don't seem to have gained any traction.

Agree with the MoPad comment about having a designer on the call, at least in part to inform about the practical relationship between content & design. That might help the community come up with the best place for some of these cross cutting design/ composing skills.

[jgmac1106]

@jamiea I didn't know the original intent was to separate CSS and HTML by putting one under design and the other under composing.

Can you compose for the web without CSS, yes. Can you compose for the web without HTML, yes. Can you write content without thinking about design, no. Can you design without thinking about content, no.

This issue to me is fundamental to writing for the web. Design is essential to meaning making.

I am stuck on this one (where to fit it), but I hope we do not end up with is a dichotomy that there is something different between composing a web page and designing a web page. Is there? Do we want one?

In the end both designing and composing live under building and I would never teach the two in isolation so the delineation in terms doesn't make much of a difference to me. If separating CSS/HTML between designing/building works I can accept it.

[jamiea]

More or less agree @jgmac1106, though I will say there are plenty of independent web designers who have earned their bread & butter by dealing with a heap of unstructured content from clients. Can be a tough gig! Maybe I'd like to see either more of a division or else an more obvious link between the two competencies, e.g an 'Understanding & explaining a style guide' skill in Composing... http://en.wikipedia.org/wiki/Style_guide

[jgmac1106]

@jamiea Thanks for the insight. Spent some time thinking on what we suggested and I still don't feel like we captured the aesthetic nature of designing for the web. It still reads as quite technical.

Now I know we are trying to parse out elements of literacies unique to the web but I want to try and capture the artistry and agency of design not just the skills.

Maybe something like

• Using principles and elements of design to enhance your message.

[jamiea]

IMO +1 @jgmac1106! The current sub-heading for Design & Accessibility is "Creating universally effective communications through web resources" which will now change of course. Seems like the 'natural' place for your suggested expansion into the artistry and agency of design, nicely covers the new Design skills set too. My 2 cents.. - Using the principles & elements of design to optimize content. Different from but has that overt connection to content that I'm fond of in 'Composing /Creating & curating content'

[dajbelshaw]

Just to reply to some of the great comments so far:

In the end both designing and composing live under building and I would never teach the two in isolation so the delineation in terms doesn't make much of a difference to me. If separating CSS/HTML between designing/building works I can accept it.

I think, as we've seen with the Clubs curriculum, designing activities aligning with the Web Literacy Map almost always involves two or more competencies. So I don't particularly see an issue here? We're always making judgement calls when demarcating what are fairly fuzzily-defined areas, so happy to debate further...

---

I like @jamiea's suggestion of Understanding and explaining a style guide - which I think actually fits here - and @jgmac1106's Using principles and elements of design to enhance your message. I think 'your message' seems somehow preferable to 'content' as it suggests designing for an audience. I've tweaked it slightly below.

This gives us:

• Using principles and elements of current web design practices to enhance your message
• Reorganizing the structure of a web page to improve its hierarchy/conceptual flow
• Using CSS tags to change the style and layout of a Web page
• Demonstrating the difference between inline, embedded and external CSS

Would love some input from @iamjessklein @cassiemc @xmatthewx et al. :)

---

• Understanding how and why to involve users in the design process (suggests client model)
• Understanding the impact of diversity of screen size and mobile vs desktop device inputs on design (covered with first bullet point)

[cassiemc]

I'm not sure exactly what all is on the table here but I think 'design' and 'content' are two very different pieces. Better in conjunction, but can work independently. 'Design' is such a broad term, and in the thick of building it's always useful for me to make the distinction between visual design (graphic design, branding, style, illustration), interaction design (user interface and sometimes html/css), and user experience design (the overall emotional and practical journey through an experience). I think it's a widely accepted definition of design to think of it as a 'communication' medium, so I liked some of the suggestions around design being one element of how a message is relayed (I wouldn't naturally look for Design under Composing for the Web, though, as I think of it more as a structural skill rather than a content one). This is just my gut, would be interested to hear what others think.

I really love the distinction between the technical and the artistic – or what I would call intuitive – design skills. One set of skills is so easily taught, and the other, I think is gained through watching and experience and developing an 'eye' – much harder to pin down. And now that I think of it, here's a good article about Art Direction that might reference some of the nuance here. It's a little old but still relevant, especially if you swap the words 'art direction' with 'ux design' :) http://alistapart.com/article/art-direction-and-design

Hope this helps a little! Look forward to following the conversation.

[dajbelshaw]

Thanks @cassiemc! Really useful to think through the different types of design. Just to pull them out of your comment, they were:

• Visual design (graphic design, branding, style, illustration)
• Interaction design (user interface and sometimes html/css)
• User experience design (the overall emotional and practical journey through an experience)

It looks like we've got some work to do! :hourglass_flowing_sand:

I wouldn't naturally look for Design under Composing for the Web, though, as I think of it more as a structural skill rather than a content one

Absolutely. To clarify what's happening to form this new Designing for the Web competency:

Looking forward to further comments. :)

[cassiemc]

Very cool, these changes look great!

[dajbelshaw]

Closing this in favour of issue #19