On the 25th Birthday of the Web!

Wow, this means I’ve been doing this stuff a long time, as I was involved in networking through newsgroups and online boards like the Well before this. I remember seeing the first Web pages where I immediately downloaded them and began to learn HTML. And the first book I purchased that had a chapter about HTML, and the Mosaic browser created by Chris Anderson, who soon after that started Netscape.

A student asked me today “How wealthy is Tim Berners-Lee, he must be worth a fortune?” I sense that Tim Berners-Lee is more excited about what the web has accomplished than whether he gained any $$ for it. And I know he gave us the Web, he never sold it. He convinced his company at the time, CERN, the physics lab in Switzerland, to give his work to the world freely, and they chose to do just that.

The challenges Mr. Berners-Lee presented to us who work with the web during his brief video on this day are an important mission for us all. The Web is still unavailable to over 2/3 of the world population. The global community is what gives the unusual power of the web to all of us who design and develop for it. It is a privilege we have to be a part of this amazing communications channel allows us to find ways to make a difference, to engage in discovery and meaningfulness in every opportunity we have to learn new technologies, and to share our work with everyone possible.

I like many others have had my credit card hacked twice recently, and how to curb the problems with security are of great interest to all of us. My attention to passwords and secure methods of working on the web, have heightened, and caused me a lot of extra time and concern. This effort must be deliberate and we have to discover better, more secure ways to connect and transact business on the web.

And while my talents may not contribute much to these very real challenges, my personal support for those who can and do work on the issues will have my support and cooperation. And I will teach others processes that will make their web transactions safer and more secure.

But most important of all, is my commitment to making a difference with web technologies. My personal company is focused to working only with those who also want to make a difference, and who demonstrate a willingness to partner with me to accomplish what they envision, rather than become “clients”. This is my small effort to engage in the meaning that is there for us to find and distribute.

#Main Header

This is a common paragraph that tells the story of how Markdown can be used within the WordPress Editor. For now, it is a quick way to “code” in html.

*Some are ideal and others are not*

A list of colors:

+Purple

– Black

*Blue

Changes & Transitions

I am in the process of changing my hosting and will move my websites and eventually this blog to a new hosting service. I will finally have all of my projects in one environment, which I hope will give me more time to focus on writing and creating sites that are meaningful to those who want to learn web design as well as develop self-directed learning skills. I am also designing websites again, and will host some of my clients on the new hosting environment. It is an exciting transition for me as I continue to find more focus in retirement, although I am still teaching as an adjunct Professor.

Since my retirement and transition to adjunct teaching I am beginning to focus on work with faculties who are interested in developing digital literacies through training in a variety of social software tools and processes. I have taught a class for beginning web design students that was a similar approach, but I find that without good models of how software and networking can be effective and expansive for learning, these vital skills will not be easily available to the majority of students. So a transition to working with other teachers in a new type of professional development is slowly underway.

Once my new hosting and domain transfers take place, I will continue to post at this site until I can establish the new environment.

New toys for my mind

[this article is unedited but released for its links and their usefulness to learners]

This has been an amazing week for discovering new things for my PLE (personal learning environment), and a new stage of developing my PLN (personal learning network) by joining the etmooc which started up this week thanks to Alex Couros who began the idea for its creation. I am a late starter for the global event, an open online course with 1647 people registered! More on this event later, but it is a a great opportunity to connect with other educational technology leaders all offering insight into new forms of teaching and learning.

I also got very involved in the topic of design thinking as well as content curation and discovered some new resources and a lot of new tools to explore. Re-designing the IMD Fundamentals course has been challenging and exciting, as there are so many new tools and resources to work with.

Design thinking brought me back to an early influence in my studies when I learned about Empathic Instructional Design in an article by Maish Nichani, published back in 2002. I was struggling with instructional design theories such as the traditional ADDIE concept [Analyze, design, develop, implement, evaluate]. Basically this style of designing learning is formulamatic and based on ancient times before the digital explosion. Elliott Masie in reference to early, boring e-learning, commented that “Whenever there is a new technology, early usage is often modeled after something that is familiar. ‘Right now, [2001] we see many of the classroom or textbook metaphors shining through.” The point of this is that ADDIE represents detached design, whereas Empathic design is user-centered, where each problem could have and usually does have, unique solutions. So, “in order to innovate, we have to learn to empathize with our learners [or users] and then base our designs on resultant observations and reflections. This trait is essential for all designers.”

