Adobe Education Leaders

A student and I are working together on making my teacher site user friendly for a smart phone, tablet and desktop screen. We have been using Dreamweaver CS5 to accomplish this mission and the Media Query option.  Everything is working out ok (so far) except….The java script code from the mobile site is interfering with the ability to move to a different page on the desktop and tablet site.  We are using the mobile site  and javascript that Dreamweaver developed.  We are using images for the links. For example, when setting up on the desktop/tablet site <a href=”index.html” target=”_self” > the image will not work as a link at all (it acts as a regular image.) If we do not include a target is also does not work .  When we include “target=”_blank” the images do act as links but then go ahead and open up each internal link in a new window which clearly we do not want.  So in summary, the image links on the desktop/tablet file will not work unless we have target=”_blank” which then opens each link a new window (not what we want when they are internal links.)  Any solutions to this problem.  We did try changing the images to text and that did not work either (same issue.)  Any guidance would be greatly appreciated. Lori Cullen

I was recently commissioned by Web Designer magazine here in the UK to produce a two part tutorial to create and prepare an interface in Photoshop ready for Flash Catalyst.
I expected the design to port straight across from Photoshop without any problems but there are a couple of design features that didn’t make it across. I thought it would be a good idea to share with you what they are so you can get up to speed quickly. Once you are familiar with the workflow everything is very smooth.
The main problem I had was with text that that had layer styles. Keeping the text as ‘editable’ caused Catalyst to lose any layer styling. Flattening the layer to a bitmap worked okay, but if there was a semi-transparent region – with a drop shadow for instance, then this merged with elements of any layers below. This becomes a problem when layers turn off and on as you move from one page/state to another. The solution – flatten the layer in Photoshop first before importing to catalyst. While this loses the editability of text, visually the design remains intact. So there is a trade off here depending on what you need.
The second problem was with vector shape layers that also have layer styles applied – this gave very similar problems to those found above, but the solution here was much simpler. Check the ‘editable paths and layer styles’ for that layer in the advanced import.
Once the design was into Catalyst it was very easy to apply interactivity and transitions. The main problem seemed to be importing it 5 or 6 times in order to find the right way to get the visual appearance exact. Now as I understand how the design is treated on import, I think this will be very useful software.

My students, their parents and our business advisory board are all very excited about earning the Adobe Certified Associate credentials. Of course I want all my students to be successful so I have been searching for resources that will provide my students with the skills and knowledge they need to succeed. Here is a list of what I have found.
Study Guides
Did you know that Adobe has posted detailed study guides for each exam at: http://www.adobe.com/education/instruction/ace/ These are .pdf files with both written tutorials and the sample files for the lessons all wrapped up in one Adobe Acrobat file!

Adobe Curriculum
Adobe has worked closely with classroom teachers like myself to develop curriculum that is aligned with the ISTE standards and teacher tested.
http://www.adobe.com/education/resources/k12/instructional/
Visual Design is a yearlong, project-based curriculum that develops career and communication skills in print production and graphic design, using Adobe tools.
Digital Design is a yearlong, project-based curriculum that develops IT career skills in web design and production, using Adobe tools.
Adobe TV
It is time that instructors learned about this incredible resource. Adobe has developed hours of fantastic instructional video resources and offers it free through the Adobe Media Player. Check out all that they have to offer at:
http://tv.adobe.com/channel/students-educators

Learn by Video
This is the first resource that I have found that is specifically design to prepare students for the ACA exam. It has a easy to use interface, tutorials that you download to your iPod and well delivered content that will help your students prepare for the exam. I have really appreciated the book that accompanies this because it helps to explain the non-software specific topics covered on the exam. I also appreciate the test at the end of each unit both monitoring my students progress and helping them prepare for the type of exam questions they will face in the real ACA exam.
Classroom in a Book
Of course these books have been around for year providing a great resource for students and teachers. They provide great instruction on the application but you will need to supplement the lessons to fully prepare your students for the exam.
Online Software Training
If you or your students are looking for high quality online training on Adobe software then I strongly recommend the following resources:
Lynda.com: http://www.lynda.com/Member.aspx
Total Training: http://www.totaltraining.com/
Atomic Learning: http://www.atomiclearning.com/
Of course my own software workshops (free): http://www.mountsihighschool.com/directory/_dockeryj/conferences/index.html
Professional Development
Faculty workshops through Knowledge Network Solutions
Master education consultants from Knowledge Network Solutions come to your school to run workshops for faculty on how to use Adobe tools and effectively integrate them into their courses. Workshops are available to higher ed and K-12 institutions.
For more information about the Adobe Certified Associate Exam go to:
http://www.adobe.com/education/instruction/ace/

