Archiv der Kategorie: Web

Myspace 3.0

Myspace wagt knapp zwei Jahre nach dem letzten Redesign einen kompletten Neuanfang. Optisch wirkt die Seite, wie eine Mischung aus Pinterest und Windows 8. Trotzdem ist es anders, als die übrigen Social Networks, die man so kennt. Irgendwie neu eben. Gespannt bin ich auf das horizontal ausgelegte Navigationskonzept. Auf Touch-Screens, mit Trackpad oder Magic Mouse kommt das bestimmt gut.

The new Myspace from Myspace on Vimeo.

Ich habe Myspace mit meiner Band im letzten Jahrzehnt nur als Ergänzung zu unsere Webseite genutzt und bin mit den fummeligen Profilseiten nie so wirklich warm geworden. Das Video macht mich aber neugierig auf das, was da kommt und irgendwie wünsche ich mir, dass es nicht wieder floppt. Leider ist die Seite noch nicht online, man kann sich aber vorregistieren.

Veröffentlicht unter Web, Webdesign | 2 Kommentare

Responsive Webdesign mit CSS3 Media Queries

Den folgenden Artikel habe ich ursprünglich als „UX-Newsletter“ für meine Kollegen in der Firma geschrieben, weswegen er sich „etwas“ von dem üblichen Kram unterscheidet, den ich hier sonst so poste. Es geht darum, dass immer mehr Menschen das Internet nicht mehr ausschließlich zu Hause am Rechner, son­dern auch unterwegs auf ihrem Smartphone, Tablet oder Laptop nutzen und – *surprise* – man diese Entwicklung als Webdesigner & -entwickler bei der Umsetzung von Webprojekten berücksichtigen sollte. Vielleicht wird es also hier in naher Zukunft auch ein mobiloptimiertes Layout geben. Wer weiß?

Wer sich bis jetzt nicht angesprochen gefühlt hat, braucht an dieser Stelle also nicht weiterzulesen. Aber vielleicht liest hier ja trotzdem jemand mit, der in einer ähnlichen Branche arbeitet und damit was anfangen kann. Wenn nicht: Bald gibt’s bestimmt wieder was anderes!

Was ist Responsive Webdesign?

Unter dem Begriff „Responsive Webdesign“ versteht man die Optimierung von Webseiten für unter­schied­liche Geräte und Bildschirmauflösungen. Durch den Einsatz von flexiblen Inhalten und flexiblem Layout kann das Design auf den Nutzer und dessen Anforderungen reagieren und ihm so die beste User Experience bieten.

Im Umkehrschluss heißt das aber auch, dass das Anbieten einer Mobil-Version für alle mobilen Endgeräte nicht zwangsläufig eine Verbesserung der User-Experience darstellt. Eine für hohe Auflösungen optimierte Webseite kann auf einem Tablet-PC mitunter besser funktionieren, als eine für Smartphones optimierte Mobil-Version.

Mögliche Vor- und Nachteile

Vorteile:

  • Bessere Bedienbarkeit (z.B. durch Optimierung für Touch-Displays)
  • Bessere Lesbarkeit
  • Schnellere Ladezeiten auf mobilen Geräten (durch Anpassung der Grafiken an kleinere Displays)
  • Mehr Gestaltungsmöglichkeiten auf großen Screens
  • Variable Inhalte und Informations-Architektur für unterschiedliche Geräte
  • Verbesserte User Experience

Weiterlesen

Veröffentlicht unter Technik, Web, Webdesign | Verschlagwortet mit , , , | 1 Kommentar

HTML / CSS: Bullet-Farbe von HTML-Listen ändern

Für die wenigen unter euch, die jemals vor dem Problem stehen werden, die Farbe der Aufzählungszeichen einer HTML-Liste mittels CSS unabhängig von der Textfarbe ändern zu müssen und dabei nicht auf ein Hintergrundbild zurückgreifen wollen, so geht’s:

HTML:
<ul>
  <li><span>Listenpunkt #1</span></li>
  <li><span>Listenpunkt #2</span></li>
  <li><span>Listenpunkt #3</span></li>
</ul>

CSS:
li {color: green;}
li span {color: black;}

Ergebnis:

