We started this month's meeting with a brief look at Internet Explorer 10, including some points raised by a review at Sitepoint.
Next, we finished viewing the video of Jeremy Keith's lecture on responsive design and progressive enhancement. We looked at an example of progressive enhancement with text layout. CSS multi-columns are not supported in older browsers, but that might not matter if the text is still readable. Users viewing with newer browsers will simply have an enhanced experience.
We then started working on responsive design by looking specifically at styling tables. It is an interesting topic because of the challenge of getting data into a format that fits on a small screen. We looked at a comparison between responsive and non-responsive tables at CSS-Tricks, but we noticed an anomaly in the responsive table. We will delve into that and more next month.
December 15, 2012
December 12, 2012
December 2012 Meeting Announcement -- Responsive Styling
The next meeting of the PACS CSS Workshop will be Saturday, December 15, at our usual 9-10 hour. The topic this month will be "Responsive Styling."
We spent most of the meeting in November watching and commenting on a video by Jeremy Keith of Clearleft, who spoke about responsive web design. We will finish the video this month with Jeremy's commentary on progressive enhancement. We will then move on to examples of particular problems with responsive design and how to use CSS to solve them.
It will be instructive and fun at the same time.
We spent most of the meeting in November watching and commenting on a video by Jeremy Keith of Clearleft, who spoke about responsive web design. We will finish the video this month with Jeremy's commentary on progressive enhancement. We will then move on to examples of particular problems with responsive design and how to use CSS to solve them.
It will be instructive and fun at the same time.
November 18, 2012
November 2012 Meeting Report
Our November meeting was devoted to responsive design and its cousin, progressive enhancement.
The meeting was organized around a video of a talk given by designer Jeremy Keith of Clearleft. Jeremy emphasized that the idea of "a website" is much more than how a site looks in a browser. It is broader than just that visualization. Further, the idea of controlling exactly how a site appears in a browser is a fiction. We do not know what user agent the reader is actually using and what technology the user has available, such as javascript or broadband. (We noted that AOL still has 3 million subscribers to its dial-up service.)
On the other hand, HTML is built to be responsive. So mobile, as well as any other form of serving information first, starts with good HTML.
A couple of references from the video:
The meeting was organized around a video of a talk given by designer Jeremy Keith of Clearleft. Jeremy emphasized that the idea of "a website" is much more than how a site looks in a browser. It is broader than just that visualization. Further, the idea of controlling exactly how a site appears in a browser is a fiction. We do not know what user agent the reader is actually using and what technology the user has available, such as javascript or broadband. (We noted that AOL still has 3 million subscribers to its dial-up service.)
On the other hand, HTML is built to be responsive. So mobile, as well as any other form of serving information first, starts with good HTML.
A couple of references from the video:
- http://dowebsitesneedtolookexactlythesameineverybrowser.com/ (Check this site in different browsers and note the slight differences, none of which matters to the actual content delivered.)
- A Dao of Web Design
November 09, 2012
November 2012 Meeting Announcement -- CSS and Responsive Web Design
Responsive web design is probably the hottest topic now in the world of web development. It will only get hotter given the increasing number of different sized screens that people will be using to view your sites. Reed Gustow started us on this topic at our Web Design SIG, and this month, we will follow up with a video and some commentary on how to implement responsive design and why.
You will come away with a different vision of how to organize your next project.
You will come away with a different vision of how to organize your next project.
October 20, 2012
October 2012 Meeting Report
We covered a number of topics at the October meeting, and below are notes and links to sites that we referenced.
- Windows 8 apps
Following up on last month's session, we looked at a 2-part article at Sitepoint on Building a Windows 8 App with HTML5: How to create a small RSS reader:
Part 1
Part 2 - HTML5 structural tags
Following up on our sessions last year, we looked at an alternative view on whether it is advisable to use the new HTML5 structural tags. The article is The truth about structuring an HTML5 page. It is an excerpt from a book entitled The Truth About HTML5. The book can be ordered, and a sample chapter can be downloaded, at the book's website. - Parallax design
That website lead us into a discussion of the parallax style of web design. The website above is an example, and more examples are available at 18 Beautiful Examples of Parallax Scrolling in Web Design. - Multiple columns
We finished up by looking at the CSS Multi-column Layout Module. This set of rules is new to CSS3, and it allows a section of a page to be laid out in columns. We compared the previous ways we did this layout, first with tables and then with floated div's. This new module is not supported by all browsers yet. For a review of the rules, take a look at CSS3 Series: Multiple Columns.
October 14, 2012
October 2012 Meeting Announcement -- CSS3 - New Solutions to Old Problems
The next meeting of the PACS CSS Workshop will be Saturday, October 20, at our usual 9-10 hour. The topic this month will be CSS3 - New Solutions to Old Problems.
We will start with a quick follow up to last month's meeting with an article on building Windows 8 apps. We will look at an alternative opinion on the new HTML5 structural tags that we covered last season. Then we will see how to put multiple background images on an element, something that was not possible before CSS3. Finally, we will look at one of my favorite new tricks with CSS3.
If we have time, I also want to look at a new way to organize your style sheets.
Plus, we may have a special guest appearance via Skype to start the meeting.
We will start with a quick follow up to last month's meeting with an article on building Windows 8 apps. We will look at an alternative opinion on the new HTML5 structural tags that we covered last season. Then we will see how to put multiple background images on an element, something that was not possible before CSS3. Finally, we will look at one of my favorite new tricks with CSS3.
If we have time, I also want to look at a new way to organize your style sheets.
Plus, we may have a special guest appearance via Skype to start the meeting.
September 23, 2012
September 2012 Meeting Report
Rob Keiser of the PACS Windows SIG was our guest presenter this month. Rob demonstrated how to create apps for the new Windows 8 app store. The foundation for these apps is a combination of HTML5, CSS, and javascript.
Rob's slide deck with links to resources developing apps has been uploaded to the Resources section of this site.
Rob's slide deck with links to resources developing apps has been uploaded to the Resources section of this site.
August 27, 2012
September 2012 Announcement -- Building HTML 5 Apps for the Windows 8 Modern UI
For the September meeting, we will have a special presentation by guest presenter Rob Keiser. Rob is the leader of the PACS Windows SIG. He will give us a brief session on creating apps for the new Modern UI in Windows 8 using HTML 5, CSS 3, and JavaScript. Rob will show us how easy it is to build apps and potentially make some cash using the languages you already know. This presentation will be an interesting and valuable follow up to our sessions last season on HTML 5.
June 17, 2012
June 2012 Meeting Report
At our June meeting, we concluded our examination of HTML5 with some final thoughts and some suggestions for implementing this new standard. I have posted an outline of the new, simpler syntax for webpages in the Samples section of this site.
We discussed that some of the old syntax requirements are now optional, but in the case particularly of the script designation, continuing to include a type might be advisable. While JavaScript is generally the default language used for web scripting, it is not the only one out there. Some others include JScript from Microsoft and the proposed Dart language from Google (about which not everyone is happy, as indicated in this article from Ars Technica.)
We closed by noting that with the looser syntax rules of HTML5, it is incumbent on editors of websites to establish standards to maintain reliable and consistent code. One such set of rules is laid out in this article.
To finish up the year with a nice review of HTML5, check this webcast from O'Reilly. It runs about an hour and covers many of the topics that we worked on this year.
We discussed that some of the old syntax requirements are now optional, but in the case particularly of the script designation, continuing to include a type might be advisable. While JavaScript is generally the default language used for web scripting, it is not the only one out there. Some others include JScript from Microsoft and the proposed Dart language from Google (about which not everyone is happy, as indicated in this article from Ars Technica.)
We closed by noting that with the looser syntax rules of HTML5, it is incumbent on editors of websites to establish standards to maintain reliable and consistent code. One such set of rules is laid out in this article.
To finish up the year with a nice review of HTML5, check this webcast from O'Reilly. It runs about an hour and covers many of the topics that we worked on this year.
June 11, 2012
June 2012 Meeting Announcement -- HTML5 - The Big Wrap-Up
We have spent several meetings looking at HTML5, what it delivers, and what issues it presents. This month we will put it all together to answer questions like what do I use now, and why, and how? We will have those answers, or at least some suggested guidelines, to get us moving forward with this new technology.
If you still have problems with your website after that meeting, be sure to attend the Web Design SIG session Saturday afternoon. The hour will be devoted to real-time problem solving on members' sites. Bring your issues (web-design only, please) to see if we can crowd-source an answer for you.
If you still have problems with your website after that meeting, be sure to attend the Web Design SIG session Saturday afternoon. The hour will be devoted to real-time problem solving on members' sites. Bring your issues (web-design only, please) to see if we can crowd-source an answer for you.
May 26, 2012
May 2012 Meeting Report
At our May meeting, we began by listing the issues about using HTML5 that we are going to discuss for the remainder of this season.
We then took a side trip to look at XML and consider if bringing that technology to websites was the goal of the W3C, as suggested by one commentator. We looked at some examples of using XML to handle information that is accessed through a browser:
We then took a side trip to look at XML and consider if bringing that technology to websites was the goal of the W3C, as suggested by one commentator. We looked at some examples of using XML to handle information that is accessed through a browser:
- ListGarden - a utility for converting HTML to XML for an RSS feed or for other platforms.
- Google Earth - Google's mapping program in which locations are plotted using KML, an XML-based language. A list of coordinates can be converted to that format using a free utility like csv2kml.
- GetSimple CMS - a content management system that uses an XML database instead of MySQL.
May 16, 2012
May 2012 Meeting Announcement -- "X" - What the Web Might Have Been
Last month we briefly discussed XHTML and where the W3C was going with web standards before HTML5 came along. We started down a side track to look at XML and to consider where the web might have headed if development of the XHTML standard had continued.
This month, we will work a little more on XML with some examples of how it is used on the web today. We will then tie everything together to see where XHTML5 stands presently.
All of this will lead us to the conclusion we are working toward -- what do I use now and why? We will have that answer by the time we break for the summer.
This month, we will work a little more on XML with some examples of how it is used on the web today. We will then tie everything together to see where XHTML5 stands presently.
All of this will lead us to the conclusion we are working toward -- what do I use now and why? We will have that answer by the time we break for the summer.
April 22, 2012
April 2012 Meeting Report
At our April meeting, we finished up from last month comparing how pages validate under different document type declarations. Using both a simple page and one with advanced HTML5 technologies, we saw that while Firefox rendered the pages the same with any doctype, the validation results were completely different.
For more on document types, check the Wikipedia article on the subject.
We then considered the fact that development of XHTML2 has been discontinued. XHTML has some strict requirements for validation, as outlined at this site, and at a future meeting, we will consider the advantages of that strict markup and whether the looser markup rules of HTML5 might be something to be cautious about.
We finished up by looking at XML to get an idea of where the web might have been going before HTML5. We will have some more to say on that topic in May before we move on to considering best practices for going forward with HTML5.
For more on document types, check the Wikipedia article on the subject.
We then considered the fact that development of XHTML2 has been discontinued. XHTML has some strict requirements for validation, as outlined at this site, and at a future meeting, we will consider the advantages of that strict markup and whether the looser markup rules of HTML5 might be something to be cautious about.
We finished up by looking at XML to get an idea of where the web might have been going before HTML5. We will have some more to say on that topic in May before we move on to considering best practices for going forward with HTML5.
April 18, 2012
April 2012 Meeting Announcement -- HTML5 and XML
Last month we played with different variations of document types applied to a sample webpage and then looked at how the differences played out in a browser (none apparent) and a validator (various errors). This month we will finish up with a couple more examples to see why the simple doctype of HTML5 works reliably.
We will then take a side track to look at XML and consider where the web might have been going with XHTML, and maybe where you want to go with XHTML5 -- yes, there is such a thing.
We will then take a side track to look at XML and consider where the web might have been going with XHTML, and maybe where you want to go with XHTML5 -- yes, there is such a thing.
March 18, 2012
March 2012 Meeting Report
At our March meeting, we started by comparing the document type declaration in a typical HTML4 webpage with the doctype now used in HTML5: <!doctype html >.
To understand why we can use that doctype now, we worked on seeing what the doctype actually does and how it relates to validation and to the appearance of a webpage. We used a sample HTML file, swapped out doctypes, added and deleted errors, and then validated the file using different doctypes. The result was that the browser (Firefox) displayed the page the same way with each version, while the validator showed different errors each time.
Next month,we will have a couple of final points on this topic before moving on.
The validator we used is at the W3C website.
For more on doctypes, see this somewhat dated article at the W3C site.
To understand why we can use that doctype now, we worked on seeing what the doctype actually does and how it relates to validation and to the appearance of a webpage. We used a sample HTML file, swapped out doctypes, added and deleted errors, and then validated the file using different doctypes. The result was that the browser (Firefox) displayed the page the same way with each version, while the validator showed different errors each time.
Next month,we will have a couple of final points on this topic before moving on.
The validator we used is at the W3C website.
For more on doctypes, see this somewhat dated article at the W3C site.
March 13, 2012
March 2012 Meeting Announcement -- HTML5 - The Disappearing DOCTYPE
We have been working with HTML5 this season. We have talked about some of the new tags in HTML5, and how to use them, and how to make them work.
Another aspect of HTML5, though, is the simplification of some aspects of website development. In the next couple of meetings, we will look at these changes, and we will start this month with the always exciting subject of the document type.
When we are done, you might never have to think about the topic again.
Another aspect of HTML5, though, is the simplification of some aspects of website development. In the next couple of meetings, we will look at these changes, and we will start this month with the always exciting subject of the document type.
When we are done, you might never have to think about the topic again.
February 26, 2012
February 2012 Meeting Report
We resumed meeting in February, after a snowed-out January meeting.
First, we checked a NY Times experimental implementation of HTML5 for creating an interactive crossword puzzle.
After a review of the stylesheet and script that we use to enable reliable use of HTML5, we looked at the source of a couple of sites that use these techniques -- a WordPress site that uses the Twenty Ten theme, and our workshop blog on Google.
We also touched briefly on the script called Modernizr, which is an HTML5 shiv and more. We will get into that subject when we work with CSS3.
We concluded by pointing out that development of XHTML2 was cancelled by the W3C. We will have more to say about that next month.
First, we checked a NY Times experimental implementation of HTML5 for creating an interactive crossword puzzle.
After a review of the stylesheet and script that we use to enable reliable use of HTML5, we looked at the source of a couple of sites that use these techniques -- a WordPress site that uses the Twenty Ten theme, and our workshop blog on Google.
We also touched briefly on the script called Modernizr, which is an HTML5 shiv and more. We will get into that subject when we work with CSS3.
We concluded by pointing out that development of XHTML2 was cancelled by the W3C. We will have more to say about that next month.
February 11, 2012
February 2012 Meeting Announcement -- HTML5 - What Happened to the "X"?
In December, before the snow hit, we looked at browser behavior to see how the new HTML5
structural tags can be made to work in legacy browsers. This month, we
will work on more aspects of this new standard and see how it will make
the job of a web developer simpler. In the process, we will consider
whatever happened to XHTML.
January 20, 2012
January meeting cancelled
The PACS meeting scheduled for January 21, 2012, is cancelled due to the severe weather forecast.
January 16, 2012
January 2012 Meeting Announcement -- HTML5 - What Happened to the "X"?
Last month, we looked at browser behavior to see how the new HTML5 structural tags can be made to work in legacy browsers. This month, we will work on more aspects of this new standard and see how it will make the job of a web developer simpler. In the process, we will consider whatever happened to XHTML.
Subscribe to:
Posts (Atom)