Guymon » Programmierung

Responsive Design am Beispiel Boston Globe

admin — Fri, 03 Feb 2012 11:57:54 +0000

Tito Bottitta beschreibt den Prozess wie das Responsive Design des Boston Globe entstanden ist.

Interessant fand ich die Wahl von InDesign als Programm zur Gestaltung.

Hands down, the answer was InDesign. At its core, BostonGlobe.com is a publication website, and InDesign is the best tool for laying out publications and content. Yes, there are huge differences between designing print publications and designing for the web, but consider this: Most web pages are simply a combination of photos and text. And where Photoshop excels at manipulating images (but sucks at type) and Illustrator is exceptional at typography (but sucks with images), InDesign is built for both.

Even better, InDesign’s internal logic parallels that of web design and development. Every new document begins with a grid. It uses type and object stylesheets that should be familiar to anyone who has used CSS, allowing you to change the characteristics of every headline (or object) from one master style.

Possibly related posts (automatically generated)

Image Effects with CSS

admin — Thu, 02 Feb 2012 08:56:22 +0000

Nick La stellt einige schöne Bildeffekt vor – embossed, soft embossed, cutout und glossy.

Various styles such as embossed, cutout / pressed, and glossy effect can be achieved using multiple inset box-shadows. You can also use the :before element to another layer of effect such as glossy gradient. See the demo source code for CSS details. Resize your browser window to see the resizable images.

Possibly related posts (automatically generated)

jQuery Fun

admin — Thu, 26 Jan 2012 08:36:51 +0000

Zwei jQuery Projekte sind mir heute im RSS Reader aufgefallen.

Zum einen scrollorama von John Polacek, the jQuery plugin for doing cool scrolly stuff. Nett, wenn auch wohl (noch) nicht für den Kundeneinsatz geeignet.

Das zweit Plugin ist Arctext.js – Curving Text with CSS3 and jQuery.

While CSS3 allows us to rotate letters, it is quite complicated to arrange each letter along a curved path. Arctext.js is a jQuery plugin that let’s you do exactly that. Based on Lettering.js, it calculates the right rotation of each letter and distributes the letters equally across the imaginary arc of the given radius.

Possibly related posts (automatically generated)

CSS3 breadcrumbs

admin — Wed, 25 Jan 2012 15:31:53 +0000

Einige Ideen für Breadcrumb Menüs mit CSS3 und ohne Bilder stellt Catalin Rosu vor.

Ausgangspunkt ist eine Link-Liste und CSS pseudo-elemente, border-radius, transforms, etc.

Possibly related posts (automatically generated)

CSS3 Click Chart

admin — Wed, 18 Jan 2012 12:15:09 +0000

Eine schöne und hilfreiche Webseite ist CSS3 Click Chart.

Für verschiedene CSS3 Eigenschaften gibt es Codebeispiele, eine Live Preview, eine Liste der Browser die die Eigenschaft unterstützen und welche Polyfils für weniger gute Browser verfügbar sind.

Sehr schön.

Possibly related posts (automatically generated)

Sprite Generator für den Mac

admin — Wed, 18 Jan 2012 12:01:39 +0000

SpriteRight schaut wie ein fantastisches Tools aus.

SpriteRight is a CSS spritesheet generator for the Mac that lets you import your existing images or stylesheets.

Leider nur für OS X 10.7 und nur über den AppStore. Der zweite Punkt nervt mich ein wenig. Warum kann man Software denn nicht “normal” kaufen, also ohne Apple ID, grrr.

Possibly related posts (automatically generated)

Drupal: Mega-Menus

admin — Sat, 14 Jan 2012 15:53:32 +0000

Einfach Mega Menus mit Views in Drupal erstellen.

Menu Views allows administrators to attach a view inside a menu item.
This is useful when creating “mega-menus” with content such as:

Recent blog, node, or user posts

Complex views that contain graphics and other HTML structures.

This module adds an “Attach view” fieldset on any add/edit menu item on any menu (admin/structure/menu/manage) where you can select a view, display and pass arguments.

Optionally, if you wish to display only the view, you may set the menu item’s path to . This will ensure the title and path (link) is not rendered.

Possibly related posts (automatically generated)

Präsentationen mit impress.js

admin — Sat, 14 Jan 2012 15:46:29 +0000

Das Präsentations-Framework impress.js sieht wirklich gut aus!

Eine Demo kann man sich hier ansehen. Schick.

Possibly related posts (automatically generated)

Drupal: Field API

admin — Fri, 13 Jan 2012 09:43:26 +0000

Felix Hofmann zeigt an einigen Beispielen wie man mit der Field-API einzelne Felder rendert.

 'image', // Der Feld-Typ z.B. image, file, text.
 'settings' => array( // Formatter-settings.
 'image_style' => 'your_image_style', // Bild mit einem angelegtem Bildstil ausgeben.
 'image_link' => 'content', // Und das Bild noch auf den Inhalt verlinken.
 ),
 );
 // Wir holen uns alle Elemente des Feldes
 $items = field_get_items('node', $node, 'field_name');
 // Value für das erste Element des Feldes
 $variables['output'] = field_view_value('node', $node, $item[$delta], $display);
 // für die Ausgabe
 print render($output);
?>

Possibly related posts (automatically generated)

New Features in Joomla! 2.5

admin — Thu, 12 Jan 2012 09:34:15 +0000

Die Übersicht der neuen Features in Joomla 2.5 sieht sehr gut aus.

Joomla 2.5, due out in January 2012, will have a host of new features including new search functionality, multi-database support, and update notification. (…) Moving from 1.7 to 2.5 can be done with the one-click upgrade within Joomla and most extensions that run on 1.7 should also run on 2.5.

Based on Finder, which was developed by jXtended, Joomla 2.5 has added an exciting new natural language search function. This feature incorporated auto-completion and stemming. Stemming is the ability for the search to use the root of the word you entered to locate matches. While there is still work to be done, this search is also much better at searching in languages other than English.

This new search is faster and more versatile that the standard search. The data is indexed to get this flexibility and speed. New plugins are required to use this search. Joomla ships with the new core extension plugins, but other extension developers will need to create their own plugins to work with this new search. By default, the standard search is active and this new search is disabled. You can enable the plugin and index your files when the extensions you want to search have the new plugins.

Ich werde die Beta 2 die Tage mal testen.