Ja stimmt, zusätzliches, überflüssiges Markup ist nicht besonders elegant. Funktioniert dafür aber auch mit dem IE7 – im Gegensatz zu einer etwaigen li:before-Lösung.

Veröffentlicht unter Technik, Web, Webdesign | Verschlagwortet mit , , | Hinterlasse einen Kommentar

KernType – the kerning game

Wenn man die Temperaturen des vergangenen Wochenendes mit denen eine Woche zuvor vergleicht, dürfte deutlich werden, dass bald der Winter auf der Matte steht! Und was macht man als einsamer Typograf an so einem kalten Winterabend? Richtig, spationieren gehen!

Beim Spiel KernType geht es darum, Wörter durch Verschiebung der Buchstaben und Justierung der Zwischenräume lesbar und optisch ansprechend zu gestalten. Je näher am Original, desto höher die Punktzahl.

„Your mission is simple: achieve pleasant and readable text by distributing the space between letters. Typographers call this activity kerning. Your solution will be compared to typographer’s solution, and you will be given a score depending on how close you nailed it. Good luck!“

Viel Spaß!

(via)

Veröffentlicht unter Design und Kunst, Games, Web | Verschlagwortet mit , , | 3 Kommentare

Spaß im CSS-Code

Was passiert, wenn Webentwickler Langeweile haben, hat csshumor.com zu Tage gefördert. Zum Beispiel sowas hier:

.vodka { position: absolute; }
.michael.jackson { background-color: black; }
.danny.devito { max-height: 0; width: 100%; }
.kids-these-days { -webkit-perspective: none; }
#me + #you { margin: 0; }

Man kann auch eigene Codeschnipsel einreichen. Lustig, nicht?

(via)

Veröffentlicht unter Quatsch und Kurioses, Technik, Web | Verschlagwortet mit | Hinterlasse einen Kommentar

vintageJS – HTML5-Bildbearbeitung

vintageJS ist ein netter Javascript/HTML5-Editor mit dem man eigene Bilder in Retrofotos verwandeln kann. Ich habe das mal ausprobiert:

Viele Parameter zur Bearbeitung stehen nicht zur Verfügung, ist aber schick umgesetzt. In der öffentlichen Galerie gibt es noch ein paar hübsche Beispiele.

(via)

Veröffentlicht unter Fotografie, Web | Verschlagwortet mit , | Hinterlasse einen Kommentar

Ein ♥ für Blogs

Das hier ist unser Beitrag zur fünften Runde von „Ein ♥ für Blogs“. Wer nicht weiß worum es geht: Genau heute schreiben alle Blogs, die mitmachen wollen, einen Beitrag mit dem Betreff “Ein Herz für Blogs” / “Ein ♥ für Blogs” und listen die deutschsprachigen Blogs auf, die ihnen am liebsten sind. Das Ganze dient dazu, anderen lesenswerte Blogs vorzustellen, den Blogrollhorizont etwas zu erweitern und kleinen Blogperlen die Aufmerksamkeit zu schenken, die sie verdient haben. Hier also unsere Favoriten:

Saschas Top 3

1. Rebel:Art

Vor allem wenn man auf Street Art steht, kommt man um das Diary von Rebel:art nicht herum. Da gibt’s täglich großartige Fotos von Aktionen, Installationen und vielen tollen Ideen aus aller Welt wie z.B. dieser hier.

2. Testspiel

Genau genommen kommt es relativ selten vor, dass die beim Hamburger Musikblog vorgestellte Musik meinen Geschmack trifft. Trotzdem lese bzw. höre ich jeden Tag, was es dort so neues gibt. Sehr schön!
Ähm, es soll hier ja eigentlich „nur“ um deutschsprachige Blogs gehen, aber pssst: Sehr gutes Musikblog aus Lexington: You ain’t no Picasso

3. Der Motorradreisende

Erik Peters ist viel mit dem Motorrad unterwegs: In Asien, Amerika, Island und in den Gebieten, die dazwischen liegen und darüber berichtet er in seinem Blog. Ganz tolle, unterhaltsame Schreibe und unfassbar großartige Fotos und Videos seiner Reisen findet man in seinem Blog. Absolute Empfehlung – nicht nur für Mopped-Fahrer.

Tobis Top 3

