web posts page 8

Konami easter egg

in

What web developer’s site is complete without an easter egg? Until today, mine didn’t have one, but I had long wanted something. Since I was struggling to make forward progress on what I had actually wanted to work on this weekend, and had just been reminded of the Konami Code, I decided it was finally time to add one. I had seen a friend do a key sequence easter egg on a site he built a while back, which had put the idea in my head. The Konami Code sequence has been used on several websites already (Digg and Vogue are two examples I could get to work), so why not mine?

A simple Konami Code script:

Continue reading post "Konami easter egg"

Symfony AppCache and ‘X-Reverse-Proxy-TTL’, a hack

in

Symfony’s HttpCache reverse proxy is a simple way to get caching of pages with Symfony. It is simple to set up, easy to work with, and easy to clear. I started using it recently on my own site.

A simple app/console cache:clear will clear the entire cache. Otherwise, following the HTTP-oriented spirit of the framework, invalidation is based entirely on HTTP headers. In this way, it works the same as proxy / gateway caches. It only caches responses with public Cache-Control headers. It is age based, using the Cache-Control s-maxage or maxage values or Expires headers (following that order of precedence). It then considers the cached items fresh until they are stored for longer than those headers specify they can be stored. The cached version is served, bypassing the router / controller, as long as the cache is fresh.

This is all nice, but using long max-ages for those headers means that caches outside of my control can cache pages for long periods of time. cache:clear won’t help when a page changes. One possible option would be to have shorter and safer max-ages as Cache-Control headers and use something else for HTTPCache.

Continue reading post "Symfony AppCache and ‘X-Reverse-Proxy-TTL’, a hack"

404 with autofilling form

in

Inspired by a tweet by @simevidas about a 404 page search form, I decided to finally replace Symfony’s default 404 page on my site. The tweet was about an example site’s 404 pages that take pieces from the URL path to populate a search field. Upon seeing it, I immediately thought how easy it would be to implement a simple version of that.

I had been thinking of customizing my 404 for a while, but stopped trying because Twig doesn’t seem to know about bundle paths in the error pages, preventing me from extending the “base” template in my bundle. I still didn’t find a solution for this, so the 404 page has an unstyled look, but I wanted to capture the search form idea while it was on my mind.

Looking into 404 best practices, I found three things that I wanted on mine: branding, guidance / next steps for the user, and small size / low power.

Continue reading post "404 with autofilling form"

Websites in Multiple File Formats

in

Since I saw Symfony’s _format routing parameter, which is used to effectively set the file type of the response, I’ve thought it would be cool to have every page on a website support more than just ‘html’ response types by adding a .{_format} to the end of the URL and make a template version for each. Users would be able to consume the same information in different formats depending on their needs. ‘txt’, for example, would basically have just the content that would go in the “ element, in pure text format, providing a fallback or simplified view that can be read even by curl users. ‘json’ or ‘xml’ formats might provide the content and meta data about it in a machine consumable format. You could even go all out with an ‘mp3’ format where you read the page content.

Yesterday, I took my first step toward this idea on my site by implementing my homepage in the ‘txt’ format. This was very simple since my content is already being composed in markdown, a visually pleasing structure for text content.

Obviously, adding more pages and formats will add development time. This probably wouldn’t be useful enough to be worth it for a normal site, but for my own site, I get to play with whatever cool ideas I want.

Symfony AppCache: built in reverse HTTP proxy

in

I finally set up my site to work with Symfony’s built in HTTP reverse proxy. Took a little bit of time since I had to fix a couple minor bugs in how things are set up with my symfony-initial and Symfony Standard Edition Bundle and then made a mistake in testing whether or not it was working that made me think it wasn’t when it was.

One useful way to test if it’s working is to set the ‘debug’ option of AppCache to true (turn this back off for production). This will set an X-Symfony-Cache header that will provide info on the cache behaviour. You can see these headers on the shell by running curl -I your.url. If it says ‘fresh’ as part of the header value, that means it was served from the cache. If it shows the header at all, that means AppCache is being used.

For the cache to work, the response must be public and have something set to control how the cache becomes stale. See Symfony’s docs on caching for more details. Since my content rarely changes at the moment, I went with the Cache-Control header with max-age. A cool thing about using Symfony’s reverse proxy is that the entire cache will be cleared when clearing Symfony’s cache like normal. This means that if you make a mistake and must remove it from the cache, there is a quick and easy way.

Givecamp 2014: Lake Erie Ink

in

