Author Archives: Mark Dennin

Wrapping Up the Class

This class was quite a learning experience.  I hit a lot of roadblocks but also solved a lot of problems and realized what I can accomplish within WordPress if I put my mind to it.

The Class Overall:

I think that the class was great for giving us a structured environment to learn some coding basics and safely experiment.  It allowed for a lot of tinkering on our own, but could have definitely benefitted from some more class and one-on-one time.  While the instructional periods were informative, more time to work with Greg on specific issues would have been nice.  I found myself working on some problems the wrong way for hours when Greg could have given me a simple fix or explanation in a few minutes.

What I Learned:

I learned the basics of HTML, CSS, PHP, and JavaScript.  I learned that you can find the answer to almost anything with Google and a little (or a lot) of mental elbow grease.  If I want to experiment in the future, I know that I can commit my changes to Github and share my code (and my issues) with a world of other developers.

Why this is important:

Knowing the basics is important because it opens lots of possibilities. Just knowing that I can look up how to write code on Codecademy or crowdsource and issue to Github or utilize Stack Overflow for almost any coding issue makes it way easier for me to solve problems and learn how to make my website capable of almost anything.

What I plan on doing with my knowledge:

I hope to keep up my blog, once I solve a couple more responsiveness and design issues.  I’m also going to be helping out a local logo artist build a portfolio and informational website that will hopefully expand her business.  I will be able to give her advice on what types of templates to use as well as give her ideas of what a good website could be capable of.  I plan on using WordPress to build this site.

Re-readings and initial readings:

Reading the initial readings over again made me realize how much I have learned about the language of coding.  Not just in the terminology, but the concepts are clearer to me as well.  “Don’t repeat yourself” was simple enough the first time I read about it, but until you actually code the same thing four times in a row you don’t realize the value of it or how it might actually require finding a new way to do things.  Designing for the masses makes more sense now, because if my functionality changes are too complicated for my authors to use, they won’t use them.  Actually working with the site makes you realize how these problems from the initial readings can quickly present themselves.

What I want to learn now:

Obviously, I’d love to get my custom meta boxes working, but beyond that, I want to learn how to make my site more responsive and aesthetically pleasing.  I want to keep it simple still, but I want it to impress.  I’m taking a web design class in the fall that I hope will help me with this.  I want to learn how to build or customize more of my plugins, as well, as so I think I’m going to fork some of my favorite code and see if I can improve on it.

Interview with Web Designer and Developer James Atkins

James Atkins is a web designer and developer who did some work with my uncle’s company, Thompson Reuters, which is an umbrella company of the Reuters news service.  I interviewed via James via Skype from his home in rural France.  His website is located at http://jamesatkinsdesign.com/.

Mark Dennin: How did you first get into web development or design?  What led you to it?

James Atkins: I was asked to work at one of the UK’s first web design companies, it was called New Media Factory, in Cambridge, UK in the mid 1990s. I was a freelance designer and wanted to find out more about the web. I was bored of conventional design companies.

MD: What was your first web development/design job?

JA: Prior to New Media Factory I was a design consultant at LIFFE, now NYSE Euronext, in London. It was essentially a trading floor where the traders all wear loud jackets and shout deals across the floor. That was 1994-5 if I remember correctly, it was the first time I’d seen the World Wide Web. I’d downloaded a copy of Mosaic and loaded a few pages – the first Yahoo, the FBI “Most Wanted” page and a few academic sites. I was intrigued that this stuff was published, free and available at anytime. I suggested to LIFFE that we could do a web page. They didn’t listen, so I started making pages in HTML 1.0 in my own time to try and work out how it all functioned. However I didn’t understand web servers, not many people did and remember, I’m a designer first, so didn’t really get very far on my own. I’d decided I’d need to find out more somewhere else.

So my first real projects were probably at New Media Factory. We worked on several sites all at once. I worked on the first site for the Economic and Social Research Council [esrc.ac.uk/]. Did some consulting and the first version of ft.com in early 1996 and created several internal intranet sites for BP. Another large site which we threw a large team at was for Nationwide a UK Bank that sponsored the English football league.

MD: What does your current or most recent web development job entail?

JA: I’m working with a team for the redesign of website for Private Swiss Bank. This will be launching this year for desktop and mobile versions. We’ve also been helping them with their intranet, email and other digital communications over the last couple of years.

MD: What field was your education in and did it prepare you for a career in web development?

JA: I studied Fine Art, Painting. That doesn’t prepare you for much in the way of a career except for being an artist. When I left art school I moved into the design world because I’d always had a love of typography. Desktop layout applications were just coming out then, PageMaker 1.0, Quark Xpress 1.0, Adobe Illustrator 88, and I was quite computer savvy as a kid so it was quite accessible for me, perhaps more so than most graphic design graduates at the time.

