Creating and sharing

For the last five years I have taken quite a few photos. Most of which I’m pretty happy with and some that I questioned why I even took them.

More and more I’ve had this little itch and I just can’t seem to take it anymore. I finally decided that I’m going to edit as many of those photos and share them with the world. Free of charge.

Wait, what?

Yeah. You read that right. I’m going to release all my photos completely and utterly free. You can attribute me if you want, or don’t; entirely up to you.

Bare in mind that this will be an ongoing process because I will be adding when I get some downtime. I mean, come on, I am only one person. I can only do so much on a given day.

When?

The rest of this year I will keep adding more and more photos. They will be saved with a maximum height and, or, width dimension of 4,000 pixels. They will be of a 4 to 3 format and if asked I can try and send a better quality photo, but keep in mind that will take a little more time. So, don’t expect instantaneous results.

Why?

Why not? Quite honestly what it came down to was I have wanted to share something other that the things I have learned over the years. In the mean time I have, somewhat, set up a semi-download area that is a work in progress. If you want to feel free to help yourself out with a few of the images I have made downloadable.

Working with mobile first mentality

This has been the biggest issue for some time now. How I want to execute it. All one stylesheet or separate ones and have the server load it depending on what it is given. Each one has its own drawbacks and perks to it. Reading about mobile design these last three days has slowly opened my eyes into what the next few years will be like when it comes to web design.

Years ago when the iPhone first made its début to the world the only thing I was thinking about was how everybody would interact and view things.

My first mobile experience was with a Sony Ericsson phone. Boy was that a mistake on my part. The way everything was laid out made it almost unbearable to really try to do anything. Navigation was decent but still took forever to get to the link I wanted to ‘click’ and go to. Using the buttons to pseudo scroll up, down and sideways was not easy. Make one mistake and often times I would have to start over. Sites took longer than I wanted to load but there really wasn’t an option to use a wifi connection with the phone.

Thinking back on those experiences with how mobile phones rendered pages it has given me some ideas on how I like seeing navigation and how to implement it. Navigation is the key when it comes to any site. Being able to know what to look for without having to look makes for a great web experience. What I mean by that is that the end-user should not have to look around the entire site’s page to find why they were looking for. A perfect example of this is just about any shopping site. The search form is one of the first things that has some emphasis to it without us really knowing.

A good study I would love to see is how many people visit a shop site and don’t use the search form. Mind you this is for fairly newcomers that I’m thinking of instead of repeat customers. Maybe one day.

Trying to view a site on a really small screen made me wonder how things would change in the future. Yeah, I like to sometimes think like that. With touch screens becoming more and more popular the next stage is of course is being able to cater to that little market. True, that demographic is small at the moment but in the next few years it will only see an increase.

Mobile first design was first coined a few years ago but has recently been what I feel is the newest standard for most sites. One of the things I have come to hate about it is scale.

Let me elaborate on what I mean. I am one of those people who likes to view a site with the browser expanded to take up the entire screen. I’m pretty sure I’m not the only one. One of the methods I have seen when it comes to creating a responsive site is creating break points. Usually what that means is that when a person resizes the browser the site adjusts to that new size. I don’t like it. Yeah it does have its advantages but it also has some drawbacks that I, personally, don’t like.

The biggest one really being the loss of certain elements. In Windows 7 you have the ability to set a program to take up half the screen and another to use the other if you want. I like doing this when I am comparing cameras, computer parts or just about anything I’m shopping for. I, like most people, love a really good deal so what better way than comparing two sites at the same time? Well, when the window gets fitted to the new size the responsive aspect takes over. Often times it doesn’t effect it much since some of the sites I browse often have a min-width of about 700 pixels and my monitor is wide enough to handle it. Sorry, geek speak.

One thing I found really interesting is that most new smartphones don’t listen to the

handheld

property when using a media query. A little strange since most mobile devices are handheld devices.

Options and decisions. One file or several. I still can’t decide. I may just have to use several ones while using server requests to help. It would be pointless to use AJAX since the page loads once on any device and people don’t resize their browser window and can’t do it on any mobile device unless they change the orientation but that has no adverse effect and shouldn’t. Shouldn’t be too hard.

Mobile web design: here I come!

HTML validation issues

If it’s one thing I hate it’s loading up a site, click on something and then the layout gets all wonky on me. For the last two years I have read and learned about HTML and CSS validation. The one thing I have learned is that there are people out there that don’t care for it.

What I have learned from reading tutorials, forums and glanced from other (what I consider professionals) developers is that validation is key. I, too, agree that it should be good practice. Better yet: natural. The one issue I have run into as of lately is that WordPress will output an empty element and you get an error in validation. The other thing I noticed is that often times an image doesn’t always get a “alt” attribute. Yes, this can be remedied by making one in the media editing section but what happens when a user doesn’t put one in?

