Website Designers Unite! Or just read... :)

[ZaLiTH]

Website Design Resource List

So... I know the "Chill Out" section of this forum doesn't really allow users to give or receive reputation, but this doesn't really fit in with the other categories.

My idea is for any SevenForums members who have anything to do with website design / development to share tips / tricks / knowledge / libraries / resources / etc, in the pure interest of sharing knowledge.

If you have any helpful or useful tips and tricks with regards to any part of the website development process (from design to coding, images, layouts, etc) post a link here with a short description of why or how you found it useful, and include the average level of knowledge required to make use of it. If you want to give an example of some code, go for it... Just try keep it short and to-the-point.

Here's a CSS extension I've been using for a little while now, this allows more intelligent nesting of CSS properties, along with variables (similar to those found in PHP or JS). The end-user must have JavaScript support turned on, but since that's a pretty common requirement for most websites these days, I haven't found any compatibility issues with using this extension.

Source: LESS « The Dynamic Stylesheet language
Required: Semi-comfortable in CSS

So... Let the sharing of knowledge commence! Or throw a brick at me and put me back in the dark corner... I think I saw a few cookies there last time.

   Note

I am only just beginning my quest in website design, and I can't afford to do any official courses, so I'm making good use of Google...

Free tutorials are all I have to go on. I think sharing knowledge and tips could be a great help to anybody else who either dabbles in or simply wants to learn better ways to handle the same old scenarios.

Either way, I am going to learn as much about website development as I can, and if my experiences and researching can help someone else along, great. I think it would be cool to have a place where many people can do the same thing, and therefore help each other along the ever-changing-TRON-like-world that is our world wide web.

 

[ZaLiTH]

To help keep this section cleaner, each piece will be ordered alphabetically inside categories.

Entries added since last update are marked with a * at the beginning of the line.
-===========================-​

Code Editors
Notepad++ | 5.8.7 - It's notepad on steroids... And it's free.
Programmer's Notepad - Another notepad-style application, possibly more useful for scripting purposes (with regards to websites).
* PSPad - Universal free text editor for script writers and developers.

Code Editor Plugins
* ZenCoding - Type HTML and CSS using a powerful abbreviation logic engine. (Various editors supported)

CSS
Blueprint: A CSS Framework | Spend your time innovating, not replicating - A CSS framework to base new sites on.
CSSDesk - Online CSS Sandbox - Test and develop stylesheets in real-time.
LESS « The Dynamic Stylesheet language - Variables, mix-ins, operators and functions in your stylesheets. Works on either client-side or server-side.

JavaScript
Highslide JS - JavaScript thumbnail viewer - Lightweight and highly customizable photo gallery library (be sure to check out the 'Configurator' link on HS site).
jQuery: The Write Less, Do More, JavaScript Library - JavaScript with countless tweaks and improvements to the coding process.
jQuery UI - Home - Low and high-level site interaction through themed widgets (based on jQuery).

Website Hosting
Free Web Hosting with PHP, MySQL and cPanel, No Ads (000WebHost) - Free and paid hosting options.
Free Web Hosting with cPanel, PHP, and no Ads (x10Hosting) - Free and paid hosting options.

Resources and Useful Apps
* 365PSD - Free PhotoShop template files for various elements.
Font Squirrel | Download Hundreds of Free @font-face Fonts - Use any font for website text, even if it's not on the client PC.
* PixeDen - More free image resources for website design.
* PremiumPixels - Free image resources for website design.
Screen Ruler - A transparent, re-sizable and movable on-screen ruler for measuring virtually anything your monitor displays.

 

[computertech19]

I'm just a beginner web designer but I'm taking a web design class and am using Photoshop, Dreamweaver, and Flash Pro. I'm so glad to not have to do HTML by hand anymore.

 

[mickey megabyte]

bring your thumbnail images to life with highslide.

simple to implement and customise - and free to use on non-commercial sites.

 

[Prisoner]

I'm just a beginner web designer but I'm taking a web design class and am using Photoshop, Dreamweaver, and Flash Pro. I'm so glad to not have to do HTML by hand anymore.

Dude! Doing it by hand is half the fun! xD


Anyway.
X10Hosting for hosting sites. I use it, and personally, I think it's awesome.

jQuery for short JS (and some neat animations...)

Cssdesk to test out your CSS.

 

[xarden]

The ultimate webbuilders tool:
Notepad++

I don't use anything else.

 

[ZaLiTH]

Dude! Doing it by hand is half the fun! xD

Oh yeah, I definitely agree there... My DreamWeaver is also either in 'Split' or 'Code' view. Lol. Only reason I use split view is to see a live view of my site as I write the code for it...

The ultimate webbuilders tool:
Notepad++

I don't use anything else.

I don't know if I'd tell people to only use N++... I mean, sure it's one of the first things about MS Windows that I replace (Notepad), but each to their own I suppose.

Update
I updated the second post with the links, also added one or two from my bookmarks bar.. I think this thread may just work out nicely after all.

 

[mickey megabyte]

for some reason, i've never got into notepad++ - i'm a programmer's notepad kinda guy...it's good to have a choice.

i expect most of you know, but filezilla is a crackingly good ftp program.

both programs are free and open-source.

another useful freebie is screen ruler.

 

[ZaLiTH]

for some reason, i've never got into notepad++ - i'm a programmer's notepad kinda guy...it's good to have a choice.

i expect most of you know, but filezilla is a crackingly good ftp program.

both programs are free and open-source.

another useful freebie is screen ruler.

I've known about N++ for ages, but Programmer's Notepad is a new one to me. Looks pretty cool though, I like the project folder list idea... Notepad++ can do something similar, but only if the 'Explorer' plugin is installed, and it's not the most user-friendly plugin either.