There are thousands of web developers these days. A lot of them very good – but my fine art education has taught me to stand on my own two feet, not wait to be told what to do and to have certain amount of self-belief. That’s useful when you are a consultant.

MD: What are your main responsibilities now in web development or at your job?

JA: It depends on the project. For larger projects I am generally an Art Director working with a team of juniors. I do a lot of presentations for clients and there’s a bit of problem solving and brainstorming. But for smaller projects I still do a bit of production, layout, design.

MD: What websites have you worked on?

JA: Lots! Recently I’ve been collaborating with colleague from NMF days [scheybeler.com]. We’ve re-launched Prixpictet.com we did a lot of work on www.univadis.com/ which is now rolling out around the world – essentially a website for doctors.  The Swiss bank thing should be going live this Autumn. I run a few smaller sites on my own – of course you know about psenterprise.com which I templated and PSE created the pages. But these days it’s not really all about websites. Apps, social media, interactive advertising – there’s all aspects of digital design to be get involved with.

MD: What has been the most challenging and most rewarding aspects of your career in web development?

JA: The big challenge is keeping up with new developments!  It’s constantly changing. Technology, approach, specifications, browsers, standards, devices. It’s rewarding; well these days I no longer have to go into a London office or studio every day. I can work remotely from my house in rural France.

But it’s always good to launch something too!

MD: What languages (HTML, PHP, JavaScript) have been most useful in your career?

JA: Probably HTML and CSS. They’ve been the most constant languages. It’s useful to know the basics of a few of the standard CMS systems like Drupal, WordPress or Textpattern.

MD: Do you have any experience doing web development for news or P.R. organizations?

JA: I did some work the FT. I started working with the Daily Telegraph but that didn’t really work out (they were starting a new company to do apps and dev – but it seemed not well thought out or resolved so I bailed very quickly). It’s important to know when to say “No!”.

I’ve just been working on the redesign of kernelmag.com which is re-launching on August 12th.  They are a news/journalism/tech blog/ which launched last year. They are re-launching with new backers. P.R., no, although I’ve done some digital work for Brunswick PR in London  – but that wasn’t really a website as such.

Still a Lot of Work To Do

It was great getting input from the class on the site. I was so busy trying to do the things I originally set out to do that I didn’t even think of some of the easily implemented upgrades my site could have benefitted from.  The idea to make external links open up in new pages instead of changing the page was especially helpful, as I realize I flood the reader with links.  It forces them to continually hit the back button and start the article over at the top of the page, which is really annoying for a multi-tasker like me who needs multiple windows open and quick access to different pages at all times.  I found new ways to make my gallery better and to make my footer more playful and witty, and have found ways to edit nearly every text part of my site.

I didn’t get to do everything I wanted to do.  Still, my custom meta boxes haunt me.  This time I even copy and pasted the Smashing Magazine and WordPress files right into a plugin folder and didn’t touch them, and the meta boxes still failed to show up.  It’s the one thing that I think I really failed at and wished I could have gotten to work, although now that I think of it, I probably wouldn’t actually have much use for it given the nature of my posts.

I don’t consider my site done.  I think I’m going to continue to think of ways to improve the site (especially when it comes to design) and figure out how to make it more responsive for mobile. I now have a great base of knowledge (and great Googling skills) and think that with enough time and effort I can eventually get my site to where I want to be.  Maybe then I’ll actually start creating content on a more consistent basis.

The Final Countdown

I’ve come pretty close to getting my website to look and function the way I want it too.  Using plugins I was able to create simple galleries for my posts, allow star ratings for certain parts of my posts when I want my users to rate something, and I gave myself the ability to post with footnotes. Much of my writing tends to be filled with “bonus” information that I feel enhances the post but doesn’t contribute to the coherence of the main article (aka I get sidetracked really easily and don’t want my readers to miss out on extra content just because it doesn’t go well with the rest of the post), so footnotes were key.

I finally figured out how to get my header to fill the top of the screen, and there are a few other styling things I want to do, but I’m happy that it doesn’t look too much like the original Twenty-Twelve theme.  Eventually I want it to be unrecognizable, similar to the way that AMCtv.com and some of the other great WordPress sites are.  The tough part here will not only just be the design (I’m not much of an artist, so I’ll probably be borrowing a lot of styling from other sites) and keeping the site optimized for mobile.  While I’ve got the site looking good for computer users, it looks downright terrible on my phone.  I’ve found some good tools for testing live sites for mobile, but I already have an iPhone and could do it on my own.  I need to find a tool that lets me test my local site on a mobile emulator, because I don’t want to have to keep updating my live site just to see if it is optimized for local.

