Explore the Premium Content

A Photo Album Site in PHP, MySQL, XHTML and CSS: Pt.IV

In the last part of Rachel's tutorial on building a photo album site (especially to show off your holiday pics) we'll be putting the finishing touches to the skeleton you've already constructed. Here we'll add a bit of functionality to enable the viewer to change the main photograph, or select a completely different album to view.

Previously in this series we've set up the CSS/XHTML framework, then created the database, and in the previous article coded the basic logic behind the image display.

Read More

CSS Articles on DMXzone

Ever get that feeling that you know what you want, but not how to get at it? Well here at DMXZone, as our article and tutorial back catalogue increases the ease with which an article can be found diminishes.

OK we know our article browsing facility is – ahem – slightly less than user friendly (yup that's on the list the next time we re-design), but also when you're new to a subject area it's not so easy to immediately navigate to the type of articles you want.

So, to help, I've tried to put together a laundry list of the CSS articles (and some related XHTML and accessibility ones) residing in our Premium Content section all linked with accompanying notation describing the content.

Hope you find it useful.

Read More

Ten ways to speed up the download time of your web pages

Want to be even more convinced about the power of CSS? 

Then check out this free article that will give you 10 hints about how to get your web pages into your viewers eyes even faster.

Read More

FREE! Same link text – different colours

Fancy making your links just a little bit more snazzy?

In this free article, Trenton Moss will show you how to use CSS to help add a little bit of spice to your link styles.

 

Read More

A Photo Album Site in PHP, MySQL, XHTML and CSS: Pt.III

In the previous instalments of this multi-part tutorial on building a website to show our holiday images, we firstly constructed an XHTML/CSS framework for the site, and secondly created a database to store our photographic information.

In this third part we're going to be working with that data as we start to build our dynamic pages. More specifically we'll be concentrating on displaying pictures from our default photo album.

Read More

Stylesheets for all Occasions

Just starting out with CSS and wondering what all the fuss is about?

If so, then this article by Matt Machell might help you out. Here Matt will show you how a change of stylesheet can make the same file of marked up text have a very different look. Of cause it's not just an aesthetic point, different stylesheets can help customize your presentation for different types of media and users with varying requirements.

Read More

A Photo Album Site in PHP, MySQL, XHTML and CSS: Pt.II

In the first tutorial of this series we embarked on our mission to provide a website for displaying our holiday pics, by creating an XHTML/CSS layout that would provide a suitable framework.

In this second step we're going to look at how to create a suitable database for holding our photographs. The database we'll be using is MySQL and, as an aside, to carry out our tasks we're going to make use of a freely downloadable tool called MySQL Control Center.

This tool is available from MySQL and during the course of this tutorial we'll look at using it to work with MySQL. If that's not to your taste though and you prefer another tool, or even working at the command line, then no matter there's still plenty in the tutorial to keep you interested.

Read More

Playing With the Edges: CSS and Curves

  The problem with a great many CSS-based designs, is that they tend to look very blocky. Mainly due to the inbuilt box model and border controls that CSS contains. 

But CSS designs don't have to be boxy. In this tutorial aimed right at beginners to CSS, we're going to look at ways in which you can take those sharp corners off a CSS-based design, by adding some curves and a bevel or two.

All you'll need is some basic experience of hand-coding HTML and CSS experience to make full use of this tutorial, but Dreamweaver MX 2004 will help you speed up the creation of the CSS. Don't worry if you haven't hand-coded HTML before, Matt will take you through it step by step.

If you enjoy this tutorial you may like to read Matts companion piece: CSS Tabs for Beginners.

Read More

FREE! Applying CSS to Forms

Forms are an essential part of interaction on the Internet but they can look rather drab. In this FREE article, suitable for beginners, Trenton Moss from the UK based webcredible consultancy takes us quickly through a method of making our forms a bit brighter nicer and user friendly.

Trenton Moss is the driving force behind webcredible; he knows an awful lot about accessibility and the Disability Discrimination Act.

If you want to delve deeper into using CSS to style forms check out these other DMXzone articles:

Styling forms with CSS

Forms and Accessibility

JavaScript Tricks for Usable Forms

 

Read More

A Photo Album site in PHP, MySQL, XHTML and CSS: Pt.I

The summer holidays are here for many of us and when we return we will have a whole bunch of photographs to show off to friends and family, and what better way than to create a site to display them on. This series of tutorials will show you how to create a site that allows the dynamic display of photo galleries using PHP and MySQL, along with a CSS layout for the design of the gallery site. 

In this first tutorial of a series we will construct the layout of the site ready to display our images dynamically.

Note: Check also the DMXzone own CSS Image Gallery extension for amazing pure CSS galleries and slideshows with a fluent navigation and image transitions!

Read More

Drop Down Menus With Standards

Drop Down Menus have been part of the DHTML dictionary for a long time. They're a popular way to cram lots of navigation elements into a small amount of space. They work in a similar way to the menus that everybody is used to using in other programs, so offer a familiar environment.

The trouble is that many of the DHTML menus you'll find out there are from the bad old days of the browser wars, they use huge amounts of code to check for compatibilities, and fail to take into account accessibility or web standards. 

In this article we'll look at some of the ways you can build a Drop Down menu using CSS and W3C DOM (document object model)-based JavaScript. We'll also look at some options for improving the menu's accessibility.

A basic knowledge of JavaScript and CSS is recommended for this tutorial.

Read More

CSS Tabs for Beginners

Tabs are a staple of website navigation. They provide a great visual metaphor for users, and they nicely round off otherwise boxy layouts. This beginning level tutorial is about creating tabs in XHTML and CSS, keeping your mark-up solid, but the visuals more interesting. The method will work in most modern browsers, and we'll cover a few exceptions and workarounds for those it doesn't work with later on.

 

You'll need basic knowledge of HTML and CSS. Fortunately, if you're using Dreamweaver MX2004, it'll help you by autocompleting the CSS and providing basic XHTML pages to work with. Watch out for problems with plain old Dreamweaver MX, as it's CSS rendering isn't perfect, so Design View may not look as it does in a browser.

 

The tutorial will take you through the changes we make to the CSS showing how the different alterations affect the end result. The full source code is included at the end of the article, as is a quick example of how to customise the technique.

Read More