I think that by default WordPress should at least create a sort of container or filler for those rare scenarios. A good example is the gallery shortcode and the captions it creates; or rather it doesn’t. When there is no caption for the image it will still output that element but will be empty. Bad. Rather than creating an empty element just don’t output it. Again: bad.

So, rather than nothing do something. It’s what I kind of did with a quick solution.

$caption = wptexturize( $image->post_excerpt );
 if ( !empty($caption) ) {
 $output .= "tt< {$captiontag} class='wp-caption-text gallery-caption'>" . $caption . "n";
 } else {
 $caption = "No caption entered";
 $output .= "tt< {$captiontag} class='no-caption'>" . $caption . "n";
 }

It works for my needs and what is really nice is that if I forget to put a caption on an image for my gallery posts it will say: No caption entered.

Now I just have to work on REGEX to remove unwanted attributes. The journey continues! 🙂

One more week

Earlier today when I got home from work I did my usual routine of updating to the most current development version of WordPress, made sure all other applications were up to date and opened up my code editor (Notepad++) to view and edit my theme files. Since I was wide awake I tried my hand at experimenting with Git and TortoiseGit on my main computer. One thing leads to another and I managed to delete my theme. I hadn’t made the last commit of adding my modified gallery shortcode.

Needless to say I am kicking myself pretty hard. What this means now is that I am starting over with a new repo but still with SVN and not Git. Git will be for my next project theme. The reason I am starting over is because I deleted the working copy and didn’t realize that I hadn’t added all the files and hadn’t made all the commits I needed to be in sync.

In about one week WordPress 3.5 will be launching and I am pretty stoked about it. The reason is because the way media is uploaded has improved. I feel this is a huge step in the right direction for WordPress development and adoption. People want to be able to share not only their stories but some want to share photos, videos and sometimes audio. The uploader is fairly easy to use and the user interface is elegantly designed.

But enough drooling about what is to come more about what I was trying to get across: patience. I have plenty of it and sometimes I feel I have too much of it. In one week I will make an attempt to rebuild all the code I lost and have it all finished by the time 3.5 launches. This should be manageable since I know what files I need this time after having tested file hierarchy with my previously deleted theme.

Today I created all the empty files and committed that to the repository so I can code away and make the final commits when I am satisfied with the code; that way I won’t have so many commits and a lot versions to go through down the line if I ever have to see why I did what I did.

Me, WordPress and Template tags

Recently I have been working more diligently on putting some finishing touches on my personal blog’s theme. Working on a local machine is so much easier now that I understand how it works. I remember when I started out with PHP it was painful.

I got frustrated because I didn’t know where the files had to go at first, the changes I had made to the configuration weren’t taking effect and random little things that almost discouraged me from continuing.

The other day I was reading on the WordPress forums seeing if there was somebody I could help. One thing leads to another and I wind up looking at frameworks, plugins and template tags. Now, I have posted something pretty similar to this before because it was a bit of a rant when I saw somebody posting code I felt was not good practice but that is besides the point at the moment.

What I really want to get to is why I’m writing about template tags. They are an extremely useful thing to know – to some. WordPress has several template tags at your disposal and I love it. There are however some that I have seen in some themes that I would love to use in some of my themes down the road.

A perfect example is using a template tag for navigational links. WordPress has a really good template tag:

< ?php posts_nav_link(); ?>

Simple. It does the job: create navigational links for more posts. I feel the downside to that is that it is all in one container. Yes, there are ways around it by creating your own template tag (which a lot of people seem to do) and use that instead. But what to use? I like the Kubrick method of navigational links where rather than using the one

post_nav_links()

you use two in one. Creating a previous and next link is easy. A better way of doing this is if you are using just the bare minimum amount of files in a WordPress theme is using conditionals to create the navigational links for certain looks.

< ?php
/* Create page navigation and post navigation
 * depending on what is being viewed.
 */
if ( is_single() ) { ?>
  
< ?php } else { ?>

< ?php } // end else statement

The little snippet works fairly decent but it is a little cluttered. It can be simplified a little more so that the only things that change are the

<

div>s containing the actual links. So we can modify it to:

< ?php
/* Create page navigation and post navigation
 * depending on what is being viewed.
 */

Now we don't repeat code and saves some processing power for other things. Amazing what cutting down two lines of code will do! Now we can wrap all that into a function and use it as a template tag to make things easier in an

index.php

file. So the final code would look something like:

/* Create page navigation and post navigation
 * depending on what is being viewed.
 */

function my_theme_nav_links() { ?>
  
< ?php }; // end my_theme_nav_links() 

Now we can use the function anywhere in our theme for post navigation.