This was my wonderful introduction to what we now refer to as Design Thinking, and perhaps a related form – Service Design, which is becoming significant in the world of web Design, graphic design, architectural design, and other design disciplines. For more about design thinking go to ideo.com, fastcodesign.com, and numerous other resources. One special resource is Service Design Magazine, edited by Jari Koskinen, and published by Lahti University of Applied Sciences Series C in Estonia. The publication is the work of cooperating universities in Finland and Estonia and present original thinking and unique perspectives about Service Design and Design Thinking. It is beautiful chaos and I loved the bluesy/browns. Reading it is more important, but very impactful.

A series of articles in websites I discovered about social media in business, SocialMedia.biz, socialbrite.com, as well as Mashable.com which I have followed for years, leads to a number of new tools related to content creation and content curation. The following articles are very informative and an overwhelming group of tools are discussed:

“Authors or curators: Who will be the more valuable in the future“, Mashable.com

“7 Smart Techniques for content curation“, at Socialbrite.org

“Take charge of the curation wave with these slick tools“, by socialmedia.biz

These articles lead you to a mecca of possibilities for your PLE!

Unique Ways to Learn…

Dan  Cederholm has been one of my favorite web designers to follow for a long time. There is something about the simplicity of his words – not simple words, but clear and concise when he describes a coding process, that I found in the first book of his that I read and used for my classes (Web Standards Solutions).

Reading his Simplebits website this morning, I read about his recent WordPress theme Pears. I have read the brief article before, but this time I went to the link for Pears [pear.rs] and discovered an amazing idea – to create a website to “collect, test, and experiment with interface pattern pairings of CSS and HTML”. The design is mainly for the user to create a collection of their own such patterns with the unique features of the theme’s structure. The left column is where you define a pattern you want to build and collect. When you select the pattern, the top half of the page becomes the pattern – a coded demonstration. The bottom half is a split window with the code used to create the pattern with the HTML on one side and the CSS on the other. What a great tool for learning and for storing snippets of code!

I highly recommend visiting pear.rs if you are just learning to code html and css, and to try the theme when you have your own hosting service as a tool for developing your own “patterns”. It is a great tool to add to my personal learning environment too!

Somehow, while on Simplebits my iPad jumped to Instagram.com/simplebits. Dan has collected a series of images to share – which probably are places and people where he lives. I have not bothered with Instagram before now, but I realized I have many images of my community that would be fun to share in this type of “biographical story”. Another project, but it looks like a fun way to share the community I am so attracted to and involved with.

The problem with reading everything without thinking

Heydon Pickering wrote an excellent article today about “The Importance of Sections” at Smashing Magazine. I highly recommend this article – one of those “I wish I could write that clearly” articles that explains the new HTML5 Sectioning elements. In the article he references the “sectioning elements” from the World Wide Web Consortium (W3C) wiki site that is also a good example of better writing on the W3C site – clean, understandable code examples of the sectioning elements in HTML5. In teaching html5 sectioning, I had delayed going “fully HTML5” by keeping <div>’s as part of learning to section content in our courses but recently in all web scripting courses, we are now fully implementing the newer HTML5 style of sectioning with the article, section, nav, and aside elements. The transition followed what major designers were doing and now most designers are implementing the html5 sectioning – which is why we made the transition.

Please read the Heydon article and the W3C article and practice these important and useful semantic methods of writing web standards based code. I think you will find Heydon’s writing interesting and very informative. He specializes in semantics – so expect it to be accurate and meaningful.

However, one of my purposes for this article is to also reference another article about the same topic, with a much different perspective – one that argues for forgetting about the new html5 elements. Luke Stephens wrote three articles at WebDesigner Depot that “they’re actually some of the most poorly specified, poorly understood, and poorly implemented parts of HTML5” referencing the “structural elements” [sic Section Elements) of HTML5. He states that you simply “shouldn’t use them”.