One question though: can you drag a folder into the application window and have that folder open in the project view? Or is it only for defined projects (like most other IDEs)..?

Screen ruler is also a new one to me, seems there's a few good utilities from that website.. I'll definitely have a look.

I think I'll refrain from listing FTP or general 'upload/download' programs in list (second post), I want to try keep it as more of a 'website design' thread than a 'website development' if I can. Focusing on tools that help with creating a website either from scratch or on templates. The website hosting is useful because there are so many different hosting pads available, it's nice to have recommendations from people who've actually used them.

Thanks for the links; second post updated.

 

[mickey megabyte]

...

One question though: can you drag a folder into the application window and have that folder open in the project view? Or is it only for defined projects (like most other IDEs)..?

...

to be honest, i've never tried using 'projects'.

i'll have to look into it that feature.

i normally just open individual files from explorer/filezilla as i need them.

 

[z3r010]

The ultimate webbuilders tool:
Notepad++

I don't use anything else.

Yep, that's all I use.

 

[ZaLiTH]

to be honest, i've never tried using 'projects'.

i'll have to look into it that feature.

i normally just open individual files from explorer/filezilla as i need them.

No problem, I can try it myself and see. I've been searching for an app that has that functionality (similar to 'TextMate' for Mac's OSX), so my curiosity simply got the better of me and I had to ask.

 

[ZaLiTH]

Just in case anybody is interested, I found a site recently with not only information on how to, but tons of free packs for download to use any font on a website without needing to convert words to images first. I'm really surprised at how easy it is too... Put the link in the second post.

 

[Prisoner]

I forgot to mention when I first posted, but 365psd.com is a good resource site for those with Photoshop. Everything still works in Gimp, but the PSDs sometimes have some features implemented that Gimp doesn't recognize and/or can't handle. Still very useful either way, though.

 

[Blandu]

Hello!

I would like to ask your opinion about a site. Please be as honest and straight forward as possible.

The website serves as a presentation platform for a sales company.
Please take in account all the aspects.

Thanx a million!

There is the website: Rainbow Intermed www.rainbow intermed.ro

 

[Imperfect1]

I like this new thread very much, but wouldn't it make more sense to have it relocated to either the Software or Customization section? [Or even to have a new section or a new sub-section Sticky created for web design tools?]

 

[LTFUbar]

I use Pspad http://www.pspad.com/ on the outside it looks to have the same features as Notepad++
Mostly do PHP, JavaScript, CSS and MySQL and enjoy using a text editor over Dreamweaver any day.

 

[ZaLiTH]

I like this new thread very much, but wouldn't it make more sense to have it relocated to either the Software or Customization section? [Or even to have a new section or a new sub-section Sticky created for web design tools?]

It's not exactly a 'new thread', I created this way back in February, but it never really took off.. Honestly, I'd forgotten about it until I saw it had any replies. Maybe I should've opened it in the software section instead though... Lol. Oh well, such is life.

I use Pspad http://www.pspad.com/ on the outside it looks to have the same features as Notepad++
Mostly do PHP, JavaScript, CSS and MySQL and enjoy using a text editor over Dreamweaver any day.

Thanks.. I'd forgotten about that one. Added to the list.

Please note: I'm not just adding entries I find in a Google search or anything like that, the list is intended to be a list of resources that people actually use and want to recommend to others.

 

[A Guy]

Today, Smashing Magazine turns five. It’s hard to believe that the years have passed so quickly. Many things have changed, but when we look back, we realize how wonderful and sometimes even intoxicating the journey has been so far. And you — who made us what we are today — deserve a special thank-you.

To honor the occasion, we have a humble gift for you: the free “Best of Smashing Magazine” Anniversary eBook.


Table of Contents
“Thirty Usability Issues to Be Aware Of”  —  Vitaly Friedman
“Ten Principles of Effective Web Design”  —  Vitaly Friedman
“Clever JPEG Optimization Techniques”  —  Sergey Chikuyonok
“Typographic Design Patterns and Best Practices”  —  Smashing Editorial team
“Ten Useful Usability Findings and Guidelines”  —  Dmitry Fadeyev
“Setting Up Photoshop for Web and iPhone Development”  —  Marc Edwards
“The Ails of Typographic Anti-Aliasing”  —  Tom Giannattasio
“Mastering Photoshop: Noise, Textures and Gradients”  —  Marc Edwards
“Better User Experience With Storytelling”  —  Francisco Inchauste
“The Beauty of Typography, Writing Systems and Calligraphy”  —  Jessica Bordeau
“Web Designers, Don’t Do It Alone”  —  Paul Boag
“Making Your Mark on the Web Is Easier Than You Think”  —  Christian Heilmann
“Responsive Web Design: What It Is and How to Use It”  —  Kayla Knight
“I Want to Be a Web Designer When I Grow Up”  —  Michael Aleo
“Persuasion Triggers in Web Design”  —  David Travis
“What Font Should I Use?”  —  Dan Mayer
“The Design Matrix: A Powerful Tool for Guiding Client Input”  —  Bridget Fahrland
“Why User Experience Cannot Be Designed”  —  Helge Fredheim
“Dear Web Design Community, Where Have You Gone?”  —  Vitaly Friedman
“Make Your Content Make a Difference”  —  Colleen Jones
“Two Cats in a Sack: Designer-Developer Discord”  —  Cassie McDaniel
“Print Loves Web”  —  Mark Cossey

Source

A Guy

 

[ZaLiTH]

To honor the occasion, we have a humble gift for you: the free “Best of Smashing Magazine” Anniversary eBook.

After four failed attempts to download the 52.9MB ZIP file, it finally finished without errors.. And then I find the only find I can or will ever use in said ZIP file is a 16MB PDF. :sarc:

Well, thanks for the link anyway.. Should make for an interesting read.