By Morten Rand-Hendriksen | Thursday, July 24, 2014
Responsive layouts have become commonplace in today’s web experiences, but the current HTML <img> element still has a fundamental flaw when used with responsive designs: It assumes uniformity in the screens it’s displayed upon, a uniformity that doesn’t exist in today’s mobile-saturated world.
Consider an image on a web page from the viewer’s perspective. Although it appears to be part of the page, it’s actually a replaced element: The code of the page cuts a hole in the page big enough to contain the image, and then retrieves it from its remote location to fill that hole. In some cases the hole has a specified width and height; in others the hole is built to be flexible and scale to a percentage, or proportion, of the screen size.
By Morten Rand-Hendriksen | Wednesday, June 11, 2014
One of the most popular requests I’ve received from lynda.com members is for a course on how to build WordPress themes from scratch. I’m excited to announce that WordPress: Building Themes from Scratch Using Underscores has finally come to fruition. The course is an introduction to WordPress theme design and development, a best-practice example of a mobile-first, standards-based web development process, and a first-hand look at my personal approach to custom WordPress projects. Just as importantly, it’s an introduction to Simone—the WordPress theme that I build in the course itself, which is now available for free in the WordPress Theme Directory.
By Morten Rand-Hendriksen | Thursday, April 17, 2014
WordPress 3.9 “Smith,” named after James Oscar “Jimmy” Smith, was released yesterday. This new version of the popular web publishing app introduces several highly anticipated new features that make managing your WordPress site and its contents easier. Let’s break down the key new features of WordPress 3.9:
A more powerful Customizer
The Customizer makes managing the appearance of your WordPress site easier by allowing you to see your edits as you make them and preview your theme configurations before you take them live. With the 3.9 update, two of the WordPress community’s most anxiously awaited feature requests have been added to the customizer to make it “complete”:
By Morten Rand-Hendriksen | Thursday, December 12, 2013
See what’s new in WordPress 3.8.
Today’s release of WordPress 3.8 is revolutionary in the history of WordPress—and a clear sign of things to come from the popular content management system. Sporting a clean new interface, tons of new features, and a new development philosophy, the 3.8 release is a milestone for the WordPress community in many ways. We’re already hard at work updating our WordPress Essential Training course to reflect WordPress 3.8, but there’s a lot to notice in today’s release beyond just what ships in the code.
Deadlines are not arbitrary
Establishing the current WordPress philosophy “Deadlines are not arbitrary,” WordPress cofounder and project leader Matt Mullenweg made a series of bold announcements at WordCamp San Francisco back in July. First, he stated that WordPress 3.7 and 3.8 would be developed in parallel, with firm, preannounced release dates for each. Furthermore, he announced that all new features slated for version 3.8 would be developed as stand-alone plugins first, and only built into the WordPress core code once they were stable. Finally, Matt announced that he’d be personally leading the development team for the 3.8 release.
By Morten Rand-Hendriksen | Thursday, August 01, 2013
A few months behind schedule, version 3.6 of WordPress is out and ready for you to make the most of. The scope of changes in this release are relatively minor, but the updates are important and will help in your day-to-day work with WordPress. Here’s what’s new and why it matters to you.
Since 2010, a new default theme has been released every year, and this year is no different. With 3.6 comes Twenty Thirteen. While the previous three themes—Twenty Ten, Twenty Eleven, and Twenty Twelve—got progressively simpler, Twenty Thirteen goes in a new design direction. It’s aggressively blog-centric with a heavy focus on Post Formats, and it’s a great example of the popular flat design trend currently sweeping the web.
Post Formats are a new feature in WordPress 3.6 that lets you choose unique layout and design templates for specific types of blog posts, such as images, videos, quotes, and regular articles, among others. The Twenty Thirteen theme supports Post Formats by providing a bold, unique visual style for each post so your site visitors can differentiate between the content in each one. In the image above you see the Video, Quote, Status, and Chat post formats on the front page. The Standard post format has a white background. The post format styling is also carried over into the post editor so as you change your post format you’ll see the styling change as you work, and the post formats are now identified using icons throughout the dashboard.
By Morten Rand-Hendriksen | Wednesday, December 05, 2012
The past two years have seen the release of two default themes for WordPress, aptly named Twenty Ten (released in 2010) and Twenty Eleven (released in 2011). Now we can add this year’s addition, Twenty Twelve, to the list. And with it we get a new stock theme that redefines what a stock WordPress theme is and sets a new standard for lean and clean design and coding. But like all good things the Twenty Twelve theme is not without controversy, which makes it all the more exciting.
Less is more
Twenty Twelve is at the same time stripped down and sophisticated in a way we’ve only previously seen in sandbox and development themes like Toolbox and _s. But unlike these themes, which were created specifically to be used as baselines for new themes, Twenty Twelve is fully built out and ready to take on the challenges of pretty much any content you throw at it. Twenty Twelve is responsive, conforming to small and large screens and providing custom navigation for smartphones and tablets; it is in line with current ultra-minimalist design trends, putting content and typography front and center; and it has tons of cool features built in for beginners as well as advanced users. All in all it makes for a great theme whether you just want a fresh look for your site or you want a good baseline to start from when you build your own child theme or full-on custom theme.
If you ask me, one of the most important aspects of the Twenty Twelve theme is its simplicity in design, code, and implementation. When the Twenty Ten theme was released, it was a revolutionary shift from the old and stale default themes. Twenty Ten was simple to work with and had lots of advanced features under the hood like custom background color, custom header images, and more widgetized areas people could take advantage of. The next theme in the series, Twenty Eleven, built on this concept and introduced more advanced features like a custom front page template, a featured content slider, and other elements. However, the advancements of Twenty Eleven came at a cost with the theme being far more complex on the back end and far more convoluted and tricky to work with.
Considering this, Twenty Twelve is a step in the right direction. Gone are advanced features that few used in practice, replaced with simpler, more meaningful templates and tools to make customization and use as easy as possible.
Twenty Twelve at a glance
The key features of Twenty Twelve include responsive design and custom phone and tablet menus; a custom front page template as well as full-width and sidebar templates for pages; full support for Aside, Image, Link, Quote, and Status post formats; full Theme Customizer support for all the standard WordPress functions; Google Fonts integration; and the standard header image and background color support we have come to expect from modern WordPress themes. Not to mention a clean and modern design with the content front and center.
Even with all this, the true power of Twenty Twelve can be found on the back end. Twenty Twelve is a leaner and cleaner theme than its numerically named predecessors. This is great for novice theme tinkerers and advanced theme developers alike. The theme provides more bang for your brackets, separating out functions and templates in separate files and folders and wrapping up functions in conditional functions, actions, and filters to make modifications and interactions easier. In my opinion, Twenty Twelve could be the new standard from which child themes and full themes should be built.
I say “could be” because quite a bit of controversy has stirred up around one decision made by the theme creators: It doesn’t seem to support Internet Explorer 8, at least not the way that is expected.
Twenty Twelve is fully responsive and ships with a custom mobile menu for smaller screens. This much is to be expected from a modern WordPress theme. However, in implementing the mobile menu function the developers of the theme made an interesting and controversial decision: Rather than setting the desktop stylesheet as the default for the theme and making special media queries for smaller screens and mobile devices, they chose to set smaller screens and mobile devices as the default and wrap the styles for larger screens in media queries. While this is no problem for modern browsers that follow the new HTML5 standard, it is problematic for older browsers like IE8 because the provisional media queries that create the layout for larger screens is not understood by these browsers. As a result, users of older browsers like IE8 get the mobile layout on their full-size screens.
The theme developers argue that this is not an issue for two reasons: One, the mobile version of the site is perfectly acceptable even on larger screens, and two, people shouldn’t be using old and outdated browsers like IE8 to begin with.
While I agree with both these statements, I believe our job as web designers and developers is not to police the Internet but rather to provide great experiences for the end users and educate them in the process. And since we have little to no control over what hardware and software the end users choose to access our sites, we need to provide the best experience possible for all of them regardless of their choices.
We can’t let older technologies hold us back from implementing new standards. In that case, providing a suboptimal experience for users with older browsers would be acceptable. However, the IE8 issue in Twenty Twelve is not caused by this type of situation but rather the choice to set the mobile styles as the default and wrap the desktop styles in media queries. In other words, they turned the theme stylesheet upside down on purpose. Had it been turned right side up, this would not be an issue.
These are the types of issues that arise in open source and they are incredibly interesting and frustrating for everyone working in open source. Unfortunately, more often than not the end users are left in the dark about what’s going on and get the impression that things are not working right. That is not the case at all. The great thing is that these issues are usually resolved through a collective effort, and a solution to the IE8 menu problem in Twenty Twelve is imminent.
If you want to read more about the IE8 menu controversy and get an idea of how these things happen and how they are resolved, check out the forum streams Excellent base for child themes and nav bar fails in IE8 as well as the track ticket. They provide for some interesting reading.
Check out Twenty Twelve right now!
Though it may sound dramatic, do not let this minor controversy deter you. Twenty Twelve is a great and forward-looking theme and a excellent basis for child themes as well. If you are itching for a new look for your WordPress or WordPress.com site, you should give it a spin and see what you think. There are lots of customization options and you can easily make it your own. Once you’re done, post your thoughts, ideas, and questions in the comments below.
Interested in more?
• The Twenty Twelve theme at wordpress.org
• WordPress 3: Building Child Themes at lynda.com
• All WordPress courses on lynda.com
• All courses from Morten Rand-Hendriksen on lynda.com
Suggested courses to watch next:• WordPress Essential Training•WordPress: Building Responsive Themes•WordPress Mobile Solutions
By Cynthia Scott | Thursday, August 25, 2011
The updated WordPress admin dashboard. The new design features a more minimalistic and streamlined approach to the content.
WordPress 3.2 was released on July 4th, 2011, followed by the 3.2.1 release on July 12th. If you are learning WordPress, you’ll find that although the content in our current WordPress 3 courses is still relevant, the user interface may be different as new features are added to WordPress.
Our current WordPress courses include:
WordPress 3 Essential Training (covers both WordPress.com and self-hosting through WordPress.org)WordPress 3: Creating and Editing Custom Themes WordPress: Creating Custom Widgets and Plugins with PHPWordPress 3: Building Child ThemesWordPress 3: Developing Secure Sites
I asked author Morten Rand-Hendriksen to summarize the changes in WordPress 3.2 to help anyone who is working through our WordPress courses. Here’s what he had to say.
By Cynthia Scott | Tuesday, November 02, 2010
You asked for WordPress courses, and we heard you. We have three new WordPress courses coming online this week.
New in the Online Training Library® is WordPress 3.0 Essential Training with author Morten Rand-Hendriksen. Morten is a gifted teacher and WordPress expert who is eager to share his knowledge with you. The course includes a walkthrough of common tasks in WordPress, from setting up an account to launching self-hosted sites. Also included are tutorials on inserting media, installing plugins, creating custom themes, and incorporating search engine optimization.
Soon, tune in to Chris Coyier’s new course, WordPress 3.0: Creating and Editing Custom Themes. I am very excited to bring Chris Coyier’s unique voice to the lynda.com Online Training Library®.
Wrapping up our new WordPress releases this week will be WordPress: Creating Custom Widgets and Plugins with author Drew Falkman. Let us know what you think!
You can change your email preferences at any time. We will never sell your email. More info
Thanks for signing up.
We’ll send you a confirmation email shortly.
Sign up and receive emails about lynda.com and our online training library:
Keep up with news, tips, and latest courses with emails from lynda.com.
We've updated our terms and conditions (now called terms of service).Go Review and accept our updated terms of service.