1. Nischenwerk

Ben ist ein guter Freund von mir. Er hat Philosophie & Germanistik studiert und schreibt im Nischenwerk seine Gedanken nieder: Mal in Prosa, mal in Gedichtform und schafft es mich damit immer wieder zu begeistern.

2. Jeriko

Mein Lieblings-Fotografie-Blog: persönlich, authentisch und optisch ansprechend. Jeriko ist ein Ein-Mann-Blog und der Schwerpunkt liegt auf eigenem Content. Meistens sind das Fotografien und Erfahrungsberichte. Auf jeden Fall lesenswert.

3. Elmastudio

Ellen und Manuel schreiben auf elmastudio.de über Webdesign und WordPress und sind dabei immer auf der Höhe der Zeit. Sie bieten auch eigene (kostenlose) WordPress-Themes an, die neueste Techniken wie HTML5 und CSS3 media queries verwenden.

Noch ganz kurz:

Eigentlich hätten wir auch noch das Kotzende Einhorn, das Kraftfuttermischwerk, Spreeblick und noch viele andere in die Tops packen müssen. Haben wir aber nicht.

Veröffentlicht unter Aktuelles, Web | Verschlagwortet mit | 5 Kommentare

Warum Google+ besser wird als Facebook…

…steht in diesem Artikel im t3n-Blog. Die „Circles“ werden der Knaller!

Mit Circles können beliebig viele Personenkreise angelegt werden, innerhalb denen man dann so kommuniziert, wie man es den Teilnehmern gegenüber für angemessen hält. So könnte man sich im Personenkreis „Stammtisch“ zotige Bemerkungen an den virtuellen Kopf werfen, während man im Personenkreis „Firma“ höchst seriös über den jüngst erstandenen Chablis philosophiert. Natürlich erlaubt Circles auch die Umgehung der Kategorisierung. So entscheidet man im Rahmen der Veröffentlichung, ob die Information an alle Personen oder nur an einen oder mehrere bestimmte Circles gesendet werden soll. So würde man sich das auch bei Facebook wünschen. Dort aber wird davon ausgegangen, dass der Status eines Facebook-Friends über alle Personen homogen empfunden wird. Absurd…

Achja, wenn jemand ‚ne Invitation für uns hat, her damit!

Veröffentlicht unter Web | Verschlagwortet mit , , , | 1 Kommentar

3gistdasneue56k.de

Manchmal rege ich mich über dieses mobile Internet auf. Erst macht es einen abhängig und dann lässt es uns minutenlang ein kleines, sich drehendes GIF anstarren. Aber anscheinend haben wir uns dran gewöhnt. Kam jedenfalls so rüber. Und weil das schon so lustig war, wie lustig muss das Ganze dann erst als Webseite werden? Genau! Deswegen ist soeben unser erstes „Webseitenprojekt“ online gegangen: 3gistdasneue56k.de

Ich würde mich freuen, wenn ihr den Link verbreitet. Twitter und Facebook und so, ihr kennt euch aus! Achja, es gibt auch eine Mobil-Seite! ;)

Veröffentlicht unter Aktuelles, Persönliches, Projekte, Web | Verschlagwortet mit , , , , | 3 Kommentare

Wie man es nicht machen sollte: Kontextsensitive Werbung

Ich finde ja, MyVideo.de übertreibt mit der Vermarktung der eigenen Werbeflächen. Und dann zwingt man System of a Down-Hörer auch noch, 20 Sekunden lang Lady Gaga zu ertragen. Dumm!

Veröffentlicht unter Aktuelles, Musik, Web | Hinterlasse einen Kommentar

Sneakerpedia

Sneakerpedia.com ist ein Social-Wiki und erhebt den Anspruch das größte Sneaker-Archiv der Welt zu sein. Jeder kann seine ausgelatschten Treter fotografieren, hochladen, kommentieren, taggen, ownen, liken, kommentieren undsoweiterundsofort. Meine heißgeliebten Sambas sind natürlich auch vertreten.

Join the Sneaker revolution!

Sneakerpedia Launch Announcement from Sneakerpedia on Vimeo.

(via)

Veröffentlicht unter Mode, Web | Verschlagwortet mit | Hinterlasse einen Kommentar