Feed on
Posts
Comments

Registration opened today for the April session of classes offered by Start to Web . The instructor led classes offered this session which starts April 5, 2009 are:

  • Introduction to CSS – Cheryl D Wise, Instructor & Pat Geary, Teaching Assistant
  • Introduction to Expression Web – Cheryl D Wise, Instructor & Pat Geary, Teaching Assistant
  • Migrating From FrontPage to Expression Web- Tina Clarke and Pat Geary, Instructors

Also offered are the F REE  self paced classes:

  • Language of wee Design
  • Fonts for the Web
  • Accessibility

Readers of this blog may obtain a discount on the cost of the class by using the coupon code PGfriends.

Read more about the Migrating from FrontPage to Expression Web. The EBook is included as part of the class.

Expression Web is a web editor from Microsoft that was released December 4, 2006 and is the successor to MS FrontPage. Cheryl Wise is the author of Foundations of Expression Web: The Basics and Beyond and is the instructor for this four week course which begins April 5, 2009.

Introduction to Expression Web – This class is newly updated for Expression Web 2 but you may take this class using either version of Expression Web.

Are you ready to take the plunge and move to a standards based web editor?

This class has been restructured to get you up and running with Expression Web in just 4 weeks. While you will not be an expert on Expression Web or a professional web designer you will be able to create and manage small websites and, with practice, be able to expand on the skills you learn to create more complex websites using Expression Web.

Prerequisite:

Expression Web – You may download the 60 day trial version from the Microsoft Expression Web Site our class is 4 weeks long so the 60 day trial is adequate. If you choose to take this class with the trial version make sure that you obtain and use the registration key or your trial will end before the full trial period.

Prior Experience:

No prior web design experience required but will be useful.

Book:

