Category Archives: Web Development

First foray into Pico CMS

I started playing with Pico CMS this weekend. I converted everything that is on my Concrete5 based site into the Pico site on my development box. I am pretty happy so far with the system.


  • Markdown syntax
  • Including “widgets”

The markdown syntax is not hard, it is just unfamiliar to me. However, I can already see how it simplifies content entry. Once I get up to speed it will be fast and quite fun. Creating links with []() as a syntax is cool.

I also was not aware that tabs in your formatting makes Markdown misbehave. I am quite certain it is a feature, so that if you want to show code in pretty formatting you can just tab on a new line and it will output HTML rather than rendering the HTML. The same is true if you want a list and you press tab and then use an asterix, no list appears just an asterix and your content on the screen.

I have not yet determined the best way to include a “widget” in the markdown syntax. For instance, I have a display of recently read books generated from Good Reads and the HTML/JS/CSS that is generated for that is bulky. I would love to be able to include that chunk of code with something like

<?php include ('goodreads.html'); ?>

That may be possible but I haven’t figured it out yet as the include would be in a .md file not .php. For now, I just pasted the chunk into the page and it works but it does not seem to be maintainable.


  • It is simply awesome to be able to create directories and have that become a path that is responded to by the CMS.
  • The system is so raw it lets me really see the web as a canvas again for playing and experimenting on.

In Drupal, it is very easy to create new paths using path-auto and alias. However, where that page lives is in the database. When it comes time to do a redirect it updates the database. Within the Pico paradigm, you just move the file or directory and the paths are updated. An Apache rewrite rule I am sure would be needed for continuity but there is no admin interface to go into, no menu structure to explain, it is simple. That is refreshing.

The default theme is not responsive but it doesn’t do anything with the content either. It is plopped onto the screen. As Pico is based on Twig I am excited to build a simple Twig and Singularity based theme. The theme will also have some classes built in to support slideshows. It will be a good adventure.


Pico; WordPress alternative?

My website is powered by Concrete5 and WordPress. I develop professionally sites in Drupal. Now, I am considering migrating my blog and site to Pico. It is an interesting landscape, these “flat-file” CMS systems.  There are a few very exciting looking pay-to-play products, Statamic and Kirby. However, Pico is free, uses an MIT license, and is built by the folks at Dev7 who seem to make nice products, and frankly it looks good out of the box as well.

I am a happy vi user so using a product name pico has a bit of an internal dig built into it. There are several other free flat-file systems out there as well. What I find intriguing about Pico is that it uses the twig template system. The twig system is what powers the themes in Drupal 8 so there is a good chance what I learn in Pico will be applicable to my D8 theme modifications and vice-versa.

What all of these systems use for text entry is Markdown. I am slowly beginning to see the convenience of it though HTML isn’t difficult for me, learning Markdown has been a process. Making lists with an * or headings with ## is quite cool. I’ll be able to adapt.

Pico’s code seems to be fairly stable too. The github issue page is fairly active and folks are making pull requests. This is what makes choosing a new system difficult, trying to answer the question of will it be around in the future? One way to make sure it sticks around is to take the plunge and give it a try.

Deliberating still…


Pastry waiting to be put into a box.

Shout out to The Pastry Box Project

For those of us who work with digital goods every day it can be hard to find meaning in the work we do. It is certainly something I struggle with. I stumbled upon The Pastry Box Project during the summer last year.

The site in their own words is thus,

“Each year, The Pastry Box Project gathers 30 people who are each influential in their field and asks them to share thoughts regarding what they do. Those thoughts are then published every day throughout the year at a rate of one per day, starting January 1st and ending December 31st.”

I don’t read it every day but when I do I generally can’t stop. There may be a focus of some sorts but it generally seems random. I would call it a Chicken Soup for the Web Makers Soul. Most of the posts resonate and give unique perspectives to what we do. If you are looking for motivation or at times commiseration, I recommend you browse through some of the posts.

They also have some really interesting ways to consume the content. I normally use Feedly and just read them as RSS items. However, you can customize the site by just checking a few boxes, or even read it in your terminal with a node package, letting you sort by author, etc…

Just by visiting the site you are sure to walk away with a new nugget of knowledge.

Aural interfaces for the masses: What would it look like?

Recently I have been using my Siri like voice command capabilities on my phone. I have an Android based device and I have no idea what it is called but it does the same thing. If I ask, “Where is the nearest restaurant,” it fires up Google Maps and shows me without me having to type that into Google Maps. I know other apps can be context aware but I am curious about how an aural interface would work if you didn’t need to pull up a screen reader, it would just be always on.

When you have a full desktop browser and a mouse this still wouldn’t serve much purpose but if you are on a device without a mouse and you could just say “follow, link title” the browser would find the link titled as such and go there. Another example would be when you are on the page reading text you could say, “scroll down one page,” and the screen would scroll automatically for you. Dragon Naturally Speaking apparently can accommodate much of this.

CSS 3 already has a speech spec that is recommended. That spec is really geared towards implementing an enhanced experience for screen readers but I suspect that if you improve the markup for screen readers it would open up a doorway for use without screen readers as well. This is the classic progressive enhancement win that has been exemplified with each iteration of HTML, CSS, and JS.

Pairing this with future enhancements in eye tracking technology one day we might be able to look at the page and then dictate what we want to do. I think that would be very liberating as a user that is on a computer for 8+ hours a day. Beyond the CSS 3 spec, pages are now often built with ARIA regions that make it very straight-forward to make very robust identification/function for each HTML element.

If anyone is aware of a JS library, technology or stack that accommodates any of the above please let me know. It would be lots of fun to experiment further with this idea.