Adobe just released free exam study guides to prepare students and educators for the new Adobe Associate Certifications. In addition, Adobe Press has released three new offerings in the Learn by Video series.
The free exam study guides include:
- Web Communication using Adobe Dreamweaver CS4
- Rich Media Communication using Adobe Flash CS4
- Visual Communication using Adobe Photoshop CS4
Versions for the older CS3 are also available.
The Learn by Video series includes:
- Learn Adobe Photoshop CS4 by Video: Core Training in Visual Communication
- Learn Adobe Dreamweaver CS4 by Video: Core Training in Web Communication
- Learn Adobe Flash CS4 Professional by Video: Core Training in Rich Media Communication
See details>

I supervised a state SkillsUSA web design contest on April 24, 2009 (both secondary and post-secondary divisions) and thought it appropriate to summarize some of my observations. These comments are divided into two separate areas (business professionalism and knowledge of web design and development). Although I see the cup as “half full,” there is definitely room for improvement in both areas. I believe it is up to us as educators to encourage our students to improve in these areas.

On the business side, I must stress the importance of arriving on time for the contest and staying until the end of the contest. As a practicing professional, I am always hoping for a little extra time to polish a site for a client. Those that left early should have used the extra time to improve upon their work. Less than 25% stayed for the optional briefing after the conclusion of the contest where we shared a significant amount of information. One of the main differentiators many employers look for is passion and dedication in their employees. Staying for the debriefing confirms a desire to learn and improve.

It is also important to verify that your work has been properly copied. In many instances, although given the opportunity to check their work on the USB drive used to collect the final entries, very few opened more than the initial folder. Attention to detail is an issue of major importance as several sites had inadvertently pointed to a folder on their desktop (which will not work when the challenges are judged). This leads to broken links to images and CSS (and lost points).

Part of the competition also included an interview. As an aspiring professional, it is permissible to state that you do not know the answer to a given question but would like to find out more about it. Less than 10% of those presented with such a question took that approach (the remainder tried to guess their way through without success).

On the technical side, there was a heavy reliance upon tools (which is fine – provided one understands how to use those tools effectively). Of the tools used, Adobe Dreamweaver CS3 captured the major share (being used by over 85% of all participants). However, it is clearly evident that there is only a superficial knowledge of how to use the selected tool (resulting in errors such as pointing to an absolute location [on the desktop] for an image or CSS document). Likewise, reliance on templates (such as the Spry framework for the JavaScript challenge) is permissible, but one should definitely test prior to submitting (to make certain regions are properly defined in the HTML). Similarly, if there is a challenge to create a two column layout using only CSS, one should not use a Dreamweaver layout table to accomplish that challenge.

The quality of code is important (for example, there is no p2 element; there should not be HTML body elements placed above the DOCTYPE declaration). With the majority of contestants using Dreamweaver, one can easily test for valid code (and the tool actually helps one write such code). Unfortunately, it would appear that this feature was not employed on most challenges.

In my work with numerous business and industry professionals, it is clear they are looking for individuals who have a solid understanding of web standards and can use tools to effectively accomplish tasks. This is why the individual challenges were selected for this contest.

I implore those educating the next generation of web professionals to focus on the following areas to better prepare students for the workforce.

• Develop a good understanding of web standards (and why they are important – for maintainability of the code, for improved search engine ranking, for increased accessibility and all the other reasons). Tools are important, but students need to know the fundamentals before they can effectively employ those tools.
• Increase the emphasis on web accessibility and usability in the curriculum.
  Increase the emphasis on professional behaviors (arrive on time, test your work before turning it in, admit when you don’t know something and so forth).
• Help students develop a solid understanding of the use of the appropriate tool and when one must go beyond a given tool.

It is up to us as educators to raise the bar to help our students succeed in the workplace.

