Author Eric Shepherd says:
This technique is a bulletproof way to ensure browser compatibility and to maintain usability even for people who have old browsers or difficulty accessing dropdown menus, either because of a disability or a low level of comfort with the dropdown paradigm. It also does a much better job than standard dropdown menus of orienting the user within the site.
Warning: This technique will not work as well for lists that require large numbers of items, where dropdowns either shine or collapse under the weight of their own sheer mass, depending on your perspective.
We’re going to create a hybrid menu that runs horizontally across the window. It has two levels of navigation (in our example, main topics and their associated pages). Our menu will allow for dropdown access to all pages in both navigation levels, display the current choices in the selected topic area constantly, keep the user aware of where he is in the site, and be clean and light to boot.
Sound good? Let’s get going.
Hybrid CSS Dropdowns: A List Apart Article
Hybrid CSS Dropdown Sample
April 20, 2005
April 18, 2005
CSS Design: Taming Lists: A List Apart
Most pages on the web contain a menu of links in a navigation area. These are often marked up as a string of links, often in separate DIVs or paragraphs. Structurally, however, they are a list of links, and should be marked up as such.
CSS Design: Taming Lists: A List Apart
CSS Design: Taming Lists: A List Apart
April 13, 2005
Photoshop CS Optimization Tips
Design Your Site Team Tip: Photoshop CS Optimization Tips
This question comes up quite frequently in the Graphics and Multimedia forum so we thought we would address some of the issues of optimizing Photoshop CS for Windows and Macintosh systems.
Here are just some of many ways you can ensure Photoshop CS is running properly for best performance.
Troubleshooting
There are a few instances where Photoshop's files can become damaged or corrupt. Here are some ways to correct those problems.
Photoshop Preferences File
There may be times when your preferences file will become corrupt which will cause a variety of problems with Photoshop. Such problems include menus and tools disappearing, the program running slow or system lock-ups
To re-create the Photoshop preferences file:
1. Quit Photoshop.
2. Drag the Photoshop preferences file to the Trash:
Drag the Adobe Photoshop CS Prefs.psp in the Users/[ user profile ]/Library/Preferences/Adobe Photoshop CS Settings folder to the Trash.
Restart Photoshop.
If the problem recurs after you re-create the Photoshop preferences file, the problem isn't related to the preferences file. To restore custom settings, drag the file you moved in step 2 back to its original location, and then click Yes to replace the new preferences file.
Troubleshoot Fonts
System errors can occur if Photoshop accesses a damaged font.
To troubleshoot fonts to determine if they cause the problem.
- Drag the contents of the Library: Fonts folder to a new folder on the desktop. (If you manually added fonts to the Library: Application Support: Adobe: Fonts folder, also drag those fonts to the new folder.)
- At the Finder, choose File > Find.
- Type adobefnt.lst , select the system drive, and then press Return.
- Delete all adobefnt.lst files found (for example, adobefnt06.lst).
- Restart the computer.
- Restart Photoshop. Photoshop creates new adobefnt.lst files.
- Try to re-create the problem, and continue as follows.
-- If the problem doesn't recur, move one font back to the Library: Fonts folder, and then repeat the steps until you identify the problematic font.
-- If the problem recurs, move the contents of the new folder on the desktop back to the Library: Fonts folder.
Troubleshoot ICC profiles.
A system error can occur if Photoshop accesses a damaged ICC profile.
To troubleshoot ICC profiles to determine if they cause the problem:
1. Move all profiles from the following folders to another folder:
-- Library: ColorSync: Profiles
-- Library: Application Support: Adobe: Color: Profiles
2. Restart Photoshop, and try to re-create the problem.
-- If the problem doesn't recur, move profiles back to their original folders one at a time, and try to re-create the problem after each move, until you identify the problematic profile.
Optimization
Allocate more memory to Photoshop
Low memory in Photoshop can create real problems for you especially if you are working with large files. It’s best to shut-down all applications running in the background (if you don’t need them), and work with only Photoshop.
You can allocate a larger percentage of memory to Photoshop to eliminate problems caused by low memory.
-Start Photoshop.
-From the Photoshop menu, choose Preferences > Memory & Image Cache.
-In the Memory Usage section, increase the value in the Maximum Used by Photoshop text box.
-Click OK, and then restart Photoshop.
Optimize scratch disks.
Photoshop uses a scratch disk file (that is, temporary disk space for storing data and performing computations) when insufficient RAM is available for image editing. Photoshop CS can create 64 exabytes of scratch disk files on up to four hard disk partitions, while Photoshop 7 can create 4 exabytes on up to four hard disk partitions. An exabyte is 1,074,000,000 gigabytes.
The hard disk partition you specify as the primary scratch disk should have adequate free space equal to several times the size of your file. A good performance indicator is to have space available equal to three to five times the size of the average image file; specify additional scratch disks if you have additional hard disk partitions. If disk space is insufficient, remove unnecessary files from hard disks.
To specify a scratch disk in Photoshop, choose Photoshop > Preferences > Plug-Ins & Scratch Disks.
This question comes up quite frequently in the Graphics and Multimedia forum so we thought we would address some of the issues of optimizing Photoshop CS for Windows and Macintosh systems.
Here are just some of many ways you can ensure Photoshop CS is running properly for best performance.
Troubleshooting
There are a few instances where Photoshop's files can become damaged or corrupt. Here are some ways to correct those problems.
Photoshop Preferences File
There may be times when your preferences file will become corrupt which will cause a variety of problems with Photoshop. Such problems include menus and tools disappearing, the program running slow or system lock-ups
To re-create the Photoshop preferences file:
1. Quit Photoshop.
2. Drag the Photoshop preferences file to the Trash:
Drag the Adobe Photoshop CS Prefs.psp in the Users/[ user profile ]/Library/Preferences/Adobe Photoshop CS Settings folder to the Trash.
Restart Photoshop.
If the problem recurs after you re-create the Photoshop preferences file, the problem isn't related to the preferences file. To restore custom settings, drag the file you moved in step 2 back to its original location, and then click Yes to replace the new preferences file.
Troubleshoot Fonts
System errors can occur if Photoshop accesses a damaged font.
To troubleshoot fonts to determine if they cause the problem.
- Drag the contents of the Library: Fonts folder to a new folder on the desktop. (If you manually added fonts to the Library: Application Support: Adobe: Fonts folder, also drag those fonts to the new folder.)
- At the Finder, choose File > Find.
- Type adobefnt.lst , select the system drive, and then press Return.
- Delete all adobefnt.lst files found (for example, adobefnt06.lst).
- Restart the computer.
- Restart Photoshop. Photoshop creates new adobefnt.lst files.
- Try to re-create the problem, and continue as follows.
-- If the problem doesn't recur, move one font back to the Library: Fonts folder, and then repeat the steps until you identify the problematic font.
-- If the problem recurs, move the contents of the new folder on the desktop back to the Library: Fonts folder.
Troubleshoot ICC profiles.
A system error can occur if Photoshop accesses a damaged ICC profile.
To troubleshoot ICC profiles to determine if they cause the problem:
1. Move all profiles from the following folders to another folder:
-- Library: ColorSync: Profiles
-- Library: Application Support: Adobe: Color: Profiles
2. Restart Photoshop, and try to re-create the problem.
-- If the problem doesn't recur, move profiles back to their original folders one at a time, and try to re-create the problem after each move, until you identify the problematic profile.
Optimization
Allocate more memory to Photoshop
Low memory in Photoshop can create real problems for you especially if you are working with large files. It’s best to shut-down all applications running in the background (if you don’t need them), and work with only Photoshop.
You can allocate a larger percentage of memory to Photoshop to eliminate problems caused by low memory.
-Start Photoshop.
-From the Photoshop menu, choose Preferences > Memory & Image Cache.
-In the Memory Usage section, increase the value in the Maximum Used by Photoshop text box.
-Click OK, and then restart Photoshop.
Optimize scratch disks.
Photoshop uses a scratch disk file (that is, temporary disk space for storing data and performing computations) when insufficient RAM is available for image editing. Photoshop CS can create 64 exabytes of scratch disk files on up to four hard disk partitions, while Photoshop 7 can create 4 exabytes on up to four hard disk partitions. An exabyte is 1,074,000,000 gigabytes.
The hard disk partition you specify as the primary scratch disk should have adequate free space equal to several times the size of your file. A good performance indicator is to have space available equal to three to five times the size of the average image file; specify additional scratch disks if you have additional hard disk partitions. If disk space is insufficient, remove unnecessary files from hard disks.
To specify a scratch disk in Photoshop, choose Photoshop > Preferences > Plug-Ins & Scratch Disks.
CSS Box Model Hierarchy
The author writes:
The order in which elements such as background colour and image are stacked. To try and fill this hole, I’ve drawn a diagram. I’m not sure if this is of any use at all, but here it is anyway – the 3D CSS Box Model.
3D CSS Box Model Hierarchy
The order in which elements such as background colour and image are stacked. To try and fill this hole, I’ve drawn a diagram. I’m not sure if this is of any use at all, but here it is anyway – the 3D CSS Box Model.
3D CSS Box Model Hierarchy
Subscribe to:
Posts (Atom)