Lake Erie Ink mobile home page
Slightly over a week ago, I finished my fourth Cleveland GiveCamp. GiveCamp is a weekend of developing websites and other things for area nonprofits. As usual, it was a good time. My project this year was an update to Lake Erie Ink’s site. They had actually had their site built at the GiveCamp two years prior (I was not on that project, but know someone who was). They just wanted a map added to their site that showed where kids were writing or writing about. With six developers and a developing project manager, along with a WordPress plugin, we were able to get the basic functionality working rather quickly. So quickly that we had something working Friday night and started shedding developers to other projects. By Sunday it was basically down to just me and the project manager (plus the Lake Erie Ink people, of course). We added in some extra improvements in addition to the map. We brought in a couple of designers for brief stints to help us with some design issues.

For my part, I did help some with the map, but spent most of my time making their site responsive and tweaking the home page to include a callout for the map page. The site had not been designed with responsiveness in mind at all. It had nested divs with fixed pixel widths that accommodated padding of the parents’ even when width: 100% would’ve done the same thing. In addition, id’s were used a lot, even multiple times per page, there was a lot of unnecessary redundancy and extra CSS in the styles (such as repeated blocks and things like margin: 0px 0px 0px 0px), and extra heading elements were made up to provide extra heading styles (h7, h8, and h9). The templates were confusing at times and some had different versions or nearly identical related templates.

Continue reading post "Givecamp 2014: Lake Erie Ink"

The Happs

in

For a while now I’ve been trying to write posts that draw people, such as solutions to specific problems or things that might be called articles. I think I’ve focused on these types of writings because parts of me want to be bring myself more prominently into the larger web community, help others, get some praise or critique for my work, and perhaps get offered a high paying job from some bigger web firm. I think I got a bit heady when I started getting above 50 visitors a day, peaking at 98. But that flow has dried up and I’m back down to less than 20.

I do like writing those types of posts sometimes, and I’m not going to stop, but I think I’m going to write a lot more smaller and less focused posts that are more generally about anything on my mind. I think I shall call the posts “The Happs” so I don’t have to think of a title and to emphasize their lack of a specific topic. The article type posts really take a long time and some research to compose, and I don’t have a lot of free time for them. It is often so long between when I do whatever is the impetus for them and when I write them that I’ve forgotten a lot of the details. I think “The Happs” will get me writing more often and allow me to put out snippets of what might later go into more thorough articles.

So, what has been happening with me lately?

Continue reading post "The Happs"

Cogneato: Long Term?

in

Well, it seems like my job at Cogneato is likely to end up long term. Cogneato seems to be doing rather well this year, so Ron the owner thinks he will be able to keep me on long term. He is setting me up as the front end developer, as he finds me to be fast at the task. I take designs he’s done in Fireworks, slice them up, and convert them into HTML and CSS. I’ve done quite a few now, plus a few other things such as some set up on the CMS that will drive a couple of the sites.

I get to do the sites in modern HTML and CSS. I’ve only used a few tables for layout purposes (stuff I couldn’t figure out how to do cross browser without them), get to use PNG’s for transparency, and have been using the HTML 5 doctype. So far, every site has been at least somewhat different than the others, and most of them have required me to figure out something new. Some of the designs are fairly fancy. I find myself using a lot of extra divs/spans for appearance purposes only. It has been quite enjoyable. I test sites in Safari and Firefox (the newest versions) plus IE 6, 7, and 8. IE always gives me troubles. For IE 6 I am able to give them a simpler styled site, I just have to make sure it works, so I usually hide PNG’s and some other hard to deal-with elements. IE 7 usually isn’t too bad, and IE 8 usually works or mostly works with no special effort.

One site gave me a lot of trouble: DG Bar Ranch. It had a lot of the difficult things going on at once: drop shadows, gradients, boxes with variable height and width, a changeable part of the background image, z-index issues, all sorts of things. I took longer on that site than probably most of the others combined. The drop down menu’s caused me a fair amount of difficulty. I also had issues making the body background, composed of three separate repeating images, repeat properly while staying where they were supposed to. I couldn’t get the “position: absolute” to expand to the width of the body in all instances, but rather the width of the viewport, so I used “position: fixed” for one of them. I then, for IE 7, had to create two special divs to allow a background gradient fixed to the bottom to slide over a background image. The site isn’t up yet, but I can link to it when it’s up.

Anyway, I like the job and am glad it seems I will be staying on long term. I will try to post on some of the techniques I’ve learned along the way.

Cogneato: A New Job

in

Yay! I finally found a job. After six months of no income, I needed it. I’m doing front-end development for Cogneato, a small web development firm in Akron. They’ve done quite a few sites over the past decade, and have their own CMS/CRM they’ve built over that period. It’s pretty neat, allowing for some complicated things to be done with data and interesting features for managing customer information. It has many fancy AJAX features in the administrator interface. There have been seven people working there, and another one is coming soon. I only get to work on the front-end though.

Cogneato is only a 20 or so minute drive from my house. The atmosphere is very casual (hoodies instead of ties) and relaxed, very comfortable to work at. The owner and all the employees have been very nice.

Continue reading post "Cogneato: A New Job"