Starting a website project
n5p29
31 Oct 2011
This semester I got a college project of making a website that have css styles, javascripts, web application with servlet (what is this?), JSP, database, and something like that.
The problem is the class is using Microsoft Expression Web for work, but in other hand I only have Microsoft Visual Web Developer Express installed in my computer. Should I get the Expression Web, or just use the Visual Web Developer? is there any difference between them? which is better?
On the other side, I'm thinking of making this project include my mods (because I think it might be useful in the future). Is it possible to get this idea alongside the requirements above? I'm pretty clueless about those things (especially the few lasts). and if not possible I need to look for another idea.
I'll be grateful for your help.
Edited by n5p29, 31 October 2011 - 13:29.
The problem is the class is using Microsoft Expression Web for work, but in other hand I only have Microsoft Visual Web Developer Express installed in my computer. Should I get the Expression Web, or just use the Visual Web Developer? is there any difference between them? which is better?
On the other side, I'm thinking of making this project include my mods (because I think it might be useful in the future). Is it possible to get this idea alongside the requirements above? I'm pretty clueless about those things (especially the few lasts). and if not possible I need to look for another idea.
I'll be grateful for your help.
Edited by n5p29, 31 October 2011 - 13:29.
Dutchygamer
31 Oct 2011
Coincidently, I also have to make some kind of website/blog/portfolio, and I made sure I included a section with mods 
It shows you can be dedicated to something (if you're working solo), can work in a group (if member of a group), or have leadership skills (if mod leader and have members). At least, this is what I assumed. I include it for the heck of it, and because it's a rather boring site without it
It shows you can be dedicated to something (if you're working solo), can work in a group (if member of a group), or have leadership skills (if mod leader and have members). At least, this is what I assumed. I include it for the heck of it, and because it's a rather boring site without it
Slightly Wonky Robob
31 Oct 2011
Unfortunately I haven't done any Java before. But I can help you and HTML/CSS/javascript questions you may have.
As for which piece of software to use, of the two I've only ever used Microsoft Visual Web Developer Express, but by the looks of it, Expression Web maybe a little bit more user friendly (from a beginners point of view), but tbh, all you really need is a text editor (preferably I light weight one) and some software to compile the project (which I assume Java requires?).
Making a website for your mods is probably a good idea. You will be a lot more enthusiastic about the project, if it is actually something that you may end up using.
As for which piece of software to use, of the two I've only ever used Microsoft Visual Web Developer Express, but by the looks of it, Expression Web maybe a little bit more user friendly (from a beginners point of view), but tbh, all you really need is a text editor (preferably I light weight one) and some software to compile the project (which I assume Java requires?).
Making a website for your mods is probably a good idea. You will be a lot more enthusiastic about the project, if it is actually something that you may end up using.
n5p29
01 Nov 2011
thanks. btw, how if I want the website have some fancy animation like.. this forum for example.. when you click the login button there's a popup fade in?
is that using javascript, java, or what?
is that using javascript, java, or what?
Slightly Wonky Robob
03 Nov 2011
You would use javascript. I would recommend using a javascript library, more specifically, jQuery.
Here is an example of a cyan box fading in on a red background. You should be able to just copy the code into a blank HTML and play around with it.
The first script tag loads the javascript library, in this case I am loading it directly from google, but you can download the library from the jQuery site.
The second tag is where there 'magic' happens.
For more general website top and tricks, I would recommend looking through the tutorials and references on w3schools. w3schools also has a section on jQuery, but I would also recommend using the jQuery site as a reference for the various functions.
Edited by Bob, 03 November 2011 - 00:07.
Here is an example of a cyan box fading in on a red background. You should be able to just copy the code into a blank HTML and play around with it.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
body{
background: #ff0000;
}
#mydiv{
width: 200px;
height: 200px;
background: #00ffff;
display: none;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#mydiv').fadeIn(1000);
});
</script>
</head>
<body>
<div id="mydiv"></div>
</body>
</html>The first script tag loads the javascript library, in this case I am loading it directly from google, but you can download the library from the jQuery site.
The second tag is where there 'magic' happens.
For more general website top and tricks, I would recommend looking through the tutorials and references on w3schools. w3schools also has a section on jQuery, but I would also recommend using the jQuery site as a reference for the various functions.
Edited by Bob, 03 November 2011 - 00:07.
Slightly Wonky Robob
03 Nov 2011
And also wouldn't be cross-browser compatible...
Besides, if it were to be a popup, it would be most likely triggered onclick, rather than on page load, which isn't really possible with css3 alone.
Edited by Bob, 03 November 2011 - 09:26.
Besides, if it were to be a popup, it would be most likely triggered onclick, rather than on page load, which isn't really possible with css3 alone.
Edited by Bob, 03 November 2011 - 09:26.
n5p29
03 Nov 2011
that's a neat website. O:
thanks for the link. those tutes are really useful (as the college class not explaining much about the coding >.>).
as for jQuery thing, will it work on offline pages? because the lecturer didn't said anything about host the project on the net.
thanks for the link. those tutes are really useful (as the college class not explaining much about the coding >.>).
as for jQuery thing, will it work on offline pages? because the lecturer didn't said anything about host the project on the net.
Slightly Wonky Robob
03 Nov 2011
Yes it will work on an offline page. You can download jquery from the jquery site, and instead of referencing the google jquery file, you reference your own.
For example, if you have a folder structure like the following:
You would then reference the library with the following (instead of the google one):
Edited by Bob, 03 November 2011 - 11:28.
For example, if you have a folder structure like the following:
index.html scripts/jquery.min.js
You would then reference the library with the following (instead of the google one):
<script type="text/javascript" src="scripts/jquery.min.js"></script>
Edited by Bob, 03 November 2011 - 11:28.
n5p29
08 Nov 2011
okay, after asking the lecturer again about the project requirements, it doesn't really need to have all those things on the first post. the important ones are working interface, javascript usage, and access to database (JSP or PHP).
for the first two things is easy to be done for my website theme, but I'm not sure about the last one. what a mod/portofolio website have to do with database? does something like accessing image gallery or retrieving information separate wiki page (like FSDB) count?
Edited by n5p29, 08 November 2011 - 14:35.
for the first two things is easy to be done for my website theme, but I'm not sure about the last one. what a mod/portofolio website have to do with database? does something like accessing image gallery or retrieving information separate wiki page (like FSDB) count?
Edited by n5p29, 08 November 2011 - 14:35.
Slightly Wonky Robob
08 Nov 2011
You would store information in a database. For example, if you wanted to have an image gallery, you could save the title and description (along with the filename) of an image in the database. I doubt accessing an external website would count towards accessing a database, but that would be something you would need to clarify with your lecturer.
As for JSP vs. PHP, as I have already said, I don't have any experience with Java, so I can't really compare. But I found PHP pretty easy to learn, and even though I have learned many new languages since I first learnt PHP, it's still my favourite.
Connecting to a (mysql) database with PHP is nice and easy:
Then to retrieve information you would need to do something like the following:
As for JSP vs. PHP, as I have already said, I don't have any experience with Java, so I can't really compare. But I found PHP pretty easy to learn, and even though I have learned many new languages since I first learnt PHP, it's still my favourite.
Connecting to a (mysql) database with PHP is nice and easy:
mysql_connect('SERVER', 'USERNAME', 'PASSWORD');
mysql_select_db('DATABASE_NAME');Then to retrieve information you would need to do something like the following:
$result = mysql_query("SELECT * FROM table_name");
while($row = mysql_fetch_array($result)){
echo $row['column_name'];
}
n5p29
09 Nov 2011
ah yes, he said image gallery can counts as accessing database.
does PHP can be compiled without additional things unlike JSP? I also found JSP annoying because the language kinda unsupported in VWD.
does PHP can be compiled without additional things unlike JSP? I also found JSP annoying because the language kinda unsupported in VWD.
Slightly Wonky Robob
10 Nov 2011
PHP doesn't need to be compiled. Probably one of the reasons I still like PHP so much. 
n5p29
09 Dec 2011
sigh. they forced me to use JSP. now I must find how to run it on local host. why they don't use PHP or ASP instead? >.>
anyway I'm having difficulties designing the website layout. I can make simple web layout like this, but when it got more fancy skin like this, I can't positioning the pics correctly.
and how to remove the blue border when there's a picture with hyperlink?
in the browser the picture having a blue border around it like how a hyperlink having an underline. how to remove this?
Edited by n5p29, 09 December 2011 - 09:14.
anyway I'm having difficulties designing the website layout. I can make simple web layout like this, but when it got more fancy skin like this, I can't positioning the pics correctly.
and how to remove the blue border when there's a picture with hyperlink?
<a href="http://website.address.here.com"><img src="imagelinkhere.jpg" /></a>
in the browser the picture having a blue border around it like how a hyperlink having an underline. how to remove this?
Edited by n5p29, 09 December 2011 - 09:14.
Slightly Wonky Robob
09 Dec 2011
To remove the border you need to add the following to your stylesheet.
As for your layout issues, if you give me an idea of exactly what you want to achieve, I can point you in the right direction.
If you want to look at how other people have achieved things on websites, I suggest you have a look at the code. If you are using FireFox, you can download Firebug. Opera, Chrome, Safari and IE9 all come with there own versions built in. You can right click on an element, on a website and select 'inspect element' this will show you where it appears in the DOM tree, and all the styles / attributes it has.
Edited by Bob, 09 December 2011 - 21:53.
img{
border: 0px none;
}As for your layout issues, if you give me an idea of exactly what you want to achieve, I can point you in the right direction.
If you want to look at how other people have achieved things on websites, I suggest you have a look at the code.
If you are using FireFox, you can download Firebug. Opera, Chrome, Safari and IE9 all come with there own versions built in. You can right click on an element, on a website and select 'inspect element' this will show you where it appears in the DOM tree, and all the styles / attributes it has.
Edited by Bob, 09 December 2011 - 21:53.
n5p29
10 Dec 2011
okay, let's use that GenX website as example. even I've checked the source code, I still don't understand several things:
- the navigation menu using ul and li tags, but it appears sideway instead an unordered list
- I see it uses background pictures to construct the website skin. for example this and this composed the navigation bar. but when I put something as table cell background it will be cut if the cell have no text in it. any way to prevent this without using fixed cell height?
- I also see it doesn't use a table to separate the elements but using div instead. what's the pro-cons using div instead a table?
I also having problem when using pictures with transparent background for my website. if I saved the pic in gif format the transparent parts always messed up, but if I use png the transparent part didn't work and turned white instead.
- the navigation menu using ul and li tags, but it appears sideway instead an unordered list
- I see it uses background pictures to construct the website skin. for example this and this composed the navigation bar. but when I put something as table cell background it will be cut if the cell have no text in it. any way to prevent this without using fixed cell height?
- I also see it doesn't use a table to separate the elements but using div instead. what's the pro-cons using div instead a table?
I also having problem when using pictures with transparent background for my website. if I saved the pic in gif format the transparent parts always messed up, but if I use png the transparent part didn't work and turned white instead.
n5p29
17 Dec 2011
well, that's it. today is the assignment deadline.
in the end I only could deliver the website with HTML and CSS, with a broken gallery feature. the hardest part is when adding privileges to which users allowed to add/remove pictures in the gallery.
in the end I only could deliver the website with HTML and CSS, with a broken gallery feature. the hardest part is when adding privileges to which users allowed to add/remove pictures in the gallery.
