David Slack - Web developer

Latest content

jQuery - Use of siblings

Dave's picture
Submitted by Dave on Mon, 30/05/2011 - 17:59

How good are siblings? I've just got 390 lines of code down to 20! They're very good!!

I've been playing with jQuery for a website I'm doing and I'd had to move one element to another element and fade it in. I had to do this 94 times.

To do this I gave each element an ID and used that to move and fade in on a mouse over to another element. I was going to use vanilla javascript within php and loop all the elements.

New book - jQuery: Novice to Ninja

Dave's picture
Submitted by Dave on Sun, 29/05/2011 - 13:10

Been using jQuery for a few years on and off and figured it was about time I got a book a really learned what it's all about. I had a quick look and got jQuery: Novice to Ninja for my Kindle. I'm about 15% of the way through and finding it all very interesting, like when CSS first clicks!

Right tools for the job

Here is a list of usefull tools I use for creating websites

Spam

All sites have the potential to grow very big, very fast and the bigger the site, the more spam your site will attract.

Your first defence against spam is to try and stop the automatic spamming by bots, this is done with a CAPTCHA. It creates an image with letters and numbers a bot cannot read so only humans can post to your site (well, that's the idea).

Local Server on Windows: WAMP

If you want a local server to create your web sites on your home computer to test them before sending them out into the real world then WAMP is for you. When you have it all set up you simply drag a folder into the www folder and go to localhost/FOLDER-NAME to see the site. This will run all the PHP as server side. If you don't want to use the www folder then you'll also want to set up virtual hosts. Keep reading if this is what your looking for.

Servers

If you need to install anything to do with a server you can find help here. If you can help with any server instalation stuff let me know and I'll get it up here.

Senua Digital

This website is created using Drupal but is not the usual ecommerce site. The site is a place holder for products that will be created later with the Senua Digital brand.

SEM (Search Engine Marketing)

SEM or Search Engine Marketing is a way to get your website on to and up as high as posible on the search engines. You do this by link-backs and links.

Link-backs are links to and from your website so you link to a page on the web and they link back to you. Search engines pick up on this and move you up the rankings depending on how valid the link-back is (do the two sites/pages have info in common?) and also how valid the site is (is it a spamming forum or a .gov website?)

Documenting the Mundane

Documenting the Mundane is a side scrolling website made with a bespoke CMS. The CMS is created using PHP and has no database with it. 

Spell check in Dreamweaver

Select Commands > Check Spelling or press Shift+F7.

Dreamweaver CS5 Code hints

In Dreamweaver if you start to type a word then it will show you a list of what you could want. For example if you type '$_p' it will show '$_POST' and you can click or press enter to have it finish the word.

But, what if you want to see the list before you start to type? Then try holding 'Ctrl + SPACE' or 'cmd + SPACE' on a mac

Drupal theme - Editing the files

Info

The first file we want to edit is the .info file so open the file in your editor. This file controls all the settings of the Theme and without it Drupal will not see your theme. Here are some of the things you can add:

Drupal theme - Create Folders and Files

First thing we need to do is create the folders for the theme in the correct places then create the files that are needed. So lets start with the main folder. There are a few places to put your theme but we will use the standard so as not to mess up any updates and make the theme easily movable.

We will use the design for Dodgey Daves Discount Emporium so make sure you have the Fireworks png to hand.

CS5 Tips

Any tips for CS5 I find that are useful I'll add here. Some may work on CS4 but I'll only test for CS5

Split code button in Dreamweaver CS5

The split code button has been left out of CS5 as it was left out in CS4 so to add it all you do is edit the xml file for the toolbar.

Creating a Drupal theme

So, we have a design in Fireworks and a website created with Drupal how do we bring the two together? We create a theme (called template in some systems) using our design and add it to our website.

What is a theme?

In Drupal, a theme is a group of files and folders all added together in one main folder to change the look and feel of a website. There are some files that are needed and some that are useful but in the end they create the look and feel for the whole site. Using a theme you can theme each page, each part of the site, just the home page or many other things.

Video, movies and animations

I have tried many ways of putting a movie on line and the best way seems to be using the modules already installed.

Make sure you have WYSIWYG and TinyMCE installed and you have enabled the Media button and then you can either upload a wmv, fmv or f4v movie or use a youTube video.

Design in Fireworks

Fireworks is without doubt my favourite software find of the last few years. It has all the best parts of Photoshop and Illustrater for web designers. It uses vectors to create and it allows you to output in a range of bitmaps, for layout it is an amazing tool.

Pen and Paper

Some people will say it's a waste of time using pen and paper when you can simply use Fireworks, but, sometimes a bit of paper and a pen is a good way to start.

I was on the phone with a client a few months back (after seeing their brand that day) and while they talked about what they wanted I used the back of an envelope to sketch a design for them. I didn't have Fireworks to hand.

So, I've used a bit of paper to sketch a rough design (see the attached image). It's not great but it gives an idea of what I want to work to.

Design Tools

For designing my websites I use:

Pages

Latest content

What is a Senior Developer
There are lots of developers out there with varying degrees of experience and expertise, some mid level, some junior and some senior. Some...
Read more...
Symfony
First thoughts are Symfony is ace!Only been using Symfony for 1 project but the amount of coding it has saved has been worth the time spent...
Read more...
Lost and Found
The Lost and Found website was built by myself (David Slack) and designed by Arm & Eye.The site was created to promote a bar and...
Read more...
Read more...

Social networks

Contact me here or catch me on one of
the social networks below


What I'm listening to

Off-site News

More

My blog

What is a Senior Developer
Wednesday, 2 August, 2017 - 06:56
There are lots of developers out there with varying degrees of experience and expertise, some mid level, some junior and some senior. Some developers...
Read more
Symfony
Tuesday, 5 March, 2013 - 09:49
First thoughts are Symfony is ace!Only been using Symfony for 1 project but the amount of coding it has saved has been worth the time spent learning...
Read more
Web design "Fold" myth
Monday, 3 December, 2012 - 10:07
As a web developer and web designer I need to take into account everything on a site from SEO, marketing, usability across devices, the look and feel...
Read more

Try this on your mobile

Use your QR reader to read this

You should be able to use this right from the screen

Latest tweets

Calendar

Thursday, February 1

M T W T F S S
 
 
 
1
 
2
 
3
 
4
 
5
 
6
 
7
 
8
 
9
 
10
 
11
 
12
 
13
 
14
 
15
 
16
 
17
 
18
 
19
 
20
 
21
 
22
 
23
 
24
 
25
 
26
 
27
 
28
 
29
 
 
 
 

You are here

Home » Latest content
Back to top

Copyright David Slack - Web developer