My concern with Luke’s article is that it is an example of opinion, and he authorizes himself as the author of a book about HTML5 as proof that he knows what he is talking about. Please read Luke’s articles to see his point of view and make your own decisions about these two different perspectives about changes in coding with HTML5.

Colleges and universities are often criticized by developers as teaching outdated stuff, and not keeping up to date. Our programs have been teaching Web Standards based html/css since there were standards. Articles by “designers” such as Mr. Stephens do not help us keep the content in line with Web Standards. I have coded html before there was CSS and before Web Standards were prevalent. I don’t think the web design community wants to go back to the days of browser wars and every individual deciding to create code the way they think it should be done. There are many top designers/developers that not only believe in the Web Standards process, but that is the way the code – and they do pretty well at that!

Luke Stephens article at Webdesigner Depot : “The Harsh Truth About HTML5’s Structural Semantics“. Links to part 2, and part 3 are at the end of the first and second articles.

New Theme, New Ideas

Sometimes its fun to simply select someone else’s theme and focus on writing. At this stage I am more interested in designing information, than designing the theme. I like the bold look of this theme, the ease of reading and the simple navigation of categories. This has been an overwhelming quarter and its good that it is about done. This is a new beginning – with time to write and share experiences.

This is my last week as a full-time instructor, and even though I will teach a few classes in the winter quarter, I mostly look forward to the challenges ahead, and the new things I want to accomplish. I may even build a few websites along the way, and perhaps even make a difference in my community….

Web design & development has grown in leaps and bounds since I began teaching back in 1997. And it is easy to see that there were more major additions and changes to the focus of our industry this past year, than any I can remember. The dot com crash of 2000 was mild compared to the dramatic changes that are occurring because of the rapid expansion of internet capable devices. The impact of responsive web design is almost overwhelming as there are so many frameworks and practices in place, yet some areas that simply are not working effectively yet. The new year will surely find better solutions for images, and perhaps even browser adjustments. It should be an exciting year and a great time to be a web design learner and professional.

What really is difficult in our business is design thinking, how do you solve the new types of problems clients will come to us with – that have never been tackled before? Who dreamed that over 50% of the computer use in this country would be on a 320×480 viewport? And the number will probably increase more rapidly than we can say responsive design. How about designing a clients e-commerce solution for a mobile phone? There are not yet established patterns for Responsive Web Design yet; flex layout and grid layout specifications are coming soon, not to mention more focus on scripting and developing personal frameworks to speed our coding effort. We have to have great tools for learning, just to keep up with the changes! But we still have the challenges of the impact of the web on our global village as the major challenge.

The real learning experience available to all of us, is through collaboration with colleagues who are working to solve the current issues with RWD. It is an important time to realize how social networking will be important to our forward progress, as changes will still be rapid and confusing at time. We need to stay connected to the larger design community to keep up with the changes. We really need to focus on design thinking at this stage, and get to the essence of what we are working to accomplish.

It’s been a good run with great people – I’ll be around teaching part-time for a while, but the ebb and flow of this life is changing – I will be doing the things that matter to me – trying to make a difference….

Designing for the ebb & flow…

The Web is finally actualizing into its own thing. The transition from print design and human tendency to “hang on to the old” is about gone. We are entering another new phase of web design. We are now at the threshold perhaps, of really inventing what will be the web of the future. John Allsopp wrote about “A Dao of Web Design” in A List Apart back in 2000. In that article he referenced a number of excerpts from the Tao Te Ching. One of those related to the designer’s need to control web pages, whereas The Sage “…accepts the ebb and flow of things, Nurtures them, but does not own them,” Tao Te Ching; 2 Abstraction.

We are in that state with the new tools and technologies arriving daily, and it is our responsibility to nurture them, but not own them. As web designers we are faced with a multitude of devices we are designing for – including mobile phones, laptops, tablets, e-readers, game consoles, and soon most likely, the display in my Honda! There are more people connected using mobile phones today than those using desktops/laptops. This could be a really big hassle for web design, but instead we have arrived at a time when the tools and the technologies are available to solve these problems and allow a more holistic approach to design. Responsive Web Design guru, Ethan Marcotte, suggests in a recent interview in .NET, that “we can finally design for the “ebb and flow of things,” referencing the Allsopp article stated above.

