Sabtu, 02/10/2010 Website 1727 hits
Ketika Anda mulai terjun sebagai web desainer, Anda dapat melakukan semua yang dapat Anda lakukan untuk memahami prinsip-prinsip dasar desain sehingga Anda memiliki dasar yang kuat untuk memulai perjalanan Anda dalam dunia web desainer.
Ketika Anda menjadi lebih mahir dalam karya Anda, Anda mulai mempelajari teknik yang lebih maju, dan Anda mulai menerapkan hal-hal yang lebih besar dan lebih baik dalam pekerjaan Anda sampai Anda mencapai titik di mana Anda merasa cukup nyaman untuk langkah di luar batas-batas yang biasa.
Kali ini artikel dari SixRevisions memberikan kita inspirasi atau ide yang bisa kita pertimbangkan apabila ingin mempelajari next level dari web desain.
Selamat menyimak ..
When you start out as a web designer, you do all you can to grasp the basic design principles so that you have a solid foundation to start your journey on. As you become more proficient in your craft, you start to learn techniques that are more advanced, and you begin to implement bigger and better things in your work until you reach a point where you feel pretty comfortable to step outside the bounds of the ordinary. What else can you do to take your web designs to the next level?
Here are just a handful of ideas you can consider if you’d like to take your web designs the next level.
If you look at most beautifully designed websites, you’ll notice that they are often set apart not because of big things, but the little details that let you know the designer took great care and attention of even the smallest of things. These small touches don’t need to be in your face to be powerful and effective; details can include a hairline stroke for additional depth, a faint gradient for more interesting surfaces, small icons for added visual appeal as well as to aid visual cognition, and so forth.
Here are three good examples of web designs that delve into the details.
This site rocks with lots of small details that contribute to an overall great design. The banner behind the F6 logo at the upper left corner of the layout has a slight shadow, creating depth and drawing attention through distinction. The shadows behind the large website thumbnails in the middle are also nice for creating depth as well. Small shadows can be seen in a bunch of places if you look closely, as well as hairline highlights too. Unique icons and other small details make this design really shine.
This site design shows great personality through lots of textures, bright colors, and great typography. The navigation banner has plenty of details including unique dividing lines, a wrap-around ribbon with depth, and extra lines at the top and bottom that complete the look. The halftone dotted pattern can be seen throughout the site, not only showing consistency, but also the impression that the designer pays attention to the details.
This site is subtle in colors, but still powerful and loaded with details. Slight shadows can be found everywhere on the site: on the content edging, headlines, dividing lines, and so forth. These subtle shadows are wonderful ways to add small details. The soft glow at the top center of the homepage is a good additional detail as well.
JS libraries can give designers an easy way to implement animation effects and interactivity into their design and, if you’re the braver kind of web designer, Ajax utilities and dynamic manipulation of markup.
You can find plenty of excellent examples of jQuery use in this site design. Most notably, check out the navigation animation, the header graphic that was made functional with the use of hover events, and the scrolling Twitter feed near the bottom. These additions to the site are classy and professional, adding a lot of goodness into the design.
This cleanly designed website has a few jQuery features to heighten the user experience. Check out the "Preview" box on the homepage, which is a jQuery-based slideshow that slickly transitions between pictures. Also, check out the interesting scrolling action that keeps the sidebar navigation and site logo fixed in place. The site’s theme, minimalist and clean, makes the interactive pieces truly stick out.
Additionally, you can also click on the arrows that appear over the banner of pictures, which scrolls through a slideshow of images. Click through the site and you’ll see other jQuery tidbits at work.
Great typography can certainly make a good website even awesomer. There are tons of ways to use fun and out-of-the-ordinary fonts in your designs outside of web-safe fonts (e.g. Arial, Georgia, Verdana).
My two favorite methods are the @font-face CSS property and Cufon. Both methods are different —
@font-face) to not only bring your site designs to the next level, but also to take advantage of Google’s powerful infrastructure to serve your font files.
Let us take a look at some sites with great typography powered by web fonts.
This site design has remarkable typography, including the use of the Steinem font for some headlines (rendered using
@font-face). They have also used beautiful fonts as CSS background text image replacements where web fonts weren’t possible, adding more style and personality to the design.
This site uses
@font-face to display the Museo font, which is utilized by all headlines. The font is just distinct enough to make it stand out, but not so much that it’s over the top "look at me I’m using
Cufon is powering the fonts on this site, including headlines and some standout phrases. Using a special font on the site design gives it a little something extra. This site is so unique in look and style — the font fits right in — adding to the rustic theme they have.
CSS3 has brought about tons of new options for web designers to style their designs effortlessly with. CSS3 isn’t supported in every browser just yet (most notably IE8 and below), but that doesn’t mean we can’t play around with it and create designs that are progressively enhanced. Let us check out some cutting-edge web designs that utilize CSS3.
There are a few CSS3 goodies at play in this web design. They’ve implemented some rounded corners and gradients through CSS. Click through the site to check out the elements they’ve brought in to elevate the site’s design to the next level.
This site that caters to web designers leverages some CSS3. They’ve used the
border-radius property as well as the
box-shadow property for various elements to give them a distinctive look. Also check out the great typography and the use of WebKit CSS transformations.
The images on the homepage use the
opacity CSS property on
:hover. It’s a small effect that adds great attention to detail.
As you can see from the ideas I’ve highlighted, you don’t need to add much — just some extra thought and care and paying attention to the craftsmanship of our work as well as keeping up to speed with our growth as a web designer and staying ahead of the curve. Got more tips for taking web designs to the next level? Share them in the comments.
: tanpa label
Wayang Golek: Bonge Beak Ku Sorangan
Abu Sa'id Al-Khudri R.a. Mendengar Rasulullah Saw Bersabda, "Jika Salah Seorang Kamu Melihat Mimpi Yang Disukai, Maka Itu Dari Allah Dan Hendaklah Diceritakannya Kepada Orang Lain."Dalam Riwayat Lain: "Jangan Diberitakan Kecuali Kepada Orang Yang Engkau Sukai. Dan Jika Mimpi Yang Menakutkan, Maka Itu Dari Setan Dan Hendaklah Ia Berlindung Kepada Allah Subhanahu Wa Ta'ala Dan Tidak Menceritakannya Kepada Orang Lain, Maka Tidak Akan Berbahaya Baginya.Kepada Sebuah Mimpi
Kini saatnya memiliki website/blog professional dan memiliki prestise baik untuk pribadi maupun instansi/perusahaan. Layanan VPS maupun Dedicated Server dengan harga yang terjangkauLearn More
Memerlukan layanan Jasa pembuatan website ? Jangan ragu untuk menggunakan layanan GaluhWeb yang telah digunakan oleh puluhan Pelanggan. Ayo tunggu apalagi ?Learn More
Gunakan identitas bisnis atau blog dengan domain yang keren. Harga murah dengan fitur melimpah. Buruan daftarkan domain anda sebelum keduluan yang lain :)Learn More