Category Archives: Coding

Microsoft Narrator and some emoticons

Messing around with Windows Narrator, because I found a more complex emoticon I used in the past (>>-x_x–>, an arrow through a dead face) and that led me down the rabbit hole trying to figure out how to make that more accessible. (Short answer: probably too many “standards,” no real way to make it work.)

I tried Apple’s screen reader on an iMac years ago at work. I don’t remember much about the experience, it was pleasant enough, but then I didn’t test it out on any of my old blog posts hahaha! So I don’t know how Apple deals with emoticons. Unless there’s a screen reader on the iPad that I’d have to dig around to test out.

Anyway, here are a few things I noticed with Narrator:

  • Why is “Windows” pronounced as if it rhymes with endows? Isn’t Narrator made by Microsoft?? Confusing.
  • It’ll read some emoticons/punctuation. But it can be inconsistent:
    • Read ^^;; as “caret caret” first (ignoring the semicolons), then “sweating face.” (Which, no! It’s not…sweating! It’s sweatdrops!)
    • Read >.< as “angry face” once, then didn’t read it the second time.
    • The >>-x_x–> emoticon above was read as “x underscore x.”
    • It read ^^ alone as “happy face.” (It’s…not quite…happy, more like bashful happy? Right?)
    • Read o_O; as “confused face” (probably ignoring the semicolon) but o.O was read as “oh dot oh.”
    • It didn’t read >.< but it does understand >_< as “angry face.”
  • For some reason I couldn’t get Narrator to read anything in Pale Moon other than the title of the Window. Strange. I didn’t want to spend my time diagnosing that or trying to figure out Narrator.

I was disappointed it couldn’t read any text coded with abbr and title or aria-label. I supposed there’s a setting I have to configure, but it’s not on by default. So I guess there’s no making emoticons 100% accessible at this point in time. :/ (Read as “uneasy face.” xD [Read as “x d.”]) But at least it read + correctly, so as someone wrote in 2014 that “1+1=2” was often read as “1 1 2”, things have gotten somewhat better over the years…?

jCarousel Lite and Fancybox

I don’t know if the reason there is no solution to this problem to be found is because it is just that simple or because no one else has run into this problem, but I thought I’d share, for others out there like me who barely understand javascript enough to install it, but not to troubleshoot it.

In April I spent one week working to get my portfolio website up. (Aside: Despite having written it up with php includes in its first incarnation, I decided to do it slightly differently so I had to edit each page to make the changes, mainly putting more of the head stuff in my include file. x.x That’s what I spent a few days doing.)

Over the weekend I decided to bite the bullet and move from Lightbox 2 with a “Coda Slider Effect” script to Fancybox with jCarousel Lite. I was so excited, thinking I’d move from the buggy Coda Slider Effect (Sometimes the slider would choose to slide vertically instead of horizontally, and on one especially annoying page, the slider would decide to wrap one of the three divs around, so going from the second to the third slide showed a diagonal top-right to bottom-left slide.) and the slow, bulky Lightbox 2 design and animation effect that I could never tweak to my liking. jCarousel Lite would, implied by the name, be a lighter javascript file, and with Fancybox running off the jQuery library as well, I could ditch the scriptaculous and prototype files.

I installed jCarousel Lite and Fancybox and set them all up on a Friday. Spent that night and the next morning trying to make them work at all. I don’t know what I did wrong there but I did manage to eventually get them working “out of the box” as promised.

The Problem

The big problem came when I realized in Fancybox when I had the next and previous navigation option turned on that the last image would repeat. I’d get to what I thought was the last image but there was still an arrow pointing to another image, which would just lead to a repeat of the same image. When I first clicked the last image and navigated to the first image, the same problem would occur, but in reverse. (That is, the first image would repeat.)

I combed the Fancybox support area. I tried using search engines to find a solution. jCarouselLite had no support area (not that it needs one, it’s so simple). I tried using a number of different searches, different words (repeat, same image, duplicate image, the list goes on). But no one else seemed to use the two scripts together, or to have the same problem I did.

Then, after letting my brain rest (staying up to four in the morning to fix javascript problems is a bad idea, I know, but it’s like scratching that itch you can’t reach!) I remembered that one function of the Carousel: to wrap around in an endless loop.