Responsive Web Design represents a transition from fixed styles to flexible design that includes fluid grids, flexible images, and media queries layered together to create a responsive design. Responsive in the sense that we can design sites that are responsive to the devices out there rather than remaining stuck in a single device mentality. Obviously we need more design focused on Mobile computing, as well as the rapidly growing tablet products. Responsive web design allows us to address all of these devices in one website.

So we will evolve our teaching with Responsive Web Design, learning the various techniques available, and the rapidly growing bank of frameworks and new technologies that address the issues we face. But one site for all devices is not a simpler solution in that we are designing for different users – a user may be on his/her laptop in the morning, using their tablet during the lunch hour, and then their mobile as they head to a meeting. Same user, different devices, and different needs! It will require thinking skills, paying attention to how these different devices involve different needs. It is challenging but exciting. Web design is becoming more important in the global landscape, and from where I view it all, it’s getting to be much more fun and meaningful!

There will be more about Responsive Web Design in the near future. In the mean time, here are some of the articles, books, websites, frameworks, etc. that I have been reading, and pondering. Please share the resources you find that inform you about this important era and responsive design.

Ethan Marcotte’s article on A List Apart: http://alistapart.com/articles/responsive-web-design (started the conversation)

His book published by A Book Apart: http://www.abookapart.com/products/responsive-web-design

Dan Cederholm’s new book: Bulletproof Web Design, third edition; http://simplebits.com

Examples of Responsive Web Design:

http://paravelinc.com

http://trentwalton.com/2011/05/10/fit-to-scale

http://thedolectures.co.uk

http://atxwebshow.com

http://netmagazine.com/features/ethan-marcottes-20-favorite-responsive-sites (these are pretty special)

http://mediaqueri.es/ – Media Queries

http://www.netmagazine.com/features/21-top-tools-responsive-web-design

And one of the interesting new frameworks related to Responsive Design: http://lessframework.com/

Changes are now!

It is time that we engage in a broader conversation, through our blogs, google+, twitter and other collaborative tools you may add to the process. Web design has been changing over the last year or so, and today we find ourselves with better languages (html5, css3 at least) and better concepts for our frameworks and support apps such as Less (lesscss.org), Sass (sass-lang.com), Twitter’s Bootstrap (twitter.github.com.bootstrap) and support files in html5 Boilerplate (html5boilerplate.com) and Andy Clarke’s 320 And Up (stuffandnonsense.co.uk/320andup). We also need to pay full attention to Responsive Web Design ( http://alistapart.com/articles/responsive-web-design ), which is rapidly becoming the best practice of the era of numberless devices that web designers must include whenever we design a new interactive project.

Where to begin is not easy to figure out. Perhaps the best place to begin is to get a more collaborative and focused conversation started between students and instructors, students and students, all of us and others in the broader global community of web designers.

This blog is about to become more active, actually a new version of Webstuff2, perhaps Webstuff3 to indicate a next level. It is not easy to write regularly, but there is too much going on to simply hold on to it, or try to slip it into a curriculum that is becoming somewhat stifled. I firmly believe that a curriculum is more than what happens in the classroom however, and it is time to find out how much we can grow, just because we want to learn more, and be the best at what we are doing.

This intro to the “webstuff3 era” will be followed with an article about Responsive web design, as well as a list of resources that everyone should be reading. More soon.

Articles about Web Design

I have just posted a link to a Word document that contains direct links to a group of articles available from the Peachpit.com/articles website. These articles are by authors of recent books related to web design or they are actual chapters from books. I listed these to suggest that this is a way of keeping up with the latest resources as well as get in touch with authors you may not have read before. There is a wealth of material about progressive enhancement, html5, css3, designing with grids, and other interesting design issues. To get to the list go to my ftp site and the resources at the bottom of the page, Articles & Books. Look for the “alistofarticles.doc” link to download the linked titles. I will add a list of relevant books in a short time. If you go to the peachpit site, articles section, and select the “web design & development” topic from the left side menu,  you’ll find many more articles on other topics of interest for your reading.