Simmons Career Center is a little different than most traditional high schools. Simmons is for students who want to learn a trade and get out of school as quickly as possible. Eligible students are at least a year behind and in jeopardy of dropping out of school. Unfortunately, for a majority of our students, poor success in school has also led to other destructive behavior outside of school. Like many other schools, we have gang members, students with criminal records, and students who struggle with poverty. Students who are able to manage their personal challenges and reach the Web Design IV class are required to do a project based exit activity to complete the program. The students act as a web design firm and work with a real client from start to finish. The guidance counselor referred a woman from a non‐profit agency called Advocates for a Safer Community to be our real life example. Before long, we found ourselves learning a lot about choices in life.
A tall slender woman came into the conference room where the students were all seated. We all stood and introduced ourselves and began by discussing how the web site should look and feel. Mrs. Saunders began to pull out news articles and pictures from her bag and spread them across the table. Each article and photo represented a young person who was murdered within the city limits of Tampa, Florida. Case by case, the students, by their own accord, began reading the articles and looking at the pictures. The students very quickly realized their project would have a significant impact on others’ lives. From that very first meeting, our students began to feel really needed.
Mrs. Saunders pulled out a picture and began to tell us how “he didn’t like getting his picture taken, so that was the best she could find”. One student asked, “Who is he?” She replied, “My son”. Mrs. Saunders started the organization after her son was murdered while waiting outside for a friend to come out and play. Mrs. Saunders pulled out another photo of her son. She said,” I like this one because he was not wearing a hat.” I could actually see and feel a change as my students empathized with this complete stranger and accepted her burden as their own.
The meeting was over and the students brought the notes back to the classroom. We began to discuss and build low level storyboards on roll paper. A couple of the students began to get nervous about doing such an important project, but we kept them on it anyway. Everyone agreed the pictures of the victims needed to be improved in Photoshop to make the faces larger and easier to see. We decided to create a Flash file that would have the mission and information in a center box with thumbnail images of all the victims presented. The students wanted every victim to be equally as important on the home page. As the user moved the mouse over the thumbnails, the center would change to a larger picture of the victim. We also included the name, the date of their death, and whenever possible, a word that family and friends used to describe the victim. There were links included to get more information about each case.
Now the hard part, there were nearly three hundred cases. Students began the tedious task of scanning pictures and recreating articles to build the Flash file and sub‐pages. One might think, or at least I did, that the students would eventually return to being unmotivated and lazy, with poor attendance and off task behavior. The opposite was true; the students were giving up their lunch, coming in early, and
finishing work in their other classes so they could work on the website. The seniors’ last day was fast approaching and the students were feeling the crunch. I offered to finish the project so they could enjoy some of the senior events and the last couple of days with their friends and none of my students would accept my offer. The last day for seniors came and there were still some finishing touches we needed to do. The seniors showed up to school as volunteers and worked on the project. When we sat with Mrs. Saunders to review and get her feedback, she was very surprised. One of our students even used Photoshop to edit the picture of Mrs. Saunders’ son. The student removed the hat and re‐created her son’s hair and features from the other photo where he was not wearing a hat.
In nine years of teaching, I have never seen dedication like my students gave to this project. What made the outcome even better were the conversations the students had with each other while working. These students discussed choices, their future and options for themselves. Nine weeks earlier, these same students were talking about who fought whom and their crazy weekends. No one could have predicted that a project used to teach Dreamweaver, Flash and Photoshop could actually change my students’ lives.
Michael Sawyer
Technology Resource Teacher
Simmons Career Center

