We Must Adjust Our Expectations As Technology Changes…
Once it was quick and easy to generate a web page in a WYSIWYG editor like Dreamweaver or FrontPage, but today’s Web—with fly-out menus, multimedia, and Web 2.0 tools—is a vastly different place. Evolving web standards, which are set by the WorldWideWeb Consortium (W3C) and the Web Standards Project, are significantly shaping web editing tools.
What are Cascading Style Sheets?
Adobe has enhanced Dreamweaver cascading style sheet (CSS) features to comply with evolving web standards—mainly the migration from HTML tables to CSS for text formatting and page layout. Web developer Jeffrey Zeldman, in the article From Table Hacks to CSS Layout: A Web Designer’s Journey, talks about this shift toward CSS when he says, “We all know the future is about web standards. And web standards are about the separation of style from content – presentation from structure – design from data.”
To see the benefit of cascading style sheets, visit the CSS ZenGarden. The design of a CSS-driven site can be quickly changed by swapping out style sheets. The secret: information about layout and formatting is stored separately from the web page, in a CSS file, rather than embedded in HTML tags on the web page.
Some benefits of using CSS:
- Efficiency: No more editing hundreds of individual web pages and table cells. CSS allows you to change your website in one location and to see those changes take effect globally throughout your website.
- Accessibility: In some areas (e.g., higher education), government legislation requires websites to be accessible to users with disabilities. Applications that assist people with disabilities, such as screen readers, are dependent on CSS styles. CSS also helps ensure your site is viewable in mobile devices capable of browsing the web.
In Dreamweaver CS4, aside from bolding or italicizing, you cannot make any font formatting changes, without creating a CSS style. This is because HTML font tags will not be supported by future web browsers, and at some point sites using font tags for text formatting will not display correctly. In addition, you must use CSS styles to format individual parts of a table.
As part of the Adobe Creative Suite 4, Dreamweaver is in labs and as a self-install to faculty/staff computers.
Changes for BITS Dreamweaver Training
- Dreamweaver CS4 requires that students learn advanced web development features (i.e., CSS). Dreamweaver training will now be a minimum of two 50 or 75 minute workshops. We recommend a third training session to help students get started on creating their own pages from a template.
New lesson plan: W:\BITS\Workshops\Dreamweaver\Lesson_Plan_Materials\
- Students will create web pages from templates that use CSS for formatting and page layout. BITS will provide the standard template shown here and guide students through creation of the final Campus Computing Resources page. Students will learn how to change colors, add links and images, and more, but they will not learn how to set up the structure and layout of the page.
Rethinking Dreamweaver Assignments
The drawback to all this is that web design and development has become increasingly complex. Having assignments that require students, with a couple hours of training, to create websites may no longer be successful, especially for students who have no prior experience.
Technology changes rapidly and students are likely to encounter a variety of web-based applications, such as content management systems, in the workplace. Leslie Jensen-Inman, in her article “Elevate Web Design at the University Level,” talks about this when she says “Teaching current technologies is critical. Equally critical is teaching that these technologies will change and that, for students to stay competitive in the real world, they will have to change with these technologies...Although technology is vital to web design and web development, specific technologies are not as important as teaching “why” something should be done.”
Instructors should evaluate whether the time and training involved with Dreamweaver CS4 still matches the goals of their assignments. Instructors who don’t wish to devote this much time to a web-based assignment may wish to explore the alternatives listed below.
In addition, although we provide CSS-based templates for faculty and staff who want to create professional or curricular pages, significant time will be involved on the part of the faculty or staff member to learn the advanced technologies required to develop these pages.
Alternatives to Dreamweaver
Mozilla SeaMonkey is a simple web editor available in all general access labs, which was already being used by some instructors as an alternative to Dreamweaver. Students can use SeaMonkey to create simple web pages the traditional way, with HTML tables and without the added burden of learning advanced features like CSS. However, this is an introductory step in learning web design and development, and does not reflect the standards of practice in the field. At this time BITS will not be offering support for Mozilla SeaMonkey. There are various tutorials available within the program and online on sites like YouTube.
Creating Websites Online
These free online services are similar to a content management system, where students publish their content into pre-designed web site templates. Students who are not studying to be web designers or developers are likely to encounter this type of system in the workplace, as publishers to an existing website, rather than designers or developers for a new site.
Students create free blog accounts and create entries including text, graphics, and multimedia. Others can comment on blog entries and students can customize the layout and design.
Web Design & Development Resources
- Dreamweaver CS4 includes many free CSS-based templates. Free templates can also be found at Open Source Web Design http://www.oswd.org/ , Andreas Vickland http://andreasviklund.com/ , and Jason Cole http://jason-cole.com/
- Adobe TV Learn Dreamweaver series.
- The Adobe Developer Center http://www.adobe.com/devnet/dreamweaver/ contains various free online tutorials. In addition, there are free Dreamweaver tutorials available on YouTube.
- Many organizations are developing web education initiatives: The Web Standards Project, Opera, and more.
- AListApart.com for current issues and trends in web design and development.
- The UWEC Computer Science program offers a minor in Web Design and Development.
When deciding whether to continue with Dreamweaver assignments, please note the recent changes to our mission statement and policies. With our help, you will ultimately become the primary support for your Dreamweaver assignments.
Together BITS and CETL can assist you with incorporating technology into your course material. To get the conversation started, please contact BITS at 836-5157, firstname.lastname@example.org or stop by and see us at the Help Desk / BITS complex, OL 1106.