The Solution

I don’t know how jCarousel makes it work, and perhaps I could have skipped my javascript headaches weekend by just using jCarousel, but I liked the simplicity of the Lite script.

jCarousel Lite, in order to create that circular loop of images (or whatever content used) needs to make a duplicate of the first div. I just turned off the circular option, since I chose to use the external controls over the left and right navigation arrows.

That one little switch, and oh my gosh everything fell so nicely into place once I turned it off! The three days (or maybe two, if you don’t count the time I spent just trying to make the scripts work in the first place) I spent wracking my brains were over just like that!

Javascript, I don’t understand you, therefore I hate you.

deeper into WordPress

Woot! I feel accomplished! I edited a WordPress plugin tonight. *grin*

Okay, it was mostly the HTML code output that I edited, not really PHP or Javascript (basically code I don’t know), but still. I managed to not screw up my blog while working inside a file with PHP. :3

I also learned what “\n” or “backslash n” means. (New line.) hee. I’m learnin’!

Also, if you didn’t notice, I had a FlickrRSS plugin working in the sidebar before, but decided it’s not the way I want to go about inserting my photos.

Basically I want to upload a photo to Flickr and write a mini-blog entry in the description, then display both on my blog. But the sidebar is waaay too tiny for that (I think it’s too tiny for even the Twitter updates.)

Ideally I’d like the photo updates to show up with my blog entries, but I really don’t know how to go about doing that, so I guess I’ll just make regular WordPress entries linking to the Flickr image. How unspectacular. *snerk* That is, if I actually get around to doing photo updates. (I probably haven’t touched my camera for the past two weeks. How sad…poor camera.)

exactly relative sizes

Down to business. I’m forcing myself to write those reviews. Which doesn’t seem all that logical, because I keep this blog for myself, and why do it if I have to force myself? But oh well. I’ll try to write these in the order they came to mind.

This one’s from last quarter, around January or February. Hah! I learned in my CSS class to use em measurements for font sizes. (Or we could have used percentages. But I went with ems because of that whole GrC student thing I’ve got going.)

I never liked using relative sizing before, because I was used to applying sizes to practially each and every tag and all divs. So everything was shrinking relatively down from whatever size I’d set Body to. Grr, argh.

But in my CSS class I learned that you have to set the default in Body for the em to relate to, and that the default size for one em in all browsers (or just most?) is 16 pixels. Then my teacher taught us that each browser rounds off pixels differently, so to make your design look as similar as possible in different browsers, that we should go four decimal places when figuring em sizes. So to get ten point type, which is the same as 13 pixels (at least on my computers?), you’d have to use 0.8125 ems of the base 1 em, or 16 pixels. That way browsers aren’t randomly rounding up or down to the nearest whole pixel.

That isn’t what I want to talk about though. I always used point sizes because I thought they were relative to a real, absolute measurement: an inch. (A point is 1/72 of an inch.) And it seemed to prove true to me on all the computers I used. 10 point type on my 1024×768, 15″ laptop screen was pretty much the same size as on my 1152×864 17″. It was also a comfortable size on Mac’s 1600×whatever 20″ monitor — not sure if it was the same as my displays though.

But now, now the type on my websites shrink on the more robust monitors! Mac monitors, with their HD display and pixels equating to a fraction of an inch, show my type as barely more than piddly ant scratchings! Incredibly painful for me to read. I don’t know how other people stand it. I always seem to increase the size of type in browsers on bigger monitors. *meep* I’m an old granny at the age of early 20s. (Well okay, I’ve probably got the eyesight of a 90-year-old.)

I guess I should feel satisfied though; at least I know for certain that any and all browsers can increase my type size to the viewer’s liking.

coding discrepancy

It’s funny. These two archive pages are running off the same linked stylesheet, yet they’re displayed differently in IE. Why is that?

[dead links redacted; they went to pMachine’s general archive page and single entry archive page]

I also found another discrepancy between Mozilla and IE. That would be the heading tags. Why the heck does Firefox show these headings in nice small pretty text and IE shows them as freaking huge ugly things??