It looks like I’ll be spending the rest of the night trying to fix what has been plaguing me: custom meta boxes.  I’ve been through three different tutorials, and still can’t get my custom box to appear.  That the last real functionality piece that I need, but it’s also the one that’s been giving me the most trouble from the start.

Pages of Posts and Progress

I think I’m finally starting to get the hang of this.  After spending a few days fruitlessly searching Google for answers to poorly worded questions, I’m starting to figure some things out and make some real changes to my site.  Some are simpler than others; I’ve added plugins to let me rearrange my nav menu, add footnotes to my posts, and let me show off my twitter and contact information.  I’ve done a lot of things that help support the site, like feed my new Twitter account to the sidebar, made myself a self-hosted email address, and even added a favicon so you see my site’s logo next to the url.  I’ve even started written a few posts to test out my new formats, so it’s not just gibberish anymore.

The page of posts plugin that I wrote after consulting the codex is probably the most useful thing I’ve done so far.  I didn’t realize that WordPress wouldn’t automatically do this; I wanted to automatically post every post to the homepage, as well as a copy on a different page (almost a separate, more specific blog in addition to a “superblog”) based on the categories I choose.  This way I can have as many categories as I want, but only have three specific blogs that theoretically should have different content (although they could easily overlap). Although I’m still having problems getting my custom meta boxes to appear, and I’m still struggling a bit with the css and include functions (how do you get your header to be a solid color and go all the way across the top of the page?!?!), I’m encouraged by the progress I have made and hope it will lead to further breakthroughs.  For now I’m going to keep chipping away and hopefully figuring things out on my own until I can get some more pro tips in class. I’m not sure I’m going to get to do everything I originally wanted to do, but I’m discovering the power of plug-ins, and the fact that I’m probably not the first person to want to do certain things for my site.  A few searches for plug-ins and my site is starting to quickly be capable of functioning in the most efficient way.

My first plugin and custom post type

Knowing that I want to have custom post types for different types of content, I set out finding the best way create custom posts.  Plugins seem to be the easiest way to add custom post types, but the WordPress codex didn’t seem to give me all of the answers I needed.  I was understanding how some of the code worked, and that it needed hooks.  I wasn’t entirely sure what code to edit or whether I should make new files or change existing ones.  I didn’t know whether this was a content or an admin issue, as the posts usually come from the dashboard.

Plugins made this simpler, as I discovered that I could just make a whole new file in wp_content/plugins, and not be at risk of screwing up any of the other files.  I also decided to look at some examples and use a template of some code, just so I could get something working and not have to start from scratch.  There are so many pieces to custom post types; it really helps to look at what some other people have done in order to get it working right.

After following the WordPress codex and a great article about plugins and custom post types I saw here, I was actually able to see my plugin, working, on my local site, which felt like a big accomplishment after spending hours reading and looking at tons of code and step-by-step instructions.  I activated the plugin and saw my custom post type show up in the sidebar, allowing me to click on it and start typing.  Although it currently has the same functionality as the regular post, I’m exciting that its working.  Now the next step is to learn more about meta-boxes and figure out how exactly to get my custom post type to do what I want it to do.

Switching to a Manual Transmission

When I first tried to host my own WordPress site a few years ago, I didn’t know anything about coding, MAMP, Github, or child themes. Everything was automatic, and I picked out a free theme and did little to edit it. I didn’t love the theme, and I had my own ideas about how it should look and what I wanted it to do. It was, however, simple. There were only a few instructions, nothing extra to download, and it was still free.

Getting out of that automatic mindset has been difficult. When using WordPress, there are shortcuts every step of the way. When setting up my hosting, they offered a one-button install, which I did. It gave my WordPress site its title and immediately let me using the site, but didn’t necessarily make it easier to edit. In trying to edit my website, I found myself back to square one.  In class, we set up a sample webdev final project site, but in making High on Endorphins I had a lot of questions, and not enough answers for the series of questions. What was my database name? My SQL username? Should I enter “localhost” or my BlueHost information, if I was going to be running it through MAMP anyway? Are all of these answers different on my actual WordPress than on my localhost version? A lot of these simple problems were easily answered when we did it together, but now working on my own, Google is providing most of the answers to my questions.

Although Codecademy was a challenge, learning to code is only half of the battle. Simply getting the new code into a working website, using multiple applications and dozens of steps, and figuring out how to make it all run once its written is taking a while to get used to. Once I finally become comfortable with all of these steps, then I’ll really be free to really experiment with the code. For now I’m going to just keep Googling, learning, and practicing.

High On Endorphins: Doing it Right This Time

