Jump to content
xisto Community

twitch

Members
  • Content Count

    520
  • Joined

  • Last visited

Everything posted by twitch

  1. I take much joy in putting down IE and Opera. But the thing is, how is software meant to grow and develop if the developers of it aren't given the information they need to suite it to their audience. Microsoft's primary goal is to please the public. However, due to their pleasing nature, they have to cut corners and provide patches when there are road-bumps. Many people still use IE, and that is the way it is going to be as long as computers come pre-bundled (Windows) with IE. Majority of the focus group are not as computer literate as us, so they do not realise the true extent of problems that Microsoft IE causes. Even if we were to present a list to them, they would still use IE because it is less stressful to learn (apparently). Switching from one thing to another can take time, as people do get attatched to the stuff they use. For example, I was determined to keep using the WYSIWYG editor of Namo WebEditor 6, and I even recommended it to others. But when I forced myself to Wordpad and Dreamweaver code view, I realised what a mistake I had been making. So, what am I talking about? We need to get people to understand the problems of IE first of all. Then once people understand, we can start to show them the different browsers which crush IE for all of it's mis-spent glory. Comparison charts and reports help people to be open to other and in this case better browsers. If we had such a thing, and it was well known about, then perhaps non-compliant browser users would make the switch. Remember that not everyone will change their habits due to the word of mouth. On your site, if you could give the following points, then I'm sure it would be a better success: Provide a comparison chart between the major browsers and include a running commentary on it Provide links to other resources of studies, reports, etc based on the different browsers Provide figures of the people using compliant and non-compliant browsers Use simple terms and don't over-reach.
  2. Well, people in the UK have the chance to download some cool packs (for free). The featured ones (most people in other countries only get the stupid boarding one I think) are 3, XBOX360, Some new trainer things and a few others. The rest you need to pay for.Personally, I prefer the dynamic avatars. The dynamic backgrounds are far too heavy for the application, so I find every other program slows down.
  3. Actually yeah, I keep watching the Ice Skating parts. There's something about their graice that makes me watch. Other than that, not really.I find curling boring, although there are a few interesting women on it
  4. Try going to Add New Content. Then, in the WYSIWYG editor, there is a Flash button (represented by te Flash .swf file icon), click on it and follow the steps from that. I think you will need to upload your .swf file first and then provide the external link to it.You don't need to directly place <object> tags into the source code for it to work.
  5. Some free softwares are now classed as adware, as they bundle other softwares with them. For example, CCleaner bundles the Yahoo! Toolbar (but which software doesn't ), so it is now classed as Adware, although it allows you to choose whether it is installed or not.Personally, I loved Avast Antivirus software, and it also came with anti-spyware which was a bonus. This was until I installed McAfee virusscan.From experience, I have learnt that AVG is not that great. It used to let all of the latest viruses through the comuter and ruin it to the point where I had to get a new one.Overall, you are best saving up and then buying your antivirus software. I wouldn't go for Norton, it does hog resources and messes with anything that doesn't have the Symantec logo on it.My uncle (IT Tech) recommends AntiVir Personal Edition (http://www.avira.com/en/free-antivirus-windows) for free ones. I haven't tried it, but it must be decent.
  6. Lol. Anyway, hello on behalf of me (always wanted to say that).Just watch out when posting this video of yours that it isn't directly taken from somewhere else.Good luck, and happy posting (cheesy I know, but someone has to say it).--mik
  7. Welcome to the community elevenmil, and I like to see that you are getting into it seriously now .Anyway, hope that you find this place as great as I do, just watch out for microscopic^earthling (m^e) he's a strange one --mik
  8. This is very strange. I use CCleaner, and have the latest version (I have been using it for a very long time now) and I have had no troubles. The latest versions do come with the Yahoo Toolbar, but you have the choice to install it. One problem I do find though is when you are installing it, the installer will only work on computers with internet access. IF you tell it not to update, then it closes the installer before it has done anything.
  9. Step 4 â Finding your way; creating a menu There are many web designers out there that ruin their efforts because they donât put the due care into making their navigation. If you donât properly structure your site or have a usable menu, then youâre literally dead in the water. Overcoming the mass problem of bad site structure and navigation is simple, as long as you take your time and review it. Whenever I make a design, I spend most part of it constantly refreshing the menu; whether it be the spacing, colours, font or even adding accents like bullets. When you put effort into your work, you will get the recognised return on it. So that you know what type of menu you should make in the future, here are a few simple pointers. Vertical menus are much preferred over horizontal ones. This is because vertical menus are often easier to amend/add-to. This is because most layouts are expandable, in a vertical sense. Horizontal menus are also constricting when it comes to space, just think about it, you can only have five or six decent sized menu items for a 1024x768 screen resolution. Text based menus are more sightly and better for loading times than 100% graphics. Unless your design requires that you use 100% graphics to create your menu items, I suggest for your sake that you keep away from them. Great effects can be created with a small graphic, CSS and XHTML. Use standard or obvious terms, it will help with your site being indexed and causes less human confusion. I have come across some sites, where I couldnât figure out how to get to the home page, because all of the menu items were named completely strange things. This can be very annoying, so just keep it short and simple. Avoid flashes of imagery or bright colours, as some of your audience may suffer from acute headaches, migraines and/or epilepsy. Starting with the rectangle tool, draw a rectangle that is (x25,y75) and (w190,h3). This will create a short bar that is exactly 10 pixels from the bottom edge of the logo icon. Give it a solid colour of #385A77. If you have been wondering at all throughout the design process, how I get the colours that work, itâs rather quite simple, but it takes about a minute or so. To find a colour from the beginning: Change the appearance of the colour palette, using the right-facing arrow. I usually change it to continuous tone; it helps with me seeing the true colours. You do not have to do this though. Select a blue from the palette. I have gone with the mild #0099CC. Once you have the base colour, click on the colour wheel, found along the top border of the colour select palette. Select a soft blue using the crosshair on the main system colour palette. Then, change the tone level to suite you. To find a colour for other elements after base colour is made: As you will know you base colour, simply enter that into the HEX, then using the colour wheel symbol, change the tone or base colourâs so that it fits in with the overall primary colour. Moving on, weâre going to change the solid colour so that it doesnât stand out too much. Transparency, or better known as Opacity, is what controls the amount of visibility the object has. For example, a glass has an Opaque appearance, this means that light can pass through it at around 50%. The other 50% is refracted and reflected to our eyes, so that we can see it. An object that has 0% opacity is invisible and something with 100% opacity is solid, like wood. The opacity control can be found in the properties panel, on the right hand side. Change the opacity to 45% This bar will act as a visual divider, separating the header from the navigation. Please be aware, that things like this will not be used as images, simply because there is no need. As we can not use CSS during the design phase, we have to represent CSS elements with graphics. Also be aware that this is just the canvas size, and not absolute. When we come to developing, most items will be in a percentage. Now we are going to be creating the bullets for the menu items. I always make my bullets the same size â 13x13 pixels. This helps to keep them properly-aligned with the text that follows it. To make bullets though in Fireworks, it is much better if you use the bitmap tools. The bitmpa tool which will be the most use for us is the Pencil tool. However, before we even think about touching it, we need to make our first rounded corner rectangle. Now most people would use the preset rounded rectangle tool to create it. But trust me, when you want an easy way to make four corners the same roundness, then use the roundness feature within the properties panel. So, to start making our bullet, use the rectangle tool to create a square that is 13x13 pixels. Give it the solid colour of #6F8C77, which is a moss like colour, but works well with the existing colour scheme. Remember, colour co-ordination isnât just about one colour with different tones, itâs also about seeing and using a multitude of colours and tones that match the primary colour. It takes time to find colours that match manually, but the effort is well worth it. Anyway, to give our rectangle the rounded pixel look, use the Rectangle Roundness feature within the properties panel and set the level to 27. To avoid the corners from blending in (which would remove the feel that we want), make sure you set the Edge to HARD. Next step is to create the bitmap arrows that will form the main part of the bullet. Select your rectangle, and zoom in so that it covers most of the window. You can use the keyboard shortcut CTRL and the plus (+) sign. You should then notice that the rectangle has one pixel missing from each of the corners. Anyhow, to start creating the bulle, select the Pencil tool, and start the pattern of two across and one down. When creating arrows for the web, always use the 2-1 method, it gives a nice looking bullet that is still subtly noticable. Use the solid colour #DAE6F0 for the first one. Use the following colour #B8C7BC to create the second bullet. Make it 2 pixels from the edge of the last one. To make it easier and quicker for yourself, you can copy and paste the arrow, move it into position then go to the Effects (in the properties panel) Adjust Colour then Colour fill. Change the Normal to Colour and apply the colour stated above to make it a different colour immediately. Using the effects feature within the properties helps cut the time down what it takes to reproduce items. Since we have the bullet, it is time to add the text. Using the text tool, on the tools panel, create a new field and enter Home page into it. Set font to Tahoma, size 12 and colour to #3D607C. Remember to make sure that there is NO anti-aliasing. If there is, then it goes all smooth and will not represent what it would look like in the browser. To make sure that we align it properly with the bullet, zoom in so that you cansee both closely. Then, from the capital H, make sure it is in the middle of the right edge of the bullet. Once you have it aligned, hold SHIFT and press the right arrow key ONCE to move it exactly 10 pixels. This helps to save time, rather than pressing the right arrow key ten times. In all, that wasnât too difficult, and to be honest, once you know your way around Fireworks, it only gets easier. With that said, weâll now fill in the rest of the menu. Using the copy and paste feature, space 4 more items 5 pixels in distance from the bottom edge of the bullet to the top edge of it (see screenshot below if you donât get it). To finish our little happy menu off, weâre going to add a base divide, similar to the top divide. Using your skills, create a rectangle that is align with the top one, 10 pixels distant from the bottom edge of the last menu item bullet, width 190 pixels and a transparency of 30. IF you donât remember the transparency part, then I suggest you start reading this step again. Change the height of the object to 2px. (see the screenshot above).
  10. I think I might give it a go. Presuming that mods can also take part B)Anyway, give me about four or so days to come up with it, got school soon and some work to finish off.--mikP.S. I'm going to have to put my back into it to compete with Reaver's or Final Design's.
  11. SP2??? Are you mad. I have the basic XP Pro with no service packs, and just keep my Anti-Virus/Firewall up-to-date and it suites me fine. Whenever we have SP2 in, our modem starts messing up and there is nothing that can be done, as the supposed 'fix' still leaves errors.What's your graphics like? I suppose it would be a 128Mb card or better.
  12. Well, what you just mentioned was a list of common sense factors. I do them automatically without thinking. But here's my piece. Make sure that every step is outlined in detail and explain the relevance. Connecting to your reader helps them to get more involved and feel as though they are making it, not just doing what you did. If you come to a point that involves using a skill acquired previously in your tutorial, direct them to re-use it instead of repeating yourself. They can only gain true experience if they have to do things without being 100% spoon fed. When using screenshots, make sure that it relates to the previous paragraph or the next one. It is no good having a screenshot of your favourite actress ona tutorial about connecting to a wireless network. Also, screenshots shouldn't be HUGE, they should be able to fit into the window. In my first couple of tutorials, I used full-sized screenshots to show what was happening. It ate away at my BandWidth and was a stupid thing to do anyway. I tend to take a screenshot, edit out the taskbar, then re-scale the picture so that it is 510x368 pixels, then save it as a JPG. I also like to put down why we do things the way we do it. Especially on web-design/development tutorials. It helps the reader understand things on different levels, therefore helping them in future projects. --mik
  13. Thanks moonwitch, now I can finally get onto converting it into Fireworks, and then use it to recreate the Xisto - Web Hosting logo .I just wish I could tolerate Photoshop to use it. Maybe the merger of Adobe and Macromedia will result in Fireworks 9 being a half-way system incorporating advanced bitmap features of Photoshop.
  14. I think we get the idea now:IF you're going to flash your drive, then you only have yourself to blame if it goes wrong.But if you do want to flash it, then go ahead and try and make it better.
  15. All the routers I have come across here in England have been at frequencies in the low Gigahertz (yes, I did say Gigahertz).An example of the wireless problem I came across was the signal not being picked up by the other end. This was on my auntie's other computer, which they had just bought from my uncle so that they had two. Anyway, I went and upgraded the computer to XP Pro, and very easily set up the connection. The mains router is upstairs, and the reciever downstairs. Both sides work perfectly.The problem my other uncle faced was that (him being an intermediate IT technician) he over-complicated matters (doing all sorts of random stuff). As both computers are XP (and Pro) it was easy to install (due to the drivers already available). Simply plug it in and wait for Windows to load the driver database for it.At school, as it uses multiple wireless connections, there is an overlap of signals, so sometimes we can not connect to log on. Other times we can.I remember a few years ago when it was all leads to do multiple comuters on the Internet.
  16. If that is the case, then why not review their TOS and also the small print. If you turn out to be in the right, then send in a complaint.
  17. In total, it has so far taken me 8 hours to make it, get the screenshots, eat and drink, and write about it. Before I released Step 3, I re-wrote it.
  18. Ah, so it is like that is it. Just remember who can actually USE A GRAPHICS EDITOR. I would explain to you what one is, but I have better things to do. j/k.Thank you MoonWitch, I really appreciate the vote of confidence, and the vote of we know what B)Come one guys (or gals) where's your enthusiasm.
  19. ***ISSUE RESOLVED, TOPIC CLOSED***
  20. Step 3 – Head’s up; start with the logo The first two steps have been covered (and I hope you have been saving it), so now it is time to have a quick review of what you should have. Your screen should look similar to the below. Hopefully it does, because if there is anything completely different, then I suggest you back through the previous two steps to figure it out. In design, there is no room for idol mess. If you genuinely forgot to do something, then you’re not a bad person really. Anyway, moving things on you need to get your logo made. To keep in line with the UKISS theme we are adopting, we need a logo that is modular in design, with hard edges but subtly blends in with the rest of the theme. This is a great disappointment to those that like having psychedelic colours splashed across the screen, but tough. To be a true designer, you must get past personal comforts and put yourself in other people’s places. Would you like to spend half of your time waiting for a page to load because it is filled with meaningless coloured junk? Producing a logo can often be hard and strenuous on your creative ability. Therefore, you’re going to struggle in the future, as I and all of the designers out there do. But, as we are only making a temporary logo, we don’t need to concentrate to heavily on the style of it. So, to start your logo, select the rectangle tool, and draw a rectangle that is (x25,y25) and (w40,h40). This should produce a box that is 40x40 pixels, 25 pixels from the top and left sides. If it doesn’t, then you have simply done something wrong. It is more than likely that if you are continuing from the last step without closing down Fireworks or working on another project, that the box will have a linear vertical gradient, but this doesn’t matter as we can easily change this. To give you an idea of what we will be making, here is a completed version. Select your rectangle, and remove the solid colour. To do this, click on the colour type select and click on none. Now your box should become invisible. This is because there is no stroke, which is the line surrounding an object, nor is there a colour fill. We are going to apply a stroke, in order to get the border appearance shown on the preview. Firstly, click on the colour filler box on the right hand side of the pencil within the properties panel. This will bring up the colour palette. Into the HEX selector, put in the following code: #729DC0 This will produce the desired colour. It should also make it a 1-Pixel Hard (or Soft) stroke. If you have keen eyes, you would have noticed that I have changed Rectangle to Bg in the Layers panel. Every time you make a new object, it’s always best to change the name of it in this panel, that way it is easier to find and edit at a later point. You do not have to do this, but it certainly helps me. To change the name of something in the Layers panel, double click it and then type in your custom name. We’re now going to make the main box of the logo icon. To achieve the same effect, you will need to know the following things: How to make vertical linear gradients How to apply first and second colour If you don’t know any part of these two parts, I suggest you go back to Step 2 and re-read it. Hint: it is the same way we made the background. Create a rectangle, that is (x27,y27) and (w36,h36). This will more than likely create a similar object to the border. Take off the stroke (the same way as you take off the colour fill), and apply a vertical linear gradient with the first colour as #78A1C1 and the second colour as #355773. It should create a gradient square that looks like the below. To get the dynamic, switch-like graphic as well, it requires a bit more skill. Make another rectangle within the box, that is (x30,y30) and (w30,h30). When you are creating your linear gradients, you’ll notice two more colour selectors on the top of the coloured bar (see image below if you have no idea what I am talking about). Well, the first one controls the starting transparency level and the second one obviously controls the ending transparency. Knowing that, we can apply a 30% transparency to the first one and 0% transparency on the second. Make sure that the two colour pots on the bottom are filled with #FFFFFF (white). If you didn’t quite understand that, below is a GIF animation which throws together the steps. After this, I grouped the three new objects (excluding Bg). You can do this by hold SHIFT and selecting the objects, followed by going to Edit > Group or CTRL+G. If you think you have done making the logo icon, then you are unfortunately wrong. Sorry. This part requires that you have a specific font, named baby blocks. I do not have permission to redistribute this font, so you will have to download it from the place I did. But to save you time, I will put the direct download link for you. Click here to obtain the Baby Blocks font. If you haven’t installed a downloaded font before, then here is some instructions (for PC users only). Download the file. You will now need a ZIP file extractor. If you are using Windows ME or XP, then they come with built in self-extractors. IF you aren’t, then you can use either WinZip which is a good all round ZIP file extractor or WinRAR is another favourite. Once you have downloaded these and installed them, double click on the font file you downloaded in 1, and extract the font file (TTF) into C:\Windows\Fonts (or whatever you have for C:\ ). If you have a partition, then your Windows folder may be named something else. Just make sure that the path you are extracting into is correct. If you don’t know how to extract, then I suggest you look at the Help Files that come with the software. The font will be ready for you to use in Fireworks. Using the Text Tool (the capital A found on the Tools Panel), creat a small field which you can enter your text. Once you have marked it out, type in a letter, I have used P which stands for Personal Page. You can have whatever you like. After you have done that, you’ll need to move it so that it doesn’t look out of place. In order to do this, use the Pointer Tool (keyboard shortcut 0 or V). Then, select your text field and move it so that it is at (x30,y24). To resize it, DO NOT change where it says (w,h). If you do, it will screw up. Simple as. You need to manually change the size using the pointer select tool, and click on the square dots around the field, to change the size. Make sure that it is (w30,h35) this way it will be in the middle (sort of). To put the text in the middle, you should see a centre align on the properties panel, click it and your letter should be in the center. Remember, when handling Baby Blocks, capital letters are put into blocks, so use lower case whenever I mention using Baby Blocks font. Also remember to change the colour of the font to #D2E1ED and the text size to 27. If you can’t figure it out, then look closely at the screenshot below. Now that you are able to create a text object, make the following, using font colour #3A5D79, size 25 and left aligned. Once you have done that, create another one below it, with a slogan or tag line. I used Tahoma 11 to get that effect, and took my time on getting it aligned with the text above it. When it comes to web design, your visitors need to be caught up in the moment of seeing your website. The first thing their eyes will be directed towards I your header, and that is where you should put in the effort. It is often hard to try and create a decent and hook-line tag or slogan, but just thinking philisophically can help. When it comes to personal pages, if you think of Life and what it means to you, it’s much easier to think of your own mini-proverb. If you create a good one, then more people are going to notice it and recognise it with themselves, which opens the connection of being personal with your visitors. So, make it quite but loud. Guess what. You’ve actually finished the header. Because we are going for a UKISS design, there is only often a logo icon and proceeding text. Everything else is classed as pollyfiller.
  21. Introduction In recent times, the push for simple but effective web sites has increased. You don’t necessarily need to know how to create a stunning Flash-full site to get the visitors, and many would prefer you not to anyway. There are many ways to creating that simple site, from delving into hardcore CSS to using tables and invalid HTML. And of course, it is entirely up to you, but just remember one thing - browsers are being redeveloped all of the time to keep up with cross-platform compatibility and out-do each other. The display of tables may be more accurate cross-browsers now, but wait until that faithful day when tables are longer supported and half of your visitors will be looking at a shabby mess of boxes splattered with dollops of colour. Is that what you really want? No. I didn’t think so. To combat the problem of design versus compatibility, you need to make sure that you think on two levels when creating you plans. The first level is to think about the catchy aspect of design. You need to think will this design catch my visitor’s eye, and not blind them? Don’t just make one or two plans, make many of them, then take the best parts of each and adapt them to fit in with each other. The colour scheme then follows. Then there is the second thing to think of. How will you make sure that it works? Are you going to use invalid tables and rely hopelessly that all your visitors use Internet Explorer? Or will you use Mozilla compatible CSS only and have it shown as a mess in IE? It is very annoying, but like most things, until companies design their software around the industry specifics, then problems will always arise for the end users. So that is where cross-compatibility comes in. To overcome the problems laid down to us, we need to design and develop sites that are eye-catchy and functional. So, what does this have to do with KISS/UKISS (Keep It Simple Stupid/Ultra Keep It Simple Stupid)? Well, from personal experience, over-complicating matters always leads to invalid table use. Using a div-conscience approach to design allows the process of developing your work a heck of a lot easier. The transition from clutter to organised space is hard, but with constant attempts, you will be able to come up with your own valid UKISS site. Design Do not fear I am here to help you through both design and development. I wouldnât just throw in the information and not help you get through the deep end. In this following section, I will be taking you through the basics. Macromedia Fireworks (MX 2004 or above recommended) Plenty of fluid and fruit Patience Brain Further resources will be provided throughout Please be aware, that you do not need a very good computer to run Fireworks. Before I upgraded my computer for the third time, it was running on 128MB RAM, 333MHz Processor. With RAM DEF XT (Google term search it), it kept my RAM at a healthy level to work with. I suggest you get it. Now my computer is at 256MB RAM, it can handle a bit more. From here on, it is going to be very image heavy, so donât say I didnât warn you. Please note if the images do not show, then it is not my problem â literally. The servers that my images are at may go down or do anything strange thing. Step 1 â Starting Fireworks and creating your canvas First of all, if you do not have Macromedia Fireworks, then I suggest you download it from the Macromedia home page. You can also buy it from all good software stores. If you are going to be using software other than Fireworks, then I am afraid I can not support you. I have generally no experience in any other graphics program. Once you have downloaded and installed Fireworks, then we are ready to move onto opening and setting up your work space. The work space is where all of the panels are (the Tools, Layers, etc). When you fire up Fireworks it should look something like the below. Now, along the Open a Recent Item column, there is a list of file names. This only appears when you have opened or created and saved a file in Fireworks. At the moment, if you have not used Fireworks before, it should be blank. Click on the Create New > Fireworks File to start a new project. Once you do that, a new box will appear. As you can see, there is a few options for you to control when setting up your new document. Firstly, note the Width and Height. They are displayed as pixels (in the drop down boxes). You can change these to cm, but it is much more accurate and easier to use pixels (px) when designing web pages or any other related graphics. The mock design we will be doing is a personal page. This means relatively nothing, but as you think more in depth about it, you start to wonder one thing that is in relation to this part. What size of canvas should I make? Well, a rule I like to keep is that you design everything on a canvas size of 750px wide and 800px high. Once we get to laying it out, then you will understand why this is. So, for those who havenât quite grasped it, put 750 into the Width box and 800 into the Height box. Resolution for web graphics is best at 72px/inch. Inches are an old unit, but if you wanted to use centimetres, then it would be 28.35px/cm. If you are creating images specifically for high-resolution gaming and model work, then your resolution needs to be at least 200px/inch, for the detail. Canvas colour is something that is entirely up to you. I personally prefer the default setting of White, but you may have it as transparent or any other colour. I use white as it helps me design on an easy surface. Dark text on a Light background is always easier to read, and also helps to prevent me from having headaches or migraines. When you have done with this, select Ok. Hopefully, your new document should look similar the one above. If you have a different panel layout or canvas colour, then donât worry, itâs just my personal profile settings. If it looks completely different, then retrace the above. Throughout this extensive tutorial, I suggest you save at every step, that way youâre not going to loose anything major if your computer crashes or you have a power-cut. I also suggest that you take a five minute break after every two steps, that way your eyes and muscles get a break from the strenuous reading and keyboard/mouse work. Now that we have the fundamental basics up, letâs get started with the design. Design Do not fear I am here to help you through both design and development. I wouldnât just throw in the information and not help you get through the deep end. In this following section, I will be taking you through the basics. Macromedia Fireworks (MX 2004 or above recommended) Plenty of fluid and fruit Patience Brain Further resources will be provided throughout Please be aware, that you do not need a very good computer to run Fireworks. Before I upgraded my computer for the third time, it was running on 128MB RAM, 333MHz Processor. With RAM DEF XT (Google term search it), it kept my RAM at a healthy level to work with. I suggest you get it. Now my computer is at 256MB RAM, it can handle a bit more. From here on, it is going to be very image heavy, so donât say I didnât warn you. Please note if the images do not show, then it is not my problem â literally. The servers that my images are at may go down or do anything strange thing. Step 1 â Starting Fireworks and creating your canvas First of all, if you do not have Macromedia Fireworks, then I suggest you download it from the Macromedia home page. You can also buy it from all good software stores. If you are going to be using software other than Fireworks, then I am afraid I can not support you. I have generally no experience in any other graphics program. Once you have downloaded and installed Fireworks, then we are ready to move onto opening and setting up your work space. The work space is where all of the panels are (the Tools, Layers, etc). When you fire up Fireworks it should look something like the below. Now, along the Open a Recent Item column, there is a list of file names. This only appears when you have opened or created and saved a file in Fireworks. At the moment, if you have not used Fireworks before, it should be blank. Click on the Create New > Fireworks File to start a new project. Once you do that, a new box will appear. As you can see, there is a few options for you to control when setting up your new document. Firstly, note the Width and Height. They are displayed as pixels (in the drop down boxes). You can change these to cm, but it is much more accurate and easier to use pixels (px) when designing web pages or any other related graphics. The mock design we will be doing is a personal page. This means relatively nothing, but as you think more in depth about it, you start to wonder one thing that is in relation to this part. What size of canvas should I make? Well, a rule I like to keep is that you design everything on a canvas size of 750px wide and 800px high. Once we get to laying it out, then you will understand why this is. So, for those who havenât quite grasped it, put 750 into the Width box and 800 into the Height box. Resolution for web graphics is best at 72px/inch. Inches are an old unit, but if you wanted to use centimetres, then it would be 28.35px/cm. If you are creating images specifically for high-resolution gaming and model work, then your resolution needs to be at least 200px/inch, for the detail. Canvas colour is something that is entirely up to you. I personally prefer the default setting of White, but you may have it as transparent or any other colour. I use white as it helps me design on an easy surface. Dark text on a Light background is always easier to read, and also helps to prevent me from having headaches or migraines. When you have done with this, select Ok. Hopefully, your new document should look similar the one above. If you have a different panel layout or canvas colour, then donât worry, itâs just my personal profile settings. If it looks completely different, then retrace the above. Throughout this extensive tutorial, I suggest you save at every step, that way youâre not going to loose anything major if your computer crashes or you have a power-cut. I also suggest that you take a five minute break after every two steps, that way your eyes and muscles get a break from the strenuous reading and keyboard/mouse work. Now that we have the fundamental basics up, letâs get started with the design. Step 2 â Making a base on which to work on I have said this many times before on several forums. A background is the fundamental foundations of a working site. If you do not choose your background carefully, then it will come back to haunt you. In order to create the best background for the effect you are trying to reach, you need to make several attempts. I warn you now, if you think you have made a decent background in one shot, then do it again, because not even the best of the professionals out there can do it. Creating a background that is 99% perfect for your site is a long and hard process, and many prefer to leave it to the end. Those that do not really care about their visitors thoughts often shove down any old psychedelic or plain coloured background as a time saver. One thing you need to get clear with design. It can take MONTHS for the 99% perfect design to be reached. It can also take just a few hours, depending on the thought power. Since I have had a few days at working at this, we can get the best results in only a minute or less. So that we know what we are doing and can design more accurately, zoom into 100%. This can be achieved in so many ways that it is quite amazing. Keyboard shortcut CTRL+1 Use the Magnifier Tool Zoom Level select 100% from drop-down arrow View > Zoom In View > Magnification > 100% Well, five ways to zoom into 100% isnât bad. Now that youâve zoomed in so that you can design it properly, weâll start with the background. Before you can start leaping into making the background, you need to know the colour scheme you will be using. In this tutorial, I will be using the following colours for the background: #97B9D5 This is a soft blue. You may be wonder, why only use one colour? This is the base colour, and seeing as though the magic of Fireworks can calculate the rest of the colours, this and #FFFFFF is all that we need. So, to create our stepping block, you must firstly select the Rectangle Tool found in the Tools panel. Then, draw a rectangle of any size onto the main area of the document. After you have your square, donât bother formatting it just yet. We need to sort out the size and position of the graphic first. Firstly, in the X Co-ordinate change it to 0 (from here on shown as (x (px)) e.g. if x co-ordinate equals 5, then I will show it as (x5)) and the Y Co-ordinate to 0 (from here on shown as (x (px),y(px)) e.g. if x co-ordinate equals 5 and y equals 12, then I will show it as (x5,y12)). By having the rectangle at (x0,y0), it will be in the top left corner, 0 pixels from the left and 0 pixels from the top. If you do not know your co-ordinates in maths, then you will struggle slightly to understand this and CSS background image properties. But I will do my best to explain. Then in the Width box, change the value to 750 and in the Height box, change the value to 800. These two combined will make the rectangle stretch the full length of the canvas, and will look just like the background of a site. If you have no idea where these are found, relate to the screenshot below. Now to make it look like a background. From the screenshot above, you can see where it says Solid in the drop down box. This controls the type of colour formatting that is about to take place. Click in that box, the go to Gradient > Linear. When you have done that, the linear gradient will be horizontal facing. Never design a site with a horizontal background â they are pigs to get right and it often takes quite a lot of time working out how to make them work, as well as the often very large file size. So, to beat this, when designing KISS/UKISS sites, you are best off making a vertical design that goes from the primary colour into white, or a colour that can be completed by CSS later on. This helps reduce file size, loose stress and generally makes everyoneâs life easier. To achieve the vertical gradient, hold left click on the DIAMOND selector on the gradient, and then drag it to the top of the Rectangle. Once you have done that, it is more than likely that the gradient has shifted, but it should still be horizontal. In order to change the direction of the gradient, Hold left click on the SQUARE selector on the control line (if you canât see it, then zoom out until you can) and move it so that it is exactly straight down your document. Once you have done this, you should end up with something that looks like the below. It may take several attempts before you get it bang on straight; it still takes me a couple of times before it finally gets into the appropriate position. The good thing is that we have the gradient and the main part of the background. Now all you need to do is replace the white with #97B9D5 and the black with #FFFFFF. To do this, make sure that your rectangle is selected, then where you changed it to a gradient, there is a box of gradient colour that matches the gradient on your canvas. Click on the box, then on the white little colour selector (see screenshot below). Once you click that, a colour palette appears. Where it displays the HEX code (seen as #FFFFFF), change it to #97B9D5. Then, on the second colour selector, change the HEX (seen as #000000) to #FFFFFF. You should then end up with a happy little background, that will suite us for now. Iâm not saying that it is 100% efficient, but it is as good as it is going to get at this stage.
  22. Creating your own UKISS site from beginning to end Contents So that you know what is happening and when I’ve compiled this contents section. It will also help you got to the parts that you need without scrawling through everything. Introduction Design Step 1 – Starting Fireworks and creating your canvas Step 2 – Making a base on which to work on Step 3 – Head’s up; start with the logo Step 4 – Finding your way; creating a menu Step 5 – Eyes to the centre; work on the main column Step 6 – Extra! Extra! Creating a third column for those tidbits Step 7 – Last thing’s last, making your footer Step 8 – Polishing it off Step 9 – Slice and dice! Getting your image slices ready for the development Swatting Up Step 1 – Getting to grips with XHTML Step 2 – All you need to know about CSS Development Step 1 – Starting your XHTML page Step 2 – Starting your CSS page Step 3 – Comments! Step 4 – Developing the header Step 5 – Hand’s on the wheel, controlling the navigation Step 6 – Setting up rows within the Navigation column Step 7 – Main column; all the nitty gritty Step 8 – End column, not far to go now Step 9 – Footer, the beginning of the end BONUS MATERIAL! Bonus 1 – Clean up your code and validate Bonus 2 – How to set up a web hosting account and using it! Bonus 3 – Useful resources (Italic items have not been uploaded). Due to the size of this tutorial, I will release it in parts over several weeks. Once it is fully released and the kinks taken out of it, then I will make it as a downloadable document. Remember, I am working on it at the time of writing it, so I will be learning some new things as well. Each part will be release into the originating topic, with a link to it on the list item that corresponds with it. PS: Sorry about deleting Abhiram and yordan's posts here. PS2: The screenshots may change slightly in appearence throughout, this is due to the different computers I use.
  23. Cryptic clues. Lol.What I am trying to say is that if you do put person information on your computer that you don't want to share, then make sure you properly configure Google Desktop. IF you don't configure it properly, and use the feature mentioned, then you only have yourself to blame.
  24. It is possible to mask your email address with a fake one. How it is done, I'll never know.Personally, I haven't had this email but my mom did. She told me about it and as soon as I looked at the subject line I deleted it. I thought to myself, why in the whole world would the FBI send my mom something, when we live in England? Stupid wasaks.
  25. Well, that certainly got your attention didn't it. Apparently, according to the EFF (Electronic Frontier Foundation), Google Desktop is a nasty program. To put it simply. Their extremely biased view against Google's creation obviously shows that they are teaming with Microsoft, but that would be slander, so I didn't say that . As you have probably guessed, this EFF company has said "Google Copies Your Hard Drive - Government Smiles in Anticipation" in their main title. But, if you read into the article, you'll find this line. Have they never heard of antivirus or even hardware firewalls? If Google are having this feature, then I suspect they will have the best protection behind storing those files. Afterall, they would be liable for damages. Sorry, but if you are STUPID enough to put this type of information onto your computer, then it is your own doing. Google are providing a genuine service, and the EFF are nit-picking. Anyone with half a brain, will not put tax returns, love letters (lmfao, who wrot this bs) or any other private document onto their computers. Medical files are kept safe in computers with hardware firewalls. If they don't, then they can be charged with violating the Data Protection Act 1998. So? If you get your things taken, then there must be a valid reason. If and when they are taken, use your rights to get them back. And chances are, they aren't going to take the document, but rather a copy of it. OMG OMG OMG. The ECPA has been targeted to be updated, along with international Data Protection Acts. When you send your private data through any form of electronic communication, it is at risk. Just because it is being stored at Google won't increase the risk, in fact it is more than likely going to reduce it. Google, use your private data as marketing purposes. HAHAHA. To quote myself: The only type of documents you should ever have on your computer are those that aren't private or confidential. If you do have these types of documents, then at least have the brain power to either set-up the Share Computer thing properly, or simply take the documents off and load them onto a secure memory stick. So, all in all, the EFF are a set of busy-bodies that don't realise that people need to make mistakes in order to learn from them. If anyone is stupid enough to put private documents on a computer and not protect themselves are in the firing line for a multitude of problems. Just recently, I looked at a site that was beating against GMail. You can bet who that was sponsored by It went on about the adsense eventually leading to a corrupt sex promotion on little kiddies computers. Sad. Anyway, after my long rant, I'd like to see your response. --mik
×
×
  • Create New...

Important Information

Terms of Use | Privacy Policy | Guidelines | We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.