Month: March 2016

I guess I got ahead of myself when turning in the new version of the Ithaca Weather page.  After doing so, I read some more about HTML5 and realized that instead of using <div> with class names assigned for header, section and footer, I could actually use elements of those types.  So something like:

<div class="section">
<h2>Ithaca Historical Weather</h2>
<p><a href="http://www.usclimatedata.com">U.S. Climate Data</a></p>
</div>

and

.section h2 {
margin: 1em 0 0 0;
}

.section p {
font-size: 1.3em;
margin: 0 0 0.2em 0;
}

becomes

<section>
<h2>Ithaca Historical Weather</h2>
<p><a href="http://www.usclimatedata.com">U.S. Climate Data</a></p>
</section>

and

section h2 {
margin: 1em 0 0 0;
}

section p {
font-size: 1.3em;
margin: 0 0 0.2em 0;
}

I like this a lot better and it seems like the right thing to do, so I’ll be using this as much as possible in future changes.  After reading about the other changes in HTML5 and am looking forward trying to use the canvas and drawing SVG graphics on some new experimental pages.

I also ran the page through web-based lint programs, using Another HTML Lint and CSS Lint to clean up a few things.  I may run lint regularly, but might not have the energy or humility to make all of the petty changes it suggests.

The Ithaca Weather page is the first one I chose to modernize from its antiquated 1990s format.  It is one of the least viewed pages on the site and half the links were broken, so little harm could be done if it went wrong.  After separating all the styling out into its own CSS file, I tweaked a few things.

The image at the top now has rounded corners.  The link to my main page has been moved into a “footer” div that is in a fixed location against the bottom of the screen.  This required lengthening the page content so that none of it is hidden behind the footer when the window is not tall enough. Also, an “About this page” link has been added to the footer that will show all blog posts that include the “Weather” tag.  I hope to use footers like this on all the pages that I update.

I developed the page on Chrome, then tested in on Firefox and Microsoft Edge.  Are developers still obligated to test it on Internet Explorer?  I am not going to try Opera and Safari as their usage is too low.  I looked at it on my Android phone and all was well, though that may just have been lucky due to the narrow content.  I’ll study that problem more when I update some of the other pages.

I would like to come back to this page sometime and make it show something interesting based on calls to a weather API.