A few years ago, a couple of people on the Georgetown track team and I started a blog called High On Endorphins, where we would post videos and little articles about running and our comical viewpoints on the sport. Usually we would get really into it for about a week and actually post something, then it would go dormant for a year and a half. The site I want to build would be a revival of this basic idea, mostly comical commentary loosely centered around endurance sports (Without any actual rules. If I want to comment on Miley Cyrus’s latest music video, I’m going to do that too).

In the past the site was a tumblr, this time I want it to be more functional.  Mostly, I want the design to look professional, and I think using CSS and PHP will help me make the site look better than it ever has. I want to have different pages, not just posts, and for those pages to have different functionalities. I want to be able to offer readers ways to vote on certain things in my posts and share their opinions in ways beyond commenting, and have pages that have results of those interactions. I want to be able to post with interactive galleries and polls. Mostly, I want the site to be so good that I won’t want to leave it dormant again, so that it encourages me to post more prolifically.

 

Update to my idea:

URL: highonendorphins.com

Description: a collection of my most interesting/funny/angry thoughts on exercise, endurance sports, sports in general, pop culture, and anything else I think needs to be commented on.

Goals: to build an aesthetically pleasing, high-functioning and engaging site/blog that has enough constant interesting content to bring new and returning viewers.

  • I will focus on a few important style and function aspects that I want to improve on my theme and perfect those changes
  • I will have a finished site that looks so good and works so well that I’ll have no choice but to add content
  • I will spend all day Googling questions when I hit a wall
  • I will have a site that looks and works so professionally that visitors who stumble upon it will take it seriously and not know how few pageviews I actually have

I will be using Twenty-Twelve to start out.

Functionality/Design Changes:

  • Post options that allow me to include polls and star ratings to increase engagement beyond comments
  • Post options that allow galleries
  • Custom post for reviews (movie/game/show)
  • Modern colors, fonts, and room for future ads and greatest hits content (I’m going to sketch a mock-up at some point, although the creative art part may be the toughest part)

 

Codecademy seemed simple, WordPress looks more complicated

After breezing through this weeks Codecademy PHP lessons, I thought I was well on my way to building my own site. Although we didn’t seem to learn anything too complicated, and I’m not quite sure how I will be practically using arrays and loops yet (I’m not going to create all of a 500 word post by typing “This”, “is”, “my”, “post”, and then echoing a loop, and I’m not going to spend too much time counting to 100 by 10s), the concepts and syntax were simple enough to follow.  Much of it had the same JavaScript syntax; always include semicolons, use brackets or curly brackets to tell the computer what to actually do or print out.

Reading through the codex for WordPress, however, I started to come across some foreign concepts and potential problems that I didn’t realize could happen. While child themes make a lot of sense (I always wondered how the site would be able to update and stay compatible with WordPress without breaking completely), as well as plug-ins to save time, and I realized that different post types could be formatted differently, I never thought there could be so many naming conflicts and additional things to worry about like hooks. I’m not sure what hooks are, or what they are supposed to do, but if I’m making a custom post template, WordPress assumes I already know what they are and offers me the best one to use.

It also bothered me that not all themes did not support all post formats, which I thought would be a benefit of using WordPress. I guess this means that some posts are just more complicated than others and that some themes are too simple, but I assumed that this all could be modified to work in some way. I guess I still have a lot to learn about the way WordPress’s templates, themes, infrastructure, and modification coding all work together.

jQuery seems simple enough…

Maybe it was the fact that there were about a third as many exercises as we usually do, or that I’ve learned how to quickly see what I’m doing wrong on message boards, or maybe the instructions are clearer, but I found jQuery to be much easier than traditional JavaScript. Although the class lesson seemed confusing, with the libraries and some of the fancier code that I didn’t understand at first. I feel like I have a much better grasp of jQuery, although I’m realizing that I’m going to have to keep coding to prevent forgetting everything I recently learned.

In one exercise I realized I had to use nth child, but completely forgot how to format it. I thought I could use ol-nthchild(3), when it should have been li: nth-child(3). Simple formatting like that is easy to forget in just two weeks, and I’m realizing that I’m not as fluent as I once was. If I’m going to remain fluent in programming, I’m going to have to find a way to practice while I’m not working on something.

As for setting up my domain name and hosting, it was a little more challenging than I thought it would be. In the end, I’m glad I went with bluehost for my hosting, because after some small troubles logging in because of site maintenance, I was able to easily install my WordPress blog by following a few simple instructions. I was surprised by a phone call from bluehost, which was fairly personal and asked me about my site and gave me tips for improving it, along with making sure that I didn’t have any problems. (Most importantly, they told me that I could cancel at any time and get a full refund.  For such great customer service, I might not pay anything at all for hosting in the end.) If you haven’t found hosting yet, I would definitely recommend bluehost.