4 Replies - 564 Views - Last Post: 06 September 2013 - 05:52 PM

#1 d.c  Icon User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 12
  • Joined: 06-September 13

Building my first serious website/ need help with coding the design

Posted 06 September 2013 - 04:45 PM

Hello this is my first post on the forum, however I have been watching the website for quite a while now.
I have finally finished my web design in Photoshop and now I am ready to start coding it step by step. However I have many general questions as well.

_____________________________

I guess that I will start with showing you the website design which I want to code in html5.

Link to image

Please remember that this image is for structural purposes only and does not present the final design. It shows only the home page of the website. Let me quickly explain the design just in case.

The top 5 boxes are the featured posts/ articles that are simply of higher quality than the rest of the content. Once a new one is added the last of the featured articles is replaced with the one before it and so on.

Then there is the main section/ container of the website with a navigation on top and an aside section on the right (the advertisement). The left titles are outside of the container but those are still clickable buttons.

Here again I want it to work the same way as the top 5 boxes (featured articles) - once a new article is being added the last one is replaced with a one before it and so on.
_____________________________

I have a basic knowledge of html and css, however I have never built a proper website and I lack some of basic knowledge or understatement of how some things work. I have some questions for which I couldn't find an answer

  • How is the content being added on a daily basis on popular websites, especially on websites that are being managed by multiple people (e.g. article writers). Is it possible to add the content to the website (an article) without the need of manually editing the html code in an application such as Dreamweaver and then updating the file on the server? If so how does this process look?

  • Based on my design, how to create something like the top 5 featured articles so that the chosen article is being taken from among the website's content and so that it moves along the path once new featured articles are being added until it finally drops from featured.

  • My design shows only the homepage of my website, however would the articles be saved on the server so that they are still searchable especially with Google if possible after a time.


I think that at this stage it would be appropriate to show you my website's structure

[html]
<!DOCTYPE HTML>

<html>
<head>
<title>title</title>
<link rel="stylesheet" type="text/css" href="style.css"/>
</head>


<body>


<section id="page">

<header>
    <img src="logo1.jpg" width="310" height="91" alt="logo">
</header>

<section id="main">

<header>
    
        <nav id="nav"><ul>
            <li><a href="#">articles</a></li>
            <li><a href="#">3D art</a></li>
            <li><a href="#">animation</a></li>
            <li><a href="#">artwork</a></li>
            <li><a href="#">illustration</a></li>
            <li><a href="#">photoshop</a></li>
            <li><a href="#">general</a></li>
            <li><a href="#">crew</a></li>
        </ul></nav>

</header>

<aside>
</aside>

</section><!--main section end-->

<footer>
</footer>

</section><!--page section end-->

</body>
</html>




[css]
body {
	background-color:#fff;
	margin: 0; /*removes any space around the container*/
	padding-top:15px;
}

#page {
	width: 1000px;
	margin: 0 auto;
	background-color:#fff;
}

#main{
	padding-top: 100px;
	
}


#nav {
	color:#333;
	font-family: "orator Std";
	min-width: 100%;
}

#nav ul{ 
	list-style:none; /*removes the bullet points from the nav*/
	float: left;
}

#nav li{
	display:inline-block;
	text-align: left;
}

#nav a{
	display:block;
	text-decoration: none;
}

#nav a:hover, #nav li.current a {
	color: #000;
}



As you can see the structure of the website is the only thing I have accomplished so far (it is much easier designing the website than actually coding it).

To summarize I require help with the top 5 featured articles as for the start. At the same time I am deeply grateful for any answers.

This post has been edited by andrewsw: 06 September 2013 - 05:19 PM


Is This A Good Question/Topic? 0
  • +

Replies To: Building my first serious website/ need help with coding the design

#2 andrewsw  Icon User is offline

  • Fire giant boob nipple gun!
  • member icon

Reputation: 3243
  • View blog
  • Posts: 10,882
  • Joined: 12-December 12

Re: Building my first serious website/ need help with coding the design

Posted 06 September 2013 - 05:08 PM

Creating pages whose content changes requires a server-side language such as PHP or ASP.NET (C#/VB.NET). There are many others: Java, Python, Ruby.

The server-side language constructs different HTML pages by retrieving data from, typically, a database such as MySQL or SQL Server (among others). Less structured data can, alternatively, be stored in XML or text files.

I'm afraid you have a way to go before you can get to your "top 5 featured" request.

We have a Tutorials link at the top of the page.

This post has been edited by andrewsw: 06 September 2013 - 05:22 PM

Was This Post Helpful? 0
  • +
  • -

#3 andrewsw  Icon User is offline

  • Fire giant boob nipple gun!
  • member icon

Reputation: 3243
  • View blog
  • Posts: 10,882
  • Joined: 12-December 12

Re: Building my first serious website/ need help with coding the design

Posted 06 September 2013 - 05:26 PM

Personally, as you have "a basic knowledge of html and css", I would continue to study these first (and probably some Javascript) before moving on to consider a server-side language.
Was This Post Helpful? 0
  • +
  • -

#4 d.c  Icon User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 12
  • Joined: 06-September 13

Re: Building my first serious website/ need help with coding the design

Posted 06 September 2013 - 05:33 PM

Thank you for your reply, looks like I have to learn PHP, javascript and MySQL according to you. I will start immediately, once I will have a good understanding of those everything will be much clearer for me to understand and then I will be able to start coding the actual website.
Was This Post Helpful? 1
  • +
  • -

#5 andrewsw  Icon User is offline

  • Fire giant boob nipple gun!
  • member icon

Reputation: 3243
  • View blog
  • Posts: 10,882
  • Joined: 12-December 12

Re: Building my first serious website/ need help with coding the design

Posted 06 September 2013 - 05:52 PM

Quote

I will start immediately

I like this enthusiasm :smartass:
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1