Saul Rosenbaum is a frequent guest speaker at the PACS Web Design SIG. He will in fact join us at the December 15 meeting.
Saul showed us a number of interesting online utilities and resources when we was last with us, and he was good enough to share with me his list of Bookmarklets, Links and Favelets for the Busy Webdeveloper. Some of these he demonstrated at our meeting, and all of them will give you great ideas and save you lots of time and effort.
Thanks, Saul.
The Philadelphia Area Computer Society CSS Workshop started with the basics of cascading style sheets and will continue as long as there is interest and we have something new to learn.
December 09, 2007
November 25, 2007
November 17 Meeting Report:
Good Examples of Table Styling
At the November session of the PACS CSS Workshop, we finished up on the topic of styling tables by working on borders and frames and continued with background images. We tried some samples from a couple of CSS books and concluded by looking at some good examples from different sources.
Here are some additional sites about table styling. Take a look for inspiration, and check the sources to see how the styling is done.
Our next meeting is December 15. See you then.
Here are some additional sites about table styling. Take a look for inspiration, and check the sources to see how the styling is done.
- CSS-Based Tables: Modern Solutions
- CSS Table Gallery
- A CSS styled table | Veerle's blog
- HTML Tables - HTML Code Tutorial
Our next meeting is December 15. See you then.
November 14, 2007
November 17 Meeting Announcement
The next session of the PACS CSS Workshop will be this Saturday, November 17, at 9-10 in room 713.
This month we will finish up the topic of styling tables. There was more to it than I had originally thought, but we will conclude this month by putting the styles all together to improve the appearance and readability of tables.
Our lineup of web-related meetings will be at full strength this month, with Javascript back and Flash scheduled as usual, and we will be doing design at the Web Design SIG. All that and those frosted donuts.
You might note an addition to this website--I turned on comments. I am hoping that the Blogger controls will be sufficient to keep out spam. If you want to comment on anything, now you can.
And remember that if you want to receive notices whenever something is added to the CSS Workshop website, just use either the email system or the RSS feed. Links are in the right sidebar.
This month we will finish up the topic of styling tables. There was more to it than I had originally thought, but we will conclude this month by putting the styles all together to improve the appearance and readability of tables.
Our lineup of web-related meetings will be at full strength this month, with Javascript back and Flash scheduled as usual, and we will be doing design at the Web Design SIG. All that and those frosted donuts.
You might note an addition to this website--I turned on comments. I am hoping that the Blogger controls will be sufficient to keep out spam. If you want to comment on anything, now you can.
And remember that if you want to receive notices whenever something is added to the CSS Workshop website, just use either the email system or the RSS feed. Links are in the right sidebar.
October 27, 2007
Data Tables and Cascading Style Sheets Gallery
I came just across this site called Data Tables and Cascading Style Sheets Gallery, and it fits right in with our recent sessions on styling tables. The site is basically like csszengarden. Chris Heilmann, the owner of the site, posted a table and invited users to submit styles for it. Each example is the same table but with a different style sheet. If you are using Firefox or another browser that lets you turn off styles, you can see the unstyled table.
There are also links to other sites for further information and inspiration on styling tables.
It's a lot of fun and should give us all some good ideas.
There are also links to other sites for further information and inspiration on styling tables.
It's a lot of fun and should give us all some good ideas.
October 22, 2007
October 20 Meeting Report:
More Table Styling
At the October meeting, we continued with styling tables. Our goal for this topic is not just an attractive appearance but also an effective presentation of data. We started with a review of the basics of table HTML and then moved on to some finer points. We then worked on styling the HTML tags.
Much of the styling of tables is the same as any other HTML elements, with things like color, text-align, background, etc. Understanding how a table can be structured with HTML, using the horizontal groups thead, tfoot, and tbody, and the vertical groups col and colgroup, helps to make styling more efficient. There are also specific table styles in CSS: caption-side, border-collapse, and border-spacing. Browser support varies, and border-collapse is probably the most useful of the three.
We also started looking at the HTML border attribute, and we broke it down into its components, frame and rules.
We used this diagram to demonstrate the priorities of elements of a table when it comes to styles: tbl-layers.png.
We will pick up in November with mixing and matching HTML and CSS to make effective table styles that work across browsers. Then we will look at some actual examples of styled tables.
Much of the styling of tables is the same as any other HTML elements, with things like color, text-align, background, etc. Understanding how a table can be structured with HTML, using the horizontal groups thead, tfoot, and tbody, and the vertical groups col and colgroup, helps to make styling more efficient. There are also specific table styles in CSS: caption-side, border-collapse, and border-spacing. Browser support varies, and border-collapse is probably the most useful of the three.
We also started looking at the HTML border attribute, and we broke it down into its components, frame and rules.
We used this diagram to demonstrate the priorities of elements of a table when it comes to styles: tbl-layers.png.
We will pick up in November with mixing and matching HTML and CSS to make effective table styles that work across browsers. Then we will look at some actual examples of styled tables.
October 15, 2007
October 20 Meeting Announcement
The next session of the PACS CSS Workshop will be held this Saturday, October 20. We will start at the usual time, 9 am. But because the Javascript Workshop is off month, we will be splitting that hour with the Flash Workshop. As a result, CSS will go until 10:30. It's a timely opportunity, as I hope to use the extra time to complete the topic of Styling Tables.
We started this subject in June, and in September, we revisited it with a demo of a calendar that one of our members created for his church's website. We also spent some time on display:none, something that I wanted to get in before we went too far into the year. But that left us with a lot of material on tables still to be covered.
So this month, we will use the extra time to do justice to the topic. We will start with a quick review of what we covered previously, and then move on to some more advanced styling methods. I have learned a lot preparing for these sessions, and I think there will be something new for just about everyone.
Be sure to check the PACS website for details on other activities going on this month, including the expanded Flash Workshop and another Web 2.0 topic at the Web Design SIG.
See you Saturday.
We started this subject in June, and in September, we revisited it with a demo of a calendar that one of our members created for his church's website. We also spent some time on display:none, something that I wanted to get in before we went too far into the year. But that left us with a lot of material on tables still to be covered.
So this month, we will use the extra time to do justice to the topic. We will start with a quick review of what we covered previously, and then move on to some more advanced styling methods. I have learned a lot preparing for these sessions, and I think there will be something new for just about everyone.
Be sure to check the PACS website for details on other activities going on this month, including the expanded Flash Workshop and another Web 2.0 topic at the Web Design SIG.
See you Saturday.
September 27, 2007
Excellent CSS Resource - css-discuss
I recently attended a talk by a web developer who is involved with the CSS Discuss list. They have a wiki at css-discuss. The wiki is notable for two reasons. First, it is a very full set of discussions on topics of interest in CSS. Second, from what I have been able to learn, this list has an outstanding membership, and the big guns in CSS are involved here. So the site should be a great resource for everything to do with CSS.
The home page for css-discuss. org is, not surprisingly, http://www.css-discuss.org/.
The home page for css-discuss. org is, not surprisingly, http://www.css-discuss.org/.
September 16, 2007
September 15 Meeting Report:
Headings and Tables
At our September meeting, we followed up on two topics that we had covered in previous meetings.
The main portion of our meeting was spent on techniques for using a graphic to replace a heading. The issue is that you obviously can't have both the heading and the graphic visible, and I had always just given the heading the property display:none to remove it from visibility in a styled page.
What I learned from reading The Art & Science of CSS is that this technique has accessibility issues. As Cameron Adams, the author of the chapter on this subject, told me by email, the reason is that many current text-to-speech readers will ignore elements that have the display:none property. Cameron referred me to this article on screen reader visibility.
We discussed three techniques from his chapter for substituting a graphic for a heading, each with its own pluses and minuses:
We finished with a demo by one of our members of a calendar that he prepared for his church group's website. He adapted the CSS techniques for styling a table that we discussed in June. Those techniques were taken, again, from The Art & Science of CSS.
The main portion of our meeting was spent on techniques for using a graphic to replace a heading. The issue is that you obviously can't have both the heading and the graphic visible, and I had always just given the heading the property display:none to remove it from visibility in a styled page.
What I learned from reading The Art & Science of CSS is that this technique has accessibility issues. As Cameron Adams, the author of the chapter on this subject, told me by email, the reason is that many current text-to-speech readers will ignore elements that have the display:none property. Cameron referred me to this article on screen reader visibility.
We discussed three techniques from his chapter for substituting a graphic for a heading, each with its own pluses and minuses:
- Negative indent the heading with some high number: text-indent: -9999px; .
- Put an empty span within the heading and make the image the background of that span.
- Use a Flash replacement technique, such as described in this article on sIFR.
We finished with a demo by one of our members of a calendar that he prepared for his church group's website. He adapted the CSS techniques for styling a table that we discussed in June. Those techniques were taken, again, from The Art & Science of CSS.
September 12, 2007
September 15 Meeting Announcement
A new season of PACS begins this Saturday, September 15, and the CSS Workshop will be back at its usual time and place, 9 - 10 am in room 713.
Like some popular TV series, we left off last season with a cliff hanger. We were in the middle of talking about styling tables when time ran out. So for this first session, we will briefly review what we covered in June and then move on to finish the topic. Depending on time, we will cover one or two other topics--items of interest that came up over the summer.
We are fortunate that we will again have workshops on Javascript and Flash this year, and the Web Design SIG will start off with a Web 2.0 session. Reed will demo some of the newest ways to present information over the Internet. Don't miss his bagel video!
See you Saturday.
Like some popular TV series, we left off last season with a cliff hanger. We were in the middle of talking about styling tables when time ran out. So for this first session, we will briefly review what we covered in June and then move on to finish the topic. Depending on time, we will cover one or two other topics--items of interest that came up over the summer.
We are fortunate that we will again have workshops on Javascript and Flash this year, and the Web Design SIG will start off with a Web 2.0 session. Reed will demo some of the newest ways to present information over the Internet. Don't miss his bagel video!
See you Saturday.
July 26, 2007
National Association of Government Webmasters
Annual Conference in Valley Forge
Readers of this site might be interested in this upcoming event: The National Association of Government Webmasters (http://www.nagw.org) will hold its fifth annual conference in September in Valley Forge. NAGW is an organization for webmasters of government entities at the county level and below.
About 250 people attended the conference in 2006. It is hoped that attendance this year will be closer to 300. The conference brochure is at http://www.nagw.org/mailing/mailing_2007_001.html.
Local web professionals who work with government clients or who would like to expand into that market might be interested in attending the conference sessions or in becoming a sponsor of the conference. There is a range of available sponsorships, and information is online at http://nagw.org/conference/2007/ under the Sponsors menu tab.
There is also a call for speakers at http://www.nagw.org/conference/2007/speakers.php, and there are still opportunities for presenters who would like to participate. Vendors who want to speak would be required to be sponsors. Even without being identified as a vendor, speaking at this conference would be a valuable public service by helping local governments develop more effective ways to use the internet to serve their constituents.
If anyone has questions, feel free to contact me. I am on the organizing committee of the conference as webmaster of a township in Chester County, PA.
About 250 people attended the conference in 2006. It is hoped that attendance this year will be closer to 300. The conference brochure is at http://www.nagw.org/mailing/mailing_2007_001.html.
Local web professionals who work with government clients or who would like to expand into that market might be interested in attending the conference sessions or in becoming a sponsor of the conference. There is a range of available sponsorships, and information is online at http://nagw.org/conference/2007/ under the Sponsors menu tab.
There is also a call for speakers at http://www.nagw.org/conference/2007/speakers.php, and there are still opportunities for presenters who would like to participate. Vendors who want to speak would be required to be sponsors. Even without being identified as a vendor, speaking at this conference would be a valuable public service by helping local governments develop more effective ways to use the internet to serve their constituents.
If anyone has questions, feel free to contact me. I am on the organizing committee of the conference as webmaster of a township in Chester County, PA.
Subscribe to:
Posts (Atom)