certificate posts

Self-signed certificate for testing

In playing with service workers, I set up a self-signed SSL certificate for my local development environment. I used instructions from debian.org. It was very simple, since I didn’t need the security involved with a real operating site. Creating the certs took a single command:

openssl req -new -x509 -days 365 -nodes -out /path/to/server/config/certs/sitename.pem -keyout /path/to/server/config/certs/sitename.key

You then just need to set things up in the server configuration (Apache in my case). mod_ssl must be installed and enabled, which looks something like:

Continue reading post "Self-signed certificate for testing"

My sites now HTTPS with LetsEncrypt

My sites are now HTTPS-enabled with LetsEncrypt. It was easy to set up with Dreamhost’s panel. It was just a few clicks and some waiting. This is the first time my own sites have been available over HTTPS. I’ve been wanting to do it for a while, but it was kind of costly until the free LetsEncrypt became available. This brings my sites in line with the “HTTPS Everywhere” movement. I’ve also been wanting to play with the new installable apps forming standard for making web apps installable almost like native apps.

I had written a post before about how I’m setting my security-related headers. I’ve now added an HTTPS related header in a similar manner: Upgrade-Insecure-Requests and HSTS.

Continue reading post "My sites now HTTPS with LetsEncrypt"

Lynda: Web Accessibility Principles

I’ve completed another Lynda course, Web Accessibility Principles by Zoe Gillenwater. This course was well put together, had a lot of good information, and should be very usable, though it perhaps had a lot of repetition (to give a feeling of what screen-readers must go through?) and pacing issues. It also, perhaps due to its age (from late 2007), missed some techniques, such as pure CSS drop-down menus.

As I watched it, in addition to taking copious notes, I stopped from time to time to implement some of the practices on my own site(s). For instance, I added a class for content that will benefit screen-readers but not be that useful to or possibly bother regular sighted visitors:

.screenreaderOnly{ position: absolute; margin-left: -9000px; }

I had been using “display:none;”, but evidently screen-readers hide that content as well. I added some screenreaderOnly headers in my navigation and footer since screen-readers provide easy navigation by header. I also created a skipToNav link (my nav is below my content) using the hiding technique above, but also used “:focus” and “:active” (for IE6) to allow keyboard users to access it:

<div id="skipToNav"><a href="#navigation">Jump to navigation</a></div>

and:

#skipToNav{ z-index: 3; position: absolute; top: -20px; left: 60px; }
#skipToNav a{ position: absolute; left: -9000px; }
#skipToNav a:focus, #skipToNav a:active{ position: relative; left: 0; }

I also added a few Firefox Extensions for accessibility purposes. Fangs writes out pages as text similarly to how they’d be read be a screen-reader. I had been using Lynx to see my pages rendered text-only, but hadn’t realized how much other stuff gets read out. Colour Contrast Analyzer and WCAG Contrast Checker both allow checking of page color contrast of individual page elements to make sure visually impaired folk can read text. They do things slightly differently, and both seem to show background-foreground pairings that don’t exist on the page.

I’ve done some other stuff to improve my sites accessibility, but plan to do more when I have free time. I will go through those accessibility checkers and attempt to move as close as I can to being compliant with them. As I start to implement this stuff on my own site, I will be able to more easily implement it on other sites I build as well. This will hopefully be helpful in getting a job as well.


Lynda.com: Building an Online Shopping Cart

I’ve completed another Lynda.com certificate, my first since starting my solo lynda account. This one was titled Building an Online Shopping Cart. I don’t really have experience with eCommerce yet. I worked with the forms and some of the database information at my RPM internship, but the actual processing was already built and out of site, and all I was doing was modifications to something that existed.

The course had a fair amount of good information for doing eCommerce. It did kinda focus on Cartweaver a lot, which is unfortunate considering that I don’t do Coldfusion and don’t really have a desire to. The basic concepts of that could be applied to any shopping cart application though. It also didn’t go into enough detail for me about the specifics of working with gateways/processors or, to a lesser extent, SSL certificate companies. I will definitely have to actually do one to truly understand how to do it and what options there are.

Anyway, I think knowing this could easily help in getting a job or maybe a freelance project. Then I’d get some actual experience which will really help getting more.


Lynda JQuery Certificate

We had the day off for Veteran’s Day, so I’ve had some extra free time.  I spent part of it doing some of the other Lynda tutorials.  I worked on the SEO and JQuery ones.  The SEO one is crazy long and it felt like I was making no progress.  The JQuery one was about double the length of the Worpress one, but I finally finished it.  Yeah!  Here is my certificate for that one (Link no longer working).

I already knew most of the basics of JQuery, but the tutorial filled in many blanks for me.  It went over all of the main parts and functions of JQuery fairly well.

It also introduced me to JQuery UI.  That looks very neat for sure, but the full plugin, with the theme and what not, is something like 312kb.  That’s crazy huge for a web site.  Some (92kb) of that is images which would only load when needed, but the CSS for the theme is 28kb and the script itself is 192kb.  Definitely a good thing that it is so easy to customize what parts you want.  I generally try to keep my entire page loads, or at least the home page, under 100kb.  That is becoming harder and harder as more images and functionality are expected, but it’s good to keep load times fast.

I took some notes on this one, a lot of notes.  It’s really just as a reference for me.  I forget the specifics of this stuff very easily and am always having to look it up, even sometimes for things I do frequently.  I’m somewhat dependent on my notes.  So, if I can figure out how, I will attach them as a text file.  No point in adding them directly to this post, they will make it huge.  But I’ll have to worry about that later:  I have a usability event to go to (Link no longer working).