The book required for this class is Foundations of Expression Web: The Basics and Beyond available at Amazon or a bookseller near you.  ( There will be reference to sections of this book that will help you better understand CSS.

Introduction to Expression Web – The Class

This course covers the fundamentals of standards based web design, including xhtml and css:

Week 1 – Getting Started

  • Why Worry About Standards
  • Why CSS Layouts?
  • Website Planning
  • Installing Expression Web
  • Interface
  • Configuring Expression Web
    • Site Settings
    • Page Editor Options Overview
      • Version 1
      • Version 2
      • CSS Tab
      • Font Family Tab
  • File Menu
  • Page Properties
  • Semantic HTML – Structuring Your Page
  • Publishing

Week 2

  • CSS Basics
  • CSS Tools
  • Fonts
  • Block
  • Background
  • Box
  • Positioning
    • Options in the New-Modify Styles Dialog box
    • Float vs Positioning
    • Lists & Tables
  • Applying Styles

Week 3

  • Contextual Selectors
  • Creating Page layouts
  • Layout Examples

Week 4

  • Dynamic Web Templates
    • Creating the DWT
    • New Pages and DWTS
    • Editing a DWT
    • Detaching or Changing a DWT
  • Preparing an Existing Page for a DWT
  • Site Reports
    • Report Options
    • Slow Pages
    • Hyperlinks
    • Accessibility Report
    • Compatibility Reports
    • CSS Reports
  • External Stylesheets

By the end of the 4week course you will have a simple multi-page website that will work on all modern browsers. You will have an understanding of the underlying principles of effective web design that will look good.

If you are interested in taking this class, you can read more about Introduction to Expression Web and register for the class at Start To Web. Cost of the Class is $89.95. Readers of this blog can obtain a 10% discount by using the coupon code PGfriends.

The next class will begin on April 5, 2009 and will last four weeks. The eBook is included as part of the class. Readers of this blog may obtain a 10% discount on the $79.95 cost of the class by using the code PGfriends when you register. REGISTER NOW so you can start at the beginning.

If the class does not fit into your current schedule, you may purchase the eBook separately.

Updates for the eBook and the class schedules will be announced on our FrontPage to Expression mailing list

Migrating from FrontPage to Expression EBook $29.00


==============

Perhaps you are using FrontPage 1998, one of the earliest versions of FrontPage to design your websites. Maybe you are using a later version 2000 or 2002. Are you still using Themes, Shared Borders, and the Navigation Bots? Have you upgraded to FrontPage 2003 but still using the formatting toolbar which adds all of those <font> tags? Is your site accessible to those visitors who cannot “see” you site?

Do you already have Expression Web or maybe you are thinking of getting it? Perhaps you have it but have decided the process of cleaning up your site is just “too much.”

(Did you know you can upgrade for less than $99 if you have a qualifying application which includes many of the Microsoft products?) Not in your budget right now?

You still might consider taking Migrating from FrontPage to Expression Web.  Why? In the class we teach you to use many of Expression Web’s clean up tools and EW does help where FrontPage simply cannot. Some of cleanup can just as easily be done with other third party tools or using FrontPage 2003 in particular. Microsoft does provide a free 30 day trial of Expression Web so you can test out the software, but the software may expire BEFORE you have completed the class. We are also teaching you how to make use of accessibility features.

The cost for class has is $79.95 AND you will receive a copy of the eBook which contains additional material, lots of screenshots, and a selection of templates you can use. While the book is an excellent resource, the class gives you two Microsoft MVPs to hold your hand and answer your questions while you are migrating. What more could you want?

To register go to http://starttoweb.com/classes/fp-ew.php and start learning how to clean up your code. Remember, using cleaner coding methods means easier maintenance and easier maintainance me

Introduction to CSS

Are you new to CSS? Confused about box models and how to create a CSS based page layout? This Introduction to CSS class is for you. You must be able to write or at least read HTML and familiar with the terms of web design to participate in this class.

Introduction to CSS is another class offered by Cheryl Wise at Start to Web and will begin April 5, 2009

Prerequisite:

Any CSS or text editor (code view of many popular HTML editors qualifies) maybe used in this class but the ability to work directly in the code is required.

Prior Experience:

Must be able to write or at least read HTML and familiar with the terms of web design. Minimum experience the equivalent of “The Language of Web Design” short class.

Book:

The book for this class is Cascading Style Sheets Separating Content From Presentation. There will be reference to sections of this book that will help you better understand CSS during this class so you should order it in time to receive it prior to the start of your class.

Other Requirements:

Web space to upload assignments. Minimum of 3 browsers for your operating system, recommended browsers: Firefox, Opera and either Internet Explorer 6 or Safari depending on your operating system.

Class Syllabus:

Week 1 Overview and Basic Concepts

  • What is CSS?
  • Types of Styles
    • Inline
    • Document Level
    • Linked or External
  • Order of the Cascade
  • Class, ID and Element Selectors
  • Attributes
  • Values
    • Units of Measurement
    • Colors
    • Shorthand
  • Pseudo Classes

Week 2 Fonts, Text Properties and Positioning

  • Font Families, Style, Weight and other font values
  • Spacing
  • Text-Decoration
  • Box Model
    • Margin
    • Padding
    • Borders
    • Size
  • The Box Model Differences
    • Between Browsers
    • How Doctype affects the box model.
  • Flow
  • Absolute
  • Relative
  • Floats

Week 3 & 4 Contextual Selectors & Pulling it All Together

  • What is a “contextual selector”?
  • Why and when you should use them.
    • menus
    • footer
    • content columns
  • How to write “contextual selectors”.
  • Media Type Styles
  • Creating page layouts
  • Final project – assigned week 3 for completion week 4

You can read more about Introduction to CSS and register for the class at Start to Web. Cost of the class is $89.95. Readers of this blog may obtain a 10% discount by using coupon code PGfriends.

Using WordPress as a CMS

I have been using WordPress for blogging for a couple of years now. Ever since taking Cricket Walker’s SEO Training Course and one of the lessons was The Benefits of Blogging. I moved the blog I had from blogger.com to my own server and installed WordPress following her tutorials. I wanted it to look more like my own creation so I started playing around with various themes and quickly learned not all of them are created equal.

My next step was working on an eBook on with my fellow MVP Tina Clarke on Launching a WordPress Blog which is offered F REE to anyone interested. It is soon to be revised to cover the latest version of WordPress 2.7.

Today I had the opportunity to watch a video produced by fellow MVP, Morten Rand-Hendriksen
Using WordPress in Alternate Configurations – My WordCamp Whistler 09 Presentation. After watching it I am again excited about WordPress and what I can do with it. Morten suggest using it more like a CMS which is the abbreviation for Content Management System. He shows you how using WordPress and Expression Web 2, you can customize your site so it looks more like a web site and less like a blog yet still functions as a blog. The site he uses in the tutorial is one he did AnnyChih.com which is fantastic. You can watch Using WordPress in Alternate Configurations – My WordCamp Whistler 09 Presentation and see for yourself how it is done. He also provides the code snippets you will need to try out his suggestions.

Morten Rand-Hendriksen is the newest MS MVP – Expression Web and the author of  Sams Teach Yourself Microsoft Expression Web 2 in 24 Hours (Sams Teach Yourself — Hours) (affiliate link.)

Web Design Plus

In my wanderings around the web today, I came across another site I wanted to share – Web Design+ — Tips and advice on web standards development by Harry Roberts, an 18 year old web developer from the UK states:

Welcome to Web Design+. This is, in no particular order, an amalgamation of web-standards solutions for common web development issues and problems - a way to tackle development in the cleanest, most accessible and semantic way possible. By using Web Design+, the aim is to standardise practices throughout an organization; from accessibility to hacks, Web Design+ covers the best ways to tackle a variety of dev problems.

The idea of Web Design+ is not to force techniques and methods onto developers, but to offer the best known ways of getting round problems, and generally better coding and developing standards in terms of accessibility, maintainability, usability and longevity.

Most of the tips here I have picked up along the way and have been of massive help to me - though I wish I had learn them all right away, which is why I’ve decided to collate them all for use by up-and-coming developers.

He starts with:

!DOCTYPE

The correct !DOCTYPE depends on the project. If you are starting a new project use the Strict !DOCTYPE, if you are appending or modifying an existing project use the Transitional !DOCTYPE.

Markup

  • The fundamental aspect of a maintainable project is well structured and semantic markup. Proper indentation, semantic ID and class names and valid markup all lead to better code.
  • Validating you markup is not required BUT it is certainly advisable. Valid code will eliminate the majority of broken layouts and visual discrepancies, making cross browser compatibility much simpler.
  • It is important to use semantic and relevant names for ID and class attributes. As a general rule, only use a class if it is likely to appear more than once, and IDs for unique items such as container <div>s.
  • It’s always a good idea to define a series of generic class names in each new project that will be used frequently to achieve mundane tasks.
  • CSS Resets are the topic of much debate. They are used to create a level playing field across different browsers in one go.
  • Diagnostic CSS is incredibly useful during the build phase as it allows you to visually recognise errors in your markup as you build.
  • It is a good idea to have a preset list of generic classes in your stylesheets to carry out repetitive styling.

Navigation

Designers and developers wrongly categorise navigation and menus as being one and the same. Navigation is a means of navigating an entire site, whether that be through the main menu, sidebar links, breadcrumbs or content links. A menu however (which is often incorrectly referred to as the ‘navigation’ or simply ‘nav’) is the main body of links often located at the top of a document, and is usually consistent throughout the whole site.

Links

  • Phrases and naming – Never use phrases such as ‘Click Here’ for link text. ‘Click Here’ means very little to someone using a screen reader.
  • Attributes - Links come with several ‘obvious’ and widely used attributes such as href=”" and title=”". The former meaning ‘hypertext reference’ and the latter being a title used to describe the link’s function/behaviour.
  • Fragment Identifiers – It’s possible to use IDs and anchors to link to specific parts of a page (used extensively here), these are known as fragment identifiers. This is a valid means of navigation, especially in one page websites.

Images

  • Embedding in a Page – If the image serves no informational/content purpose to the page it should be added using CSS as a background image. If however it is a product page, where a product is described with an accompanying image,then insert the image into your html code.
  • Attributes - The <img> tag comes with several specific attributes, the most important (and mandatory) of which being the alt=”…” attribute.

Divs

<div>s are the building blocks of CSS developed sites but should not be heavily overused.

Forms

He covers only the most relevant in terms of accessibility and semantics.

Type

Whenever styling text on the web, it is advisable to use ems - a relative measure defined as “A unit of measurement used in typesetting, approximately the width of the letter “m”". Font sizing on the web is extremely flexible, but anything smaller than 10px is generally too small to read comfortably.

Read Web Design+ — Tips and advice on web standards developmentcomplete with many examples and the style rules you will need.

Today is the last day for you to purchase the Migrating from FrontPage to Expression Web EBook at the low price of $22.00. Regular price is $29.

If you are moving from using FrontPage as your web editor to Expression Web, then this is the book for you. Our EBook will help you achieve your dream of an easy maintenance, trouble free, standards compliant website. Included with the EBook are Expression queries to help you with the cleanup process and seven free templates to get up started. Techniques and tools to make the cleanup process easier will be covered. Access details for the companion web site which includes some CSS lessons and the f ree templates is included in the eBook.

Don’t delay – get your copy of Migrating from FrontPage to Expression Web for the low price of $22.

Today is also the last day to obtain Expression Web 2.0 from the Microsoft online store at half price.  Buy  Expression Web 2 Upgrade for $49.95. Offer good for US purchases only.

I’ve noticed recently that many of the techniques used by top designers are actually quite simple. It’s how these simple elements are pieced together that makes a design brilliant. Today we’ll be looking at the first one of these highly effective, yet strikingly simple design methods with the use of CSS borders.

Borders have a lot more impact than most people realize. They can make a design look miles better with only minutes of work. The little characteristics like weight, style, and color have big effects on either drawing elements out or making them fit into the background.

Read Five Minute Upgrade – Using CSS Borders for Emphasis by Zach Dunn and try out some of his suggestions on your own site.

The Woork Handbook

The Woork Handbook is a free eBook about CSS, HTML, Ajax, web programming, Mootools, Scriptaculous and other topics about web design… directly from Woork!

The book contains articles with code sections, images, illustrations and links to the original articles on woork.You can choose to download The Woork Handbook in pdf format or read it online.

CSS Rounded Corners

Would you like to be able to add a rounded corner box to your web page to display news items, sales items or just about anything but dread the thought of trying to create the corners with your graphics program? Never fear, help is close by.

  • RoundedCornr – This generator will allow you to create basic rounded corners, rounded corners with gradients, rounded corners with borders
  • curvyCorners – curvyCorners is a free JavaScript program that will create on-the-fly rounded corners for any HTML DIV element, that look as good as any graphically created corners.
  • CSS Round – Creates a text page with round corner. You can define your own options : Radius value, Round color, Background color, Text color and size of round content you want. After generating the corners, you will get the 4 corners iamges, the html and css code in a ZIP file.
  • Corner Shop – Once you have entered your chosen values, click Create Graphics. The four images, CSS code, and HTML code are generated that you can use to make your own rounded-corner boxes.

If you need a place to select some of the colors to use, check out Colour Lovers or Adobe Kuler. If you have a site where you are using rounded corners, send me the url of your site. I would love to give some real life examples.

Examples: Rounded Corner Boxes

« Newer Posts - Older Posts »