As well as playing with Flash to get my seminar presentation on line in a fashion that sort of reproduced the look and feel of the Keynote in which it was created, I have spent the last couple of weeks getting my end of year exhibition up on our departmental website – a job that I do every summer.
So I thought that I might share the process for any who may be interested.
The site is http://www.artatsidcotschool.org.uk and the link is to ‘current exhibition’ (the site is a bit wobbly at the moment, so if it is down try later…)
If you click on ‘digital’ at the bottom of the page, and ‘Key Stage 3’ at the bottom of the menu, you will get examples of the different galleries that I have created.
For much of the work I simply edited the photos in a combination of Aperture and Photoshop – I guess that I should be using Lightroom, but Aperture came out first…
Most of the galleries were then created directly from Aperture – very simple and very quick to do, but not much in the way of templates. I am sure that I could as easily have used Lightroom, and Photoshop has lots of templates for web galleries – lots of choice for simple web galleries these days. The Yr 7 Land Art is an example of this sort of gallery.
For galleries with lots of images, I used a Dreamweaver plug in called Image Gallery Pack from a company called Project 7. They do lots of cool plugins for Dreamweaver. The menu on the digital page is also from them – Popup menu magic. I really like their concertina plugin too. The Holborne Museum photos are an example of this type of gallery.
The book effect in the Time Capsule project has been created with a bit of software called Banner Zest Pro from Aquafadas – with the images created pretty directly from Acrobat files. The project itself was originally created with Comic Life from Plasq. A slightly cheaper alternative is a Flash plugin called FlippingBook, but this is a little more comlex to use.
Another example of Banner Zest Pro is the kiost effect in the GCSE panel – either Meg or Sasha’s photos, or Holly’s (my daughter…)
And finally the animations and films that have been put together using the template that I created for the seminar presentation, which is done in Flash, with an extra component called TweenMax. I can offer instructions and a template if folk would like – contact me.
ross.wallis@virgin.net
In terms of showing good practice in relation to digital photography, the work of Alex Hughes-Games is spectacular. I have included flipbook versions of his workbook/journals – but in order to keep them to a reasonably sensible size I have had to compromise on quality, so they may be hard to read. Useful on a mac is the alt apple = shortcut that magnifies text (if it is on in preferences). There is also three of the movies that he created with a binary application called mathmap.
The Paris photos of Nathan Al’Shebab are worth a look too. He has created a beautiful website to display them using msql and php.
Because these journals will be really useful to me (and I hope others) in demonstrating good practice to future students, I have also included one as an Acrobat 9 portfolio (thank you Adobe – thank you Steve) The downsite is that it weighs in at 25.6mb.
It strikes me that acrobat – the portfolio, and form creation are a simply perfect digital solution for the International Baccalaureate record book.
- Ross

Adobe just released information regarding the 2008 Adobe School Innovation Awards. The theme this year is “My Community – My Planet – My 21st Century.” The competition is open to high school students in grades 9-12.
Students can submit entries in three categories:
-Web Design & Development
-Film & Video
-Graphic and Print Design
Prizes include software, cash, a laptop computer, and a trip to NECC being held in San Antonio, Texas.
For more information…

Austin is a great city. The music and food are fantastic, the people friendly, and the traffic…well; umm…they’re working on it. Last week’s TCEA conference lived up to the high Austin standards I have come to expect. The event was well attended, offered many great workshops, and hosted a football-sized field of computer and technology vendors. Of course Adobe had a large presence and their booth was always jammed full of conference goers hoping to learn about the latest Adobe magic.
I had the opportunity to present three Adobe-themed workshops: Dreamweaver, Acrobat, and Photoshop. Each session was well attended by a slew of enthusiastic educators chomping at the bit to add to their bag of tricks. Yep, it was one whirl-wind of a week, and judging from the twinkle in their eyes, I would have to say that their students are in for some exciting stuff.
Now that I have had a few days to recover from my “Austin experience,” I can’t help but to think about the strange transition that is taking place regarding web design in education. The professional design community has been going through the CSS change for about 8 years now, but designing pages using Cascading Style Sheets has only recently trickled down into the high school web and multimedia classes. In fact, many teachers in the session were not familiar with the term CSS or had only just begin dabbling with learning how to use Cascading Style Sheets.
I like to “feel out” the skill level of my audience, so when I started to speak about CSS and eyes started to glaze over, I quickly switched gears and started teaching table-based layouts. Yep…I sold out. Much like a science teacher refusing to teach that Pluto is now a planetoid, I sold out.
About two years ago I decided to ditch table based layout and go strictly with CSS. Frankly, the transition was not an easy one and the time investment was huge. Learning all about the different browser quirks and hacks was enough to pull my hair out. Most of my time was spent trying to figure out why one page looked good in “browser A” but was completely blown out in “browser B.” Learning the ins-and-outs of CSS took time…lots and lots of time (and coffee, and aspirin, and more coffee).
But in hindsight, I should have stuck with my guns. A good teacher finds ways to teach hard content. A good teacher finds ways to reach both the struggling newbie and the seasoned brainiac. A good teacher doesn’t shy away from a hard topic. Next year I’ll be teaching CSS layout…and sticking with my guns! Next year teachers will be walking out with a twinkle in their eye and some new CSS tricks in their toolbox!
So, what learning materials (websites, books, etc.) have helped you learn more about desiging with CSS?

If you need to publish photos online in a hurry, I suggest you check out the new slide shows available in Fireworks CS3. They are easy and quick to create. All you have to do is select the folder of photos you want to publish, choose a slide show design you like, specify your export options, and click “Create”. Fireworks will optimize all your images, write all your scripts, and build your slide show in a matter of minutes.
We’ve been studying about force and pressure this week in my science class – thought it was time to put my students in the “hot seat.” See the slide show.